.em-before__frame{position:relative;display:block;height:var(--em-compare-height, 610px);overflow:hidden;background:#f7f7ed;isolation:isolate;touch-action:pan-y}emily-before-after.em-before__frame>.em-before__image{position:absolute;top:0;right:0;bottom:0;left:0;display:block;min-width:0;overflow:hidden}.em-before__image--after{z-index:1}.em-before__image--before{z-index:2;clip-path:inset(0 calc(100% - var(--em-compare-position, 50%)) 0 0)}.em-before__frame .em-before__image img{display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:var(--em-image-position-x, 50%) var(--em-image-position-y, 50%)}.em-before__frame>.em-before__label{position:absolute;z-index:4;top:24px;padding:8px 20px;border-radius:999px;background:#151515;color:#fff;font-size:10px;font-weight:750;line-height:1;text-transform:uppercase;pointer-events:none}.em-before__label--before{left:24px}.em-before__label--after{right:24px}.em-before__range{position:absolute;z-index:6;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;-webkit-appearance:none;appearance:none}.em-before__frame>.em-before__divider{position:absolute;z-index:5;left:var(--em-compare-position, 50%);top:0;bottom:0;width:3px;height:auto;padding:0;border-radius:0;transform:translate(-50%);background:#fff;color:#151515;pointer-events:none}.em-before__frame .em-before__handle{position:absolute;left:50%;top:50%;display:flex;align-items:center;justify-content:center;gap:3px;width:38px;height:60px;padding:0;border:1px solid rgba(17,17,17,.16);border-radius:18px;transform:translate(-50%,-50%);background:#fff;box-shadow:0 2px 8px #1111111a}.em-before__handle i{display:block;width:1px;height:17px;background:#777}.em-before__range:focus-visible+.em-before__divider .em-before__handle{outline:3px solid #151515;outline-offset:3px}.em-before__range:active+.em-before__divider .em-before__handle{transform:translate(-50%,-50%) scale(.96)}@media(max-width:749px){.em-before__frame{height:var(--em-compare-height-mobile, 360px)}.em-before__frame>.em-before__label{top:12px;padding:7px 12px;font-size:9px}.em-before__label--before{left:12px}.em-before__label--after{right:12px}.em-before__frame .em-before__handle{width:34px;height:54px}}
/*# sourceMappingURL=/cdn/shop/t/41/assets/clouduvet-before-after.css.map */