*{box-sizing:border-box}body{font-family:Arial,sans-serif;color:#333;display:flex;flex-direction:column;height:100vh;width:100vw;margin:0}header{display:flex;align-items:center;background-color:#fff;box-shadow:0 2px 4px #0000001a;padding:10px}.logo{width:75px;margin:0 2rem 0 1rem}.app-name{font-size:2rem;font-weight:700;color:indigo}main{height:100%;display:flex}@media screen and (max-width: 959px){main{display:block}}nav{background-color:#4a027e;color:#fff;font-size:18px;padding:20px;flex:1;min-width:270px}@media screen and (max-width: 959px){nav{display:none}}nav a{display:block;background-color:#ead9f8;color:#4a027e;text-decoration:none;padding:5px 10px;margin-bottom:2px;height:30px}@media screen and (max-width: 959px){nav a{height:40px;padding:10px;margin-bottom:2px}}nav a.subitem{padding-left:2rem}nav a:hover,nav .selected{background-color:#430272;color:#fff}nav .subselected{font-weight:700}article{padding:20px 40px 20px 20px;flex:5}article h1{font-size:2rem;font-weight:700}article .content{max-width:1024px}button.btn-large{background-color:#7303c4;padding:20px;border-radius:5px}button.btn-large a{background-color:#7303c4;color:#c790ef;font-size:24px;display:block;text-decoration:none;padding:5px 10px;margin-bottom:2px;height:30px}button.link{background-color:transparent;padding:2px;border:none;display:block}button.link a{color:#4a027e;text-decoration:none;font-size:16px;font-weight:500}button.link a:after{content:">";display:inline-block;margin-left:5px}footer{height:20vh;background-color:indigo;color:#fff;font-size:14px;text-align:center;line-height:50px}.section{margin-top:10px}@media screen and (max-width: 959px){.topnav{overflow:hidden;position:relative}}.topnav a.icon{display:none}@media screen and (max-width: 959px){.topnav a.icon{color:#000;padding:24px 16px;text-decoration:none;font-size:26px;display:block;background:white;position:absolute;right:0;top:0}}.topnav a:hover{background-color:#ddd;color:#000}.active{background-color:#04aa6d;color:#fff}