<style>
		body {margin: 0;}

		ul.sidenav {
		  list-style-type: none;
		  margin: 0;
		  padding: 0;
		  width: 25%;
		  background-color: #f1f1f1;
		  position: fixed;
		  height: 100%;
		  overflow: auto;
		}

		ul.sidenav li a {
		  display: block;
		  color: #000;
		  padding: 8px 16px;
		  text-decoration: none;
		}
		 
		ul.sidenav li a.active {
		  background-color: #4c87af;
		  color: white;
		}

		ul.sidenav li a:hover:not(.active) {
		  background-color: #555;
		  color: white;
		}

		div.content {
		  margin-left: 25%;
		  padding: 1px 16px;
		  height: 1000px;
		}

		@media screen and (max-width: 900px) {
		  ul.sidenav {
		    width: 100%;
		    height: auto;
		    position: relative;
		  }
		  
		  ul.sidenav li a {
		    float: left;
		    padding: 15px;
		  }
		  
		  div.content {margin-left: 0;}
		}

		@media screen and (max-width: 400px) {
		  ul.sidenav li a {
		    text-align: center;
		    float: none;
		  }
		}
	</style>