/* 
24.08.30 - px-em
*/


/* TOP HEADER MENU*/
.menu-nav-ul {display:flex; justify-content:space-between; flex-wrap:wrap; padding:0 7%; width:inherit!important}

/*
#menudrop div {margin-right: 20px;}
#menudrop div:last-child {margin-right:0px;} */
.header-menu-drop .button {margin-right:0px;}
/*
.logo-left #menudrop ul {display: flex; justify-content: space-between; margin-left: 120px;}
.logo-left .logo {left:0%;}
.logo-right #menudrop ul {display: flex; justify-content: space-between; margin-right: 120px;}
.logo-right .logo {right:0%;}*/
.menu-color-rev {background:var(--clr-m)}
.menu-color-rev { --clr-m:var(--clr-b)}
#menudrop > nav {
--menu-nav-pad:0.75em;
--menu-nav-font-s:1em;
}

#menudrop ul {display: flex; justify-content: space-between; margin-bottom: 0px; width: inherit; padding-left: 0;}
/* #menudrop:after,#menudrop > nav > ul:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0} */
#menudrop #head-mobile{display:none}
#menudrop > nav > ul span > li {float:left}
#menudrop > nav > ul > li > a {padding:var(--menu-nav-pad) 0px; letter-spacing:1px;text-decoration:none;color:var(--clr-b); font-size:1.2em; text-transform:uppercase; }
#menudrop > nav > ul > li:hover > a, #menudrop ul li.active a{}
#menudrop > nav > ul > li:hover,#menudrop ul li.active:hover,#menudrop ul li.active,#menudrop ul li.has-sub.active:hover{z-index:991}
#menudrop > nav > ul > li.has-sub > a{padding-right:1em; display:flex; align-items:center;}
#menudrop > nav > ul > li.has-sub > a:before, #menudrop > nav > ul > li.has-sub > a:after {display:flex; top:auto; align-content:center;position:absolute;background:var(--clr-m);content:'';}
#menudrop > nav > ul > li.has-sub > a:after{font-size:1em; right:0.0625em; width:0.5em; height:0.125em;}
#menudrop > nav > ul > li.has-sub > a:before{font-size:1em; right:0.25em; height:0.5em; width:0.125em;}
#menudrop > nav > ul > li.has-sub:hover > a:before{height:0; visibility: hidden}
#menudrop ul ul{position:absolute; left:-9999px; display:block; background:var(--clr-w); border-bottom:1px solid var(--clr-m); padding-left:0px;}
#menudrop ul ul li:first-child {}
#menudrop ul ul li {height:0;-webkit-transition:all .25s ease;-ms-transition:all .25s ease; transition:all .25s ease}
#menudrop ul ul li:hover{}
#menudrop li:hover > ul{left:auto}
#menudrop li:hover > ul > li{height:auto}
#menudrop ul ul ul{margin-left:100%;top:0; padding: 0}
#menudrop ul ul li a{display:flex; align-items:center;padding:var(--menu-nav-pad);width:250px;font-size:1em;text-decoration:none;color:var(--clr-b);font-weight:400;}
#menudrop ul ul li:last-child > a,#menudrop ul ul li.last-item > a{border-bottom:0}
#menudrop ul ul li:hover > a,#menudrop ul ul li a:hover{color:var(--clr-w); font-weight: 700; background: var(--clr-m)}
#menudrop ul ul li.has-sub > a:after, #menudrop ul ul li.has-sub > a:before {position:absolute; background:var(--clr-m);content:''; display:block; font-size:1.125em;}
#menudrop ul ul li.has-sub > a:after{width:0.5em; height:0.125em; right:0.5em;}
#menudrop ul ul li.has-sub > a:before{height:0.5em; width:0.125em; right:0.7em;}
#menudrop ul ul > li.has-sub:hover > a:after{background:var(--clr-w)}
#menudrop ul ul > li.has-sub:hover > a:before {top:1.5em;height:0}
#menudrop ul ul li.has-sub:hover,#menudrop ul li.has-sub ul li.has-sub ul li:hover{background:var(--clr-m)}
#menudrop ul ul ul li.active a{border-left:1px solid var(--clr-m)}
#menudrop > nav > ul > li.has-sub > ul > li.active > a,#menudrop > nav > ul ul > li.has-sub > ul > li.active> a{border-top:1px solid var(--clr-m)}


@media screen and (max-width:1620px){	
.menu-nav-ul {}
#menudrop > nav > ul > li > a {font-size: 1.25em;}
}
@media screen and (max-width:1440px){
.menu-nav-ul {}
#menudrop > nav > ul > li > a {font-size: 1.125em;}
#menudrop ul ul li a{width:220px;font-size:0.875em;}
}
@media screen and (max-width:1180px){
.menu-nav-ul {}
#menudrop > nav > ul > li > a {font-size: 1em;}
}
@media screen and (max-width: 1086px) {
.menu-nav-ul {padding: 0; max-height: 100vh; overflow: auto;}
.menu-nav-ul li:hover .submenu-button:before, .menu-nav-ul li:hover .submenu-button:after {background: var(--clr-w);}
#menudrop{flex-wrap: wrap;}
#menudrop ul{width:100%!important; padding:1em 0; order: 7; margin-right:0; display: block}
#menudrop ul li{width:100%;border-top:1px solid var(--clr-m); padding-left:1em}
#menudrop ul li:hover{padding-left:1.5em}
#menudrop ul ul{background:none;}
#menudrop ul ul li,#menudrop li:hover > ul > li{height:auto}
#menudrop ul li a {width:100%;border-bottom:0; padding:var(--menu-nav-pad) 0}
#menudrop ul ul li a {width:100%;border-bottom:0; padding-left:0px; color:var(--clr-w); background:none; width:calc(95% - 2.25em);}
#menudrop > nav > ul > li{float:none; padding:0;}
#menudrop ul ul li:hover{background:none!important}
#menudrop ul ul ul li a{padding-left:0.5em}
#menudrop ul ul li:hover > a, #menudrop ul ul li.active > a{color:var(--clr-w);}
#menudrop > nav > ul > li > a {padding-right:var(--menu-nav-pad)}
#menudrop > nav > ul > li:hover > a {color:var(--clr-w); background:var(--clr-m); }
#menudrop ul ul,#menudrop ul ul ul{padding: 0; position:relative;left:0;width:100%;margin:0;text-align:left;border-bottom: 0;}
#menudrop > nav > ul > li.has-sub > a:after,#menudrop > nav > ul > li.has-sub > a:before,#menudrop ul ul > li.has-sub > a:after,#menudrop ul ul > li.has-sub > a:before{display:none}
#menudrop #head-mobile{display:block;padding:0px;color:var(--clr-d);font-size:0.8em;font-weight:700}
#menudrop li .submenu-button {position:absolute;right:0;z-index:99;display:flex;justify-content:center;align-items:center;border-left:1px solid var(--clr-m);height:2.5em;width:2.5em; height:calc(var(--menu-nav-font-s) + var(--menu-nav-pad)*2); width:calc(var(--menu-nav-font-s) + var(--menu-nav-pad)*2);
	
	
	
	cursor:pointer}
#menudrop li .submenu-button:after{position:absolute;width:1em;height:0.225em;background:var(--clr-m);content:''}
#menudrop li .submenu-button:before{position:absolute;width:0.225em;height:1em;background:var(--clr-m);content:''}
	
#menudrop li:hover .submenu-button {border-left:1px solid var(--clr-w);}
#menudrop ul ul li:hover .submenu-button {border-left:1px solid var(--clr-m);}
#menudrop li:hover .submenu-button:after, #menudrop li:hover .submenu-button:before{background:var(--clr-w);}
#menudrop li:hover li .submenu-button:after, #menudrop li:hover li .submenu-button:before{background:var(--clr-m);}
#menudrop li li:hover .submenu-button:after, #menudrop li li:hover .submenu-button:before{background:var(--clr-w);}
#menudrop ul ul .submenu-button:after, #menudrop ul ul .submenu-button:before{}
#menudrop ul ul .submenu-button{}
#menudrop ul ul.open{}
	/**/
#menudrop ul ul .submenu-button:after{}
#menudrop ul ul .submenu-button:before{}
#menudrop .submenu-button.submenu-opened:before{display:none}
#menudrop ul ul ul li.active a{border-left:none}
#menudrop > nav > ul > li.has-sub > ul > li.active > a,#menudrop > nav > ul ul > li.has-sub > ul > li.active > a{border-top:none}

#menudrop .button{width:2.25em;height:2.25em;position:relative;cursor:pointer;z-index:999; order:9}
#menudrop .navigation {z-index:999; order:10; width:100%; background:var(--clr-g);}
#menudrop .button:after, #menudrop .button:before {position:absolute; top:1em; right:0; display:block; height:0.7em; width:2.25em; border-top:0.3em solid var(--clr-m); border-bottom:0.3em solid var(--clr-m); content: '';}
#menudrop .button:before {top:0px; height:0px; border-bottom:0;}
#menudrop .button.menu-opened:after{transform:rotate(45deg); border-bottom:0; height:0}
#menudrop .button.menu-opened:before{transform:rotate(-45deg)}
#menudrop .button.menu-opened:after, #menudrop .button.menu-opened:before{width:2.25em; top:1.125em; background:var(--clr-m);}
}
	
	
/* TOP HEADER MENU END*/