@import"https://fonts.googleapis.com/css?family=Vollkorn|Roboto";.container{position:absolute;width:100%;height:100%;text-align:center;top:40%;left:0;margin:0 auto;font-family:Roboto,sans-serif}.container p{font-size:1.25rem}.container a{display:inline-block;position:relative;text-align:center;color:#000;text-decoration:none;font-size:20px;overflow:hidden;top:5px}.container a:after{content:"";position:absolute;background:#000;height:2px;width:0%;transform:translate(-50%);left:50%;bottom:0;transition:.35s ease}.container a:hover:after{width:100%}h1{position:relative;text-align:center;font-family:Vollkorn,sans-serif}.button_container{position:fixed;top:0px;right:0px;height:27px;width:35px;cursor:pointer;z-index:100;transition:opacity .25s ease}.button_container:hover{opacity:.7}.button_container.active .top{transform:translateY(10px) translate(0) rotate(45deg);background:#FFF}.button_container.active .middle{opacity:0;background:#FFF}.button_container.active .bottom{transform:translateY(-10px) translate(0) rotate(-45deg);background:#FFF}.button_container.active span:nth-of-type(3){top:1.5rem}.button_container span{background:#FFF;border:none;height:.2rem;width:40%;position:absolute;top:0px;left:0;transition:all .35s ease;cursor:pointer;margin-left:1.25rem;margin-top:1.25rem}.button_container span:nth-of-type(2){top:.5rem}.button_container span:nth-of-type(3){top:1rem}.overlay{position:fixed;top:0;left:0;width:100%;height:100%;opacity:1;visibility:hidden;transition:opacity .35s,visibility .35s,width .35s;z-index:50}.overlay:before{content:"";background:#000;left:-55%;top:0;width:50%;height:100%;position:absolute;transition:left .35s ease}.overlay:after{content:"";background:#000;right:-55%;top:0;width:50%;height:100%;position:absolute;transition:all .35s ease}.overlay.open{opacity:.9;visibility:visible;height:100%}.overlay.open:before{left:0}.overlay.open:after{right:0}.overlay.open li{animation:fadeInRight .5s ease forwards;animation-delay:.35s}.overlay.open li:nth-of-type(2){animation-delay:.45s}.overlay.open li:nth-of-type(3){animation-delay:.55s}.overlay.open li:nth-of-type(4){animation-delay:.65s}.overlay nav{position:relative;height:70%;top:50%;transform:translateY(-50%);font-size:2rem;font-family:Vollkorn,serif;font-weight:400;text-align:center;z-index:100}.overlay ul{list-style:none;padding:0;margin:0 auto;display:inline-block;position:relative;height:100%}.overlay ul li{display:block;height:25%;height:20%;min-height:50px;position:relative;opacity:0}.overlay ul li a{display:block;position:relative;color:#fff;text-decoration:none;overflow:hidden}.overlay ul li a:hover:after,.overlay ul li a:focus:after,.overlay ul li a:active:after{width:100%}.overlay ul li a:after{content:"";position:absolute;bottom:0;left:50%;width:0%;transform:translate(-50%);height:3px;background:#FFF;transition:.35s}@keyframes fadeInRight{0%{opacity:0;left:20%}to{opacity:1;left:0}}.current-middle span{background:#000}.current-middle ul li a{color:#000}.current-middle ul li a:after{background:#000}