.sidenav{height:100%;width:250px;position:fixed;z-index:1;top:0;left:0;background-color:#111;overflow-x:hidden;padding-top:60px;-webkit-transition:.5s;transition:.5s}.sidenav a{padding:8px 8px 8px 32px;text-decoration:none;font-size:25px;color:#818181;display:block;-webkit-transition:.3s;transition:.3s}.sidenav a:hover{color:#f1f1f1}.sidenav .closebtn{position:absolute;top:0;right:25px;font-size:36px;margin-left:50px}#main{-webkit-transition:margin-left .5s;transition:margin-left .5s;padding:20px;margin-left:250px}@media screen and (max-height:450px){.sidenav{padding-top:15px}.sidenav a{font-size:18px}}.topnav{background-color:#333;overflow:hidden}.topnav a{float:left;display:block;color:#f2f2f2;text-align:center;padding:14px 16px;text-decoration:none;font-size:17px}.topnav a:hover{background-color:#ddd;color:#000}.topnav a.active{background-color:#4caf50;color:#fff}.topnav .icon{display:none}