/*
== malihu jquery custom scrollbar plugin ==
plugin uri: http://manos.malihu.gr/jquery-custom-content-scroller
*/



/*
contents: 
	1. basic style - plugin's basic/essential css properties (normally, should not be edited). 
	2. vertical scrollbar - positioning and dimensions of vertical scrollbar. 
	3. horizontal scrollbar - positioning and dimensions of horizontal scrollbar.
	4. vertical and horizontal scrollbars - positioning and dimensions of 2-axis scrollbars. 
	5. transitions - css3 transitions for hover events, auto-expanded and auto-hidden scrollbars. 
	6. scrollbar colors, opacity and backgrounds 
		6.1 themes - scrollbar colors, opacity, dimensions, backgrounds etc. via ready-to-use themes.
*/



/* 
------------------------------------------------------------------------------------------------------------------------
1. basic style  
------------------------------------------------------------------------------------------------------------------------
*/

	.mcustomscrollbar{ -ms-touch-action: none; touch-action: none; /* mspointer events - direct all pointer events to js */ }
	.mcustomscrollbar.mcs_no_scrollbar{ -ms-touch-action: auto; touch-action: auto; }
	
	.mcustomscrollbox{ /* contains plugin's markup */
		position: relative;
		overflow: hidden;
		height: 100%;
		max-width: 100%;
		outline: none;
		direction: ltr;
	}

	.mcsb_container{ /* contains the original content */
		overflow: hidden;
		width: auto;
		height: auto;
	}



/* 
------------------------------------------------------------------------------------------------------------------------
2. vertical scrollbar 
y-axis
------------------------------------------------------------------------------------------------------------------------
*/

	.mcsb_inside > .mcsb_container{ margin-right: 30px; }

	.mcsb_container.mcs_no_scrollbar_y.mcs_y_hidden{ margin-right: 0; } /* non-visible scrollbar */
	
	.mcs-dir-rtl > .mcsb_inside > .mcsb_container{ /* rtl direction/left-side scrollbar */
		margin-right: 0;
		margin-left: 30px;
	}
	
	.mcs-dir-rtl > .mcsb_inside > .mcsb_container.mcs_no_scrollbar_y.mcs_y_hidden{ margin-left: 0; } /* rtl direction/left-side scrollbar */

	.mcsb_scrolltools{ /* contains scrollbar markup (draggable element, dragger rail, buttons etc.) */
		position: absolute;
		width: 16px;
		height: auto;
		left: auto;
		top: 0;
		right: 0;
		bottom: 0;
	}

	.mcsb_outside   .mcsb_scrolltools{ right: -26px; } /* scrollbar position: outside */
	
	.mcs-dir-rtl > .mcsb_inside > .mcsb_scrolltools, 
	.mcs-dir-rtl > .mcsb_outside   .mcsb_scrolltools{ /* rtl direction/left-side scrollbar */
		right: auto;
		left: 0;
	}
	
	.mcs-dir-rtl > .mcsb_outside   .mcsb_scrolltools{ left: -26px; } /* rtl direction/left-side scrollbar (scrollbar position: outside) */

	.mcsb_scrolltools .mcsb_draggercontainer{ /* contains the draggable element and dragger rail markup */
		position: absolute;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0; 
		height: auto;
	}

	.mcsb_scrolltools a   .mcsb_draggercontainer{ margin: 20px 0; }

	.mcsb_scrolltools .mcsb_draggerrail{
		width: 2px;
		height: 100%;
		margin: 0 auto;
		-webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px;
		*display:none
	}

	.mcsb_scrolltools .mcsb_dragger{ /* the draggable element */
		cursor: pointer;
		width: 100%;
		height: 30px; /* minimum dragger height */
		z-index: 1;
		*right:0;
	}

	.mcsb_scrolltools .mcsb_dragger .mcsb_dragger_bar{ /* the dragger element */
		position: relative;
		width: 4px;
		height: 100%;
		margin: 0 auto;
		-webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px;
		text-align: center;
	}
	
	.mcsb_scrolltools_vertical.mcsb_scrolltools_ondrag_expand .mcsb_dragger.mcsb_dragger_ondrag_expanded .mcsb_dragger_bar, 
	.mcsb_scrolltools_vertical.mcsb_scrolltools_ondrag_expand .mcsb_draggercontainer:hover .mcsb_dragger .mcsb_dragger_bar{ width: 12px; /* auto-expanded scrollbar */ }
	
	.mcsb_scrolltools_vertical.mcsb_scrolltools_ondrag_expand .mcsb_dragger.mcsb_dragger_ondrag_expanded   .mcsb_draggerrail, 
	.mcsb_scrolltools_vertical.mcsb_scrolltools_ondrag_expand .mcsb_draggercontainer:hover .mcsb_draggerrail{ width: 8px; /* auto-expanded scrollbar */ }

	.mcsb_scrolltools .mcsb_buttonup,
	.mcsb_scrolltools .mcsb_buttondown{
		display: block;
		position: absolute;
		height: 20px;
		width: 100%;
		overflow: hidden;
		margin: 0 auto;
		cursor: pointer;
	}

	.mcsb_scrolltools .mcsb_buttondown{ bottom: 0; }



/* 
------------------------------------------------------------------------------------------------------------------------
3. horizontal scrollbar 
x-axis
------------------------------------------------------------------------------------------------------------------------
*/

	.mcsb_horizontal.mcsb_inside > .mcsb_container{
		margin-right: 0;
		margin-bottom: 30px;
	}
	
	.mcsb_horizontal.mcsb_outside > .mcsb_container{ min-height: 100%; }

	.mcsb_horizontal > .mcsb_container.mcs_no_scrollbar_x.mcs_x_hidden{ margin-bottom: 0; } /* non-visible scrollbar */

	.mcsb_scrolltools.mcsb_scrolltools_horizontal{
		width: auto;
		height: 16px;
		top: auto;
		right: 0;
		bottom: 0;
		left: 0;
	}

	.mcustomscrollbox   .mcsb_scrolltools.mcsb_scrolltools_horizontal,
	.mcustomscrollbox   .mcsb_scrolltools   .mcsb_scrolltools.mcsb_scrolltools_horizontal{ bottom: -26px; } /* scrollbar position: outside */

	.mcsb_scrolltools.mcsb_scrolltools_horizontal a   .mcsb_draggercontainer{ margin: 0 20px; }

	.mcsb_scrolltools.mcsb_scrolltools_horizontal .mcsb_draggerrail{
		width: 100%;
		height: 2px;
		margin: 7px 0;
	}

	.mcsb_scrolltools.mcsb_scrolltools_horizontal .mcsb_dragger{
		width: 30px; /* minimum dragger width */
		height: 100%;
		left: 0;
	}

	.mcsb_scrolltools.mcsb_scrolltools_horizontal .mcsb_dragger .mcsb_dragger_bar{
		width: 100%;
		height: 4px;
		margin: 6px auto;
	}
	
	.mcsb_scrolltools_horizontal.mcsb_scrolltools_ondrag_expand .mcsb_dragger.mcsb_dragger_ondrag_expanded .mcsb_dragger_bar, 
	.mcsb_scrolltools_horizontal.mcsb_scrolltools_ondrag_expand .mcsb_draggercontainer:hover .mcsb_dragger .mcsb_dragger_bar{
		height: 12px; /* auto-expanded scrollbar */
		margin: 2px auto;
	}
	
	.mcsb_scrolltools_horizontal.mcsb_scrolltools_ondrag_expand .mcsb_dragger.mcsb_dragger_ondrag_expanded   .mcsb_draggerrail, 
	.mcsb_scrolltools_horizontal.mcsb_scrolltools_ondrag_expand .mcsb_draggercontainer:hover .mcsb_draggerrail{
		height: 8px; /* auto-expanded scrollbar */
		margin: 4px 0;
	}

	.mcsb_scrolltools.mcsb_scrolltools_horizontal .mcsb_buttonleft,
	.mcsb_scrolltools.mcsb_scrolltools_horizontal .mcsb_buttonright{
		display: block;
		position: absolute;
		width: 20px;
		height: 100%;
		overflow: hidden;
		margin: 0 auto;
		cursor: pointer;
	}
	
	.mcsb_scrolltools.mcsb_scrolltools_horizontal .mcsb_buttonleft{ left: 0; }

	.mcsb_scrolltools.mcsb_scrolltools_horizontal .mcsb_buttonright{ right: 0; }



/* 
------------------------------------------------------------------------------------------------------------------------
4. vertical and horizontal scrollbars 
yx-axis 
------------------------------------------------------------------------------------------------------------------------
*/

	.mcsb_container_wrapper{
		position: absolute;
		height: auto;
		width: auto;
		overflow: hidden;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		margin-right: 30px;
		margin-bottom: 30px;
	}
	
	.mcsb_container_wrapper > .mcsb_container{
		padding-right: 30px;
		padding-bottom: 30px;
	}
	
	.mcsb_vertical_horizontal > .mcsb_scrolltools.mcsb_scrolltools_vertical{ bottom: 20px; }
	
	.mcsb_vertical_horizontal > .mcsb_scrolltools.mcsb_scrolltools_horizontal{ right: 20px; }
	
	/* non-visible horizontal scrollbar */
	.mcsb_container_wrapper.mcs_no_scrollbar_x.mcs_x_hidden   .mcsb_scrolltools.mcsb_scrolltools_vertical{ bottom: 0; }
	
	/* non-visible vertical scrollbar/rtl direction/left-side scrollbar */
	.mcsb_container_wrapper.mcs_no_scrollbar_y.mcs_y_hidden   .mcsb_scrolltools ~ .mcsb_scrolltools.mcsb_scrolltools_horizontal, 
	.mcs-dir-rtl > .mcustomscrollbox.mcsb_vertical_horizontal.mcsb_inside > .mcsb_scrolltools.mcsb_scrolltools_horizontal{ right: 0; }
	
	/* rtl direction/left-side scrollbar */
	.mcs-dir-rtl > .mcustomscrollbox.mcsb_vertical_horizontal.mcsb_inside > .mcsb_scrolltools.mcsb_scrolltools_horizontal{ left: 20px; }
	
	/* non-visible scrollbar/rtl direction/left-side scrollbar */
	.mcs-dir-rtl > .mcustomscrollbox.mcsb_vertical_horizontal.mcsb_inside > .mcsb_container_wrapper.mcs_no_scrollbar_y.mcs_y_hidden   .mcsb_scrolltools ~ .mcsb_scrolltools.mcsb_scrolltools_horizontal{ left: 0; }
	
	.mcs-dir-rtl > .mcsb_inside > .mcsb_container_wrapper{ /* rtl direction/left-side scrollbar */
		margin-right: 0;
		margin-left: 30px;
	}
	
	.mcsb_container_wrapper.mcs_no_scrollbar_y.mcs_y_hidden > .mcsb_container{ 
		padding-right: 0; 
		-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
	}
	
	.mcsb_container_wrapper.mcs_no_scrollbar_x.mcs_x_hidden > .mcsb_container{ 
		padding-bottom: 0; 
		-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
	}
	
	.mcustomscrollbox.mcsb_vertical_horizontal.mcsb_inside > .mcsb_container_wrapper.mcs_no_scrollbar_y.mcs_y_hidden{
		margin-right: 0; /* non-visible scrollbar */
		margin-left: 0;
	}
	
	/* non-visible horizontal scrollbar */
	.mcustomscrollbox.mcsb_vertical_horizontal.mcsb_inside > .mcsb_container_wrapper.mcs_no_scrollbar_x.mcs_x_hidden{ margin-bottom: 0; }



/* 
------------------------------------------------------------------------------------------------------------------------
5. transitions  
------------------------------------------------------------------------------------------------------------------------
*/

	.mcsb_scrolltools, 
	.mcsb_scrolltools .mcsb_dragger .mcsb_dragger_bar, 
	.mcsb_scrolltools .mcsb_buttonup,
	.mcsb_scrolltools .mcsb_buttondown,
	.mcsb_scrolltools .mcsb_buttonleft,
	.mcsb_scrolltools .mcsb_buttonright{
		-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 .2s ease-in-out, background-color .2s ease-in-out;
	}
	
	.mcsb_scrolltools_vertical.mcsb_scrolltools_ondrag_expand .mcsb_dragger_bar, /* auto-expanded scrollbar */
	.mcsb_scrolltools_vertical.mcsb_scrolltools_ondrag_expand .mcsb_draggerrail, 
	.mcsb_scrolltools_horizontal.mcsb_scrolltools_ondrag_expand .mcsb_dragger_bar, 
	.mcsb_scrolltools_horizontal.mcsb_scrolltools_ondrag_expand .mcsb_draggerrail{
		-webkit-transition: width .2s ease-out .2s, height .2s ease-out .2s, 
					margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, 
					margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s,
					opacity .2s ease-in-out, background-color .2s ease-in-out; 
		-moz-transition: width .2s ease-out .2s, height .2s ease-out .2s, 
					margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, 
					margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s,
					opacity .2s ease-in-out, background-color .2s ease-in-out; 
		-o-transition: width .2s ease-out .2s, height .2s ease-out .2s, 
					margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, 
					margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s,
					opacity .2s ease-in-out, background-color .2s ease-in-out; 
		transition: width .2s ease-out .2s, height .2s ease-out .2s, 
					margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, 
					margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s,
					opacity .2s ease-in-out, background-color .2s ease-in-out; 
	}



/* 
------------------------------------------------------------------------------------------------------------------------
6. scrollbar colors, opacity and backgrounds  
------------------------------------------------------------------------------------------------------------------------
*/

	/* 
	----------------------------------------
	6.1 themes 
	----------------------------------------
	*/
	
	/* default theme ("light") */

	.mcsb_scrolltools{ opacity: 0.75; filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; }
	
	.mcs-autohide > .mcustomscrollbox > .mcsb_scrolltools,
	.mcs-autohide > .mcustomscrollbox ~ .mcsb_scrolltools{ opacity: 0; filter: "alpha(opacity=0)"; -ms-filter: "alpha(opacity=0)"; }
	
	.mcustomscrollbar > .mcustomscrollbox > .mcsb_scrolltools.mcsb_scrolltools_ondrag,
	.mcustomscrollbar > .mcustomscrollbox ~ .mcsb_scrolltools.mcsb_scrolltools_ondrag,
	.mcustomscrollbox:hover > .mcsb_scrolltools,
	.mcustomscrollbox:hover ~ .mcsb_scrolltools,
	.mcs-autohide:hover > .mcustomscrollbox > .mcsb_scrolltools,
	.mcs-autohide:hover > .mcustomscrollbox ~ .mcsb_scrolltools{ opacity: 1; filter: "alpha(opacity=100)"; -ms-filter: "alpha(opacity=100)"; }

	.mcsb_scrolltools .mcsb_draggerrail{
		background-color: #000; background-color: rgba(0,0,0,0.4);
		filter: "alpha(opacity=40)"; -ms-filter: "alpha(opacity=40)"; 
	}

	.mcsb_scrolltools .mcsb_dragger .mcsb_dragger_bar{
		background-color: #fff; background-color: rgba(255,255,255,0.75);
		filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; 
	}

	.mcsb_scrolltools .mcsb_dragger:hover .mcsb_dragger_bar{
		background-color: #fff; background-color: rgba(255,255,255,0.85);
		filter: "alpha(opacity=85)"; -ms-filter: "alpha(opacity=85)"; 
	}
	.mcsb_scrolltools .mcsb_dragger:active .mcsb_dragger_bar,
	.mcsb_scrolltools .mcsb_dragger.mcsb_dragger_ondrag .mcsb_dragger_bar{
		background-color: #fff; background-color: rgba(255,255,255,0.9);
		filter: "alpha(opacity=90)"; -ms-filter: "alpha(opacity=90)"; 
	}

	.mcsb_scrolltools .mcsb_buttonup,
	.mcsb_scrolltools .mcsb_buttondown,
	.mcsb_scrolltools .mcsb_buttonleft,
	.mcsb_scrolltools .mcsb_buttonright{
		background-image: ; /* css sprites */
		background-repeat: no-repeat;
		opacity: 0.4; filter: "alpha(opacity=40)"; -ms-filter: "alpha(opacity=40)"; 
	}

	.mcsb_scrolltools .mcsb_buttonup:hover,
	.mcsb_scrolltools .mcsb_buttondown:hover,
	.mcsb_scrolltools .mcsb_buttonleft:hover,
	.mcsb_scrolltools .mcsb_buttonright:hover{ opacity: 0.75; filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; }

	.mcsb_scrolltools .mcsb_buttonup:active,
	.mcsb_scrolltools .mcsb_buttondown:active,
	.mcsb_scrolltools .mcsb_buttonleft:active,
	.mcsb_scrolltools .mcsb_buttonright:active{ opacity: 0.9; filter: "alpha(opacity=90)"; -ms-filter: "alpha(opacity=90)"; }/* theme: "dark-thick" */
	
	.mcs-dark-thick.mcsb_scrolltools .mcsb_draggerrail{
		background-color: #eee; background-color:#888);
		-webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
	}

	.mcs-dark-thick.mcsb_scrolltools .mcsb_dragger .mcsb_dragger_bar{
		background-color: #888; background-color:#ddd);
		-webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
	}
    
    /* thick */
	.mcs-dark-thick.mcsb_scrolltools .mcsb_dragger:hover .mcsb_dragger_bar{ background-color: #888; background-color:#999 }

	.mcs-dark-thick.mcsb_scrolltools .mcsb_dragger:active .mcsb_dragger_bar,
	.mcs-dark-thick.mcsb_scrolltools .mcsb_dragger.mcsb_dragger_ondrag .mcsb_dragger_bar{ background-color: #888; background-color:#888 }

	.mcs-dark-thick.mcsb_scrolltools .mcsb_buttonup{ background-position: -96px 0; }

	.mcs-dark-thick.mcsb_scrolltools .mcsb_buttondown{ background-position: -96px -20px; }

	.mcs-dark-thick.mcsb_scrolltools .mcsb_buttonleft{ background-position: -100px -40px; }

	.mcs-dark-thick.mcsb_scrolltools .mcsb_buttonright{	background-position: -100px -56px; }
	
	/* ---------------------------------------- */