*,:after,:before{box-sizing:border-box}.fadeIn{animation:fadein .5s;opacity:1}@keyframes fadein{0%{opacity:.5}to{opacity:1}}body{position:relative;margin:0;font-family:Helvetica,sans-serif;background:#fff}main{transition:background 1s ease-in-out}.wrapper{margin:20px auto;max-width:270px}.swatch{box-shadow:0 0 10px 8px rgba(0,0,0,.1)}.color{width:270px;height:240px}.description{background:#fff;padding:15px 10px 35px;position:relative}.loading,.range-slider__value,h1{font-size:21px;color:#000;font-weight:700;text-transform:uppercase;text-align:center;letter-spacing:.1em;margin:40px 0}h1,h2,h3{line-height:1.2em}h1,h2{font-weight:700}h2,h3{margin:0}h2{font-size:38px}h3{font-size:18px;font-weight:400}h3.swatch-hex{text-transform:uppercase}sup.heading-superscript{position:static;font-size:11px}sup.swatch-superscript{font-size:16px;position:absolute;top:7px}label{text-align:center;display:block;text-transform:uppercase;margin:10px 0;letter-spacing:.1em;color:#000}input{width:100%}.range-slider{width:100%;margin:25px 0 0}.range-slider__range{-webkit-appearance:none;width:100%;height:10px;border-radius:5px;background:rgba(0,0,0,.3);padding:0;margin:0}.range-slider__range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:#000;cursor:pointer}.range-slider__value{font-size:21px}.content-loading{background:#9db8d3;animation:hue 10s linear infinite;height:100vh}.loader{position:absolute;text-align:center;width:100%;top:50%}.loader-letter{text-transform:uppercase;color:#fff;font-weight:700;padding:0 .2em;font-size:42px;line-height:1;position:relative;display:inline-block;animation:bounce .5s cubic-bezier(.165,.84,.44,1) infinite alternate}.loader-letter:first-child{animation-delay:0s}.loader-letter:nth-child(2){animation-delay:.05s}.loader-letter:nth-child(3){animation-delay:.1s}.loader-letter:nth-child(4){animation-delay:.15s}.loader-letter:nth-child(5){animation-delay:.2s}.loader-letter:nth-child(6){animation-delay:.25s}.loader-letter:nth-child(7){animation-delay:.3s}@keyframes gradient{0%{background-position:25% 50%}50%{background-position:75% 50%}to{background-position:25% 50%}}@keyframes bounce{0%{transform:translateY(0)}to{transform:translateY(-1em)}}@keyframes hue{0%{-webkit-filter:hue-rotate(0deg);filter:hue-rotate(0deg)}to{-webkit-filter:hue-rotate(1turn);filter:hue-rotate(1turn)}}
/*# sourceMappingURL=main.543886a1.chunk.css.map */