/* Menu  © admotion*/

#menu {  z-index: 998; background: var(--secondary); padding: 5%; position: fixed; width: 300px; left: -350px; top: 0; height: 100%; transition: 0.3s ease;}
#menu.open {  z-index: 998; left: 0;  }

#menu li { padding: 20px 0; border-bottom: 1px solid var(--primary);}
#menu li a { font-weight: 700; }
#menu li a:hover { color: var(--primary); }

#menu a { color: #fff; }

    #menu-small { display: block; }
 
#menu ul li ul {padding-left: 20px;}
#menu ul li ul li {list-style: none; font-size: 14px; padding: 10px 0;}
#menu ul li ul li:last-child {border-bottom: 0px solid var(--primary);}



/* Hamburger Menu */

#menu-small { background: var(--primary);
  width: 50px; z-index: 1000;
  height: 50px; border-radius: 3px;
  position: relative;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
}

#menu-small span {
  display: block;
  position: absolute;
  height: 3px; border-radius: 10px;
  width: 60%; left: 20%;
  background: #fff;
  opacity: 1;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}


#menu-small span:nth-child(1) {
  top: 13px;
}

#menu-small span:nth-child(2),#menu-small span:nth-child(3) {
  top: calc(50% - 1.5px);
}

#menu-small span:nth-child(4) {
  top: 34px;
}

#menu-small.open span:nth-child(1) {
  top: calc(50% - 1.5px);
  width: 0%;
  left: 50%;
}

#menu-small.open span:nth-child(2) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

#menu-small.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

#menu-small.open span:nth-child(4) {
  top: calc(50% - 1.5px);
  width: 0%;
  left: 50%;
}

@media(min-width:768px) {
    
}
@media(min-width:1250px) {
   
  #menu ul {display: flex; justify-content: flex-end; gap: 40px; align-items: center;}
  #menu ul li  {padding: 0; border: 0;}
  #menu ul > li.item-120 {background: var(--primary); transition: 0.2s;padding: 8px 20px 10px;}
  #menu ul > li.item-120:hover  {background: var(--secondary); }
  #menu ul > li.item-120:hover  a {color: white;background: var(--secondary)}
  #menu ul li a {padding: 5px 10px; color: white;transition: 0.2s;text-shadow: 0 0 10px rgba(0,0,0,0.3); }
  #menu ul li li a {text-shadow: 0 0 0px white; }
  #menu ul li a:hover {background: var(--primary); color: white; }
  #menu ul li:hover a {background: var(--primary); color: white; }
  
 #menu ul li ul.mod-menu__sub { position: absolute; padding: 20px 30px; background: white; display: none;}
 #menu ul li:hover ul {display: block;}
 #menu ul li ul.mod-menu__sub li {list-style: none; font-size: 16px;}
 #menu ul li ul.mod-menu__sub li a {color: black ; background: none; padding: 5px 0; display: block;}
 #menu ul li ul.mod-menu__sub li a:hover {color: var(--primary);}
 #menu ul li ul.mod-menu__sub li.active a {color: var(--primary);}
  
    #menu-small { display: none; }
#menu {  z-index: 998; background: none; padding: 0; position: relative; width: auto; left: auto; top: auto; height: auto; transition: 0.3s ease;}


}