
/* Our wrapper */
.three-way .wrapper{
    width: 100%;
    height: 100%;
    max-height:100vh;
    position: absolute;
    overflow:hidden;
    border-radius: 16px;
}

/* Our image information */
.three-way .right,
.three-way .middle,
.three-way .top {
    width:100%;
    height:100%;
    background-repeat:no-repeat;
    background-color: white;
    background-size: cover;
    background-position: center;
    position: absolute;
    top:0;
    left:0;
    pointer-events:none;
    overflow: hidden;
    img {
        height:100%;
    }
}

.three-way .top img {
    max-width: 1000px;
    padding-top: 0px;
}

.three-way .right img {
    max-width: 1200px;
    padding-top: 0px;
}

.three-way .middle img {
    max-width: 1200px;
    padding-top: 0px;
}

.three-way .top{
    width:125px;
}

.three-way .scroller{
    width: 50px;
    height:50px;
    position: absolute;
    left:100px;
    top:50%;
    transform:translateY(-50%);
    border-radius:50%;
    background-color: #fff;
    opacity:0.9;
    transition: opacity 0.12s ease-in-out;
    pointer-events:auto;
    cursor: pointer;
}
.three-way .scroller-middle{
    margin-top:25px;
}
.three-way .scroller-top{
    margin-top:-25px;
}

.three-way .scroller:hover{
    opacity:1;
}

.three-way .scrolling{
    pointer-events:none;
    opacity:1;
// z-index: 1;
}

.three-way .scroller__thumb{
    width:100%;
    height:100%;
    border-radius:50%;
    padding: 7px;
}

.three-way .scroller:before,
.three-way .scroller:after{
    content:" ";
    display: block;
    width: 2px;
    height: 9999px;
    position: absolute;
    left: 50%;
    margin-left: -1.5px;
    z-index: 30;
    transition:0.1s;
}
.three-way .scroller:before{
    top:49px;
}
.three-way .scroller:after{
    bottom:49px;
}

/* If you want to cahnge the colors, make sure you change the fill in the svgs to match */
.three-way .scroller-middle>.scroller__thumb{
    border: 2px solid rgba(21, 21, 21, 0.91);
}

.three-way .scroller-middle:before,
.three-way .scroller-middle:after{
    background: rgba(21, 21, 21, 0.91);
}

.three-way .scroller-top>.scroller__thumb{
    border: 2px solid rgba(21, 21, 21, 0.91);
}
.three-way .scroller-top:before,
.three-way .scroller-top:after{
    background: rgba(21, 21, 21, 0.91);
}