#before-after-slider .slider-container{position:relative;width:100%;max-width:800px;aspect-ratio:16/9;overflow:hidden;user-select:none}#before-after-slider .slider-image{position:absolute;top:0;left:0;width:100%;height:100%}#before-after-slider .slider-image img{width:100%;height:100%;object-fit:cover}#before-after-slider .slider-image:first-child{z-index:2;clip-path:inset(0 50% 0 0)}#before-after-slider .slider-handle{position:absolute;top:0;left:50%;width:40px;height:100%;z-index:3;transform:translate(-50%);cursor:col-resize;display:flex;justify-content:center;align-items:center}#before-after-slider .slider-handle-center{position:relative;width:8px;height:60px;background-color:#000;z-index:4}#before-after-slider .slider-handle:before,#before-after-slider .slider-handle:after{content:"";position:absolute;width:0;height:0;border-style:solid;transition:transform .2s ease}#before-after-slider .slider-handle:before{border-width:10px 12px 10px 0;border-color:rgba(0,0,0,0) #000 rgba(0,0,0,0) rgba(0,0,0,0);right:35px}#before-after-slider .slider-handle:after{border-width:10px 0 10px 12px;border-color:rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0) #000;left:35px}#before-after-slider .slider-handle:hover:before{transform:translate(-5px)}#before-after-slider .slider-handle:hover:after{transform:translate(5px)}#before-after-slider .slider-center-line{position:absolute;top:0;left:50%;width:2px;height:100%;background-color:#000;z-index:2;transform:translate(-50%)}#before-after-slider .slider-label{position:absolute;bottom:0;transform:translateY(-50%);padding:10px 15px;background-color:#0009;color:#fff;font-size:14px;border-radius:4px}#before-after-slider .slider-label.left{left:10px}#before-after-slider .slider-label.right{right:10px}@media(max-width:600px){#before-after-slider .slider-label{font-size:12px;padding:8px 12px}}