/* VARIABLES */
.nav .open > a{ background-color:transparent;}
.nav .open > a:hover{ background-color:transparent;}
.nav .open > a:focus{ background-color:transparent;}

/* Wrappers */
#wrapper{ -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; -webkit-transition:all 0.5s ease; padding-left:0; transition:all 0.5s ease;}
#wrapper.toggled{ padding-left:220px;}
#wrapper.toggled #sidebar-wrapper{ width:220px;}
#wrapper.toggled #page-content-wrapper{ margin-right:-220px; position:absolute; z-index:1200;}
#sidebar-wrapper{ -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; -webkit-transition:all 0.5s ease; background:#333; height:100%; left:220px; margin-left:-220px; overflow-x:hidden; overflow-y:auto; transition:all 0.5s ease; width:0; z-index:1100;}
#sidebar-wrapper::-webkit-scrollbar{ display:none;}
#page-content-wrapper{ padding-top:120px; width:100%;}

/* Sidebar nav styles */
.sidebar-nav{ list-style:none; margin:0; padding:0; position:absolute; top:0; width:220px; z-index:1100;}
.sidebar-nav > .sidebar-brand h3{ height:80px; line-height:80px; margin:0 0 20px; padding-left:25px; font-weight:normal; font-size:15px; color:#fff; text-transform:uppercase; background:#cf000e;}
.sidebar-nav li a{ padding-left:25px; font-size:#fff;}

/* Hamburger-Cross */
.menu-btn { position:fixed; top:23px; right:25px; width:34px; height:34px; background:#cf000e; border:1px solid #fff; border-radius:50%; box-sizing:content-box; z-index:4000;}
.hamburger { position:absolute; top:7px; left:7px; border:none; display:block; height:20px; width:20px; background:#cf000e;}

.hamburger:hover, .hamburger:focus, .hamburger:active{ outline:none;}
.hamburger.is-closed:before{ -webkit-transform:translate3d(0, 0, 0); -webkit-transition:all 0.35s ease-in-out; color:#fff; content:''; display:block; font-size:14px; line-height:32px; opacity:0; text-align:center; width:100px;}
.hamburger.is-closed:hover before{ -webkit-transform:translate3d(-100px, 0, 0); -webkit-transition:all 0.35s ease-in-out; display:block; opacity:1;}
.hamburger.is-closed:hover .hamb-top{ -webkit-transition:all 0.35s ease-in-out; top:0;}
.hamburger.is-closed:hover .hamb-bottom{ -webkit-transition:all 0.35s ease-in-out; bottom:0;}
.hamburger.is-closed .hamb-top{ -webkit-transition:all 0.35s ease-in-out; background-color:#fff; top:5px;}
.hamburger.is-closed .hamb-middle{ background-color:#fff; margin-top:-1px; top:50%;}
.hamburger.is-closed .hamb-bottom{ -webkit-transition:all 0.35s ease-in-out; background-color:#fff; bottom:5px;}
.hamburger.is-closed .hamb-top, .hamburger.is-closed .hamb-middle, .hamburger.is-closed .hamb-bottom, .hamburger.is-open .hamb-top, .hamburger.is-open .hamb-middle, .hamburger.is-open .hamb-bottom{ height:2px; left:0; position:absolute; width:100%;}
.hamburger.is-open .hamb-top{ -webkit-transform:rotate(45deg); -webkit-transition:-webkit-transform 0.2s cubic-bezier(0.73, 1, 0.28, 0.08); background-color:#fff; margin-top:-1px; top:50%;}
.hamburger.is-open .hamb-middle{ background-color:#fff; display:none;}
.hamburger.is-open .hamb-bottom{ -webkit-transform:rotate(-45deg); -webkit-transition:-webkit-transform 0.2s cubic-bezier(0.73, 1, 0.28, 0.08); background-color:#fff; margin-top:-1px; top:50%;}
.hamburger.is-open:before{ -webkit-transform:translate3d(0, 0, 0); -webkit-transition:all 0.35s ease-in-out; color:#fff; content:''; display:block; font-size:14px; line-height:32px; opacity:0; text-align:center; width:100px;}
.hamburger.is-open:hover before{ -webkit-transform:translate3d(-100px, 0, 0); -webkit-transition:all 0.35s ease-in-out; display:block; opacity:1;}

/* Dark Overlay */
.overlay{ position:fixed; display:none; width:100%; height:100%; top:0; left:0; right:0; bottom:0; background-color:rgba(0, 0, 0, 0.4); z-index:1100;}

@media screen and (max-width:800px){
.sidebar-nav > .sidebar-brand h3{ height:60px; line-height:60px;}
.menu-btn { top:13px; right:3.5%;}
}