.cocoen {
    box-sizing:border-box;
    cursor:pointer;
    line-height:0;
    margin:0;
    overflow:hidden;
    padding:0;
    position:relative;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none
}
.cocoen *,
.cocoen ::after,
.cocoen ::before {
    box-sizing:inherit
}
.cocoen img,
.cocoen picture>img {
    max-width:none
}
.cocoen>img,
.cocoen>picture>img {
    display:block;
    width:100%
}
.cocoen>div:first-child,
picture .cocoen>div {
    height:100%;
    left:0;
    overflow:hidden;
    position:absolute;
    top:0;
    width:50%
}
.cocoen-drag {
    background:#fff;
    bottom:0;
    cursor:ew-resize;
    left:50%;
    margin-left:-1px;
    position:absolute;
    top:0;
    width:2px
}
.cocoen-drag::before {
    border:2px solid #fff;
    content:'';
    height:50px;
    left:50%;
    margin-left:-25px;
    margin-top:-18px;
    position:absolute;
    top:50%;
    width:50px;
    border-radius:50%;
    background:url(../images/cd-arrows.svg) center no-repeat
}