body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,"Courier New",monospace}body,html{margin:0;padding:0;font-family:"Raleway",sans-serif;font-size:14px;color:#444;display:-webkit-flex;display:flex;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;align-items:center;width:100%;height:100%;position:fixed;top:0;left:0;overflow:hidden}*{touch-action:manipulation}*,:after,:before{box-sizing:border-box}.frame{top:0;position:absolute;left:0;padding:1rem}.frame__title{font-size:1.4rem;font-weight:700;display:inline-block}.frame__links{display:inline-block;margin:0 2rem;text-transform:lowercase}.frame__links a{display:inline-block;margin:0 .25rem;text-decoration:none;color:red}.frame__links a:focus,.frame__links a:hover{text-decoration:underline}#c{width:100%;height:100%;display:block;top:0;left:0}.controls{position:absolute;bottom:0;width:100%}.options{position:absolute;left:0;top:20%}.option{background-size:cover;background-position:50%;background-color:#fff;margin-bottom:3px;padding:10px;height:55px;width:75px;display:-webkit-flex;display:flex;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;align-items:center;cursor:pointer}.option:hover{border-left:5px solid #fff;width:78px}.option.--is-active{border-right:3px solid red;width:78px;cursor:default}.option.--is-active:hover{border-left:none}.option img{height:100%;width:auto;pointer-events:none}.info{padding:0 1em;display:-webkit-flex;display:flex;-webkit-justify-content:flex-end;justify-content:flex-end}.info p{margin-top:0}.tray{width:100%;height:50px;position:relative;overflow-x:hidden}.tray__slide{position:absolute;display:-webkit-flex;display:flex;left:0}.tray__swatch{transition:.1s ease-in;height:50px;min-width:50px;-webkit-flex:1 1;flex:1 1;box-shadow:0 4px 10px rgba(0,0,0,.3);background-size:cover;background-position:50%}.tray__swatch:nth-child(5n+5){margin-right:20px}.drag-notice{display:-webkit-flex;display:flex;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;align-items:center;padding:2em;width:10em;height:10em;box-sizing:border-box;font-size:.9em;font-weight:800;text-transform:uppercase;text-align:center;border-radius:5em;background:#fff;position:absolute;left:50%}.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{display:-webkit-flex;display:flex;-webkit-align-items:flex-end;align-items:flex-end}.info__message p{margin:0;font-size:.7em}.frame{left:auto;right:0;padding-left:6rem}.frame__links{display:block;margin:0;text-align:right}}@media (max-width:720px){.info{-webkit-flex-direction:column;flex-direction:column;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;align-items: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}.option{margin-bottom:1px;padding:5px;height:45px;width:45px;display:-webkit-flex;display:flex}.option.--is-active{border-right:2px solid red;width:47px}.option img{height:100%;width:auto;pointer-events:none}}.loading{position:fixed;z-index:50;width:100%;height:100%;top:0;left:0;background:#f1f1f1;display:-webkit-flex;display:flex;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;align-items:center}.loader{-webkit-perspective:120px;-ms-perspective:120px;perspective:120px;width:100px;height:100px}.loader:before{content:"";position:absolute;left:25px;top:25px;width:50px;height:50px;background-color:red;-webkit-animation:flip 1s infinite;animation:flip 1s infinite}@-webkit-keyframes flip{0%{-webkit-transform:rotate(0);transform:rotate(0)}50%{-webkit-transform:rotateY(180deg);transform:rotateY(180deg)}to{-webkit-transform:rotateY(180deg) rotateX(180deg);transform:rotateY(180deg) rotateX(180deg)}}@keyframes flip{0%{-webkit-transform:rotate(0);transform:rotate(0)}50%{-webkit-transform:rotateY(180deg);transform:rotateY(180deg)}to{-webkit-transform:rotateY(180deg) rotateX(180deg);transform:rotateY(180deg) rotateX(180deg)}}.uploadImageBlock{display:block}.uploadedImageBlock,.uploadImage{display:none}#clear,.uploadTitle{font-weight:700}#clear{color:red;text-decoration:underline;margin-top:10px;cursor:pointer}
/*# sourceMappingURL=main.397f12ee.chunk.css.map */