:root{
    --scroll-body:var(--dark);
    --scroll-thumb:var(--grey);
}

.scrollWrapper{
    position:fixed;
    right:0;
    top:0;
    width:27px;
    height:100vh !important;
    /*border-left: 1px solid #131313;*/
}

@media(max-width:769px){
.scrollWrapper{display:none;}
}
.scrollWrapper.hider {
    opacity: 0;
}

.scrollWrapper.hider.hover {
    opacity: 1;
}

/*.scrollableArea .scrollPositioner {*/
/*    padding-right: 16px !important;*/
/*}*/

/*.scrollableArea .h600 {*/
/*    height: 600px;*/
/*}*/

/*.scrollableArea .hfull {*/
/*}*/

.scrollDown {
    /*background-color: var(--grey);*/
    bottom: 0;
    cursor: pointer;
    position: absolute;
    right: 0;
    /*display: none;*/
}

.scrollUp {
    /*background-color: #33ccaa;*/
    /*background-color: var(--grey);*/
    cursor: pointer;
    position: absolute;
    right: 0;
    top: 0;
    /*display: none;*/
}

.scrollBody {
    background-color: var(--scroll-body);
    cursor: pointer;
    height: calc(100% - 52px);
    position: absolute;
    width:26px;
   right: 0px;
    top: 26px;
}

.separate .scrollBody {
    right: 0 !important;
}

.scrollBar {
    background-color: var(--scroll-thumb);
    cursor: pointer;
    position: absolute;
    width:26px;
    right: 0px;
}
.scrollBar.grabbed{
    transform: scale(1.2);
}

.separate .scrollBar {
    right: 0 !important;
}