.menu-header{ position:absolute; left:0; width:calc(100% - 5rem); top:0; bottom:0; z-index:110; padding:4rem 1rem 1rem 1rem; overflow-y:scroll; background-color:#FFFFFF; }
.menu-header > ul{ flex-wrap:wrap; position:relative; margin:0; padding:0; }
.menu-header > ul > li{ flex:1 100%; border-top:1px solid var(--tertiarycolor); }
.menu-header > ul > li a{ padding:6px 0; }

@media screen and (min-width:769px){ 
    .menu-header{ position:relative; width:auto; bottom:unset; padding:0; overflow:visible; background-color:transparent; }
    .menu-header > ul{ width:100%; display:flex; flex-wrap:unset; }
    .menu-header > ul.space{ justify-content:space-between; }
    .menu-header > ul.center{ justify-content:center; }
    .menu-header > ul > li{ flex:unset; display:inline-block; color:#FFFFFF; font-size:1rem; line-height:3rem; font-weight:500; position:relative; border:0; }
    .menu-header > ul > li a{ color:#FFFFFF;  line-height:2rem; font-size:1rem; padding:0.5rem 1.5rem; }
    .menu-header > ul > li:first-child a{ padding-left:0; }
    .menu-header > ul > li:last-child a{ padding-right:0; }
}

.menu-header > ul > li .wrapper{ padding:10px 20px; background:white; background-color:var(--tertiarycolor); box-shadow:0 10px 10px 0 rgba(0,0,0,.1); max-height:calc(100vh - 166px); overflow:auto; display:none; grid-template-columns:repeat(3,auto); grid-gap:1.625rem 1.875rem; }
.menu-header > ul > li.has-sub::after{ content:''; width:11px; height:11px; border-bottom:3px solid var(--primaryColor); border-left:3px solid var(--primaryColor); transition:all ease .3s; right:30px; top:10px; position:absolute; transform:rotate(-135deg); }
.menu-header > ul > li.has-sub.opened:after{ transform:rotate(-45deg); }
.menu-header > ul > li.has-sub.opened .wrapper{ display:block; }

@media screen and (min-width:769px){ 
    .menu-header > ul > li .wrapper{ width:max-content; }
    .menu-header > ul > li .wrapper{ position:absolute; top:40px; z-index:99; padding:30px 30px 20px 30px; background-color:white; }
    .menu-header > ul > li.has-sub:hover .wrapper{ display:grid; }
    .menu-header > ul > li.has-sub::after{ display:none; }
}

.menu-header > ul > li .wrapper .submenu{ all:unset; display:block; }
.menu-header > ul > li .wrapper .submenu .submenu-item.off{ display:none; }
.menu-header > ul > li .wrapper .submenu li{ display:block; }
.menu-header > ul > li .wrapper .submenu li:nth-child(1){ margin-bottom:5px; font-weight:600; }
.menu-header > ul > li .wrapper .submenu li:nth-child(n+2){ font-weight:400!important; text-transform:none; font-size:.8125rem; }
.menu-header > ul > li .wrapper .submenu li:last-child{ color:var(--primaryColor); text-transform:uppercase; margin-top:10px; }
.menu-header > ul > li a.no-link-styleN{ color:var(--secondaryColor); }
.menu-header > ul > li a.see-more{ color:var(--primaryColor); font-weight:600; }
@media screen and (min-width:1199px){ 
    .menu-header > ul > li .wrapper{ width:550px; }
    .menu-header > ul > li.left .wrapper{ left:0px; right:unset; }
    .menu-header > ul > li.center .wrapper{ left:-240px; right:unset; }
    .menu-header > ul > li.right .wrapper{ left:unset; right:0px; }
}