.menu-mobile-container {
width: 71vw;
min-height: 100vh;
padding-top: 0;
position: absolute;
background-color: #333;
z-index: 99;
transition-duration: 200ms;
box-shadow: -10px 0 2px -8px rgba(0, 0, 0, 0.3) inset;
}
.menu-mobile-container .nav-menu {
padding: 1rem 0;
}
.menu-mobile-container ul.nav-menu,
.menu-mobile-container ul.sub-menu {
margin: 0;
}
.menu-mobile-container .nav-menu > li {
display: block;
padding: 0 1rem;
}
.menu-mobile-container .nav-menu > li {
border-bottom: 1px solid #111;
}
.menu-mobile-container .nav-menu > li > ul > li > a {
padding-left: 1rem;
}
.menu-mobile-container .nav-menu > li > ul > li > ul > li > a {
padding-left: 2rem;
}
.menu-mobile-container .nav-menu > li > ul > li > ul > li > ul > li > a {
padding-left: 3rem;
}
.menu-mobile-container a {
color: white;
padding: .5rem 0;
display: block;
}
.menu-mobile-container a:hover {
color: white;
}
.menu-mobile-hidden {
left: -71vw;
}
.menu-mobile-open {
left: -71vw;
transform: translateX(71vw);
}
#fwm-overlay {
background: #000;
opacity: .4;
width: 100%;
height: 100%;
position: absolute;
z-index: 90;
}
.simple-menu-expand-button,
#simple-menu-close-button {
border-bottom: 0 !important;
float: right;
padding-right: 1rem !important;
padding-left: 1rem !important;
}
.simple-menu-expand-button:hover,
#simple-menu-close-button:hover {
cursor: pointer;
}
#page {
transition-duration: 200ms;
transform: none;
filter: none;
}
.page-mobile-open {
position: fixed;
transform: translateX(71vw);
-webkit-filter: blur(10px);
-moz-filter: blur(10px);
-o-filter: blur(10px);
-ms-filter: blur(10px);
filter: blur(10px);
}
.page-mobile-close {
transform: translateX(0);
left: 0;
position: initial;
-webkit-filter: blur(0px);
-moz-filter: blur(0px);
-o-filter: blur(0px);
-ms-filter: blur(0px);
filter: blur(0px);
}