*{box-sizing:border-box}.img-comp-container{height:300px;overflow:hidden;position:relative;width:500px}.img-comp-img{height:auto;overflow:hidden;position:absolute;width:auto}.img-comp-img img{display:block;vertical-align:middle}.img-comp-slider{background-color:transparent;border:3px solid #fff;border-radius:50%;box-shadow:0 0 12px rgba(51,51,51,.5);color:#fff;cursor:ew-resize;font-size:20px;height:40px;padding-top:1px;position:absolute;text-align:center;width:40px;z-index:9}.img-comp-slider:after,.img-comp-slider:before{background:#fff;content:" ";display:block;position:absolute;z-index:30}.img-comp-slider:before{bottom:50%;-webkit-box-shadow:0 3px 0 #fff,0 0 12px rgba(51,51,51,.5);box-shadow:0 3px 0 #fff,0 0 12px rgba(51,51,51,.5);margin-bottom:22px}.img-comp-slider:after,.img-comp-slider:before{height:9999px;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);width:3px}.img-comp-slider:after{-webkit-box-shadow:0 -3px 0 #fff,0 0 12px rgba(51,51,51,.5);box-shadow:0 -3px 0 #fff,0 0 12px rgba(51,51,51,.5);margin-top:22px;top:50%}.img-slider-overlay{background:transparent;height:100%;position:absolute;top:0;-webkit-transition-duration:.5s;-o-transition-duration:.5s;transition-duration:.5s;width:100%}.img-slider-overlay:hover{background:rgba(0,0,0,.5)}.img-slider-overlay .left-label,.img-slider-overlay .right-label{background:hsla(0,0%,100%,.2);border-radius:2px;color:#fff;font-size:13px;letter-spacing:.1em;line-height:38px;margin-top:-19px;opacity:0;padding:0 20px;position:absolute;top:50%}.img-slider-overlay .left-label{left:10px}.img-slider-overlay .right-label{right:10px}.img-slider-overlay:hover .left-label,.img-slider-overlay:hover .right-label{opacity:1}