.before-after{position:relative;display:block;width:100%;padding:0;margin:0;box-sizing:border-box}.before-after .photo img{display:block;max-width:100%;height:auto;width:100%}.before-after .photo.before{position:absolute;left:0;top:0;width:100%;height:100%;overflow:hidden;transform:translate(-50%) skew(-15deg)}.before-after .photo.before .layer,.before-after .photo.before img{transform:translate(50%) skew(15deg)}.before-after .drag-handler{width:5px;background-color:#000;margin:0 0 0 -4px;position:absolute;left:50%;top:0;height:100%;opacity:1;transform:skew(-15deg)}.before-after .drag-handler .drag-element{position:absolute;left:-22px;top:50%;width:48px;height:48px;margin:-16px 0 0;cursor:pointer;transform:rotate(0);background:url(../img/case-study/kems/slider-arrow.svg);background-repeat:no-repeat;transform:skew(15deg)}.before-after:hover .drag-handler{opacity:1}@media screen and (max-width:768px){.before-after .drag-handler .drag-element{left:-16px;width:36px;height:36px;background-size:100%}}