/*************** SCROLLBAR BASE CSS ***************/



.scroll-wrapper {

	overflow: hidden !important;

	padding: 0 !important;

	position: relative;

}



.scroll-wrapper > .scroll-content {

	border: none !important;

	box-sizing: content-box !important;

	height: auto;

	left: 0;

	margin: 0;

	max-height: none;

	max-width: none !important;

	overflow: scroll !important;

	padding: 0;

	position: relative !important;

	top: 0;

	width: auto !important;

}



.scroll-wrapper > .scroll-content::-webkit-scrollbar {

	height: 0;

	width: 0;

}



.scroll-element {

	display: none;

}

.scroll-element, .scroll-element div {

	box-sizing: content-box;

}



.scroll-element.scroll-x.scroll-scrollx_visible,

.scroll-element.scroll-y.scroll-scrolly_visible {

	display: block;

}



.scroll-element .scroll-bar,

.scroll-element .scroll-arrow {

	cursor: default;

}



.scroll-textarea {

	border: 1px solid #cccccc;

	border-top-color: #999999;

}

.scroll-textarea > .scroll-content {

	overflow: hidden !important;

}

.scroll-textarea > .scroll-content > textarea {

	border: none !important;

	box-sizing: border-box;

	height: 100% !important;

	margin: 0;

	max-height: none !important;

	max-width: none !important;

	overflow: scroll !important;

	outline: none;

	padding: 2px;

	position: relative !important;

	top: 0;

	width: 100% !important;

}

.scroll-textarea > .scroll-content > textarea::-webkit-scrollbar {

	height: 0;

	width: 0;

}



/*************** SIMPLE INNER SCROLLBAR ***************/



.scrollbar-inner > .scroll-element,

.scrollbar-inner > .scroll-element div

{

	border: none;

	margin: 0;

	padding: 0;

	position: absolute;

	z-index: 10;

}



.scrollbar-inner > .scroll-element div {

	display: block;

	height: 100%;

	left: 0;

	top: 0;

	width: 100%;

}



.scrollbar-inner > .scroll-element.scroll-x {

	bottom: 2px;

	height: 8px;

	left: 0;

	width: 100%;

}



.scrollbar-inner > .scroll-element.scroll-y {

	height: 100%;

	right: 2px;

	top: 0;

	width: 8px;

}



.scrollbar-inner > .scroll-element .scroll-element_outer {

	overflow: hidden;

}



.scrollbar-inner > .scroll-element .scroll-element_outer,

.scrollbar-inner > .scroll-element .scroll-element_track,

.scrollbar-inner > .scroll-element .scroll-bar {

	-webkit-border-radius: 8px;

	-moz-border-radius: 8px;

	border-radius: 8px;

}



.scrollbar-inner > .scroll-element .scroll-element_track,

.scrollbar-inner > .scroll-element .scroll-bar {

	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";

	filter: alpha(opacity=40);

	opacity: 0.4;

}



.scrollbar-inner > .scroll-element .scroll-element_track { background-color: #e0e0e0; }

.scrollbar-inner > .scroll-element .scroll-bar { background-color: #c2c2c2; }

.scrollbar-inner > .scroll-element:hover .scroll-bar { background-color: #919191; }

.scrollbar-inner > .scroll-element.scroll-draggable .scroll-bar { background-color: #919191; }



/*************** SIMPLE OUTER SCROLLBAR ***************/



.scrollbar-outer > .scroll-element,

.scrollbar-outer > .scroll-element div

{

	border: none;

	margin: 0;

	padding: 0;

	position: absolute;

	z-index: 10;

}



.scrollbar-outer > .scroll-element {

	background-color: #ffffff;

}



.scrollbar-outer > .scroll-element div {

	display: block;

	height: 100%;

	left: 0;

	top: 0;

	width: 100%;

}



.scrollbar-outer > .scroll-element.scroll-x {

	bottom: 0;

	height: 12px;

	left: 0;

	width: 100%;

}



.scrollbar-outer > .scroll-element.scroll-y {

	height: 100%;

	right: 0;

	top: 0;

	width: 12px;

}



.scrollbar-outer > .scroll-element.scroll-x .scroll-element_outer { height: 8px; top: 2px; }

.scrollbar-outer > .scroll-element.scroll-y .scroll-element_outer { left: 2px; width: 8px; }



.scrollbar-outer > .scroll-element .scroll-element_outer { overflow: hidden; }

.scrollbar-outer > .scroll-element .scroll-element_track { background-color: #eeeeee; }



.scrollbar-outer > .scroll-element .scroll-element_outer,

.scrollbar-outer > .scroll-element .scroll-element_track,

.scrollbar-outer > .scroll-element .scroll-bar {

	-webkit-border-radius: 8px;

	-moz-border-radius: 8px;

	border-radius: 8px;

}



.scrollbar-outer > .scroll-element .scroll-bar { background-color: #d9d9d9; }

.scrollbar-outer > .scroll-element .scroll-bar:hover { background-color: #c2c2c2; }

.scrollbar-outer > .scroll-element.scroll-draggable .scroll-bar { background-color: #919191; }





/* scrollbar height/width & offset from container borders */



.scrollbar-outer > .scroll-content.scroll-scrolly_visible { left: -12px; margin-left: 12px; }

.scrollbar-outer > .scroll-content.scroll-scrollx_visible { top:  -12px; margin-top:  12px; }



.scrollbar-outer > .scroll-element.scroll-x .scroll-bar { min-width: 10px; }

.scrollbar-outer > .scroll-element.scroll-y .scroll-bar { min-height: 10px; }





/* update scrollbar offset if both scrolls are visible */



.scrollbar-outer > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track { left: -14px; }

.scrollbar-outer > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track { top: -14px; }



.scrollbar-outer > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { left: -14px; }

.scrollbar-outer > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { top: -14px; }



/* update scrollbar offset if both scrolls are visible */



.scrollbar-inner > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track { left: -12px; }

.scrollbar-inner > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track { top: -12px; }





.scrollbar-inner > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { left: -12px; }

.scrollbar-inner > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { top: -12px; }