.content-wrap{overflow:hidden;width:100%;height:100%;}
.menu-wrap a{color:#b8b7ad;}
.menu-wrap a:hover,
.menu-wrap a:focus{color:#2e97ce;}
.content-wrap{-webkit-transition:-webkit-transform 0.3s;transition:transform 0.3s;}
.content{position:relative;}
.content::before{position:absolute;top:0;left:0;z-index:0;width:100%;height:100%;background:none;content:'';opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);-webkit-transition:opacity 0.3s, -webkit-transform 0s 0.3s;transition:opacity 0.3s, transform 0s 0.3s;}
.menu-button{position:fixed;z-index:1000;margin:1em;padding:0;width:2.5em;height:2.25em;border:none;text-indent:2.5em;font-size:1.5em;color:transparent;background:transparent;-webkit-transition:-webkit-transform 0.3s;transition:transform 0.3s;}
.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:20px;height:20px;position:absolute;right:20px;top:110px;overflow:hidden;text-indent:1em;font-size:0.75em;border:none;background:transparent;color:transparent;outline:none;}
.close-button::before,
.close-button::after{content:'';position:absolute;width:1px;height:100%;top:0;left:50%;background:#575a5c;}
.close-button::before{-webkit-transform:rotate(45deg);transform:rotate(45deg);}
.close-button::after{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);}
.menu-wrap{position:absolute;font-weight:700;opacity:0;-webkit-transition:opacity 1s;transition:opacity 1s;width:300px;height:100%;}
.menu-top{line-height:58px;}
.menu-top .profile{display:inline-block;padding:8px 10px;line-height:42px;}
.menu-top .profile,
.menu-side{width:300px;}
.menu-top .profile img{float:left;margin-right:1em;}
.icon-list{display:inline-block;font-size:1.25em;}
.icon-list a{margin:0 1em 0 0;padding:0;}
@media screen and (max-width:32em){.icon-list{padding-left:1em;}
}
.menu-side a{display:block;padding:1.2em;border-bottom:1px solid rgba(0,0,0,0.1);}
.menu-side a:first-child{border-top:1px solid rgba(0,0,0,0.1);}
.show-menu .menu-wrap{opacity:1;}
.show-menu .content-wrap,
.show-menu .menu-button{-webkit-transform:translate3d(300px,0,0);transform:translate3d(300px,0,0);}
.show-menu .content::before{opacity:1;-webkit-transition:opacity 0.3s;transition:opacity 0.3s;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);}