.before-after-effects{margin:2rem 0}.before-after-effects__item{margin-bottom:2rem}.before-after-effects__item:last-child{margin-bottom:0}.before-after-effect{background:#fff;border-radius:8px;overflow:hidden}.before-after-effect__wrapper{background:#fdf9f8}.before-after-effect__container{max-width:1100px;padding:1rem}.before-after-effect__images{background:#f0f0f0;cursor:ew-resize;display:grid;grid-template-columns:1fr;grid-template-rows:1fr}.before-after-effect__image-wrapper{grid-column:1;grid-row:1}.before-after-effect__image-wrapper--before{z-index:1}.before-after-effect__image-wrapper--after{clip-path:inset(0 50% 0 0);will-change:clip-path;z-index:2}.before-after-effect__image{display:block;-o-object-fit:cover;object-fit:cover;pointer-events:none}.before-after-effect__divider{grid-column:1;grid-row:1;height:100%;left:50%;position:absolute;top:0;transform:translateX(-50%);width:6px;will-change:left;z-index:10}.before-after-effect__divider-line{background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.1)}.before-after-effect__handle{background:#fff;border-radius:50%;cursor:ew-resize;gap:8px;height:50px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:50px}@media only screen and (min-width:992px){.before-after-effect__handle{height:116px;width:116px}}.before-after-effect__arrow{font-size:12px;font-weight:700}@media only screen and (min-width:992px){.before-after-effect__arrow{font-size:24px}}.before-after-effect--dragging{-webkit-user-select:none;-moz-user-select:none;user-select:none}.before-after-effect--dragging .before-after-effect__images{cursor:ew-resize}.before-after-effect--dragging .before-after-effect__handle{transform:translate(-50%,-50%) scale(1.05)}.before-after-effect__slider{background:#ddd;border-radius:3px;cursor:pointer;height:6px;opacity:.7;outline:none;transition:opacity .2s;width:100%}.before-after-effect__slider:hover{opacity:1}.before-after-effect__slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;border-radius:50%;cursor:pointer;height:20px;-webkit-transition:all .2s ease;transition:all .2s ease;width:20px}.before-after-effect__slider::-webkit-slider-thumb:hover{transform:scale(1.1)}.before-after-effect__slider::-moz-range-thumb{border:none;border-radius:50%;cursor:pointer;height:20px;-moz-transition:all .2s ease;transition:all .2s ease;width:20px}.before-after-effect__slider::-moz-range-thumb:hover{transform:scale(1.1)}.before-after-effect__slider:focus{outline:none}