:root{--range-height: 2px;--range-thumb-width: 30px;--range-thumb-height: 30px;--range-thumb-radius: 30px;--range-thumb-border-size: 2px;--range-thumb-bg: #1d1d1d;--range-track-bg: #1d1d1d;--range-track-progress-bg: linear-gradient(to right, #fff, #fff) 0 / var(--sx) 100% no-repeat, #000000;--range-track-progress-bg-ms: #fff;--mobile-device-settings-font-size: .8em}body.interactive-colors,body.interactive-colors section,body.interactive-colors .section,body.interactive-colors .section .image-with-text__content{background-color:var(--iro-color-bg-value)!important}slite-interactive-colors{display:block;font-family:Helvetica Neue,Arial,Helvetica,sans-serif;-webkit-text-size-adjust:none;position:relative;display:flex;min-height:150vh;align-items:center;justify-content:space-between}slite-interactive-colors div:empty{display:block}.slic__container{display:flex;width:100%}.slic__media{position:relative}.slite-back__picker .IroSliderGradient{border-radius:0!important}.slite-phone-colorpicker .IroWheelHue,.slite-phone-colorpicker .IroWheelSaturation,.slite-phone-colorpicker .IroWheelBorder{box-shadow:0 0 .7em .5em #1d1d1d;border:1px solid #1d1d1d}.slite-phone-colorpicker .IroWheelHue{filter:blur(3px)}.slite-phone-colorpicker .IroWheelSaturation:before{content:"";background:radial-gradient(circle closest-side,#fff 0% 21%,#fffefe00 79%)!important;display:block;width:100%;height:100%;filter:blur(.2em)}.slite-phone-colorpicker .IroWheelSaturation{background:none!important}.slite-phone-colorpicker .IroWheelBorder{border:1px solid #1d1d1d!important}.slite-phone-colorpicker .IroHandle{cursor:pointer;opacity:0}.slite-phone-colorpicker-handle{position:absolute;top:0;left:0;background-color:var(--iro-color-value);width:30px;height:30px;border-radius:50%;border:2px solid white;pointer-events:none;will-change:transform}.mobile-device-app{position:absolute;width:240px;color:#fff;bottom:10%;left:90%;line-height:1;aspect-ratio:var(--mobile-device-app-aspect-ratio)}.mobile-device-app img{width:100%;height:100%;opacity:0}.ready .mobile-device-app img{opacity:1}.mobile-device-app__tools{position:absolute;top:11.9%;left:12.8%;width:74.7%;height:74.4%}.mobile-device-app__power{width:12.4%;height:6.203%;position:absolute;top:7.2%;left:7.1%;border-radius:50%;display:flex;background-color:var(--iro-color-value);align-items:center;justify-content:center}.mobile-device-app__power svg{width:42%;height:40%}.mobile-device-app__brightness{position:absolute;top:20.8%;width:100%;height:14%}.mobile-device-app__brightness-text{font-size:var(--mobile-device-settings-font-size);font-weight:700;position:absolute;left:12.2%}.mobile-device-app__brightness-range{position:absolute;top:69.4%;left:0;width:100%;font-size:var(--mobile-device-settings-font-size);--range-height: .12em;--range-thumb-width: 1.75em;--range-thumb-height: 1.75em;--range-thumb-radius: 1.75em;--range-thumb-border-size: 2px;--range-track-progress-bg: linear-gradient(to right, #fff, #fff) 0 / var(--sx) 100% no-repeat, #000000;--range-track-progress-bg-ms: #fff;cursor:pointer}.mobile-device-app__saturation{position:absolute;top:37.1%;width:100%;height:14%;z-index:1}.mobile-device-app__saturation-text{font-size:var(--mobile-device-settings-font-size);font-weight:700;position:absolute;left:12.2%}.mobile-device-app__saturation-range{position:absolute;top:69.4%;left:0;width:100%;font-size:var(--mobile-device-settings-font-size);--range-height: .12em;--range-thumb-width: 1.75em;--range-thumb-height: 1.75em;--range-thumb-radius: 1.75em;--range-thumb-border-size: 2px;--range-track-progress-bg: linear-gradient(to right, #ffffff, var(--iro-color-value)) 0 / var(--sx) 100% no-repeat, #000000;--range-track-progress-bg-ms: linear-gradient(to right, #ffffff, var(--iro-color-value))}.mobile-device-app__color-picker{position:absolute;width:90%;top:51.9%;left:5%;font-size:100%}.mobile-device-app__interact{position:absolute;width:27rem;left:calc(100% + 1rem);top:60%;display:flex;align-items:center;white-space:nowrap;line-height:1.5;text-align:center;color:#fff;transition:color .3s ease-out}.black .mobile-device-app__interact{color:#000}.mobile-device-app__interact .line{width:60%;height:2px;background-color:#fff;margin-right:1.6rem;transition:background-color .3s ease-out}.black .mobile-device-app__interact .line{background-color:#000}.slite-back{width:600px;position:relative;line-height:1;aspect-ratio:var(--slite-back-aspect-ratio)}.slite-back__screen{max-width:220px;position:absolute;color:#fff;bottom:5.26%;left:22.9167%;width:13.6%;height:8.3%;border-radius:10%;padding:.7em .667em .2em}.slite-back__brightness{font-size:1.1em;line-height:1em;text-align:right;letter-spacing:-.1em;margin-right:.21em;margin-bottom:.34em}.slite-back__screen .slite-back__picker{position:relative;margin-bottom:.496em}.slite-back__hue{width:100%;height:.64em;background:linear-gradient(to right,red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.slite-back__screen-bottom{display:flex;align-items:flex-start;justify-content:space-between}.slite-back__color{font-size:.48em;letter-spacing:-.065em;text-transform:uppercase;display:flex;flex-direction:column}.slite-back__color div{font-size:1.46em;margin-top:.02em;margin-right:.4em;text-align:right}.slite-back__spot-color,.slite-back__spot-color:empty{width:1.07em;height:1.07em;margin-left:.48em;border-radius:50%;background-color:var(--iro-color-value);display:block}.slite-back img{width:100%;height:100%}.slic__container{position:relative}.slic{display:flex;position:relative;flex-direction:column}.slic__content{padding:0;display:flex;position:relative;width:100%;align-items:center;justify-content:center;z-index:2;pointer-events:none}.slic__box{background:none;padding:4rem 3.5rem;position:relative;height:fit-content;align-items:center;text-align:center;width:100%;word-wrap:break-word;z-index:1;color:#000}.slic__heading{margin-bottom:0;color:#000}.white .slic__box,.white .slic__heading{color:#fff}.slic__box .slic__heading+*{margin-top:1rem}.slic__buttons{display:inline-flex;flex-wrap:wrap;gap:1rem;max-width:45rem;word-break:break-word;pointer-events:all}@media only screen and (max-width: 1200px){.slic__container{flex-wrap:wrap}}@media only screen and (max-width: 1150px){.slic__media{margin:0 auto;width:calc((130vw - 3rem)/2);max-width:600px;transform:translate(calc(-10vw + 1.5rem))}.slic__content.slic__content--top-right{justify-content:flex-start}.mobile-device-app__interact{position:absolute;top:auto;left:0;width:100%}.mobile-device-app__interact .line{width:1px;height:25px;position:absolute;right:50%;top:13px;margin:0}.mobile-device-app__interact .pulse{display:block;position:absolute;top:0;right:50%;z-index:1;transform:translate(50%)}.mobile-device-app__interact span{position:absolute;right:50%;top:41px;transform:translate(50%)}.slic--content-align-mobile-right .slic__box{text-align:right}.slic--content-align-mobile-left .slic__box{text-align:left}}@media (max-width: 840px){.slite-back{width:100%}.mobile-device-app{width:40%;--mobile-device-settings-font-size: .45em}.mobile-device-app__color-picker{top:50%;left:0;width:100%}.slite-phone-colorpicker .IroWheelHue,.slite-phone-colorpicker .IroWheelSaturation,.slite-phone-colorpicker .IroWheelBorder{box-shadow:inset 0 0 0 .4em #1d1d1d,0 0 .02em #1d1d1d;border:1px solid #1d1d1d!important}.slite-phone-colorpicker .IroWheelHue{filter:blur(3px)}.slite-phone-colorpicker .IroWheelSaturation:before{content:"";background:radial-gradient(circle closest-side,#fff 0% 21%,#fffefe00 79%)!important;display:block;width:100%;height:100%;filter:blur(.2em)}.slite-phone-colorpicker .IroWheelSaturation{background:none}.slite-phone-colorpicker-handle{width:12px;height:12px;border:1px solid white}.slite-back__screen{font-size:.7rem}}@media only screen and (min-width: 750px){.slic--content-align-right .slic__box{text-align:right}.slic--content-align-left .slic__box{text-align:left}.slic--content-align-left.slic--desktop-transparent .slic__box,.slic--content-align-right.slic--desktop-transparent .slic__box,.slic--medium.slic--desktop-transparent .slic__box{max-width:68rem}.slic{flex-direction:row}.slic--small:not(.slic--adapt){min-height:42rem}.slic--medium:not(.slic--adapt){min-height:56rem}.slic--large:not(.slic--adapt){min-height:72rem}.slic__content.slic__content--top-left{align-items:flex-start;justify-content:flex-start}.slic__content.slic__content--top-center{align-items:flex-start;justify-content:center}.slic__content.slic__content--top-right{align-items:flex-start;justify-content:flex-end}.slic__content.slic__content--middle-left{align-items:center;justify-content:flex-start}.slic__content.slic__content--middle-center{align-items:center;justify-content:center}.slic__content.slic__content--middle-right{align-items:center;justify-content:flex-end}.slic__content.slic__content--bottom-left{align-items:flex-end;justify-content:flex-start}.slic__content.slic__content--bottom-center{align-items:flex-end;justify-content:center}.slic__content.slic__content--bottom-right{align-items:flex-end;justify-content:flex-end}}@media screen and (max-width: 749px){.slic--small:not(.slic--mobile-bottom):not(.slic--adapt) .slic__content{min-height:28rem}.slic--medium:not(.slic--mobile-bottom):not(.slic--adapt) .slic__content{min-height:34rem}.slic--large:not(.slic--mobile-bottom):not(.slic--adapt) .slic__content{min-height:39rem}.slic:not(.slic--stacked){flex-direction:row;flex-wrap:wrap}.slic--stacked,.slic--stacked.slic--adapt .slic__content{height:auto}.slic:not(.slic--mobile-bottom):not(.email-signup-slic) .slic__box{background:transparent;--color-foreground: 255, 255, 255;--color-button: 255, 255, 255;--color-button-text: 0, 0, 0}.slic:not(.slic--mobile-bottom) .slic__box{border:none;border-radius:0;box-shadow:none}.slic:not(.slic--mobile-bottom) .button--secondary{--color-button: 255, 255, 255;--color-button-text: 255, 255, 255;--alpha-button-background: 0}.slic--stacked:not(.slic--mobile-bottom):not(.slic--adapt) .slic__content{position:absolute;height:auto}.slic--stacked.slic--adapt:not(.slic--mobile-bottom) .slic__content{max-height:100%;overflow:hidden;position:absolute}.slic:before{display:none!important}}@media screen and (min-width: 750px){.slic__content{padding:5rem}.slic__content--top-left{align-items:flex-start;justify-content:flex-start}.slic__content--top-center{align-items:flex-start;justify-content:center}.slic__content--top-right{align-items:flex-start;justify-content:flex-end}.slic__content--middle-left{align-items:center;justify-content:flex-start}.slic__content--middle-center{align-items:center;justify-content:center}.slic__content--middle-right{align-items:center;justify-content:flex-end}.slic__content--bottom-left{align-items:flex-end;justify-content:flex-start}.slic__content--bottom-center{align-items:flex-end;justify-content:center}.slic__content--bottom-right{align-items:flex-end;justify-content:flex-end}.slic--mobile-bottom:not(.slic--stacked) .slic__content{order:2}.slic:not(.slic--mobile-bottom) .field__input{background-color:transparent}}@media screen and (min-width: 750px){.slic--desktop-transparent .slic__box{background:transparent;max-width:89rem;border:none;border-radius:0;box-shadow:none}.slic--desktop-transparent .button--secondary{--alpha-button-background: 0}.slic--desktop-transparent .content-container:after{display:none}}.slic__box>*+.slic__text{margin-top:1.5rem}@media screen and (min-width: 750px){.slic__box>*+.slic__text{margin-top:2rem}}.slic__box>*+*{margin-top:1rem}.slic__box>*:first-child{margin-top:0}@media screen and (max-width: 749px){.slic--stacked .slic__box{width:100%}}@media screen and (min-width: 750px){.slic__box{width:auto;max-width:71rem;min-width:45rem}}@media screen and (min-width: 1400px){.slic__box{max-width:90rem}}@media screen and (max-width: 749px){slite-interactive-colors{min-height:0;padding:6rem 0}.slic--content-align-mobile-right .slic__buttons--multiple{justify-content:flex-end}.slic--content-align-mobile-center .slic__buttons--multiple>*{flex-grow:1;min-width:22rem}}@media screen and (min-width: 750px){.slic--content-align-center .slic__buttons--multiple>*{flex-grow:1;min-width:22rem}.slic--content-align-right .slic__buttons--multiple{justify-content:flex-end}}.slic__box>*+.slic__buttons{margin-top:2rem}
/*# sourceMappingURL=/cdn/shop/t/13/assets/slite-interactive-colors.css.map?v=37029986675344913881693300834 */