.before-after-image-wrapper{width:100%;height:100%;position:absolute;left:50%;top:50%;transform:translate3d(-50%,-50%,0);overflow:hidden;box-shadow:0 10px 20px #00000030,0 6px 6px #0000003b}.before,.after{width:100%;height:100%;background-repeat:no-repeat;background-color:#fff;background-size:cover;background-position:center;position:absolute;top:0;left:0;pointer-events:none;overflow:hidden}.content-image{height:100%;width:100%;object-fit:cover;display:flex}.after{width:125px}.scroller{width:50px;height:50px;position:absolute;left:100px;top:50%;transform:translateY(-50%);border-radius:50%;background-color:transparent;opacity:.9;pointer-events:auto;cursor:pointer}.scroller:hover{opacity:1}.scrolling{pointer-events:none;opacity:1;// z-index: 1}.scroller__thumb{width:100%;height:100%;padding:5px}.scroller:before,.scroller:after{content:" ";display:block;width:7px;height:9999px;position:absolute;left:50%;margin-left:-3.5px;z-index:30;transition:.1s}.scroller:before{top:100%}.scroller:after{bottom:100%}.scroller{border:5px solid var(--scroller-color)}.scroller:before,.scroller:after{background:var(--scroller-color)}.scroller__thumb polygon{fill:var(--scroller-color)}.before-after-image-wrapper .after .badge{left:10px}.before-after-image-wrapper .badge{position:absolute;bottom:10px;background:#000000b3;color:#fff;padding:5px 10px;font-size:14px;border-radius:3px;-webkit-user-select:none;user-select:none;pointer-events:none;width:max-content}.before-after-image-wrapper .before .badge{right:10px}@media(max-width:767px){.image-with-text-image .before-after-slider-image,.before-after-image-wrapper .content-image,.image-with-text__media{height:var(--before_after_slider_mobile_height)!important}.image-with-text-wrapper{display:grid}.image-with-text__media-item,.image-with-text__text-item{width:100%}.image-with-text__text-item{padding-left:35px;padding-right:35px;padding-bottom:35px}}@media(min-width:768px){.image-with-text-image .before-after-slider-image,.before-after-image-wrapper .content-image,.image-with-text__media{height:var(--before_after_slider_desktop_height)!important}.image-with-text-wrapper{display:flex;row-gap:var(--grid-desktop-horizontal-spacing);column-gap:0;align-items:center}.image-with-text__media-item{width:40%;align-self:stretch}.image-with-text__text-item{width:60%;height:100%}}
/*# sourceMappingURL=/cdn/shop/t/2/assets/component-before-after-image.css.map */