#g-nav{position:fixed;z-index:999;top:0;right:-120%;width:100%;height:100vh;background:#3896b9;transition:all .6s}#g-nav.panelactive{right:0}#g-nav.panelactive #g-nav-list{position:fixed;z-index:999;width:100%;height:100vh;overflow:auto;-webkit-overflow-scrolling:touch}#g-nav ul{position:absolute;z-index:999;top:50%;left:50%;transform:translate(-50%, -50%)}#g-nav li{list-style:none;text-align:center}#g-nav li a{color:#fff;text-decoration:none;padding:16px;font-size:1.8rem;font-weight:300;display:block;text-transform:uppercase;letter-spacing:.1em;transition:.3s}#g-nav li a:hover{opacity:.5}.openbtn{position:fixed;z-index:9999;top:0;right:0;cursor:pointer;width:70px;height:70px;border-bottom:solid #3896b9 1px;border-left:solid #3896b9 1px;background-color:#3896b9;transition:all .5s}.openbtn.active{transition:all .5s;border:solid #3896b9 1px}.openbtn.active span{background-color:#fff}.openbtn span{display:inline-block;transition:all .5s;position:absolute;left:16px;height:1px;border-radius:1px;background-color:#fff;width:55%}.openbtn span:nth-of-type(1){top:30%;transform:translate(0, -50%)}.openbtn span:nth-of-type(2){top:50%;transform:translate(0, -50%)}.openbtn span:nth-of-type(3){top:70%;transform:translate(0, -50%)}.openbtn.active span:nth-of-type(1){top:30px;right:0;transform:translateY(6px) rotate(-45deg);width:50%}.openbtn.active span:nth-of-type(2){opacity:0}.openbtn.active span:nth-of-type(3){top:42px;right:0;transform:translateY(-6px) rotate(45deg);width:50%}@media(min-width: 767px){#g-nav li a{font-size:2.4rem;letter-spacing:.1em;letter-spacing:3px}.openbtn{width:86px;height:86px}.openbtn span{left:20px}}@media(min-width: 1008px){#g-nav li a{font-size:2.2rem;letter-spacing:.1em;letter-spacing:3px}.openbtn{width:86px;height:86px}.openbtn:hover{background-color:#fff;border:solid #3896b9 1px}.openbtn:hover span{background-color:#3896b9}.openbtn span{left:20px}.openbtn.active:hover{opacity:.5;border:solid #3896b9 1px;background-color:#3896b9}.openbtn.active:hover span{background-color:#fff}}