html{font-size:62.5%;margin:auto;font-family:sans-serif}div{margin:0px auto 0px auto;width:1080px;display:block}body{padding:0px 0px 60px 0px;font-size:1.6rem;color:rgb(84,84,84)}div#content{width:900px;float:right}.sidenav{position:fixed;width:160px;height:100%;z-index:1;top:0;overflow-x:hidden;padding-top:20px;margin-right:10px;float:left}.sidenav a{margin-right:10px;font-size:1.8rem;font-weight:bold;color:black;text-decoration:none;text-transform:uppercase;display:block}.sidenav a:hover{width:100%;background-color:grey;color:white}.sidenav a:active{background-color:green;color:white}footer{width:900px;display:inline-block;margin-top:3rem;padding:10px 0;border-top:0.3rem solid rgb(84,84,84);font-size:1.2rem;color:#555;text-align:center;float:right}h1{font-size:2.5rem}h2{font-size:2rem}article .header{font-size:1.4rem;font-style:italic;color:#555}.logo a{font-weight:bold;color:#000;text-decoration:none}span{margin:auto;width:50%;height:auto;justify-content:space-around;display:flex;text-align:center}@media (max-width:60%){body{width:50%;margin:0;padding:0 5%}header{margin:3.5rem 0}.sidenav{margin:0 auto 3rem;text-align:center}footer{text-align:center}.logo{text-align:center;margin:1rem auto 3rem}.logo a{font-size:2.4rem}.sidenav a{display:block;line-height:1.6}}@media (min-width:20%){body{width:60%;margin:0;padding:0 5%}header{margin:4.2rem 0}.sidenav{margin:0 auto 3rem;text-align:center}footer{text-align:center}.logo{text-align:center;margin:1rem auto 3rem}.logo a{font-size:2.4rem}nav a{display:vertical;margin:0 0.6rem}}