@keyframes addressAppear{0%{width:0;opacity:0}65%{opacity:0}to{opacity:1;width:30%}}@keyframes errors{0%{opacity:0}to{opacity:1}}body{margin:0;font-family:sans-serif;color:#555}nav{padding:0 10px;align-items:center;max-width:1000px;margin:auto}nav>h1{color:#8c8c8c;font-size:2em}#error{background-color:#ff5c5c;color:#fff;font-weight:700;text-align:center;padding:10px;animation:errors 1s ease}#main,nav{display:flex;justify-content:space-between}#main>#address{width:30%;padding:10px 20px;box-sizing:border-box;animation:addressAppear 1s ease}#main>#address>#details{color:gray}button{font-size:1rem;background-color:#3b7197;color:#fff;border:0;padding:10px 20px;border-radius:5px;transition:all .5s ease}button:hover{background-color:#4a8db7}button:active{background-color:#a1e1fa}.hidden{display:none}@media screen and (max-width:820px){#main{flex-direction:column}#main>#address{width:100vw}@keyframes addressAppear{0%{opacity:0}to{opacity:1}}}