/**
 * Author: Alexander Leutsky
 * Base styles
 */


.scrollar, .scrollar-contentwrap, .scrollar-content {
    position: relative;
}

.scrollar-viewport, .scrollar-systemscrolls {
    bottom: 0px;
    height: auto;
    left: 0px;
    position: absolute;
    right: 0px;
    top: 0px;
    width: auto;
}

.scrollar-viewport {
    /*clip: rect(0, auto, auto, 0);*/
    /*clip: rect(0 100% 100% 0);*/
    /*overflow: hidden;*/
}

.scrollar-systemscrolls {
    /*
    margin: 0px -22px -22px 0px;
    padding: 0px 22px 22px 0px;
    */
    bottom: -22px;
    overflow-x: scroll;
    overflow-y: scroll;
    right: -22px;
}

.scrollar-contentwrap {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    min-width: 100%;
    padding: 0px 22px 22px 0px;
    /*position: absolute;*/
}

.scrollar-content { }

.scrollar-scroll,
.scrollar-track,
.scrollar-btn,
.scrollar-thumb,
.scrollar-corner {
    position: absolute;
}

.scrollar-hscroll {
    bottom: 0px;
    height: 0px;
    left: 0px;
    right: 0px;
}

.scrollar-vscroll {
    bottom: 0px;
    right: 0px;
    top: 0px;
    width: 0px;
}

.scrollar-btnup { left: 0px; top: 0px; }
.scrollar-btndown { bottom: 0px; left: 0px; }
.scrollar-btnleft { left: 0px; top: 0px; }
.scrollar-btnright { right: 0px; top: 0px; }

.scrollar-vthumb { max-height: 100%; height: 30px; left: 0px; right: 0px; }
.scrollar-hthumb { max-width: 100%; width: 30px; bottom: 0px; top: 0px; }

.scrollar-corner {
    bottom: 0px;
    right: 0px;
}

/* No horizontal scroll */
.scrollar-nohscroll .scrollar-viewport {
    bottom: 0px;
}
.scrollar-nohscroll .scrollar-contentwrap {
    padding-bottom: 0px;
}
.scrollar-nohscroll .scrollar-content { right: 0px; }
.scrollar-nohscroll .scrollar-systemscrolls {
    bottom: 0px;
    overflow-x: hidden;
}
.scrollar-nohscroll .scrollar-hscroll { display: none; }
.scrollar-nohscroll .scrollar-vscroll { bottom: 0px; }
.scrollar-nohscroll .scrollar-corner { display: none; }

/* No vertical scroll */
.scrollar-novscroll .scrollar-viewport {
    right: 0px;
}
.scrollar-novscroll .scrollar-contentwrap {
    padding-right: 0px;
}
.scrollar-novscroll .scrollar-content { bottom: 0px; }
.scrollar-novscroll .scrollar-systemscrolls {
    overflow-y: hidden;
    right: 0px;
}
.scrollar-novscroll .scrollar-vscroll { display: none; }
.scrollar-novscroll .scrollar-hscroll { right: 0px; }
.scrollar-novscroll .scrollar-corner { display: none; }


.default .scrollar-viewport {
    bottom: 2px;
    right: 2px;
}

.default .scrollar-scroll {
    z-index: 0;
}

.default .scrollar-scroll:hover, .default .scrollar-active-scroll {
    z-index: 1;
}

.default .scrollar-scroll:hover, .default .scrollar-active-scroll, .scrollar-track {
    background-color: #eee;
}

.default .scrollar-hscroll {
    bottom: 0px;
    height: 10px;
    left: 0px;
    right: 0px;
}

.default .scrollar-hscroll > div {
    height: 2px;
    top: 8px;
}

.default .scrollar-hscroll:hover > div, .default .scrollar-hscroll.scrollar-active-scroll > div {
    height: 10px;
    top: 0px;
}

.default .scrollar-vscroll {
    bottom: 0px;
    right: 0px;
    top: 0px;
    width: 10px;
}

.default .scrollar-vscroll > div {
    left: 8px;
    width: 2px;
}
 
.default .scrollar-vscroll:hover > div, .default .scrollar-vscroll.scrollar-active-scroll > div {
    left: 0px;
    width: 10px;
}

.typology .scrollar-vscroll {
	bottom: 0px !important;
	right: -4px !important;
	top: 0px !important;
	width: 7px !important;
}
.typology .scrollar-vscroll:hover > div, .typology .scrollar-vscroll.scrollar-active-scroll > div {
    left: 0px !important;
    width: 7px !important;
}

.typology .scrollar-vscroll > div {
left: 0px;
width: 7px;
cursor: pointer;
}

.default .scrollar-htrack {
    bottom: 0px;
    left: 11px;
    right: 11px;
    top: 0px;
}

.default .scrollar-vtrack {
    bottom: 11px;
    left: 0px;
    right: 0px;
    top: 11px;
}

.default .scrollar-btn,
.default .scrollar-thumb,
.default .scrollar-corner {
    background-color: #999;
}

.typology .scrollar-btn, .typology .scrollar-thumb, .typology .scrollar-corner {
	background-color: #717171; 
}
.typology .scrollar-scroll:hover, .typology .scrollar-active-scroll, .typology .scrollar-track {
	background-color: #161616;
}

.default .scrollar-btnup, .default .scrollar-btndown {
    height: 10px;
    left: 0px;
}

.default .scrollar-btnleft, .default .scrollar-btnright {
    top: 0px;
    width: 10px;
}

.default .scrollar-corner {
    display: none;
}