/* FIREFOX BUILDS HIS OWN EMPTY SCROLLBARS FIX R.Carstens */
.firefox .scroll-wrapper > .scroll-content {scrollbar-width: none !important;height: 100% !important;margin-bottom: 0 !important; margin-right: 0 !important;}

/*************** 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-wrapper.scroll--rtl {direction: rtl;}
.scroll-element {box-sizing: content-box;display: none;}
.scroll-element div {box-sizing: content-box;}
.scroll-element .scroll-bar,.scroll-element .scroll-arrow {cursor: default;}
.scroll-element.scroll-x.scroll-scrollx_visible, .scroll-element.scroll-y.scroll-scrolly_visible {display: block;}
.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;}
.scrollable-xs > .scroll-scrolly_visible + .scroll-y {display: none;}


/*************** SCROLLBAR LIGHT ***************/
.scrollbar-light > .scroll-element,
.scrollbar-light > .scroll-element div {border: none; margin: 0;overflow: hidden;padding: 0; position: absolute; z-index: 10;}
.scrollbar-light > .scroll-element div {display: block;height: 100%;left: 0; top: 0; width: 100%;}
.scrollbar-light > .scroll-element .scroll-element_outer {-webkit-border-radius: 5vw;-moz-border-radius: 5vw;-ms-border-radius: 5vw;border-radius: 5vw;}
.scrollbar-light > .scroll-element .scroll-element_size {width: 0.75vw;height: 100%;margin: 0;-webkit-border-radius: 5vw;-moz-border-radius: 5vw;    -ms-border-radius: 5vw;border-radius: 5vw;filter: "alpha(opacity=23)";-ms-filter: "alpha(opacity=23)";background-color: rgba(0,0,0,0.4);box-shadow: inset 0.2vw 0.2vw 0.2vw rgba(0, 0, 0, 0.23);}
.scrollbar-light > .scroll-element.scroll-y {height: calc(100% - 2vw);min-height: calc(100% - 2vw);right: .5vw;top: 1vw;width: .75vw;}
.scrollbar-light.innerscroll > .scroll-element.scroll-y {height: 100%;min-height: 100%;right: 0;top: 0;}
.scrollbar-light > .scroll-element .scroll-bar {-webkit-border-radius: 5vw;-moz-border-radius: 5vw;-ms-border-radius: 5vw;border-radius: 5vw;text-align: center;box-shadow: inset 0 0 0.1vw #000;background-color: rgba(255, 255, 255, 0.5);-webkit-transition: opacity .2s ease-in-out, background-color .2s ease-in-out;-moz-transition: opacity .2s ease-in-out, background-color .2s ease-in-out;-o-transition: opacity .2s ease-in-out, background-color .2s ease-in-out;transition: opacity 0.2s ease-in-out, background-color .2s ease-in-out;}
.scrollbar-light > .scroll-element .scroll-bar:hover, .scrollbar-light > .scroll-element .scroll-bar.active {background: #FFF !important;cursor:pointer}
.scrollbar-light > .scroll-element.scroll-y .scroll-bar { left: 0;  min-height: 5vh;}
.scrollbar-light > .scroll-element.scroll-y .scroll-element_outer {width: .75vw;}

@media only screen and (max-width: 767px) {
/*	.scrollbar-light > .scroll-element.scroll-y {height: calc(100% - 1rem);min-height: calc(100% - 1rem);right: .5rem;top: .5rem;} */
	.scrollbar-light > .scroll-element.scroll-y {height: calc(100% - 1rem);min-height: calc(100% - 1rem);right: .2rem;top: .5rem;width: .75rem;}
	.scrollbar-light > .scroll-element .scroll-element_size, .scrollbar-light > .scroll-element.scroll-y .scroll-element_outer, .scrollbar-light.innerscroll > .scroll-element.scroll-y  {width: .5rem;}
	.scrollable-xs > .scroll-scrolly_visible + .scroll-y {display: block;}
}
/* make scrollable-xs NOT scrollable in higher resolutions */
@media only screen and (min-width: 768px) {	
	.scrollable-xs > .scroll-scrolly_visible {overflow: hidden !important;max-height: inherit !important;}
}