/* ------- menu-burger visible à partir de 1366px -------- */

.menu-button {
  width: 32px;
  cursor: pointer;
  z-index: 33;
  display: block;
  height: calc(12px + 8px);
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.menu-button__wrapper {
  display:none;
  z-index: 33;
  width: 3rem;
  height: 3rem;
}
.menu-button__bar {
  background-color: white;
  height: 4px;
  width: 32px;
  display: block;
  position: absolute;
  transition: all 0.4s ease;
}
.menu-button__bar:nth-of-type(2) {
  top: 8px;
}
.menu-button__bar:nth-of-type(3) {
  top: 16px;
}
.menu-button.active .menu-button__bar {
  transform: translateY(8px) rotate(45deg);
}
.menu-button.active .menu-button__bar:nth-of-type(2) {
  transform: translateX(2rem);
  opacity: 0;
  visibility: hidden;
}
.menu-button.active .menu-button__bar:nth-of-type(3) {
  transform: translateY(-8px) rotate(-45deg);
}

.menu-overlay {
  background-color: var(--orange);
  right: 0;
  height:0px;
  transition: all 0.8s ease;
  z-index: 22;
visibility:hidden;
  width:80%;
  display:none;
  position:relative;
  top:-500px;
  height:0;
}

.menu-overlay.open {
visibility:visible;
transition: all 0.8s ease;
top:0;
height:400px;
}

.dropdownmenu__mobile ul {
	list-style: none;
  display: flex;
  flex-direction: column;
}
.dropdownmenu__mobile li {
  text-align:left;
  color:white;
	-webkit-transition: all .25s ease;
	-moz-transition: all .25s ease;
	-ms-transition: all .25s ease;
	-o-transition: all .25s ease;
	transition: all .25s ease;
  padding:15px 0;
    border-bottom:1px solid white;
}

.dropdownmenu__mobile a{
	color: #FFFFFF;
  font-family:'PoppinsExtraBold';
  font-size:16px;
	display: inline;
	text-decoration: none;
	-webkit-transition: all .25s ease;
	-moz-transition: all .25s ease;
	-ms-transition: all .25s ease;
	-o-transition: all .25s ease;
	transition: all .25s ease;
    padding: 5px 0;
}
.dropdownmenu__mobile li:hover a {
  color:var(--noir);
  border-bottom: none;
}

.dropdownmenu__mobile li:hover{
  cursor:pointer;
  color: var(--noir);
	-webkit-transition: all .25s ease;
	-moz-transition: all .25s ease;
	-ms-transition: all .25s ease;
	-o-transition: all .25s ease;
	transition: all .25s ease;}

.sub-menu__mobile{
  padding-left:30px;
  & a li{
    font-family:'PoppinsSemiBold';
      font-size:14px;
	display: inline;
	text-decoration: none;
    color:white;
    border:none;
  }
}



/* ------- medias queries ----- */
@media screen and (max-width:1366px){
    .menu-overlay{
        display:inline;
    }
  .menu-button__wrapper{
    display:block;
  }
  .dropdownmenu{
    display:none;
  }
header{
    height:auto;
    flex-direction: column;
  align-items: center;
}
.header{
    height:100px;
}

.logo-color{
    display:none;
}
.logo-white{
    display:inline;
}
.active-sub li{
  background-color: none !important;
}

}

@media screen and (max-width:480px){
    .dropdownmenu__mobile a{
        font-size:14px;
    }
    .sub-menu__mobile a li{
        font-size:12px;
    }
    .menu-overlay.open{
        height:450px;
    }
}