.menu-wrap a{color:#f3f3f3;font-family:'Open Sans', sans-serif;font-size:16px;}
.menu-wrap a:hover,
.menu-wrap a:focus{color:#fecd1a;background:#191e21;border-left:3px solid #eee;transition:0.5s all;-webkit-transition:0.5s all;-o-transition:0.5s all;-ms-transition:0.5s all;-moz-transition:0.5s all;}
.content-wrap{overflow-y:scroll;-webkit-overflow-scrolling:touch;}
.content{position:relative;background:#b4bad2;}
.content::before{position:absolute;top:0;left:0;z-index:10;width:100%;height:100%;background:rgba(0,0,0,0.3);content:'';opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);-webkit-transition:opacity 0.4s, -webkit-transform 0s 0.4s;transition:opacity 0.4s, transform 0s 0.4s;-webkit-transition-timing-function:cubic-bezier(0.7,0,0.3,1);transition-timing-function:cubic-bezier(0.7,0,0.3,1);}
.menu-button{position:absolute;z-index:1000;margin:13px;padding:0;width:2.5em;height:2.25em;border:none;text-indent:2.5em;font-size:1.5em;color:transparent;background:transparent;outline:none;top:37px;}
.menu-button:active{outline:none;}
.menu-button::before{position:absolute;top:0.5em;right:0.5em;bottom:0.5em;left:0.5em;background:linear-gradient(#373a47 20%, transparent 20%, transparent 40%, #373a47 40%, #373a47 60%, transparent 60%, transparent 80%, #373a47 80%);content:'';}
.menu-button:hover{opacity:0.6;}
.close-button{width:1em;height:1em;position:absolute;right:1em;top:1em;overflow:hidden;text-indent:1em;font-size:0.75em;border:none;background:transparent;color:transparent;}
.close-button::before,
.close-button::after{content:'';position:absolute;width:3px;height:100%;top:0;left:50%;background:#bdc3c7;}
.close-button::before{-webkit-transform:rotate(45deg);transform:rotate(45deg);}
.close-button::after{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);}
.menu-wrap{position:fixed;z-index:1001;width:300px;height:100%;background:#1d292f;padding:40px 0 0;font-size:1.15em;-webkit-transform:translate3d(-320px,0,0);transform:translate3d(-320px,0,0);-webkit-transition:-webkit-transform 0.4s;transition:transform 0.4s;-webkit-transition-timing-function:cubic-bezier(0.7,0,0.3,1);transition-timing-function:cubic-bezier(0.7,0,0.3,1);}
.menu,
.icon-list{height:100%;}
.icon-list{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0);}
.icon-list a{display:block;padding:11px 0 10px 10px;-webkit-transform:translate3d(0,500px,0);transform:translate3d(0,500px,0);}
.icon-list,
.icon-list a{-webkit-transition:-webkit-transform 0s 0.4s;transition:transform 0s 0.4s;-webkit-transition-timing-function:cubic-bezier(0.7,0,0.3,1);transition-timing-function:cubic-bezier(0.7,0,0.3,1);}
.icon-list a:nth-child(2){-webkit-transform:translate3d(0,1000px,0);transform:translate3d(0,1000px,0);}
.icon-list a:nth-child(3){-webkit-transform:translate3d(0,1500px,0);transform:translate3d(0,1500px,0);}
.icon-list a:nth-child(4){-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0);}
.icon-list a:nth-child(5){-webkit-transform:translate3d(0,2500px,0);transform:translate3d(0,2500px,0);}
.icon-list a:nth-child(6){-webkit-transform:translate3d(0,3000px,0);transform:translate3d(0,3000px,0);}
.icon-list a span{margin-left:10px;font-weight:700;}
.show-menu .menu-wrap{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);-webkit-transition:-webkit-transform 0.8s;transition:transform 0.8s;-webkit-transition-timing-function:cubic-bezier(0.7,0,0.3,1);transition-timing-function:cubic-bezier(0.7,0,0.3,1);height:100%;}
.show-menu .icon-list,
.show-menu .icon-list a{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);-webkit-transition:-webkit-transform 0.8s;transition:transform 0.8s;-webkit-transition-timing-function:cubic-bezier(0.7,0,0.3,1);transition-timing-function:cubic-bezier(0.7,0,0.3,1);}
.show-menu .icon-list a i{font-size:20px;vertical-align:initial;}
.show-menu .icon-list a{-webkit-transition-duration:0.9s;transition-duration:0.9s;transition:0.5s all;-webkit-transition:0.5s all;-o-transition:0.5s all;-ms-transition:0.5s all;-moz-transition:0.5s all;margin:10px 0;border-left:3px solid #1d292f;}
.show-menu .icon-list a:hover{border-left:3px solid #eee;}
.show-menu .content::before{opacity:1;-webkit-transition:opacity 0.8s;transition:opacity 0.8s;-webkit-transition-timing-function:cubic-bezier(0.7,0,0.3,1);transition-timing-function:cubic-bezier(0.7,0,0.3,1);-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);}
@media (max-width:1280px){.menu-button{margin:35px 0;}
}
@media (max-width:1080px){.menu-button{margin:30px 0;}
}
@media (max-width:1024px){.show-menu .menu-wrap{overflow-y:scroll;}
}
@media (max-width:800px){.show-menu .menu-wrap{overflow-y:visible;}
.menu-button{margin:9px 0;top:75px;}
}
@media (max-width:768px){.menu-wrap a{font-size:15px;}
.show-menu .icon-list a i{font-size:19px;}
.menu-wrap{width:260px;}
.show-menu .menu-wrap{overflow-y:visible;}
}
@media (max-width:736px){.show-menu .menu-wrap{overflow-y:scroll;}
.menu-button{left:5px;top:82px;}
.menu-wrap{width:270px;}
}
@media (max-width:414px){.menu-button{top:130px;}
}