@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');

* {
  
  
  padding: 0;
  margin: 0;
  }

  ol {
    display: flex;
    flex-direction: row;  
    }

  #burger li {
    list-style-type: none;
    padding: 30px;
    width: 25%;
    color: white;    
    text-align: center;
    }

  

  #burger a {
    color: #c1b3d1;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: bolder;
  
    }

input[type="checkbox"] {
  display: none;
}

  a:hover{
  background-color: rgb(131, 50, 97);
  cursor:url(../images/iconmonstr-candy-22-32.png),pointer;
  
  
  
  
  }
  #menu { 
    background-size: 50% ;
    border-color:black ;
    border-style: solid;
    background-image: url(../images/rubymenu.jpg);
    margin-block-start: 0px;
    position: fixed;
    width: 100%;
    margin-top: -30px;
    z-index: 2;
  }


   /* debut Menu Burger responsive*/

  /* Gestion de la checkbox */
 


  /*A VERIFIER SI ENCORE BESOIN*/
  
  @media screen and (max-width: 640px) {
    ol {
      flex-direction: column;
    }
    #menu{
      background-image: url(../images/rubbismenutel.jpg);
      background-repeat: no-repeat;
      background-size: cover;
      
    }
    
    /* Gestion de l'affichage du menu */
    input[type="checkbox"]:not(:checked) ~  ol {
      display: none;
    }
    input[type="checkbox"]:checked ~  ol {
      display: flex;
    
        /* background-image: url(../images/rubymenu.jpg);
        object-fit: cover; */
      /* background-color: chartreuse; */
    }
    
    /* Gestion de la checkbox */
    input[type="checkbox"] + label:before {
      font-family: FontAwesome;
      font-size: 30px;
      margin-top: -30px;
      margin-left: 10px;
      position: absolute;
      z-index: 3;
      color:rgb(131, 50, 97);
    }
  
    input[type="checkbox"] + label:before {
      content: "\f0c9";
    }
  
    input[type="checkbox"]:not(:checked) + label:before {
      content: "\f0c9";
    }
  
    input[type="checkbox"]:checked + label:before {
      content: "\f00d";
    }
  }
  /*fin du menu */


/* debut carousel  */

* { box-sizing: border-box; 
}


.carousel {
  background: transparent;
  margin-top: 30px;
}
/* containeur carousel */
.carousel-cell {
  /* padding-top: 50px; */
  /* margin-top: 55px; */
  width: 66%;
  height: 200px;
  /* flex-box, center image in cell */
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
          justify-content: center;
  -webkit-align-items: center;
          align-items: center;

}

/* height width image */
.carousel-cell img {
  display: block;
  max-width: 100%;
  max-height: 200%;
  /* dim unselected */
  opacity: 0.8;
  -webkit-transform: scale(0.85);
          transform: scale(0.85);
  -webkit-filter: blur(1px);
          filter: blur(1px);
  -webkit-transition: opacity 0.3s, -webkit-transform 0.2s, transform 0.2s, -webkit-filter 0.2s, filter 0.2s;
          transition: opacity 0.3s, transform 0.2s, filter 0.2s;
 }



/* brighten selected image */
.carousel-cell.is-selected img {
  opacity: 1;
  -webkit-transform: scale(1);
          transform: scale(1);
  -webkit-filter: none;
          filter: none;
}

@media screen and ( min-width: 768px ) {
  .carousel-cell {
    height: 400px;
      }
     
       
     
      
}

@media screen and ( min-width: 960px ) {
  .carousel-cell {
    width: 60%;
    margin-top: 155px;
    margin-bottom: 140px;
  }
  
}

/* buttons, no circle */
.flickity-prev-next-button {
  width: 60px;
  height: 60px;
  background: transparent;
  opacity: 0.6;
}
.flickity-prev-next-button:hover {
  background: white;
  opacity: 1;
}
/* arrow color */
.flickity-prev-next-button .arrow {
  fill: red;
}
.flickity-prev-next-button.no-svg {
  color: white;
}
/* closer to edge */
.flickity-prev-next-button.previous { left: 0; }
.flickity-prev-next-button.next { right: 0; }
/* hide disabled button */
.flickity-prev-next-button:disabled {
  display: none;
}
 


.flickity-page-dots {
  padding-top: 2px;
  margin-top: 5px;
  bottom: 1px;
  background-color: white;
}
/* white circles */
.flickity-page-dots .dot {
  width: 1px;
  height: 1px;
  opacity: 10;
  background: transparent;
  border: 0,3px solid transparent;
}
/* fill-in selected dot */
.flickity-page-dots .dot.is-selected {
  background: white;
}
/* fin carousel  */