#root,body,html{align-items:center;color:#444;display:flex;font-family:Raleway,sans-serif;font-size:14px;height:100%;justify-content:center;left:0;margin:0;overflow:hidden;padding:0;position:fixed;top:0;width:100%}*{touch-action:manipulation}*,:after,:before{box-sizing:border-box}.frame{left:0;padding:1rem;position:absolute;top:0}.frame__title{display:inline-block;font-size:1.3rem;font-weight:400}.frame__links{display:inline-block;margin:0 2rem;text-transform:lowercase}.frame__links a{color:red;display:inline-block;margin:0 .25rem;text-decoration:none}.frame__links a:focus,.frame__links a:hover{text-decoration:underline}#c{display:block;height:100%;left:0;top:0;width:100%;z-index:1}.controls{bottom:0;width:100%}.controls,.options{position:absolute;z-index:5}.options{left:0}@media screen and (max-width:680px){.options{left:auto;right:0;top:0}}.option{align-items:center;background-color:#fff;background-position:50%;background-size:cover;cursor:pointer;display:flex;height:55px;justify-content:center;margin-bottom:3px;padding:10px;width:55px}.option:hover{border-left:5px solid #fff;width:58px}.option.--is-active{border-right:3px solid red;cursor:default;width:58px}.option img{height:100%;pointer-events:none;width:auto}.info{display:flex;justify-content:flex-end;padding:0 1em}.info p{margin-top:0}.tray{height:50px;overflow-x:hidden;position:relative;width:100%}.tray__slide{display:flex;left:0;position:absolute}.tray__swatch{background-position:50%;background-size:cover;box-shadow:0 4px 10px rgba(0,0,0,.3);flex:1 1;height:50px;min-width:50px;transition:.1s ease-in}.tray__swatch:nth-child(5n+5){margin-right:20px}.drag-notice{align-items:center;background:#fff;border-radius:5em;box-sizing:border-box;display:flex;font-size:.9em;font-weight:800;height:10em;justify-content:center;padding:2em;position:absolute;text-align:center;text-transform:uppercase;width:10em}.drag-notice.start{-webkit-animation:popout .25s 3s forwards;animation:popout .25s 3s forwards}@-webkit-keyframes popout{to{-webkit-transform:scale(0);transform:scale(0)}}@keyframes popout{to{-webkit-transform:scale(0);transform:scale(0)}}@-webkit-keyframes wheelin{to{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes wheelin{to{-webkit-transform:translateX(0);transform:translateX(0)}}@media (max-width:960px){.options{top:0}.info{padding:0 1em 1em 0}.info__message{align-items:flex-end;display:flex}.info__message p{font-size:.7em;margin:0}.frame{left:auto;padding-left:6rem;right:0}.frame__links{display:block;margin:0;text-align:right}}@media (max-width:720px){.info{align-items:center;flex-direction:column;justify-content:center;padding:0 1em 1em}.info__message{margin-bottom:1em}}@media (max-width:680px){.info{padding:1em 2em}.info__message{display:none}.options{bottom:50px}.frame{padding-left:1rem;padding-right:60px}.option{display:flex;height:60px;margin-bottom:1px;padding:5px;width:60px}.option.--is-active{border-left:2px solid red;border-right:none;width:60px}.option img{height:100%;pointer-events:none;width:auto}}
/*# sourceMappingURL=main.f336c4aa.css.map*/