*{box-sizing:border-box}html{font-family:Jost,sans-serif}body{margin:0}header{box-shadow:0 2px 8px #00000042;margin:2rem auto;border-radius:10px;padding:.5rem;background-color:#0078c6;color:#fff;text-align:center;width:90%;max-width:40rem}#app ul{margin:0;padding:0;list-style:none}#app li{box-shadow:0 2px 8px #00000042;margin:1rem auto;border-radius:10px;padding:1rem;text-align:center;width:90%;max-width:40rem}#app h2{font-size:1.5rem;border-bottom:4px solid #ccc;color:#000;margin:0 0 1rem}#app button{font:inherit;cursor:pointer;border:1px solid #0078c6;background-color:#fff;color:#0078c6;padding:.05rem 1rem;box-shadow:1px 1px 2px #00000042}#app button:hover,#app button:active{background-color:#fede58;border-color:#0078c6;box-shadow:1px 1px 4px #00000042}#app span:hover li{background-color:#0078c6}