body{font-family:Arial,Helvetica,sans-serif;background-color:#1f2937;touch-action:pan-x pan-y}h5{margin:0;font-size:12px}.swatch-array-page{display:flex;flex-direction:column;margin-bottom:40px}.csi-header{position:fixed;width:100%;background-color:rgba(31,41,55,.9);justify-content:space-between;left:0;padding:0 20px;top:0;z-index:1;box-sizing:border-box}.app-title,.csi-header{height:50px;display:flex;align-items:center}.app-title{padding-left:20px;-webkit-filter:drop-shadow(-3px -1px 3px #000);filter:drop-shadow(-3px -1px 3px black);width:25%}.utility-logo{-webkit-filter:grayscale(.5) hue-rotate(155deg) saturate(.5);filter:grayscale(.5) hue-rotate(155deg) saturate(.5);width:100px}.app-title #csi_logo_top,.utility-logo #csi-logo-asiatan,.utility-logo #csi-logo-bottom,.utility-logo #csi_logo_top{fill:#fefefe}.app-title #csi-logo-bottom{fill:#fefefe;-webkit-filter:drop-shadow(-3px -1px 3px #000);filter:drop-shadow(-3px -1px 3px black)}.app-title #csi-logo-asiatan{fill:rgba(250,251,0,.5647058823529412)}.search-box{border-radius:6px;position:relative;border:thin solid #fefefe;box-shadow:inset 0 0 2px #fefefe}.input-box{position:relative;padding:5px 20px;text-transform:uppercase;font-size:16px;font-weight:100;letter-spacing:1px;border:none;border-radius:5px;outline:none;height:30px;background:none;width:280px;color:#fefefe;text-align:center}.input-box::-webkit-input-placeholder{font-weight:100;font-size:12px}.input-box:-ms-input-placeholder{font-weight:100;font-size:12px}.input-box::placeholder{font-weight:100;font-size:12px}.search-icon{position:absolute;top:9px;right:8px;color:hsla(0,0%,99.6%,.4392156862745098);z-index:1;cursor:pointer}.nav-menu-button{color:#fff;width:25%;display:flex;justify-content:flex-end;height:50px;align-items:center}.nav-menu-button-icon{cursor:pointer}.nav-menu{position:fixed;z-index:1;top:50px;right:20px;overflow:hidden;border-bottom-left-radius:12px;border-bottom-right-radius:12px;-webkit-filter:drop-shadow(0 1px 2px #4e4e4e);filter:drop-shadow(0 1px 2px rgb(78,78,78))}.nav-menu-icon{margin-right:5px}.nav-menu-body{width:200px;display:flex;flex-direction:column;background:rgba(31,41,55,.8)}.nav-menu-item{height:40px;display:flex;justify-content:flex-start;align-items:center;color:#fefefe;padding-left:20px;font-size:12px;text-transform:uppercase;border:thin solid hsla(0,0%,100%,.3);margin:5px;border-radius:5px;cursor:pointer;font-weight:100;background-color:transparent;transition:background-color .2s}.nav-menu-item:hover{background-color:hsla(0,0%,100%,.2);transition:background-color .2s}.csi-count{width:25%;text-align:right;color:#fff}.csi-count h5{color:hsla(0,0%,99.6%,.5019607843137255);margin:0}.csi-array{display:flex;flex-wrap:wrap;margin-top:50px;margin-left:0;justify-content:center}.csi-swatch{width:300px;height:60px;display:flex;border:thin solid grey;border-radius:12px;overflow:hidden;margin:2px;align-items:center;position:relative;cursor:pointer;box-sizing:content-box;text-transform:uppercase}.csi-thumbnail{width:25%;height:60px;border:thin solid rgba(82,82,82,.3137254901960784)}.csi-text-background{width:70%;height:100%;padding:10px;display:flex;align-items:center;box-sizing:border-box}.csi-thumbnail-right{width:20px;height:70px;border:thin solid rgba(82,82,82,.3137254901960784);position:absolute;right:0;justify-content:center;align-items:center}.csi-thumbnail-right,.csi-thumbnail-right span{display:flex;flex-direction:column;grid-gap:10px;gap:10px}.csi-thumbnail-right span{padding-left:2px}.csi-thumbnail-right svg{-webkit-filter:drop-shadow(0 0 1px #000);filter:drop-shadow(0 0 1px black);width:15px;height:15px}.csi-count-mobile{display:none}.stored-csi-message{display:flex;width:100%;height:60vh;padding:20px;text-align:center;color:#fff;flex-direction:column;text-transform:uppercase;justify-content:center;align-items:center}.store-button{position:absolute;top:10px;left:10px;cursor:pointer}.store-button svg{width:22px;height:22px}.close-modal-icon{position:absolute;top:10px;right:10px;cursor:pointer}.common-crust{position:absolute;right:70px;width:300px;height:200px;border-radius:6px;overflow:hidden;-webkit-filter:drop-shadow(0 0 2px #000);filter:drop-shadow(0 0 2px black);transition:top .2s ease-in-out}.common-crust-title{display:flex;justify-content:flex-end;align-items:flex-end;color:#fefefe;padding:8px 10px;width:100%;height:100%;box-sizing:border-box;position:absolute;top:0;left:0;text-transform:uppercase}#overlay{-webkit-filter:drop-shadow(0 0 1px #000);filter:drop-shadow(0 0 1px black)}#cutout{mix-blend-mode:multiply;-webkit-filter:opacity(.8);filter:opacity(.8)}.similar-color-tray{display:flex;width:100%;height:100%;flex-direction:column;justify-content:flex-end}.similar-tray-message-box{position:absolute;z-index:2;width:100%;display:flex;justify-content:center;height:100px;align-items:center}.similar-tray-message{width:80%;height:50%;background:hsla(0,0%,100%,.6);border-radius:12px;justify-content:center;align-items:center;flex-direction:column;display:flex}.similar-tray-message button{margin:3px}.similar-color-toggle{display:flex;width:100%;justify-content:flex-start;cursor:pointer}.similar-color-toggle h6{margin:3px;text-transform:uppercase;font-size:9px;padding-left:6px}.similar-colors{display:flex;flex-wrap:wrap-reverse;justify-content:flex-start}.similar-color-thumb{width:20px;height:20px;position:relative;overflow:hidden}.similar-thumb-triangle{position:absolute;width:25px;height:10px;content:"";top:-1px;right:-11px;transform:rotate(60deg)}.close-modal-icon svg{width:22px;height:22px}.modal-middle-bar{text-align:center}.download-button{border:thin solid #000;border-radius:3px;font-size:8px;transition:border .3s;cursor:pointer}.download-button:hover{border:thin solid grey;transition:border .3s}.settings-modal-view{width:310px;height:370px;display:flex;flex-direction:column;align-items:center;color:#fefefe;background:rgb(25 32 41/50%)}.settings-modal-view-close{position:absolute;top:10px;right:10px;cursor:pointer}.setting-modal-section{width:100%;min-height:4em;box-sizing:border-box;border-top:thin solid rgba(0,0,0,.2);margin-bottom:2px;border-bottom:thin solid hsla(0,0%,100%,.1);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:13px 0}.setting-model-section:last-child{border-bottom:thin solid #ff0}.MuiSlider-markLabelActive{color:hsla(0,0%,99.6%,.5647058823529412)!important;text-transform:uppercase;font-size:8px!important}.MuiSlider-marked{margin-bottom:5px!important}.MuiSlider-markLabel{top:26px;color:hsla(0,0%,99.6%,.5647058823529412)!important;position:absolute;font-size:8px!important;transform:translateX(-70%)!important;font-family:"Roboto","Helvetica","Arial",sans-serif;font-weight:400;line-height:1.43;white-space:nowrap;letter-spacing:.01071em}.radio-button-group{display:flex}.radio-button-container{display:flex;flex-direction:column;margin:0 10px}.radio-button-container h6{font-size:8px;font-weight:100;margin:0;text-align:center}.mobile-menu{width:40px;height:40px;border-radius:22px}.mobile-menu,.mobile-menu.active{position:fixed;z-index:2;bottom:10px;left:20px;color:#000;overflow:hidden;background-color:rgba(31,41,55,.7);transition:width .5s,height .5s}.mobile-menu.active{width:100%;height:100px;border-radius:0;transform:translate(-20px,10px);border-top:thin solid hsla(0,0%,99.6%,.18823529411764706)}.menu-items.active{opacity:1;transform:translateY(0) scale(1);transition:opacity 0ms,transform .3s cubic-bezier(.175,.885,.32,1.275);transition-delay:.6s,.7s}.menu-items,.menu-items.active{position:absolute;left:0;bottom:0;width:100vw;height:100px;display:flex;justify-content:center;align-items:center}.menu-items{flex-direction:column;opacity:0;transform:translateY(60px) scale(1.1);transition:opacity 0ms,transform 0ms cubic-bezier(.175,.885,.32,1.275)}.menu-items button{border:thick solid #fefefe;background:none;height:60px;margin:3px;border-radius:30px;width:60px;text-transform:uppercase;color:#fefefe;display:flex;justify-content:center;align-items:center;transition:transform .3s;cursor:pointer}.menu-items button:hover{transform:scale(1.1);transition:transform .5s}.menu-items button svg{width:30px;height:30px}.menu-items p{margin:0;color:#fff;text-transform:uppercase;font-size:10px}.settings-button{left:20px;top:20px}.mobile-menu .mobile-menu-button,.settings-button{width:40px;height:40px;color:#fafb00;position:absolute}.mobile-menu .mobile-menu-button{display:flex;justify-content:center;align-items:center;top:0;right:0;z-index:3;cursor:pointer}.mobile-menu .mobile-menu-button svg{width:30px;height:30px;-webkit-filter:drop-shadow(0 0 2px #000);filter:drop-shadow(0 0 2px black);transform:rotate(45deg);transition:transform .8s ease-out}.mobile-menu .mobile-menu-button.active svg{transform:rotate(0deg);transition:transform .8s ease-out}.download-icon{margin-top:0}.image-dialog{width:600px;background:#1f2937;color:#fff}.drop-container,.image-dialog{height:450px;display:flex;flex-direction:column}.drop-container{padding:20px;text-align:center}.drop-zone{max-height:200px}.drop-zone-small{position:absolute;top:10px;right:10px;width:100px;padding:10px!important;margin:0!important;text-align:center}.drop-text{margin-bottom:30px;padding:0 40px}.image-container{width:600px;height:300px;overflow:hidden;background-size:cover;background-position:50%;border-bottom-right-radius:12px;border-bottom-left-radius:12px;-webkit-filter:drop-shadow(2px 0 3px #000);filter:drop-shadow(2px 0 3px black);position:relative;min-height:200px}.clear-image{border:thin solid #fafb00;color:#fafb00;background:rgb(86 84 84/30%);border-radius:3px;position:absolute;bottom:10px;right:10px;padding:3px 10px;text-transform:uppercase;cursor:pointer;width:100px;text-align:center}.image-results-tray,.image-results-tray-header{display:flex;flex-direction:column}.image-results-tray-header{height:50px;justify-content:center;align-items:center;text-transform:uppercase}.image-results-tray-header h3,.image-results-tray-header h6{margin:0}.image-filtered-swatch{width:150px;height:50px;display:flex;justify-content:center;align-items:center;font-size:10px;position:relative;overflow:hidden;cursor:default;box-sizing:border-box}.image-filtered-results{display:flex;flex-wrap:wrap;width:100%}.image-container #i{visibility:hidden}.store-button.image-filtered{position:absolute;top:5px;left:5px}.store-button.image-filtered svg{width:12px;height:12px}@media only screen and (max-width:600px){.csi-header{position:fixed;width:100%;background-color:rgba(31,41,55,.9);justify-content:space-between;left:0;padding:0;top:0;z-index:1;box-sizing:border-box}.app-title,.csi-header{height:50px;display:flex;align-items:center}.app-title{padding-left:5px;width:30%;padding-top:3px}.search-box{border:thin solid #fefefe;border-radius:3px;position:relative;width:60%;margin-right:25px;height:28px;display:flex;align-items:center;justify-content:center;box-sizing:border-box}.input-box{width:100%;font-size:16px;font-weight:600;padding:0 10px;border:none;height:23px}.search-icon{position:absolute;top:6px;right:4px;color:hsla(0,0%,99.6%,.5647058823529412);z-index:1;cursor:pointer}.search-icon svg{width:15px;height:15px}.csi-count{display:none}.csi-count-mobile{text-align:right;width:20%;display:flex;max-width:70px;min-width:70px;padding-right:10px;justify-content:flex-end}.csi-count-mobile h5{color:hsla(0,0%,99.6%,.5019607843137255);margin:0;font-size:10px}.csi-swatch{width:100%;height:70px;border:thin solid grey;border-radius:4px;margin:2px;text-transform:uppercase}.csi-thumbnail{width:25%;height:100%;border:thin solid rgba(82,82,82,.3137254901960784)}.csi-text-background{width:70%;height:100%;padding:10px;display:flex;align-items:center;box-sizing:border-box}.csi-thumbnail-right{display:flex;width:20px;height:70px;position:absolute;right:0}.csi-thumbnail-right svg{position:absolute;bottom:30px;color:#fff;-webkit-filter:drop-shadow(0 0 1px #000);filter:drop-shadow(0 0 1px black);width:13px;height:13px;right:4px}.store-button{position:absolute;top:10px;left:10px;cursor:pointer}.store-button svg{width:20px;height:20px}.stored-csi-message{display:flex;width:100%;height:60vh;padding:20px;text-align:center;color:#fff;text-transform:uppercase;align-items:center;justify-content:center}.download-button{border:thin solid #000;border-radius:3px;font-size:8px}.mobile-menu{position:fixed;z-index:2;width:40px;height:40px;border-radius:22px;bottom:10px;left:20px;color:#000;overflow:hidden;background-color:rgba(31,41,55,.7);transition:width .5s,height .5s}.menu-items.active{opacity:1;transform:translateY(0) scale(1);transition:opacity 0ms,transform .3s cubic-bezier(.175,.885,.32,1.275);transition-delay:.6s,.7s}.menu-items,.menu-items.active{position:absolute;left:0;bottom:0;width:100vw;height:100px;display:flex;justify-content:center;align-items:center}.menu-items{flex-direction:column;opacity:0;transform:translateY(60px) scale(1.1);transition:opacity 0ms,transform 0ms cubic-bezier(.175,.885,.32,1.275)}.menu-items p{margin:0;color:#fff;text-transform:uppercase;font-size:10px}.mobile-menu .mobile-menu-button{width:40px;height:40px;color:#fafb00;display:flex;justify-content:center;align-items:center;position:absolute;top:0;right:0;z-index:3}.mobile-menu .mobile-menu-button svg{width:30px;height:30px;-webkit-filter:drop-shadow(0 0 2px #000);filter:drop-shadow(0 0 2px black);transform:rotate(45deg);transition:transform .8s ease-out}.mobile-menu .mobile-menu-button.active svg{transform:rotate(0deg);transition:transform .8s ease-out}}@media only screen and (max-device-width:600px) and (orientation:landscape){.MuiDialog-container{height:80%;outline:0}.modal-swatch-color{height:200px!important}}@media only screen and (max-device-width:600px) and (orientation:landscape){.MuiDialog-container{height:300px!important;outline:0;overflow:hidden}.modal-swatch-color{height:155px!important}.modal-middle-bar{font-size:14px!important;height:40px!important}.MuiDialog-paperScrollPaper{display:flex;margin-top:0;height:320px;flex-direction:column}}:root{--main-bg-color:#1f2937;--main-highlight-color:#fafb00;--secondary-highlight-color:#fefefe}.menu-container{position:fixed;left:40px;bottom:100px}.menu-body{width:60px;height:60px;display:flex;flex-direction:column;justify-content:center;align-items:center;border-radius:35px;background:#1f2937;background:var(--main-bg-color);position:relative;overflow:hidden;-webkit-filter:drop-shadow(0 0 4px rgba(0,0,0,.8));filter:drop-shadow(0 0 4px rgba(0,0,0,.8))}.menu-structure{height:300px;position:absolute;bottom:0;width:60px}.menu-item{color:#fefefe;color:var(--secondary-highlight-color);min-height:60px;width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer}.menu-item svg{height:60px;width:26px}.menu-item h5{text-align:center;font-size:8px;font-weight:100;margin-top:-10px;margin-bottom:10px}.menu-handle{width:100%;height:40px;color:grey;cursor:-webkit-grab;cursor:grab}.menu-handle,.menu-toggle{display:flex;justify-content:center;align-items:center}.menu-toggle{color:#fafb00;color:var(--main-highlight-color);height:60px;width:60px;cursor:pointer;position:absolute;bottom:0}.noselect{-webkit-touch-callout:none;-webkit-user-select:none;-ms-user-select:none;user-select:none}
/*# sourceMappingURL=main.bd081f65.chunk.css.map */