.sidenav{height:100%;width:0;position:fixed;z-index:999;top:0;right:0;background-color:#63349c;overflow-x:hidden;padding-top:60px;transition:.5s}.sidenav .content{position:relative;height:100%;margin:auto}.sidenav .content ul{position:absolute;top:50%;left:50%;list-style-type:none;margin-left:0;padding-left:0;transform:translate(-50%,-50%)}.sidenav .content ul a{display:block;transition:.3s}.sidenav a:hover{color:#f1f1f1}.sidenav .closebtn{position:absolute;top:10%;right:25px;font-size:36px;margin-left:50px;text-align:center;width:50px;height:50px;line-height:40px;border-radius:50%;border:2px solid #fff;color:#fff;z-index:999}#main{transition:margin-left .5s;padding:20px}@media screen and (max-height:450px){.sidenav{padding-top:15px}.sidenav a{font-size:18px}}