*{box-sizing:border-box;margin:0;padding:0}@font-face{font-family:"Lato";src:url("../fonts/Lato-Regular.ttf") format("truetype");font-weight:normal;font-style:normal}@font-face{font-family:"Lato";src:url("../fonts/Lato-Bold.ttf") format("truetype");font-weight:bold;font-style:normal}body{font-family:Lato,Arial,sans-serif;font-size:1rem;line-height:1.2}body{background-color:#fff;padding-block:max(1rem,10vh);padding-inline:max(1rem,10vw)}button{background-color:#666;border:#000;color:#fff;font-size:1rem;margin:1rem;padding:1rem 2rem}button:focus,button:hover{background-color:#4d4d4d;cursor:pointer}button#download{display:none}h1{font-size:2.6rem;font-weight:bold;line-height:1.2;margin-block-end:2rem}fieldset{align-items:center;border:0;display:grid;grid-template-columns:7rem 1fr;margin-bottom:1rem}input[type=color]{height:4rem;cursor:pointer;width:4rem}input[type=text]{padding:.5rem 1rem}input[type=submit]{background-color:#053c5e;border:#053c5e;color:#fff;font-size:1rem;margin:1rem 0;padding:1rem 2rem}input[type=submit]:focus,input[type=submit]:hover{background-color:#085b8e;cursor:pointer}a{color:#a31621}a:focus,a:hover{text-decoration:none}main{background-color:#f0f6f6;box-shadow:rgba(0,0,0,.4) 0 0 0 2px,rgba(0,0,0,.65) 0 4px 6px -1px,rgba(0,0,0,.08) 0 1px 0 inset;padding:2rem}p{font-size:1.1rem;font-weight:normal;line-height:1.6;margin-bottom:3rem}.color{border:1px solid #000;color:#000;display:none;margin:2rem;padding-block-end:2rem;width:max(25%,15rem)}.color-swatch{height:10rem;margin-block-end:1rem;width:100%}.color p{font-family:sans-serif;font-size:1.1rem;margin:0;padding-inline:2rem;text-align:center}.color p:first-of-type{padding-top:.5rem}.color-name,.color-hex,.color-rgb,.color-cmyk{line-height:2}.color-name{font-size:1.4rem;font-weight:bold;padding-top:1rem}