You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

1231 lines
51 KiB

1 year ago
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
  1. /*
  2. == malihu jquery custom scrollbar plugin ==
  3. Plugin URI: http://manos.malihu.gr/jquery-custom-content-scroller
  4. */
  5. /*
  6. CONTENTS:
  7. 1. BASIC STYLE - Plugin's basic/essential CSS properties (normally, should not be edited).
  8. 2. VERTICAL SCROLLBAR - Positioning and dimensions of vertical scrollbar.
  9. 3. HORIZONTAL SCROLLBAR - Positioning and dimensions of horizontal scrollbar.
  10. 4. VERTICAL AND HORIZONTAL SCROLLBARS - Positioning and dimensions of 2-axis scrollbars.
  11. 5. TRANSITIONS - CSS3 transitions for hover events, auto-expanded and auto-hidden scrollbars.
  12. 6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS
  13. 6.1 THEMES - Scrollbar colors, opacity, dimensions, backgrounds etc. via ready-to-use themes.
  14. */
  15. /*
  16. ------------------------------------------------------------------------------------------------------------------------
  17. 1. BASIC STYLE
  18. ------------------------------------------------------------------------------------------------------------------------
  19. */
  20. .mCustomScrollbar{ -ms-touch-action: none; touch-action: none; /* MSPointer events - direct all pointer events to js */ }
  21. .mCustomScrollbar.mCS_no_scrollbar, .mCustomScrollbar.mCS_touch_action{ -ms-touch-action: auto; touch-action: auto; }
  22. .mCustomScrollBox{ /* contains plugin's markup */
  23. position: relative;
  24. overflow: visible;
  25. height: 100%;
  26. max-width: 100%;
  27. outline: none;
  28. direction: ltr;
  29. }
  30. .mCSB_container{ /* contains the original content */
  31. overflow: hidden;
  32. width: auto;
  33. height: auto;
  34. }
  35. /*
  36. ------------------------------------------------------------------------------------------------------------------------
  37. 2. VERTICAL SCROLLBAR
  38. y-axis
  39. ------------------------------------------------------------------------------------------------------------------------
  40. */
  41. .mCSB_inside > .mCSB_container{ /*margin-right: 30px;*/ }
  42. .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden{ margin-right: 0; } /* non-visible scrollbar */
  43. .mCS-dir-rtl > .mCSB_inside > .mCSB_container{ /* RTL direction/left-side scrollbar */
  44. margin-right: 0;
  45. /*margin-left: 30px;*/
  46. }
  47. .mCS-dir-rtl > .mCSB_inside > .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden{ margin-left: 0; } /* RTL direction/left-side scrollbar */
  48. .mCSB_outside + .mCSB_scrollTools{ right: -26px; } /* scrollbar position: outside */
  49. .mCS-dir-rtl > .mCSB_inside > .mCSB_scrollTools,
  50. .mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools{ /* RTL direction/left-side scrollbar */
  51. right: auto;
  52. left: 0;
  53. }
  54. .mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools{ left: -26px; } /* RTL direction/left-side scrollbar (scrollbar position: outside) */
  55. .mCSB_scrollTools .mCSB_draggerContainer{ /* contains the draggable element and dragger rail markup */
  56. position: absolute;
  57. top: 0;
  58. left: 0;
  59. bottom: 0;
  60. right: 0;
  61. height: auto;
  62. }
  63. .mCSB_scrollTools a + .mCSB_draggerContainer{ margin: 20px 0; }
  64. .mCSB_scrollTools .mCSB_dragger{ /* the draggable element */
  65. cursor: pointer;
  66. width: 100%;
  67. height: 30px; /* minimum dragger height */
  68. z-index: 1;
  69. }
  70. .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
  71. .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{ width: 12px; /* auto-expanded scrollbar */ }
  72. .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
  73. .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{ width: 8px; /* auto-expanded scrollbar */ }
  74. .mCSB_scrollTools .mCSB_buttonUp,
  75. .mCSB_scrollTools .mCSB_buttonDown{
  76. display: block;
  77. position: absolute;
  78. height: 20px;
  79. width: 100%;
  80. overflow: hidden;
  81. margin: 0 auto;
  82. cursor: pointer;
  83. }
  84. .mCSB_scrollTools .mCSB_buttonDown{ bottom: 0; }
  85. /*
  86. ------------------------------------------------------------------------------------------------------------------------
  87. 3. HORIZONTAL SCROLLBAR
  88. x-axis
  89. ------------------------------------------------------------------------------------------------------------------------
  90. */
  91. .mCSB_horizontal.mCSB_inside > .mCSB_container{
  92. margin-right: 0;
  93. margin-bottom: 30px;
  94. }
  95. .mCSB_horizontal.mCSB_outside > .mCSB_container{ min-height: 100%; }
  96. .mCSB_horizontal > .mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden{ margin-bottom: 0; } /* non-visible scrollbar */
  97. .mCSB_scrollTools.mCSB_scrollTools_horizontal{
  98. width: auto;
  99. height: 16px;
  100. top: auto;
  101. right: 0;
  102. bottom: 0;
  103. left: 0;
  104. }
  105. .mCustomScrollBox + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
  106. .mCustomScrollBox + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal{ bottom: -26px; } /* scrollbar position: outside */
  107. .mCSB_scrollTools.mCSB_scrollTools_horizontal a + .mCSB_draggerContainer{ margin: 0 20px; }
  108. .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail{
  109. width: 100%;
  110. height: 2px;
  111. margin: 7px 0;
  112. }
  113. .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger{
  114. width: 30px; /* minimum dragger width */
  115. height: 100%;
  116. left: 0;
  117. }
  118. .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
  119. width: 100%;
  120. height: 4px;
  121. margin: 6px auto;
  122. }
  123. .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
  124. .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{
  125. height: 12px; /* auto-expanded scrollbar */
  126. margin: 2px auto;
  127. }
  128. .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
  129. .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{
  130. height: 8px; /* auto-expanded scrollbar */
  131. margin: 4px 0;
  132. }
  133. .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft,
  134. .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight{
  135. display: block;
  136. position: absolute;
  137. width: 20px;
  138. height: 100%;
  139. overflow: hidden;
  140. margin: 0 auto;
  141. cursor: pointer;
  142. }
  143. .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft{ left: 0; }
  144. .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight{ right: 0; }
  145. /*
  146. ------------------------------------------------------------------------------------------------------------------------
  147. 4. VERTICAL AND HORIZONTAL SCROLLBARS
  148. yx-axis
  149. ------------------------------------------------------------------------------------------------------------------------
  150. */
  151. .mCSB_container_wrapper{
  152. position: absolute;
  153. height: auto;
  154. width: auto;
  155. overflow: hidden;
  156. top: 0;
  157. left: 0;
  158. right: 0;
  159. bottom: 0;
  160. margin-right: 30px;
  161. margin-bottom: 30px;
  162. }
  163. .mCSB_container_wrapper > .mCSB_container{
  164. padding-right: 30px;
  165. padding-bottom: 30px;
  166. }
  167. .mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_vertical{ bottom: 20px; }
  168. .mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_horizontal{ right: 20px; }
  169. /* non-visible horizontal scrollbar */
  170. .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden + .mCSB_scrollTools.mCSB_scrollTools_vertical{ bottom: 0; }
  171. /* non-visible vertical scrollbar/RTL direction/left-side scrollbar */
  172. .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal,
  173. .mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal{ right: 0; }
  174. /* RTL direction/left-side scrollbar */
  175. .mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal{ left: 20px; }
  176. /* non-visible scrollbar/RTL direction/left-side scrollbar */
  177. .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; }
  178. .mCS-dir-rtl > .mCSB_inside > .mCSB_container_wrapper{ /* RTL direction/left-side scrollbar */
  179. margin-right: 0;
  180. margin-left: 30px;
  181. }
  182. .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden > .mCSB_container{
  183. padding-right: 0;
  184. -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
  185. }
  186. .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden > .mCSB_container{
  187. padding-bottom: 0;
  188. -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
  189. }
  190. .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden{
  191. margin-right: 0; /* non-visible scrollbar */
  192. margin-left: 0;
  193. }
  194. /* non-visible horizontal scrollbar */
  195. .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden{ margin-bottom: 0; }
  196. /*
  197. ------------------------------------------------------------------------------------------------------------------------
  198. 5. TRANSITIONS
  199. ------------------------------------------------------------------------------------------------------------------------
  200. */
  201. /*.mCSB_scrollTools, */
  202. .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  203. .mCSB_scrollTools .mCSB_buttonUp,
  204. .mCSB_scrollTools .mCSB_buttonDown,
  205. .mCSB_scrollTools .mCSB_buttonLeft,
  206. .mCSB_scrollTools .mCSB_buttonRight{
  207. -webkit-transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
  208. -moz-transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
  209. -o-transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
  210. transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
  211. }
  212. .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar, /* auto-expanded scrollbar */
  213. .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail,
  214. .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar,
  215. .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail{
  216. -webkit-transition: width .2s ease-out .2s, height .2s ease-out .2s,
  217. margin-left .2s ease-out .2s, margin-right .2s ease-out .2s,
  218. margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s,
  219. opacity .2s ease-in-out, background-color .2s ease-in-out;
  220. -moz-transition: width .2s ease-out .2s, height .2s ease-out .2s,
  221. margin-left .2s ease-out .2s, margin-right .2s ease-out .2s,
  222. margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s,
  223. opacity .2s ease-in-out, background-color .2s ease-in-out;
  224. -o-transition: width .2s ease-out .2s, height .2s ease-out .2s,
  225. margin-left .2s ease-out .2s, margin-right .2s ease-out .2s,
  226. margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s,
  227. opacity .2s ease-in-out, background-color .2s ease-in-out;
  228. transition: width .2s ease-out .2s, height .2s ease-out .2s,
  229. margin-left .2s ease-out .2s, margin-right .2s ease-out .2s,
  230. margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s,
  231. opacity .2s ease-in-out, background-color .2s ease-in-out;
  232. }
  233. /*
  234. ------------------------------------------------------------------------------------------------------------------------
  235. 6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS
  236. ------------------------------------------------------------------------------------------------------------------------
  237. */
  238. /*
  239. ----------------------------------------
  240. 6.1 THEMES
  241. ----------------------------------------
  242. */
  243. /* default theme ("light") */
  244. /*.mCSB_scrollTools{ opacity: 0.75; filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; }*/
  245. .mCS-autoHide > .mCustomScrollBox > .mCSB_scrollTools,
  246. .mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools{ opacity: 0; filter: "alpha(opacity=0)"; -ms-filter: "alpha(opacity=0)"; }
  247. /*.mCustomScrollbar > .mCustomScrollBox > .mCSB_scrollTools.mCSB_scrollTools_onDrag,
  248. .mCustomScrollbar > .mCustomScrollBox ~ .mCSB_scrollTools.mCSB_scrollTools_onDrag,
  249. .mCustomScrollBox:hover > .mCSB_scrollTools,
  250. .mCustomScrollBox:hover ~ .mCSB_scrollTools,
  251. .mCS-autoHide:hover > .mCustomScrollBox > .mCSB_scrollTools,
  252. .mCS-autoHide:hover > .mCustomScrollBox ~ .mCSB_scrollTools{ opacity: 1; filter: "alpha(opacity=100)"; -ms-filter: "alpha(opacity=100)"; }*/
  253. .mCSB_scrollTools .mCSB_draggerRail{
  254. background-color: #000; background-color: rgba(0,0,0,0.4);
  255. filter: "alpha(opacity=40)"; -ms-filter: "alpha(opacity=40)";
  256. }
  257. .mCSB_scrollTools .mCSB_buttonUp,
  258. .mCSB_scrollTools .mCSB_buttonDown,
  259. .mCSB_scrollTools .mCSB_buttonLeft,
  260. .mCSB_scrollTools .mCSB_buttonRight{
  261. background-image: url(mCSB_buttons.png); /* css sprites */
  262. background-repeat: no-repeat;
  263. opacity: 0.4; filter: "alpha(opacity=40)"; -ms-filter: "alpha(opacity=40)";
  264. }
  265. .mCSB_scrollTools .mCSB_buttonUp{
  266. background-position: 0 0;
  267. /*
  268. sprites locations
  269. light: 0 0, -16px 0, -32px 0, -48px 0, 0 -72px, -16px -72px, -32px -72px
  270. dark: -80px 0, -96px 0, -112px 0, -128px 0, -80px -72px, -96px -72px, -112px -72px
  271. */
  272. }
  273. .mCSB_scrollTools .mCSB_buttonDown{
  274. background-position: 0 -20px;
  275. /*
  276. sprites locations
  277. light: 0 -20px, -16px -20px, -32px -20px, -48px -20px, 0 -92px, -16px -92px, -32px -92px
  278. dark: -80px -20px, -96px -20px, -112px -20px, -128px -20px, -80px -92px, -96px -92px, -112 -92px
  279. */
  280. }
  281. .mCSB_scrollTools .mCSB_buttonLeft{
  282. background-position: 0 -40px;
  283. /*
  284. sprites locations
  285. light: 0 -40px, -20px -40px, -40px -40px, -60px -40px, 0 -112px, -20px -112px, -40px -112px
  286. dark: -80px -40px, -100px -40px, -120px -40px, -140px -40px, -80px -112px, -100px -112px, -120px -112px
  287. */
  288. }
  289. .mCSB_scrollTools .mCSB_buttonRight{
  290. background-position: 0 -56px;
  291. /*
  292. sprites locations
  293. light: 0 -56px, -20px -56px, -40px -56px, -60px -56px, 0 -128px, -20px -128px, -40px -128px
  294. dark: -80px -56px, -100px -56px, -120px -56px, -140px -56px, -80px -128px, -100px -128px, -120px -128px
  295. */
  296. }
  297. .mCSB_scrollTools .mCSB_buttonUp:hover,
  298. .mCSB_scrollTools .mCSB_buttonDown:hover,
  299. .mCSB_scrollTools .mCSB_buttonLeft:hover,
  300. .mCSB_scrollTools .mCSB_buttonRight:hover{ opacity: 0.75; filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; }
  301. .mCSB_scrollTools .mCSB_buttonUp:active,
  302. .mCSB_scrollTools .mCSB_buttonDown:active,
  303. .mCSB_scrollTools .mCSB_buttonLeft:active,
  304. .mCSB_scrollTools .mCSB_buttonRight:active{ opacity: 0.9; filter: "alpha(opacity=90)"; -ms-filter: "alpha(opacity=90)"; }
  305. /* theme: "dark" */
  306. .mCS-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.15); }
  307. .mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); }
  308. .mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: rgba(0,0,0,0.85); }
  309. .mCS-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
  310. .mCS-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: rgba(0,0,0,0.9); }
  311. .mCS-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -80px 0; }
  312. .mCS-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -80px -20px; }
  313. .mCS-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -80px -40px; }
  314. .mCS-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -80px -56px; }
  315. /* ---------------------------------------- */
  316. /* theme: "light-2", "dark-2" */
  317. .mCS-light-2.mCSB_scrollTools .mCSB_draggerRail,
  318. .mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail{
  319. width: 4px;
  320. background-color: #fff; background-color: rgba(255,255,255,0.1);
  321. -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px;
  322. }
  323. .mCS-light-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  324. .mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
  325. width: 4px;
  326. background-color: #fff; background-color: rgba(255,255,255,0.75);
  327. -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px;
  328. }
  329. .mCS-light-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
  330. .mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
  331. .mCS-light-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
  332. .mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
  333. width: 100%;
  334. height: 4px;
  335. margin: 6px auto;
  336. }
  337. .mCS-light-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.85); }
  338. .mCS-light-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
  339. .mCS-light-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.9); }
  340. .mCS-light-2.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px 0; }
  341. .mCS-light-2.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -20px; }
  342. .mCS-light-2.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -40px; }
  343. .mCS-light-2.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -56px; }
  344. /* theme: "dark-2" */
  345. .mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail{
  346. background-color: #000; background-color: rgba(0,0,0,0.1);
  347. -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px;
  348. }
  349. .mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
  350. background-color: #000; background-color: rgba(0,0,0,0.75);
  351. -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px;
  352. }
  353. .mCS-dark-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); }
  354. .mCS-dark-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
  355. .mCS-dark-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); }
  356. .mCS-dark-2.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px 0; }
  357. .mCS-dark-2.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -20px; }
  358. .mCS-dark-2.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -40px; }
  359. .mCS-dark-2.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -56px; }
  360. /* ---------------------------------------- */
  361. /* theme: "light-thick", "dark-thick" */
  362. .mCS-light-thick.mCSB_scrollTools .mCSB_draggerRail,
  363. .mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail{
  364. width: 4px;
  365. background-color: #fff; background-color: rgba(255,255,255,0.1);
  366. -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
  367. }
  368. .mCS-light-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  369. .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
  370. width: 6px;
  371. background-color: #fff; background-color: rgba(255,255,255,0.75);
  372. -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
  373. }
  374. .mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail,
  375. .mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail{
  376. width: 100%;
  377. height: 4px;
  378. margin: 6px 0;
  379. }
  380. .mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
  381. .mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
  382. width: 100%;
  383. height: 6px;
  384. margin: 5px auto;
  385. }
  386. .mCS-light-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.85); }
  387. .mCS-light-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
  388. .mCS-light-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.9); }
  389. .mCS-light-thick.mCSB_scrollTools .mCSB_buttonUp{ background-position: -16px 0; }
  390. .mCS-light-thick.mCSB_scrollTools .mCSB_buttonDown{ background-position: -16px -20px; }
  391. .mCS-light-thick.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -20px -40px; }
  392. .mCS-light-thick.mCSB_scrollTools .mCSB_buttonRight{ background-position: -20px -56px; }
  393. /* theme: "dark-thick" */
  394. .mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail{
  395. background-color: #000; background-color: rgba(0,0,0,0.1);
  396. -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
  397. }
  398. .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
  399. background-color: #000; background-color: rgba(0,0,0,0.75);
  400. -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
  401. }
  402. .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); }
  403. .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
  404. .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); }
  405. .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonUp{ background-position: -96px 0; }
  406. .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonDown{ background-position: -96px -20px; }
  407. .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -100px -40px; }
  408. .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonRight{ background-position: -100px -56px; }
  409. /* ---------------------------------------- */
  410. /* theme: "light-thin", "dark-thin" */
  411. .mCS-light-thin.mCSB_scrollTools .mCSB_draggerRail{ background-color: #fff; background-color: rgba(255,255,255,0.1); }
  412. .mCS-light-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  413. .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 2px; }
  414. .mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail,
  415. .mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail{ width: 100%; }
  416. .mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
  417. .mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
  418. width: 100%;
  419. height: 2px;
  420. margin: 7px auto;
  421. }
  422. /* theme "dark-thin" */
  423. .mCS-dark-thin.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.15); }
  424. .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); }
  425. .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); }
  426. .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
  427. .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); }
  428. .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonUp{ background-position: -80px 0; }
  429. .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonDown{ background-position: -80px -20px; }
  430. .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -80px -40px; }
  431. .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonRight{ background-position: -80px -56px; }
  432. /* ---------------------------------------- */
  433. /* theme "rounded", "rounded-dark", "rounded-dots", "rounded-dots-dark" */
  434. .mCS-rounded.mCSB_scrollTools .mCSB_draggerRail{ background-color: #fff; background-color: rgba(255,255,255,0.15); }
  435. .mCS-rounded.mCSB_scrollTools .mCSB_dragger,
  436. .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger,
  437. .mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger,
  438. .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger{ height: 14px; }
  439. .mCS-rounded.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  440. .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  441. .mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  442. .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
  443. width: 14px;
  444. margin: 0 1px;
  445. }
  446. .mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger,
  447. .mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger,
  448. .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger,
  449. .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger{ width: 14px; }
  450. .mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
  451. .mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
  452. .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
  453. .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
  454. height: 14px;
  455. margin: 1px 0;
  456. }
  457. .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
  458. .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar,
  459. .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
  460. .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{
  461. width: 16px; /* auto-expanded scrollbar */
  462. height: 16px;
  463. margin: -1px 0;
  464. }
  465. .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
  466. .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
  467. .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
  468. .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{ width: 4px; /* auto-expanded scrollbar */ }
  469. .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
  470. .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar,
  471. .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
  472. .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{
  473. height: 16px; /* auto-expanded scrollbar */
  474. width: 16px;
  475. margin: 0 -1px;
  476. }
  477. .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
  478. .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
  479. .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
  480. .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{
  481. height: 4px; /* auto-expanded scrollbar */
  482. margin: 6px 0;
  483. }
  484. .mCS-rounded.mCSB_scrollTools .mCSB_buttonUp{ background-position: 0 -72px; }
  485. .mCS-rounded.mCSB_scrollTools .mCSB_buttonDown{ background-position: 0 -92px; }
  486. .mCS-rounded.mCSB_scrollTools .mCSB_buttonLeft{ background-position: 0 -112px; }
  487. .mCS-rounded.mCSB_scrollTools .mCSB_buttonRight{ background-position: 0 -128px; }
  488. /* theme "rounded-dark", "rounded-dots-dark" */
  489. .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  490. .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); }
  491. .mCS-rounded-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.15); }
  492. .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
  493. .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); }
  494. .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
  495. .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
  496. .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
  497. .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); }
  498. .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -80px -72px; }
  499. .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -80px -92px; }
  500. .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -80px -112px; }
  501. .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -80px -128px; }
  502. /* theme "rounded-dots", "rounded-dots-dark" */
  503. .mCS-rounded-dots.mCSB_scrollTools_vertical .mCSB_draggerRail,
  504. .mCS-rounded-dots-dark.mCSB_scrollTools_vertical .mCSB_draggerRail{ width: 4px; }
  505. .mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail,
  506. .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail,
  507. .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail,
  508. .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{
  509. background-color: transparent;
  510. background-position: center;
  511. }
  512. .mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail,
  513. .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail{
  514. background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAANElEQVQYV2NkIAAYiVbw//9/Y6DiM1ANJoyMjGdBbLgJQAX/kU0DKgDLkaQAvxW4HEvQFwCRcxIJK1XznAAAAABJRU5ErkJggg==");
  515. background-repeat: repeat-y;
  516. opacity: 0.3;
  517. filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)";
  518. }
  519. .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail,
  520. .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{
  521. height: 4px;
  522. margin: 6px 0;
  523. background-repeat: repeat-x;
  524. }
  525. .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonUp{ background-position: -16px -72px; }
  526. .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonDown{ background-position: -16px -92px; }
  527. .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -20px -112px; }
  528. .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonRight{ background-position: -20px -128px; }
  529. /* theme "rounded-dots-dark" */
  530. .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail{
  531. background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYV2NkIAAYSVFgDFR8BqrBBEifBbGRTfiPZhpYjiQFBK3A6l6CvgAAE9kGCd1mvgEAAAAASUVORK5CYII=");
  532. }
  533. .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -96px -72px; }
  534. .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -96px -92px; }
  535. .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -100px -112px; }
  536. .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -100px -128px; }
  537. /* ---------------------------------------- */
  538. /* theme "3d", "3d-dark", "3d-thick", "3d-thick-dark" */
  539. .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  540. .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  541. .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  542. .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
  543. background-repeat: repeat-y;
  544. background-image: -moz-linear-gradient(left, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0) 100%);
  545. background-image: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0.5)), color-stop(100%,rgba(255,255,255,0)));
  546. background-image: -webkit-linear-gradient(left, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
  547. background-image: -o-linear-gradient(left, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
  548. background-image: -ms-linear-gradient(left, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
  549. background-image: linear-gradient(to right, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
  550. }
  551. .mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
  552. .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
  553. .mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
  554. .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
  555. background-repeat: repeat-x;
  556. background-image: -moz-linear-gradient(top, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0) 100%);
  557. background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.5)), color-stop(100%,rgba(255,255,255,0)));
  558. background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
  559. background-image: -o-linear-gradient(top, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
  560. background-image: -ms-linear-gradient(top, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
  561. background-image: linear-gradient(to bottom, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
  562. }
  563. /* theme "3d", "3d-dark" */
  564. .mCS-3d.mCSB_scrollTools_vertical .mCSB_dragger,
  565. .mCS-3d-dark.mCSB_scrollTools_vertical .mCSB_dragger{ height: 70px; }
  566. .mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger,
  567. .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger{ width: 70px; }
  568. .mCS-3d.mCSB_scrollTools,
  569. .mCS-3d-dark.mCSB_scrollTools{
  570. opacity: 1;
  571. filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)";
  572. }
  573. .mCS-3d.mCSB_scrollTools .mCSB_draggerRail,
  574. .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  575. .mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail,
  576. .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; }
  577. .mCS-3d.mCSB_scrollTools .mCSB_draggerRail,
  578. .mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail{
  579. width: 8px;
  580. background-color: #000; background-color: rgba(0,0,0,0.2);
  581. box-shadow: inset 1px 0 1px rgba(0,0,0,0.5), inset -1px 0 1px rgba(255,255,255,0.2);
  582. }
  583. .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  584. .mCS-3d.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
  585. .mCS-3d.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
  586. .mCS-3d.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
  587. .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  588. .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
  589. .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
  590. .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #555; }
  591. .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  592. .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 8px; }
  593. .mCS-3d.mCSB_scrollTools_horizontal .mCSB_draggerRail,
  594. .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{
  595. width: 100%;
  596. height: 8px;
  597. margin: 4px 0;
  598. box-shadow: inset 0 1px 1px rgba(0,0,0,0.5), inset 0 -1px 1px rgba(255,255,255,0.2);
  599. }
  600. .mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
  601. .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
  602. width: 100%;
  603. height: 8px;
  604. margin: 4px auto;
  605. }
  606. .mCS-3d.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px -72px; }
  607. .mCS-3d.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -92px; }
  608. .mCS-3d.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -112px; }
  609. .mCS-3d.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -128px; }
  610. /* theme "3d-dark" */
  611. .mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail{
  612. background-color: #000; background-color: rgba(0,0,0,0.1);
  613. box-shadow: inset 1px 0 1px rgba(0,0,0,0.1);
  614. }
  615. .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{ box-shadow: inset 0 1px 1px rgba(0,0,0,0.1); }
  616. .mCS-3d-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px -72px; }
  617. .mCS-3d-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -92px; }
  618. .mCS-3d-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -112px; }
  619. .mCS-3d-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -128px; }
  620. /* ---------------------------------------- */
  621. /* theme: "3d-thick", "3d-thick-dark" */
  622. .mCS-3d-thick.mCSB_scrollTools,
  623. .mCS-3d-thick-dark.mCSB_scrollTools{
  624. opacity: 1;
  625. filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)";
  626. }
  627. .mCS-3d-thick.mCSB_scrollTools,
  628. .mCS-3d-thick-dark.mCSB_scrollTools,
  629. .mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer,
  630. .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer{ -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; }
  631. .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  632. .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
  633. .mCSB_inside + .mCS-3d-thick.mCSB_scrollTools_vertical,
  634. .mCSB_inside + .mCS-3d-thick-dark.mCSB_scrollTools_vertical{ right: 1px; }
  635. .mCS-3d-thick.mCSB_scrollTools_vertical,
  636. .mCS-3d-thick-dark.mCSB_scrollTools_vertical{ box-shadow: inset 1px 0 1px rgba(0,0,0,0.1), inset 0 0 14px rgba(0,0,0,0.5); }
  637. .mCS-3d-thick.mCSB_scrollTools_horizontal,
  638. .mCS-3d-thick-dark.mCSB_scrollTools_horizontal{
  639. bottom: 1px;
  640. box-shadow: inset 0 1px 1px rgba(0,0,0,0.1), inset 0 0 14px rgba(0,0,0,0.5);
  641. }
  642. .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  643. .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
  644. box-shadow: inset 1px 0 0 rgba(255,255,255,0.4);
  645. width: 12px;
  646. margin: 2px;
  647. position: absolute;
  648. height: auto;
  649. top: 0;
  650. bottom: 0;
  651. left: 0;
  652. right: 0;
  653. }
  654. .mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
  655. .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ box-shadow: inset 0 1px 0 rgba(255,255,255,0.4); }
  656. .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  657. .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
  658. .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
  659. .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #555; }
  660. .mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
  661. .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
  662. height: 12px;
  663. width: auto;
  664. }
  665. .mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer{
  666. background-color: #000; background-color: rgba(0,0,0,0.05);
  667. box-shadow: inset 1px 1px 16px rgba(0,0,0,0.1);
  668. }
  669. .mCS-3d-thick.mCSB_scrollTools .mCSB_draggerRail{ background-color: transparent; }
  670. .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px -72px; }
  671. .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -92px; }
  672. .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -112px; }
  673. .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -128px; }
  674. /* theme: "3d-thick-dark" */
  675. .mCS-3d-thick-dark.mCSB_scrollTools{ box-shadow: inset 0 0 14px rgba(0,0,0,0.2); }
  676. .mCS-3d-thick-dark.mCSB_scrollTools_horizontal{ box-shadow: inset 0 1px 1px rgba(0,0,0,0.1), inset 0 0 14px rgba(0,0,0,0.2); }
  677. .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ box-shadow: inset 1px 0 0 rgba(255,255,255,0.4), inset -1px 0 0 rgba(0,0,0,0.2); }
  678. .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ box-shadow: inset 0 1px 0 rgba(255,255,255,0.4), inset 0 -1px 0 rgba(0,0,0,0.2); }
  679. .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  680. .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
  681. .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
  682. .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #777; }
  683. .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer{
  684. background-color: #fff; background-color: rgba(0,0,0,0.05);
  685. box-shadow: inset 1px 1px 16px rgba(0,0,0,0.1);
  686. }
  687. .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: transparent; }
  688. .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px -72px; }
  689. .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -92px; }
  690. .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -112px; }
  691. .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -128px; }
  692. /* ---------------------------------------- */
  693. /* theme: "minimal", "minimal-dark" */
  694. .mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical,
  695. .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical{
  696. right: 0;
  697. margin: 12px 0;
  698. }
  699. .mCustomScrollBox.mCS-minimal + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
  700. .mCustomScrollBox.mCS-minimal + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
  701. .mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
  702. .mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal{
  703. bottom: 0;
  704. margin: 0 12px;
  705. }
  706. /* RTL direction/left-side scrollbar */
  707. .mCS-dir-rtl > .mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical,
  708. .mCS-dir-rtl > .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical{
  709. left: 0;
  710. right: auto;
  711. }
  712. .mCS-minimal.mCSB_scrollTools .mCSB_draggerRail,
  713. .mCS-minimal-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: transparent; }
  714. .mCS-minimal.mCSB_scrollTools_vertical .mCSB_dragger,
  715. .mCS-minimal-dark.mCSB_scrollTools_vertical .mCSB_dragger{ height: 50px; }
  716. .mCS-minimal.mCSB_scrollTools_horizontal .mCSB_dragger,
  717. .mCS-minimal-dark.mCSB_scrollTools_horizontal .mCSB_dragger{ width: 50px; }
  718. .mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
  719. background-color: #fff; background-color: rgba(255,255,255,0.2);
  720. filter: "alpha(opacity=20)"; -ms-filter: "alpha(opacity=20)";
  721. }
  722. .mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
  723. .mCS-minimal.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{
  724. background-color: #fff; background-color: rgba(255,255,255,0.5);
  725. filter: "alpha(opacity=50)"; -ms-filter: "alpha(opacity=50)";
  726. }
  727. /* theme: "minimal-dark" */
  728. .mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
  729. background-color: #000; background-color: rgba(0,0,0,0.2);
  730. filter: "alpha(opacity=20)"; -ms-filter: "alpha(opacity=20)";
  731. }
  732. .mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
  733. .mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{
  734. background-color: #000; background-color: rgba(0,0,0,0.5);
  735. filter: "alpha(opacity=50)"; -ms-filter: "alpha(opacity=50)";
  736. }
  737. /* ---------------------------------------- */
  738. /* theme "light-3", "dark-3" */
  739. .mCS-light-3.mCSB_scrollTools .mCSB_draggerRail,
  740. .mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail{
  741. width: 6px;
  742. background-color: #000; background-color: rgba(0,0,0,0.2);
  743. }
  744. .mCS-light-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  745. .mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 6px; }
  746. .mCS-light-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
  747. .mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
  748. .mCS-light-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,
  749. .mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_draggerRail{
  750. width: 100%;
  751. height: 6px;
  752. margin: 5px 0;
  753. }
  754. .mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
  755. .mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
  756. .mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
  757. .mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{
  758. width: 12px;
  759. }
  760. .mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
  761. .mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
  762. .mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
  763. .mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{
  764. height: 12px;
  765. margin: 2px 0;
  766. }
  767. .mCS-light-3.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px -72px; }
  768. .mCS-light-3.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -92px; }
  769. .mCS-light-3.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -112px; }
  770. .mCS-light-3.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -128px; }
  771. /* theme "dark-3" */
  772. .mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); }
  773. .mCS-dark-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); }
  774. .mCS-dark-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
  775. .mCS-dark-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); }
  776. .mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.1); }
  777. .mCS-dark-3.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px -72px; }
  778. .mCS-dark-3.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -92px; }
  779. .mCS-dark-3.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -112px; }
  780. .mCS-dark-3.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -128px; }
  781. /* ---------------------------------------- */
  782. /* theme "inset", "inset-dark", "inset-2", "inset-2-dark", "inset-3", "inset-3-dark" */
  783. .mCS-inset.mCSB_scrollTools .mCSB_draggerRail,
  784. .mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail,
  785. .mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail,
  786. .mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,
  787. .mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail,
  788. .mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail{
  789. width: 12px;
  790. background-color: #000; background-color: rgba(0,0,0,0.2);
  791. }
  792. .mCS-inset.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  793. .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  794. .mCS-inset-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  795. .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  796. .mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  797. .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
  798. width: 6px;
  799. margin: 3px 5px;
  800. position: absolute;
  801. height: auto;
  802. top: 0;
  803. bottom: 0;
  804. left: 0;
  805. right: 0;
  806. }
  807. .mCS-inset.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
  808. .mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
  809. .mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
  810. .mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
  811. .mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
  812. .mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
  813. height: 6px;
  814. margin: 5px 3px;
  815. position: absolute;
  816. width: auto;
  817. top: 0;
  818. bottom: 0;
  819. left: 0;
  820. right: 0;
  821. }
  822. .mCS-inset.mCSB_scrollTools_horizontal .mCSB_draggerRail,
  823. .mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
  824. .mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
  825. .mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
  826. .mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,
  827. .mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{
  828. width: 100%;
  829. height: 12px;
  830. margin: 2px 0;
  831. }
  832. .mCS-inset.mCSB_scrollTools .mCSB_buttonUp,
  833. .mCS-inset-2.mCSB_scrollTools .mCSB_buttonUp,
  834. .mCS-inset-3.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px -72px; }
  835. .mCS-inset.mCSB_scrollTools .mCSB_buttonDown,
  836. .mCS-inset-2.mCSB_scrollTools .mCSB_buttonDown,
  837. .mCS-inset-3.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -92px; }
  838. .mCS-inset.mCSB_scrollTools .mCSB_buttonLeft,
  839. .mCS-inset-2.mCSB_scrollTools .mCSB_buttonLeft,
  840. .mCS-inset-3.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -112px; }
  841. .mCS-inset.mCSB_scrollTools .mCSB_buttonRight,
  842. .mCS-inset-2.mCSB_scrollTools .mCSB_buttonRight,
  843. .mCS-inset-3.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -128px; }
  844. /* theme "inset-dark", "inset-2-dark", "inset-3-dark" */
  845. .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  846. .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
  847. .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); }
  848. .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
  849. .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
  850. .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); }
  851. .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
  852. .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
  853. .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
  854. .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
  855. .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
  856. .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); }
  857. .mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail,
  858. .mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,
  859. .mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.1); }
  860. .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonUp,
  861. .mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonUp,
  862. .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px -72px; }
  863. .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonDown,
  864. .mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonDown,
  865. .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -92px; }
  866. .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonLeft,
  867. .mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonLeft,
  868. .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -112px; }
  869. .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonRight,
  870. .mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonRight,
  871. .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -128px; }
  872. /* theme "inset-2", "inset-2-dark" */
  873. .mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail,
  874. .mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail{
  875. background-color: transparent;
  876. border-width: 1px;
  877. border-style: solid;
  878. border-color: #fff;
  879. border-color: rgba(255,255,255,0.2);
  880. -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
  881. }
  882. .mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail{ border-color: #000; border-color: rgba(0,0,0,0.2); }
  883. /* theme "inset-3", "inset-3-dark" */
  884. .mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail{ background-color: #fff; background-color: rgba(255,255,255,0.6); }
  885. .mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.6); }
  886. .mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); }
  887. .mCS-inset-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); }
  888. .mCS-inset-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
  889. .mCS-inset-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); }
  890. .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.75); }
  891. .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.85); }
  892. .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
  893. .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.9); }
  894. /* ---------------------------------------- */