.before-after--wrapper{position:relative;overflow:hidden;-webkit-user-select:none;user-select:none}.js .before-after--wrapper{--percent: 10%}html.no-js .before-after--wrapper{--percent: 50%}.before-after--overlay{position:absolute;inset-block-start:0;inset-inline-start:0;z-index:1;clip-path:inset(0px 0px 0px var(--percent))}.before-after--wrapper.animating .before-after--overlay{transition:clip-path .7s cubic-bezier(.7,0,.3,1)}.image-effect-blur .media{filter:blur(var(--filter_amount))}.image-effect-brightness .media{filter:brightness(var(--filter_amount))}.image-effect-contrast .media{filter:contrast(var(--filter_amount))}.image-effect-grayscale .media{filter:grayscale(var(--filter_amount))}.image-effect-invert .media{filter:invert(var(--filter_amount))}.image-effect-saturate .media{filter:saturate(var(--filter_amount))}.image-effect-sepia .media{filter:sepia(var(--filter_amount))}.before-after--content{position:absolute;z-index:1;width:100%;height:100%;padding:30px;display:flex;flex-wrap:wrap;flex-direction:column;justify-content:flex-start;max-width:50%}.before-after--content.position-center{justify-content:center}.before-after--content.position-end{justify-content:flex-end}.before-after--overlay .before-after--content{text-align:right;right:0}.before-after--heading,.before-after--subheading{color:var(--image_overlay_heading)}.before-after--subheading+.before-after--heading{padding-top:10px}.before-after--drag{position:absolute;z-index:1;display:block;inset-block-start:0;inset-inline-start:var(--percent);height:100%;width:44px;margin-inline-start:-22px;cursor:col-resize}.before-after--wrapper.animating .before-after--drag{transition:.7s cubic-bezier(.7,0,.3,1);transition-property:inset-block-start,inset-inline-start}.before-after--drag:before,.before-after--drag:after{content:"";z-index:-1;position:absolute;background-color:var(--image_overlay_heading);width:2px;height:50%;inset-inline-start:50%;margin-inline-start:-2px}.before-after--drag:after{inset-block-end:0}.before-after--drag:before{inset-block-start:0}.before-after--drag-cursor{inset-block-start:50%;inset-inline-start:50%;width:48px;height:48px;margin-inline-start:-24px;margin-block-start:-24px;border-radius:50px;background-color:var(--image_overlay_heading);position:absolute;display:flex;align-items:center;justify-content:center}.before-after--drag-cursor:after{content:"";background:var(--image_overlay_heading);position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;border-radius:100%;transform:scale(1.7);opacity:.25}.before-after--drag-cursor svg{width:10px;height:auto}@media (max-width:991px){.before-after--drag-cursor{width:32px;height:32px;margin-inline-start:-16px;margin-block-start:-16px}.before-after--drag-cursor:after{transform:scale(1.5)}}@media (max-width:767px){.before-after--content{padding:15px}}
/*# sourceMappingURL=/cdn/shop/t/5/assets/before-after.css.map */