.sidenav {height:100%; width:0; position:fixed; z-index: 9999; top:0; left:0; background-color:#2d438c; overflow-x:hidden; transition:0.5s; padding-top:60px;}
.sidenav li a {padding:5px 10px;text-transform:uppercase;text-decoration:none; font-size:20px; color:#fff; display:block; transition:0.3s;}
.sidenav li a:hover,.sidenav li a.active {color:#fff;}
.sidenav li a::after {content:''; display:block; width:0; height:2px; background:#fff; transition:width .3s;}
.sidenav li a:hover::after,.sidenav li a.active::after {width:100%;}
.sidenav .closebtn {position:absolute; top:20px; right:50px; font-size:36px;color:#fff;}

@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 14px;}
}