body{font:1em/160% Inter,sans-serif;background-color:hsl(200,25%,95%);color:hsl(20,5%,25%)}a{color:hsl(230,40%,40%)}a:focus,a:hover,a:active{color:hsl(170,40%,40%)}p:not(:last-child){margin-bottom:1.5em}h1,h2,h3,h4{line-height:120%;margin-top:1.5em;margin-bottom:1.5rem;font-weight:bold;font-family:Nunito,sans-serif;color:hsl(20,5%,20%)}h1{font-size:160%}h2{font-size:140%}h3{font-size:120%}.container{margin-right:auto;margin-left:auto;max-width:600px;padding:2em}.cp-grid{display:grid;grid-template-columns:1fr 3fr;gap:2em}.cp-grid-col-full{grid-column:1/3}.cp-grid-label{font-size:.75em;font-family:Nunito,sans-serif;letter-spacing:1px;text-transform:uppercase;color:hsl(20,5%,30%)}.cp-widget:not(:last-child){padding-bottom:2em;border-bottom:1px solid hsl(200,20%,85%)}.cp-box{padding:1.5em;background-color:hsl(200,20%,85%);border:1px solid hsl(200,20%,75%);border-radius:.25em}.cp-box.cp-box--dark{background-color:hsl(20,5%,30%);color:hsl(20,5%,95%);border:1px solid hsl(20,5%,25%)}.cp-btn{padding:1em 1.5em;display:inline-flex;margin:1em 0;background-color:hsl(230,40%,40%);color:hsl(230,40%,95%);border-radius:.25em;text-decoration:none}.cp-btn:hover,.cp-btn:focus,.cp-btn:active{background-color:hsl(170,40%,40%);color:hsl(170,40%,90%)}#swatches{padding:.25em;border:1px solid hsl(200,20%,85%);border-radius:.25em;display:grid;grid-template-columns:repeat(auto-fit, minmax(30px, 1fr))}#swatches div{height:30px}#swatches div:nth-child(1){background-color:hsl(200,25%,95%)}#swatches div:nth-child(2){background-color:hsl(200,20%,85%)}#swatches div:nth-child(3){background-color:hsl(200,20%,75%)}#swatches div:nth-child(4){background-color:hsl(20,5%,25%)}#swatches div:nth-child(5){background-color:hsl(20,5%,30%)}#swatches div:nth-child(6){background-color:hsl(20,5%,95%)}#swatches div:nth-child(7){background-color:hsl(20,5%,20%)}#swatches div:nth-child(8){background-color:hsl(230,40%,40%)}#swatches div:nth-child(9){background-color:hsl(230,40%,95%)}#swatches div:nth-child(10){background-color:hsl(170,40%,40%)}#swatches div:nth-child(11){background-color:hsl(170,40%,90%)}/*# sourceMappingURL=swatches.css.map */
