.sidenav{width:0;position:fixed;z-index:999999;top:0;left:0;background-color:#111;padding-top:60px;transition:.5s;overflow-y:auto}.sidenav a{padding:8px 8px 8px 32px;text-decoration:none;font-size:14px;color:#818181;display:block;transition:.3s}.offcanvas a:focus,.sidenav a:hover{color:#f1f1f1}.sidenav .closebtn{position:absolute;top:0;right:25px;font-size:36px;margin-left:50px}#main{transition:margin-left .5s;padding:20px}@media screen and (max-height:300px){.sidenav{height:78%}}@media (min-height:300px) and (max-height:1200px){.sidenav{height:88%}}