header{
background-color: antiquewhite;
margin:0;
}

main{
    margin: 10px;
}

nav{
    background-color: aqua;
    margin: 0;
}

.Mon-titre{
    text-align: center;
    color: black;
    margin:0;
    text-decoration: underline;
    font-weight: bolder;
    font-size: 28px;
}

.connexion-image{
    text-align: end;
}

.connexion-image:hover{
    opacity: 0.5;
}

.nt{
    font-size: 20px;
    text-align: center;
    a{text-decoration: none;}
    a{color: blue;}
    a{
    font-size: 20px;
    text-align: center;
    text-decoration: none;
    color: blue;
    }

}

.R{
     font-size: 20px;
    text-align: center;
    a {text-decoration: none;}
    a{color: blue;}
    a{
    font-size: 20px;
    text-align: center;
    text-decoration: none;
    color: blue;
    }
}

.nt:hover{
    text-decoration: underline;
}

.R:hover{
    text-decoration: underline;
}

main{
    margin: 10px;
    padding: 10px;
}

.RPLM{
    font-size:20px ;
    a{text-decoration: none;}
    a{color: black;}
    a{
    font-size: 20px;
    text-decoration: none;
    color: rgb(0, 0, 0);
    }
}

.RN{
    font-size:20px ;
    a{text-decoration: none;}
    a{color: black;}
     a{
    font-size: 20px;
    text-decoration: none;
    color: rgb(0, 0, 0);
    }
}

.RH{
    font-size:20px ;
    a{text-decoration: none;}
    a{color: black;}
     a{
    font-size: 20px;
    text-decoration: none;
    color: rgb(0, 0, 0);
    }
}
.body{
    background-color:cadetblue;
    text-align: center;
    font-size: 100px;
}

.IMGS4{
    text-align: center;
}

.LBDN{
    font-size: 25px;
    color: blue;
    text-align: center;
}

.IngrédientsBuche{
    font-size: 19px;
}

.PTPB{
    text-align: end;
}

.flècheARC{
    font-size: 18px;
    color: blue;
    text-decoration: none;
}

.flècheARC:hover{
    text-decoration: underline;
}

.ancre1{
    text-decoration: none;
    color: black;
}

.ancre2{
text-decoration: none;
    color: black;
}

.connexion{
    text-align: center;
}

.TP{
    text-align: left;
}

.Donne-ton-avi{
        font-size:20px ;
    a{text-decoration: none;}
    a{color: black;}
}

.ancre3{
    text-decoration: none;
    color: black;
}

.DFD{
    text-decoration: none;
    color: black;
    font-size: 20px;
}


.MN{
    a{text-decoration: none;
    color: black;
    font-size: 20px;
}
}

.CE1MS{
    a{text-decoration: none;
    color: black;
    font-size: 20px;
}
}

table, th, td {
   border: 1px solid black;
}
th, td {
   text-align: center;
   padding: 10px;
}

.CMSPB{
    a{text-decoration: none;
    color: black;
    font-size: 20px;
    text-align:right;
}
}

video{
    border-radius: 8px;
}

.boutton-menu{
    margin: .5rem;
}

.DFD{
    a{text-decoration: none;
    color: black;
    font-size: 20px;
}
}

p{
    font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}

H1{
    text-align: center;
}

.cs{
    color: blue;
    }
 
.D3E{
        font-size: 50%;
}

.highlight {
    background-color: yellow;
}

.ui-autocomplete-input{
    font-size: 150%;
    
}


.carousel1 {
  position: relative;
  width: 100%;         
  max-width: 500px;     
  margin: 20px auto;
  overflow: hidden;
  border-radius: 10px;
  border: 2px solid #333;
  background: transparent; 
}



.carousel-track {
  display: flex;
  transition: transform 0.5s ease-in-out;
}

.slide {
  flex: 0 0 100%;
}

.slide2 {
  flex: 0 0 100%;
  text-align: center;
  padding: 10%;
}

.slide img {     
  object-fit: cover;    
  display: block;
}

.Nentv{
    background-color: black;
    color: aliceblue;
    text-align: center;
}

.LOGO-NENPRODS{
    text-align: center;
    padding:50px;
}

h2{
    font-family: monospace;
}

h1{
    font-family: monospace;
    font-size: 50px;
}

footer{
    background-color: antiquewhite;
}

.ML{
    padding: 10%;
}

.O2SWITCH{
        color: blue;
}

.soulignm{
    background-color: crimson;
}

.soulignm2{
    background-color: yellow;
}

.MO{
    text-decoration: underline;
}

.COMO{
    color: red;
    text-align: left;
    font-size: 10px;
}

.NdJ{
    text-align: left;
}

.FJ{
    font-size: 20px;
    a{
        color: black;
        text-decoration: none;
    }
}

footer{
    a{
        color: blue;
        font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    }
}

.ANglais-pour-les-6eme{
    text-decoration: underline;
}

.EDAMA{
    font-size: 19px;
    text-align: left;
}

.U{
    text-decoration: underline;
    text-align: center;
}

    /* Style du bandeau */
    .cookie-banner {
      position: fixed;
      left: 0; right: 0; bottom: 0;
      z-index: 9999;
      background: #111;
      color: #fff;
      padding: 16px;
      box-shadow: 0 -4px 12px rgba(0,0,0,0.2);
      display: none; /* sera affiché via JS si nécessaire */
      font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    }
    .cookie-container {
      max-width: 900px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 12px;
      align-items: center;
    }
    .cookie-text {
      font-size: 14px;
      line-height: 1.5;
    }
    .cookie-actions {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
    }
    .btn {
      border: none;
      cursor: pointer;
      padding: 10px 14px;
      border-radius: 6px;
      font-weight: 600;
      font-size: 14px;
    }
    .btn-primary { background: #22c55e; color: #0b1; background: #22c55e; color: #052; }
    .btn-outline { background: transparent; color: #fff; border: 1px solid #888; }
    .btn-link { background: transparent; color: #9dd1ff; text-decoration: underline; }
    /* Modal simple pour préférences */
    .cookie-modal-backdrop {
      position: fixed; inset: 0; background: rgba(0,0,0,0.5);
      display: none; z-index: 10000;
    }
    .cookie-modal {
      background: #fff; color: #111; max-width: 600px; margin: 8vh auto; padding: 20px; border-radius: 8px;
    }
    .prefs-group { margin: 12px 0; }
    .prefs-group label { display: flex; align-items: center; gap: 8px; }
    .modal-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 16px; }
    .btn-neutral { background: #eee; color: #111; }
    .cookie-banner {
      position: fixed; left: 0; right: 0; bottom: 0;
      background: #111; color: #fff; padding: 16px; z-index: 9999;
    }
    .btn { padding: 8px 12px; border: none; border-radius: 6px; cursor: pointer; }
    .btn-primary { background: #22c55e; color: #052; }
    .btn-outline { background: transparent; color: #fff; border: 1px solid #888; }
   
     .cookie-banner { position: fixed; left:0; right:0; bottom:0; background:#111; color:#fff; padding:16px; z-index:9999; }
    .btn { padding:8px 12px; border:none; border-radius:6px; cursor:pointer; }
    .btn-primary { background:#22c55e; color:#052; }
    .btn-outline { background:transparent; color:#fff; border:1px solid #888; }
    .link { color:#9dd1ff; text-decoration:underline; cursor:pointer; }
    .backdrop { position:fixed; inset:0; background:rgba(0,0,0,0.5); display:none; z-index:10000; }
    .modal { background:#fff; color:#111; max-width:520px; margin:10vh auto; padding:16px; border-radius:8px; }

     .cookie-banner { position: fixed; left:0; right:0; bottom:0; background:#111; color:#fff; padding:16px; z-index:9999; }
    .btn { padding:8px 12px; border:none; border-radius:6px; cursor:pointer; }
    .btn-primary { background:#22c55e; color:#052; }
    .btn-outline { background:transparent; color:#fff; border:1px solid #888; }
    .link { color:#9dd1ff; text-decoration:underline; cursor:pointer; }
    .backdrop { position:fixed; inset:0; background:rgba(0,0,0,0.5); display:none; z-index:10000; }
    .modal { background:#fff; color:#111; max-width:520px; margin:10vh auto; padding:16px; border-radius:8px; }

    .cookie-banner { position:fixed; left:0; right:0; bottom:0; background:#111; color:#fff; padding:16px; z-index:9999; display:none; }
    .btn { padding:8px 12px; border:none; border-radius:6px; cursor:pointer; }
    .btn-primary { background:#22c55e; color:#052; }
    .btn-outline { background:transparent; color:#fff; border:1px solid #888; }
    .backdrop { position:fixed; inset:0; background:rgba(0,0,0,0.5); display:none; z-index:10000; }
    .modal { background:#fff; color:#111; max-width:520px; margin:10vh auto; padding:16px; border-radius:8px; }

body { font-family: Arial, sans-serif; }
    .backdrop {
      position: fixed;
      /* Si inset pose problème, utilise les 4 côtés ci-dessous */
      /* inset: 0; */
      top: 0; right: 0; bottom: 0; left: 0;
      background: rgba(0,0,0,0.5); /* 50% d’opacité */
      display: none; /* caché par défaut */
      z-index: 10000; /* au-dessus du reste */
    }
    .modal {
      background: #fff;
      color: #111;
      max-width: 520px;
      margin: 10vh auto;
      padding: 16px;
      border-radius: 8px;
      box-shadow: 0 10px 30px rgba(0,0,0,0.25);
    }
    .open-btn { margin: 24px; }

    .boutton-laboubou-mes-operation{
          a{
        color: #000000;
      }

    }

    .ryu{
        background-color: #ffff00;
    }

    .IMUF{
        font-size: 20px;
    }

      .encadre {
    border: 2px solid black; /* épaisseur, style, couleur */
    padding: 10px;           /* espace intérieur */
    width: inherit;      /* largeur adaptée au contenu */
  }

  .encadre2 {
    border: 2px solid black; /* épaisseur, style, couleur */
    padding: 150px;           /* espace intérieur */
    width: inherit;      /* largeur adaptée au contenu */
  }

  label {
  display: block;
  font:
    1rem "Fira Sans",
    sans-serif;
}

input,
label {
  margin: 0.4rem 0;
}

.ce2-Maths{
    background: linear-gradient(#77A1D3,#79CBCA,#E684AE);
}

.ce2-maths-Diporama-selection{
    color:#77A1D3;
    text-decoration: none;
    font-size:20px;
}

.ce2-maths-Diporama-selection2{
    background-color: #eee;
    border: #111;
}

.Mon-main-Diaporama{
    background-color: #77A1D3;
}

.retoure{
    text-decoration: none;
}

.ce2-maths-diaporama-selection-calcul-mentale{
    text-align: center;
}

.▶︎-Lancer{
    a{
        font-size: 20px;
    color: #052;
    text-decoration: none;
    }
}

.Paramètres{
    font-size: 20px;
    color: mediumslateblue;
}

.Barre-numero{
    margin: 15px;
}

.numéro{
    background-color: pink;
    padding: 10px;
    border-radius: 50px;
    margin: 5px;
    font-weight: bold;
}

.Dioporama-ce2-calcul-mental-dipo-page2{
    font-size: 30pt;
    text-align: center;
}

.⏭︎{
    color: #111;
    text-decoration: none;
}

.modal { 
    position: fixed; inset: 0; display: none; 
}
.modal.show { 
    display: block; 
}
.modal-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.5); }
.modal-dialog { position: relative; margin: 10vh auto; max-width: 400px; background: #fff; border-radius: 8px; }
.modal-header, .modal-footer { padding: 10px; background: #f6f7f9; }
.modal-body { padding: 16px; }
.modal-close { border: none; background: transparent; font-size: 1.4rem; cursor: pointer; }
.btn { padding: 6px 12px; border: none; border-radius: 4px; cursor: pointer; }
.btn-secondary { background: #e5e7eb; }

.Cliquer-pour-quitter-l-exercice{
    border-radius: 0%;
    font-size: 200%;
    color: #000000;
    text-decoration: none;
}

.Mon-main-Diaporama2{
    background-color: #000000;
}

.Nouveau{
    color: #052;
    background-color: #e5e7eb;
    border-radius: auto;
    border-color: #052;
    font-size: 150%;
}

.patinoire-de-Mions{
    color: blue;
}

.Patinoire{
    border: 3px solid #000000;
    border-radius: 10px;
    padding: 15px;
    margin-bottom: 15pt;
}

.Carte-jeune{
    border: 3px solid #000000;
    border-radius: 10px;
    padding: 15px;
    margin-bottom: 15pt;
}

.N{
    font-size: 12pt;
    text-align: left;
}

.idee-d-article{
    color: #000000;
    text-decoration: none;
}

.correction{
    color: #052;
    font-size: 20pt;
}

.GRATUITEMENT{
    color: #0b1;
}

.📝{
    font-size: 19pt;
}

.ce2p{
        font-size: 20pt;
        color: #77A1D3;
}

.Liste-des-récompenses{
    text-align: center;
}


.un-euro:hover{
    opacity: 90%;
}

.recompense-nenchat-code-lot1:hover{
    opacity: 90%;
}

.Ce-lot-est-vable-une-seule-fois{
    width: fit-content;
}

.Ce-lot-est-vable-une-seule-fois:hover{
    color: rgb(231, 10, 10);
}

.Ce-lot-est-vable-une-seule-fois1:hover{
    color: #0b1;
}

.Ce-lot-est-vable-une-seule-fois1{
    width: fit-content;
}

.SLNAPEEP{
    color:rgb(0, 42, 17);
}

.SLNAPEEP:hover{
    color:rgb(88, 247, 101);
}

.PL{
    border: 3px solid #000000;
    border-radius: 10px;
    padding: 15px;
    margin-bottom: 15pt;
}

.DL{
     border: 3px solid #000000;
    border-radius: 10px;
    padding: 15px;
    margin-bottom: 15pt;
}