.before-after-slider-block{margin:20px 0}.before-after-slider-preview{background:#f9f9f9;border:1px solid #ddd;border-radius:8px;overflow:hidden}.after-image,.before-image{flex:1;overflow:hidden;position:relative}.after-image img,.before-image img{display:block;height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.after-label,.before-label{background:rgba(0,0,0,.7);border-radius:4px;color:#fff;font-size:14px;font-weight:700;padding:8px 16px;position:absolute;top:20px;z-index:2}.before-label{left:20px}.after-label{right:20px}.slider-handle{cursor:ew-resize;width:4px;z-index:3}.slider-handle,.slider-line{background:#fff;height:100%;left:50%;position:absolute;top:0;transform:translateX(-50%)}.slider-line{box-shadow:0 0 10px rgba(0,0,0,.3);width:2px}.slider-button{align-items:center;background:#fff;border:2px solid #007cba;border-radius:50%;box-shadow:0 2px 8px rgba(0,0,0,.2);display:flex;height:40px;justify-content:center;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);transition:all .2s ease;width:40px}.slider-button:hover{background:#007cba;color:#fff;transform:translate(-50%,-50%) scale(1.1)}.slider-arrow-left,.slider-arrow-right{color:#007cba;font-size:16px;font-weight:700;transition:color .2s ease}.slider-button:hover .slider-arrow-left,.slider-button:hover .slider-arrow-right{color:#fff}.before-after-slider-container{border-radius:8px;box-shadow:0 4px 8px rgba(0,0,0,.1);display:flex;height:400px;margin:20px 0;overflow:hidden;position:relative;width:100%}.before-after-slider-container img{display:block;height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.before-after-slider-container[slot=before]{height:100%;left:0;position:absolute;top:0;width:50%;z-index:1}.before-after-slider-container[slot=after]{height:100%;position:absolute;right:0;top:0;width:50%;z-index:1}@media(max-width:768px){.before-after-slider-container{height:300px}.after-label,.before-label{font-size:12px;padding:6px 12px}.slider-button{height:35px;width:35px}.slider-arrow-left,.slider-arrow-right{font-size:14px}}@media(max-width:480px){.before-after-slider-container{height:250px}}