.compare{--mask-width:50%;position:relative;border-radius:inherit}.compare img{height:100%;max-width:none;border-radius:inherit}.compare__separator{position:absolute;top:0;height:100%;left:var(--mask-width);width:calc(var(--handle-size) / 8);margin-left:-1px;z-index:1;pointer-events:none}.compare__image-one{width:100%;display:block}.compare__mask{position:absolute;top:0;left:0;height:100%;z-index:1;background:#fff;overflow:hidden;width:var(--mask-width);border-top-left-radius:inherit;border-bottom-left-radius:inherit;border-top-right-radius:0;border-bottom-right-radius:0}.compare__image-two{height:100%;width:auto}.compare__input{appearance:none;-webkit-appearance:none;-webkit-tap-highlight-color:#fff0;position:absolute;top:0;left:calc(var(--handle-size) / -2);width:calc(100% + var(--handle-size));height:100%;opacity:0;z-index:2;cursor:col-resize;background-color:#fff0;border-radius:inherit}.compare__input::-moz-range-track{height:100%}.compare__input::-moz-range-thumb{height:100%;border-radius:0;width:var(--handle-size);border:none}.compare__input::-webkit-slider-runnable-track{height:100%}.compare__input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;height:100%;border-radius:0;width:var(--handle-size);border:none}.compare__icon{position:absolute;z-index:2;width:var(--handle-size);height:var(--handle-size);top:50%;left:var(--mask-width);transform:translate(-50%,-50%);padding:4px;border-radius:50%}.compare__icon path{stroke-linecap:round;stroke-linejoin:round;stroke-width:1.25px}