.mobile-header{

display:flex;

justify-content:space-between;

align-items:center;

padding:20px 0;

}

.mobile-logo img{

height:50px;

}

.menu-toggle{

background:none;

border:none;

font-size:35px;

color:#fff;
margin-right: -8px;

}

.mobile-menu{

position:fixed;

inset:0;

display:flex;

opacity:0;

visibility:hidden;

transition:.35s;

z-index:99999;

}

.mobile-menu.active{

opacity:1;

visibility:visible;

}

.mobile-overlay{

flex:1;

background:rgba(0,0,0,.5);

}

.mobile-panel{

width:320px;

background:#222;

padding:40px 30px;

transform:translateX(100%);

transition:.35s;

overflow:auto;

}

.mobile-menu.active .mobile-panel{

transform:translateX(0);

}

.mobile-panel ul{

list-style:none;

padding-top:30px;

}

.mobile-panel li{

margin:20px 0;
text-align: center;
}

.mobile-panel a{

color:#fff;
font-size:22px;
text-decoration:none;
text-align: center;

}

.menu-close{

background:none;

border:none;

color:#fff;

font-size:32px;

float:right;

}

body.menu-open{

overflow:hidden;

}

@media(min-width:992px){

.mobile-header,

.mobile-menu{

display:none;

}

}