gentelella-rails 0.1.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (129) hide show
  1. checksums.yaml +7 -0
  2. data/MIT-LICENSE +20 -0
  3. data/README.md +107 -0
  4. data/Rakefile +30 -0
  5. data/assets/javascripts/autosize.js +254 -0
  6. data/assets/javascripts/bootstrap-progressbar.js +168 -0
  7. data/assets/javascripts/bootstrap-wysiwyg.js +306 -0
  8. data/assets/javascripts/data_tables.coffee +12 -0
  9. data/assets/javascripts/data_tables/jquery.data_tables.js +15277 -0
  10. data/assets/javascripts/data_tables/net-bs.bootstrap.js +182 -0
  11. data/assets/javascripts/data_tables/net-buttons-bs.buttons.js +68 -0
  12. data/assets/javascripts/data_tables/net-buttons.buttons.flash.js +1325 -0
  13. data/assets/javascripts/data_tables/net-buttons.buttons.html5.js +1322 -0
  14. data/assets/javascripts/data_tables/net-buttons.buttons.js +1634 -0
  15. data/assets/javascripts/data_tables/net-buttons.buttons.print.js +172 -0
  16. data/assets/javascripts/data_tables/net-fixedheader.js +672 -0
  17. data/assets/javascripts/data_tables/net-keytable.js +883 -0
  18. data/assets/javascripts/data_tables/net-responsive-bs.js +81 -0
  19. data/assets/javascripts/data_tables/net-responsive.js +1232 -0
  20. data/assets/javascripts/data_tables/net-scroller.js +1349 -0
  21. data/assets/javascripts/echarts.js +56282 -0
  22. data/assets/javascripts/echarts.map.world.js +27 -0
  23. data/assets/javascripts/fullcalendar.js +14206 -0
  24. data/assets/javascripts/gauge.coffee +524 -0
  25. data/assets/javascripts/gentelella.coffee +50 -0
  26. data/assets/javascripts/jquery.autocomplete.js +979 -0
  27. data/assets/javascripts/jquery.easypiechart.js +360 -0
  28. data/assets/javascripts/jquery.flot.curvedLines.js +483 -0
  29. data/assets/javascripts/jquery.flot.curved_lines.js +483 -0
  30. data/assets/javascripts/jquery.flot.orderBars.js +201 -0
  31. data/assets/javascripts/jquery.flot.order_bars.js +201 -0
  32. data/assets/javascripts/jquery.flot.spline.js +212 -0
  33. data/assets/javascripts/jquery.hotkeys.js +204 -0
  34. data/assets/javascripts/jquery.mCustomScrollbar.concat.min.js +6 -0
  35. data/assets/javascripts/jquery.mCustomScrollbar.js +2425 -0
  36. data/assets/javascripts/jquery.sparkline.js +3063 -0
  37. data/assets/javascripts/jquery.tagsinput.js +390 -0
  38. data/assets/javascripts/jquery.vmap.js +1281 -0
  39. data/assets/javascripts/jqvmap/maps/continents/jquery.vmap.africa.js +2 -0
  40. data/assets/javascripts/jqvmap/maps/continents/jquery.vmap.asia.js +2 -0
  41. data/assets/javascripts/jqvmap/maps/continents/jquery.vmap.australia.js +2 -0
  42. data/assets/javascripts/jqvmap/maps/continents/jquery.vmap.europe.js +2 -0
  43. data/assets/javascripts/jqvmap/maps/continents/jquery.vmap.north-america.js +2 -0
  44. data/assets/javascripts/jqvmap/maps/continents/jquery.vmap.south-america.js +2 -0
  45. data/assets/javascripts/jqvmap/maps/jquery.vmap.algeria.js +2 -0
  46. data/assets/javascripts/jqvmap/maps/jquery.vmap.argentina.js +1 -0
  47. data/assets/javascripts/jqvmap/maps/jquery.vmap.brazil.js +2 -0
  48. data/assets/javascripts/jqvmap/maps/jquery.vmap.canada.js +2 -0
  49. data/assets/javascripts/jqvmap/maps/jquery.vmap.europe.js +2 -0
  50. data/assets/javascripts/jqvmap/maps/jquery.vmap.france.js +1 -0
  51. data/assets/javascripts/jqvmap/maps/jquery.vmap.germany.js +2 -0
  52. data/assets/javascripts/jqvmap/maps/jquery.vmap.greece.js +1 -0
  53. data/assets/javascripts/jqvmap/maps/jquery.vmap.iran.js +6 -0
  54. data/assets/javascripts/jqvmap/maps/jquery.vmap.iraq.js +1 -0
  55. data/assets/javascripts/jqvmap/maps/jquery.vmap.russia.js +2 -0
  56. data/assets/javascripts/jqvmap/maps/jquery.vmap.tunisia.js +2 -0
  57. data/assets/javascripts/jqvmap/maps/jquery.vmap.turkey.js +11 -0
  58. data/assets/javascripts/jqvmap/maps/jquery.vmap.usa.js +2 -0
  59. data/assets/javascripts/jqvmap/maps/jquery.vmap.world.js +2 -0
  60. data/assets/javascripts/jszip.js +9344 -0
  61. data/assets/javascripts/morris.js +1892 -0
  62. data/assets/javascripts/parsley.js.map +1 -0
  63. data/assets/javascripts/pdfmake.js +68149 -0
  64. data/assets/javascripts/pnotify.buttons.js +8 -0
  65. data/assets/javascripts/pnotify.js +31 -0
  66. data/assets/javascripts/pnotify.nonblock.js +6 -0
  67. data/assets/javascripts/prettify.coffee +29 -0
  68. data/assets/javascripts/prettify/lang-apollo.js +51 -0
  69. data/assets/javascripts/prettify/lang-basic.js +32 -0
  70. data/assets/javascripts/prettify/lang-clj.js +64 -0
  71. data/assets/javascripts/prettify/lang-css.js +159 -0
  72. data/assets/javascripts/prettify/lang-dart.js +88 -0
  73. data/assets/javascripts/prettify/lang-erlang.js +92 -0
  74. data/assets/javascripts/prettify/lang-go.js +58 -0
  75. data/assets/javascripts/prettify/lang-hs.js +101 -0
  76. data/assets/javascripts/prettify/lang-lisp.js +94 -0
  77. data/assets/javascripts/prettify/lang-llvm.js +61 -0
  78. data/assets/javascripts/prettify/lang-lua.js +59 -0
  79. data/assets/javascripts/prettify/lang-matlab.js +180 -0
  80. data/assets/javascripts/prettify/lang-ml.js +56 -0
  81. data/assets/javascripts/prettify/lang-mumps.js +139 -0
  82. data/assets/javascripts/prettify/lang-n.js +65 -0
  83. data/assets/javascripts/prettify/lang-pascal.js +32 -0
  84. data/assets/javascripts/prettify/lang-proto.js +35 -0
  85. data/assets/javascripts/prettify/lang-r.js +57 -0
  86. data/assets/javascripts/prettify/lang-rd.js +47 -0
  87. data/assets/javascripts/prettify/lang-scala.js +54 -0
  88. data/assets/javascripts/prettify/lang-sql.js +58 -0
  89. data/assets/javascripts/prettify/lang-tcl.js +62 -0
  90. data/assets/javascripts/prettify/lang-tex.js +46 -0
  91. data/assets/javascripts/prettify/lang-vb.js +66 -0
  92. data/assets/javascripts/prettify/lang-vhdl.js +34 -0
  93. data/assets/javascripts/prettify/lang-wiki.js +53 -0
  94. data/assets/javascripts/prettify/lang-xq.js +67 -0
  95. data/assets/javascripts/prettify/lang-yaml.js +27 -0
  96. data/assets/javascripts/prettify/prettify.js +1655 -0
  97. data/assets/javascripts/prettify/run_prettify.js +1905 -0
  98. data/assets/javascripts/raphael.js +8330 -0
  99. data/assets/javascripts/skycons.js +730 -0
  100. data/assets/javascripts/starrr.js +98 -0
  101. data/assets/javascripts/vfs_fonts.js +1 -0
  102. data/assets/stylesheets/bootstrap-progressbar-3.3.0-3.x.x.scss +74 -0
  103. data/assets/stylesheets/bootstrap-wysiwyg.css +88 -0
  104. data/assets/stylesheets/data_tables/net-bs.bootstrap.css +185 -0
  105. data/assets/stylesheets/data_tables/net-buttons-bs.buttons.css +102 -0
  106. data/assets/stylesheets/data_tables/net-fixedheader-bs.bootstrap.css +20 -0
  107. data/assets/stylesheets/data_tables/net-responsive-bs.bootstrap.css +181 -0
  108. data/assets/stylesheets/data_tables/net-scroller-bs.bootstrap.css +24 -0
  109. data/assets/stylesheets/fullcalendar.css +1406 -0
  110. data/assets/stylesheets/fullcalendar.print.css +208 -0
  111. data/assets/stylesheets/gentelella.scss +39 -0
  112. data/assets/stylesheets/jquery.mCustomScrollbar.css +1267 -0
  113. data/assets/stylesheets/jqvmap.css +50 -0
  114. data/assets/stylesheets/morris.css +2 -0
  115. data/assets/stylesheets/pnotify.buttons.css +1 -0
  116. data/assets/stylesheets/pnotify.css +1 -0
  117. data/assets/stylesheets/pnotify.nonblock.css +1 -0
  118. data/assets/stylesheets/prettify/prettify.css +52 -0
  119. data/assets/stylesheets/starrr.css +8 -0
  120. data/lib/generators/gentelella/install/USAGE +9 -0
  121. data/lib/generators/gentelella/install/install_generator.rb +14 -0
  122. data/lib/generators/gentelella/install/templates/gentelella-custom.js +5067 -0
  123. data/lib/generators/gentelella/install/templates/gentelella-custom.scss +4241 -0
  124. data/lib/gentelella-rails.rb +58 -0
  125. data/lib/gentelella/engine.rb +15 -0
  126. data/lib/gentelella/version.rb +3 -0
  127. data/lib/tasks/bower.rake +153 -0
  128. data/lib/tasks/gentelella/rails_tasks.rake +4 -0
  129. metadata +409 -0
@@ -0,0 +1,208 @@
1
+ /*!
2
+ * FullCalendar v2.7.3 Print Stylesheet
3
+ * Docs & License: http://fullcalendar.io/
4
+ * (c) 2016 Adam Shaw
5
+ */
6
+
7
+ /*
8
+ * Include this stylesheet on your page to get a more printer-friendly calendar.
9
+ * When including this stylesheet, use the media='print' attribute of the <link> tag.
10
+ * Make sure to include this stylesheet IN ADDITION to the regular fullcalendar.css.
11
+ */
12
+
13
+ .fc {
14
+ max-width: 100% !important;
15
+ }
16
+
17
+
18
+ /* Global Event Restyling
19
+ --------------------------------------------------------------------------------------------------*/
20
+
21
+ .fc-event {
22
+ background: #fff !important;
23
+ color: #000 !important;
24
+ page-break-inside: avoid;
25
+ }
26
+
27
+ .fc-event .fc-resizer {
28
+ display: none;
29
+ }
30
+
31
+
32
+ /* Table & Day-Row Restyling
33
+ --------------------------------------------------------------------------------------------------*/
34
+
35
+ th,
36
+ td,
37
+ hr,
38
+ thead,
39
+ tbody,
40
+ .fc-row {
41
+ border-color: #ccc !important;
42
+ background: #fff !important;
43
+ }
44
+
45
+ /* kill the overlaid, absolutely-positioned components */
46
+ /* common... */
47
+ .fc-bg,
48
+ .fc-bgevent-skeleton,
49
+ .fc-highlight-skeleton,
50
+ .fc-helper-skeleton,
51
+ /* for timegrid. within cells within table skeletons... */
52
+ .fc-bgevent-container,
53
+ .fc-business-container,
54
+ .fc-highlight-container,
55
+ .fc-helper-container {
56
+ display: none;
57
+ }
58
+
59
+ /* don't force a min-height on rows (for DayGrid) */
60
+ .fc tbody .fc-row {
61
+ height: auto !important; /* undo height that JS set in distributeHeight */
62
+ min-height: 0 !important; /* undo the min-height from each view's specific stylesheet */
63
+ }
64
+
65
+ .fc tbody .fc-row .fc-content-skeleton {
66
+ position: static; /* undo .fc-rigid */
67
+ padding-bottom: 0 !important; /* use a more border-friendly method for this... */
68
+ }
69
+
70
+ .fc tbody .fc-row .fc-content-skeleton tbody tr:last-child td { /* only works in newer browsers */
71
+ padding-bottom: 1em; /* ...gives space within the skeleton. also ensures min height in a way */
72
+ }
73
+
74
+ .fc tbody .fc-row .fc-content-skeleton table {
75
+ /* provides a min-height for the row, but only effective for IE, which exaggerates this value,
76
+ making it look more like 3em. for other browers, it will already be this tall */
77
+ height: 1em;
78
+ }
79
+
80
+
81
+ /* Undo month-view event limiting. Display all events and hide the "more" links
82
+ --------------------------------------------------------------------------------------------------*/
83
+
84
+ .fc-more-cell,
85
+ .fc-more {
86
+ display: none !important;
87
+ }
88
+
89
+ .fc tr.fc-limited {
90
+ display: table-row !important;
91
+ }
92
+
93
+ .fc td.fc-limited {
94
+ display: table-cell !important;
95
+ }
96
+
97
+ .fc-popover {
98
+ display: none; /* never display the "more.." popover in print mode */
99
+ }
100
+
101
+
102
+ /* TimeGrid Restyling
103
+ --------------------------------------------------------------------------------------------------*/
104
+
105
+ /* undo the min-height 100% trick used to fill the container's height */
106
+ .fc-time-grid {
107
+ min-height: 0 !important;
108
+ }
109
+
110
+ /* don't display the side axis at all ("all-day" and time cells) */
111
+ .fc-agenda-view .fc-axis {
112
+ display: none;
113
+ }
114
+
115
+ /* don't display the horizontal lines */
116
+ .fc-slats,
117
+ .fc-time-grid hr { /* this hr is used when height is underused and needs to be filled */
118
+ display: none !important; /* important overrides inline declaration */
119
+ }
120
+
121
+ /* let the container that holds the events be naturally positioned and create real height */
122
+ .fc-time-grid .fc-content-skeleton {
123
+ position: static;
124
+ }
125
+
126
+ /* in case there are no events, we still want some height */
127
+ .fc-time-grid .fc-content-skeleton table {
128
+ height: 4em;
129
+ }
130
+
131
+ /* kill the horizontal spacing made by the event container. event margins will be done below */
132
+ .fc-time-grid .fc-event-container {
133
+ margin: 0 !important;
134
+ }
135
+
136
+
137
+ /* TimeGrid *Event* Restyling
138
+ --------------------------------------------------------------------------------------------------*/
139
+
140
+ /* naturally position events, vertically stacking them */
141
+ .fc-time-grid .fc-event {
142
+ position: static !important;
143
+ margin: 3px 2px !important;
144
+ }
145
+
146
+ /* for events that continue to a future day, give the bottom border back */
147
+ .fc-time-grid .fc-event.fc-not-end {
148
+ border-bottom-width: 1px !important;
149
+ }
150
+
151
+ /* indicate the event continues via "..." text */
152
+ .fc-time-grid .fc-event.fc-not-end:after {
153
+ content: "...";
154
+ }
155
+
156
+ /* for events that are continuations from previous days, give the top border back */
157
+ .fc-time-grid .fc-event.fc-not-start {
158
+ border-top-width: 1px !important;
159
+ }
160
+
161
+ /* indicate the event is a continuation via "..." text */
162
+ .fc-time-grid .fc-event.fc-not-start:before {
163
+ content: "...";
164
+ }
165
+
166
+ /* time */
167
+
168
+ /* undo a previous declaration and let the time text span to a second line */
169
+ .fc-time-grid .fc-event .fc-time {
170
+ white-space: normal !important;
171
+ }
172
+
173
+ /* hide the the time that is normally displayed... */
174
+ .fc-time-grid .fc-event .fc-time span {
175
+ display: none;
176
+ }
177
+
178
+ /* ...replace it with a more verbose version (includes AM/PM) stored in an html attribute */
179
+ .fc-time-grid .fc-event .fc-time:after {
180
+ content: attr(data-full);
181
+ }
182
+
183
+
184
+ /* Vertical Scroller & Containers
185
+ --------------------------------------------------------------------------------------------------*/
186
+
187
+ /* kill the scrollbars and allow natural height */
188
+ .fc-scroller,
189
+ .fc-day-grid-container, /* these divs might be assigned height, which we need to cleared */
190
+ .fc-time-grid-container { /* */
191
+ overflow: visible !important;
192
+ height: auto !important;
193
+ }
194
+
195
+ /* kill the horizontal border/padding used to compensate for scrollbars */
196
+ .fc-row {
197
+ border: 0 !important;
198
+ margin: 0 !important;
199
+ }
200
+
201
+
202
+ /* Button Controls
203
+ --------------------------------------------------------------------------------------------------*/
204
+
205
+ .fc-button-group,
206
+ .fc button {
207
+ display: none; /* don't display any button-related controls */
208
+ }
@@ -0,0 +1,39 @@
1
+ @import 'bootstrap-sprockets';
2
+ @import 'bootstrap';
3
+ @import 'bootstrap/progress-bars';
4
+ @import 'bootstrap-progressbar-3.3.0-3.x.x';
5
+
6
+ @import 'daterangepicker-bs3';
7
+
8
+ @import "font-awesome-sprockets";
9
+ @import "font-awesome";
10
+
11
+ @import 'icheck/flat/green';
12
+ @import 'jqvmap';
13
+
14
+ @import 'nprogress';
15
+ @import 'nprogress-bootstrap';
16
+
17
+ @import 'prettify/prettify';
18
+
19
+ @import 'switchery';
20
+
21
+ @import 'starrr';
22
+
23
+ @import 'bootstrap-wysiwyg';
24
+
25
+ @import 'select2';
26
+ @import 'select2-bootstrap';
27
+
28
+ @import 'parsley';
29
+
30
+ @import 'data_tables/net-bs.bootstrap';
31
+ @import 'data_tables/net-buttons-bs.buttons';
32
+ @import 'data_tables/net-fixedheader-bs.bootstrap';
33
+ @import 'data_tables/net-responsive-bs.bootstrap';
34
+ @import 'data_tables/net-scroller-bs.bootstrap';
35
+
36
+ @import 'fullcalendar';
37
+
38
+ @import 'morris';
39
+ @import 'jquery.mCustomScrollbar';
@@ -0,0 +1,1267 @@
1
+ /*
2
+ == malihu jquery custom scrollbar plugin ==
3
+ Plugin URI: http://manos.malihu.gr/jquery-custom-content-scroller
4
+ */
5
+
6
+
7
+
8
+ /*
9
+ CONTENTS:
10
+ 1. BASIC STYLE - Plugin's basic/essential CSS properties (normally, should not be edited).
11
+ 2. VERTICAL SCROLLBAR - Positioning and dimensions of vertical scrollbar.
12
+ 3. HORIZONTAL SCROLLBAR - Positioning and dimensions of horizontal scrollbar.
13
+ 4. VERTICAL AND HORIZONTAL SCROLLBARS - Positioning and dimensions of 2-axis scrollbars.
14
+ 5. TRANSITIONS - CSS3 transitions for hover events, auto-expanded and auto-hidden scrollbars.
15
+ 6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS
16
+ 6.1 THEMES - Scrollbar colors, opacity, dimensions, backgrounds etc. via ready-to-use themes.
17
+ */
18
+
19
+
20
+
21
+ /*
22
+ ------------------------------------------------------------------------------------------------------------------------
23
+ 1. BASIC STYLE
24
+ ------------------------------------------------------------------------------------------------------------------------
25
+ */
26
+
27
+ .mCustomScrollbar{ -ms-touch-action: pinch-zoom; touch-action: pinch-zoom; /* direct pointer events to js */ }
28
+ .mCustomScrollbar.mCS_no_scrollbar, .mCustomScrollbar.mCS_touch_action{ -ms-touch-action: auto; touch-action: auto; }
29
+
30
+ .mCustomScrollBox{ /* contains plugin's markup */
31
+ position: relative;
32
+ overflow: hidden;
33
+ height: 100%;
34
+ max-width: 100%;
35
+ outline: none;
36
+ direction: ltr;
37
+ }
38
+
39
+ .mCSB_container{ /* contains the original content */
40
+ overflow: hidden;
41
+ width: auto;
42
+ height: auto;
43
+ }
44
+
45
+
46
+
47
+ /*
48
+ ------------------------------------------------------------------------------------------------------------------------
49
+ 2. VERTICAL SCROLLBAR
50
+ y-axis
51
+ ------------------------------------------------------------------------------------------------------------------------
52
+ */
53
+
54
+ .mCSB_inside > .mCSB_container{ margin-right: 30px; }
55
+
56
+ .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden{ margin-right: 0; } /* non-visible scrollbar */
57
+
58
+ .mCS-dir-rtl > .mCSB_inside > .mCSB_container{ /* RTL direction/left-side scrollbar */
59
+ margin-right: 0;
60
+ margin-left: 30px;
61
+ }
62
+
63
+ .mCS-dir-rtl > .mCSB_inside > .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden{ margin-left: 0; } /* RTL direction/left-side scrollbar */
64
+
65
+ .mCSB_scrollTools{ /* contains scrollbar markup (draggable element, dragger rail, buttons etc.) */
66
+ position: absolute;
67
+ width: 16px;
68
+ height: auto;
69
+ left: auto;
70
+ top: 0;
71
+ right: 0;
72
+ bottom: 0;
73
+ }
74
+
75
+ .mCSB_outside + .mCSB_scrollTools{ right: -26px; } /* scrollbar position: outside */
76
+
77
+ .mCS-dir-rtl > .mCSB_inside > .mCSB_scrollTools,
78
+ .mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools{ /* RTL direction/left-side scrollbar */
79
+ right: auto;
80
+ left: 0;
81
+ }
82
+
83
+ .mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools{ left: -26px; } /* RTL direction/left-side scrollbar (scrollbar position: outside) */
84
+
85
+ .mCSB_scrollTools .mCSB_draggerContainer{ /* contains the draggable element and dragger rail markup */
86
+ position: absolute;
87
+ top: 0;
88
+ left: 0;
89
+ bottom: 0;
90
+ right: 0;
91
+ height: auto;
92
+ }
93
+
94
+ .mCSB_scrollTools a + .mCSB_draggerContainer{ margin: 20px 0; }
95
+
96
+ .mCSB_scrollTools .mCSB_draggerRail{
97
+ width: 2px;
98
+ height: 100%;
99
+ margin: 0 auto;
100
+ -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px;
101
+ }
102
+
103
+ .mCSB_scrollTools .mCSB_dragger{ /* the draggable element */
104
+ cursor: pointer;
105
+ width: 100%;
106
+ height: 30px; /* minimum dragger height */
107
+ z-index: 1;
108
+ }
109
+
110
+ .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ /* the dragger element */
111
+ position: relative;
112
+ width: 4px;
113
+ height: 100%;
114
+ margin: 0 auto;
115
+ -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px;
116
+ text-align: center;
117
+ }
118
+
119
+ .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
120
+ .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{ width: 12px; /* auto-expanded scrollbar */ }
121
+
122
+ .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
123
+ .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{ width: 8px; /* auto-expanded scrollbar */ }
124
+
125
+ .mCSB_scrollTools .mCSB_buttonUp,
126
+ .mCSB_scrollTools .mCSB_buttonDown{
127
+ display: block;
128
+ position: absolute;
129
+ height: 20px;
130
+ width: 100%;
131
+ overflow: hidden;
132
+ margin: 0 auto;
133
+ cursor: pointer;
134
+ }
135
+
136
+ .mCSB_scrollTools .mCSB_buttonDown{ bottom: 0; }
137
+
138
+
139
+
140
+ /*
141
+ ------------------------------------------------------------------------------------------------------------------------
142
+ 3. HORIZONTAL SCROLLBAR
143
+ x-axis
144
+ ------------------------------------------------------------------------------------------------------------------------
145
+ */
146
+
147
+ .mCSB_horizontal.mCSB_inside > .mCSB_container{
148
+ margin-right: 0;
149
+ margin-bottom: 30px;
150
+ }
151
+
152
+ .mCSB_horizontal.mCSB_outside > .mCSB_container{ min-height: 100%; }
153
+
154
+ .mCSB_horizontal > .mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden{ margin-bottom: 0; } /* non-visible scrollbar */
155
+
156
+ .mCSB_scrollTools.mCSB_scrollTools_horizontal{
157
+ width: auto;
158
+ height: 16px;
159
+ top: auto;
160
+ right: 0;
161
+ bottom: 0;
162
+ left: 0;
163
+ }
164
+
165
+ .mCustomScrollBox + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
166
+ .mCustomScrollBox + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal{ bottom: -26px; } /* scrollbar position: outside */
167
+
168
+ .mCSB_scrollTools.mCSB_scrollTools_horizontal a + .mCSB_draggerContainer{ margin: 0 20px; }
169
+
170
+ .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail{
171
+ width: 100%;
172
+ height: 2px;
173
+ margin: 7px 0;
174
+ }
175
+
176
+ .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger{
177
+ width: 30px; /* minimum dragger width */
178
+ height: 100%;
179
+ left: 0;
180
+ }
181
+
182
+ .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
183
+ width: 100%;
184
+ height: 4px;
185
+ margin: 6px auto;
186
+ }
187
+
188
+ .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
189
+ .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{
190
+ height: 12px; /* auto-expanded scrollbar */
191
+ margin: 2px auto;
192
+ }
193
+
194
+ .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
195
+ .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{
196
+ height: 8px; /* auto-expanded scrollbar */
197
+ margin: 4px 0;
198
+ }
199
+
200
+ .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft,
201
+ .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight{
202
+ display: block;
203
+ position: absolute;
204
+ width: 20px;
205
+ height: 100%;
206
+ overflow: hidden;
207
+ margin: 0 auto;
208
+ cursor: pointer;
209
+ }
210
+
211
+ .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft{ left: 0; }
212
+
213
+ .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight{ right: 0; }
214
+
215
+
216
+
217
+ /*
218
+ ------------------------------------------------------------------------------------------------------------------------
219
+ 4. VERTICAL AND HORIZONTAL SCROLLBARS
220
+ yx-axis
221
+ ------------------------------------------------------------------------------------------------------------------------
222
+ */
223
+
224
+ .mCSB_container_wrapper{
225
+ position: absolute;
226
+ height: auto;
227
+ width: auto;
228
+ overflow: hidden;
229
+ top: 0;
230
+ left: 0;
231
+ right: 0;
232
+ bottom: 0;
233
+ margin-right: 30px;
234
+ margin-bottom: 30px;
235
+ }
236
+
237
+ .mCSB_container_wrapper > .mCSB_container{
238
+ padding-right: 30px;
239
+ padding-bottom: 30px;
240
+ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
241
+ }
242
+
243
+ .mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_vertical{ bottom: 20px; }
244
+
245
+ .mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_horizontal{ right: 20px; }
246
+
247
+ /* non-visible horizontal scrollbar */
248
+ .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden + .mCSB_scrollTools.mCSB_scrollTools_vertical{ bottom: 0; }
249
+
250
+ /* non-visible vertical scrollbar/RTL direction/left-side scrollbar */
251
+ .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal,
252
+ .mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal{ right: 0; }
253
+
254
+ /* RTL direction/left-side scrollbar */
255
+ .mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal{ left: 20px; }
256
+
257
+ /* non-visible scrollbar/RTL direction/left-side scrollbar */
258
+ .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; }
259
+
260
+ .mCS-dir-rtl > .mCSB_inside > .mCSB_container_wrapper{ /* RTL direction/left-side scrollbar */
261
+ margin-right: 0;
262
+ margin-left: 30px;
263
+ }
264
+
265
+ .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden > .mCSB_container{ padding-right: 0; }
266
+
267
+ .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden > .mCSB_container{ padding-bottom: 0; }
268
+
269
+ .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden{
270
+ margin-right: 0; /* non-visible scrollbar */
271
+ margin-left: 0;
272
+ }
273
+
274
+ /* non-visible horizontal scrollbar */
275
+ .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden{ margin-bottom: 0; }
276
+
277
+
278
+
279
+ /*
280
+ ------------------------------------------------------------------------------------------------------------------------
281
+ 5. TRANSITIONS
282
+ ------------------------------------------------------------------------------------------------------------------------
283
+ */
284
+
285
+ .mCSB_scrollTools,
286
+ .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
287
+ .mCSB_scrollTools .mCSB_buttonUp,
288
+ .mCSB_scrollTools .mCSB_buttonDown,
289
+ .mCSB_scrollTools .mCSB_buttonLeft,
290
+ .mCSB_scrollTools .mCSB_buttonRight{
291
+ -webkit-transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
292
+ -moz-transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
293
+ -o-transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
294
+ transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
295
+ }
296
+
297
+ .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar, /* auto-expanded scrollbar */
298
+ .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail,
299
+ .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar,
300
+ .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail{
301
+ -webkit-transition: width .2s ease-out .2s, height .2s ease-out .2s,
302
+ margin-left .2s ease-out .2s, margin-right .2s ease-out .2s,
303
+ margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s,
304
+ opacity .2s ease-in-out, background-color .2s ease-in-out;
305
+ -moz-transition: width .2s ease-out .2s, height .2s ease-out .2s,
306
+ margin-left .2s ease-out .2s, margin-right .2s ease-out .2s,
307
+ margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s,
308
+ opacity .2s ease-in-out, background-color .2s ease-in-out;
309
+ -o-transition: width .2s ease-out .2s, height .2s ease-out .2s,
310
+ margin-left .2s ease-out .2s, margin-right .2s ease-out .2s,
311
+ margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s,
312
+ opacity .2s ease-in-out, background-color .2s ease-in-out;
313
+ transition: width .2s ease-out .2s, height .2s ease-out .2s,
314
+ margin-left .2s ease-out .2s, margin-right .2s ease-out .2s,
315
+ margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s,
316
+ opacity .2s ease-in-out, background-color .2s ease-in-out;
317
+ }
318
+
319
+
320
+
321
+ /*
322
+ ------------------------------------------------------------------------------------------------------------------------
323
+ 6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS
324
+ ------------------------------------------------------------------------------------------------------------------------
325
+ */
326
+
327
+ /*
328
+ ----------------------------------------
329
+ 6.1 THEMES
330
+ ----------------------------------------
331
+ */
332
+
333
+ /* default theme ("light") */
334
+
335
+ .mCSB_scrollTools{ opacity: 0.75; filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; }
336
+
337
+ .mCS-autoHide > .mCustomScrollBox > .mCSB_scrollTools,
338
+ .mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools{ opacity: 0; filter: "alpha(opacity=0)"; -ms-filter: "alpha(opacity=0)"; }
339
+
340
+ .mCustomScrollbar > .mCustomScrollBox > .mCSB_scrollTools.mCSB_scrollTools_onDrag,
341
+ .mCustomScrollbar > .mCustomScrollBox ~ .mCSB_scrollTools.mCSB_scrollTools_onDrag,
342
+ .mCustomScrollBox:hover > .mCSB_scrollTools,
343
+ .mCustomScrollBox:hover ~ .mCSB_scrollTools,
344
+ .mCS-autoHide:hover > .mCustomScrollBox > .mCSB_scrollTools,
345
+ .mCS-autoHide:hover > .mCustomScrollBox ~ .mCSB_scrollTools{ opacity: 1; filter: "alpha(opacity=100)"; -ms-filter: "alpha(opacity=100)"; }
346
+
347
+ .mCSB_scrollTools .mCSB_draggerRail{
348
+ background-color: #000; background-color: rgba(0,0,0,0.4);
349
+ filter: "alpha(opacity=40)"; -ms-filter: "alpha(opacity=40)";
350
+ }
351
+
352
+ .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
353
+ background-color: #fff; background-color: rgba(255,255,255,0.75);
354
+ filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)";
355
+ }
356
+
357
+ .mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{
358
+ background-color: #fff; background-color: rgba(255,255,255,0.85);
359
+ filter: "alpha(opacity=85)"; -ms-filter: "alpha(opacity=85)";
360
+ }
361
+ .mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
362
+ .mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{
363
+ background-color: #fff; background-color: rgba(255,255,255,0.9);
364
+ filter: "alpha(opacity=90)"; -ms-filter: "alpha(opacity=90)";
365
+ }
366
+
367
+ .mCSB_scrollTools .mCSB_buttonUp,
368
+ .mCSB_scrollTools .mCSB_buttonDown,
369
+ .mCSB_scrollTools .mCSB_buttonLeft,
370
+ .mCSB_scrollTools .mCSB_buttonRight{
371
+ background-image: url(mCSB_buttons.png); /* css sprites */
372
+ background-repeat: no-repeat;
373
+ opacity: 0.4; filter: "alpha(opacity=40)"; -ms-filter: "alpha(opacity=40)";
374
+ }
375
+
376
+ .mCSB_scrollTools .mCSB_buttonUp{
377
+ background-position: 0 0;
378
+ /*
379
+ sprites locations
380
+ light: 0 0, -16px 0, -32px 0, -48px 0, 0 -72px, -16px -72px, -32px -72px
381
+ dark: -80px 0, -96px 0, -112px 0, -128px 0, -80px -72px, -96px -72px, -112px -72px
382
+ */
383
+ }
384
+
385
+ .mCSB_scrollTools .mCSB_buttonDown{
386
+ background-position: 0 -20px;
387
+ /*
388
+ sprites locations
389
+ light: 0 -20px, -16px -20px, -32px -20px, -48px -20px, 0 -92px, -16px -92px, -32px -92px
390
+ dark: -80px -20px, -96px -20px, -112px -20px, -128px -20px, -80px -92px, -96px -92px, -112 -92px
391
+ */
392
+ }
393
+
394
+ .mCSB_scrollTools .mCSB_buttonLeft{
395
+ background-position: 0 -40px;
396
+ /*
397
+ sprites locations
398
+ light: 0 -40px, -20px -40px, -40px -40px, -60px -40px, 0 -112px, -20px -112px, -40px -112px
399
+ dark: -80px -40px, -100px -40px, -120px -40px, -140px -40px, -80px -112px, -100px -112px, -120px -112px
400
+ */
401
+ }
402
+
403
+ .mCSB_scrollTools .mCSB_buttonRight{
404
+ background-position: 0 -56px;
405
+ /*
406
+ sprites locations
407
+ light: 0 -56px, -20px -56px, -40px -56px, -60px -56px, 0 -128px, -20px -128px, -40px -128px
408
+ dark: -80px -56px, -100px -56px, -120px -56px, -140px -56px, -80px -128px, -100px -128px, -120px -128px
409
+ */
410
+ }
411
+
412
+ .mCSB_scrollTools .mCSB_buttonUp:hover,
413
+ .mCSB_scrollTools .mCSB_buttonDown:hover,
414
+ .mCSB_scrollTools .mCSB_buttonLeft:hover,
415
+ .mCSB_scrollTools .mCSB_buttonRight:hover{ opacity: 0.75; filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; }
416
+
417
+ .mCSB_scrollTools .mCSB_buttonUp:active,
418
+ .mCSB_scrollTools .mCSB_buttonDown:active,
419
+ .mCSB_scrollTools .mCSB_buttonLeft:active,
420
+ .mCSB_scrollTools .mCSB_buttonRight:active{ opacity: 0.9; filter: "alpha(opacity=90)"; -ms-filter: "alpha(opacity=90)"; }
421
+
422
+
423
+ /* theme: "dark" */
424
+
425
+ .mCS-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.15); }
426
+
427
+ .mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); }
428
+
429
+ .mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: rgba(0,0,0,0.85); }
430
+
431
+ .mCS-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
432
+ .mCS-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: rgba(0,0,0,0.9); }
433
+
434
+ .mCS-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -80px 0; }
435
+
436
+ .mCS-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -80px -20px; }
437
+
438
+ .mCS-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -80px -40px; }
439
+
440
+ .mCS-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -80px -56px; }
441
+
442
+ /* ---------------------------------------- */
443
+
444
+
445
+
446
+ /* theme: "light-2", "dark-2" */
447
+
448
+ .mCS-light-2.mCSB_scrollTools .mCSB_draggerRail,
449
+ .mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail{
450
+ width: 4px;
451
+ background-color: #fff; background-color: rgba(255,255,255,0.1);
452
+ -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px;
453
+ }
454
+
455
+ .mCS-light-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
456
+ .mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
457
+ width: 4px;
458
+ background-color: #fff; background-color: rgba(255,255,255,0.75);
459
+ -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px;
460
+ }
461
+
462
+ .mCS-light-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
463
+ .mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
464
+ .mCS-light-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
465
+ .mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
466
+ width: 100%;
467
+ height: 4px;
468
+ margin: 6px auto;
469
+ }
470
+
471
+ .mCS-light-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.85); }
472
+
473
+ .mCS-light-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
474
+ .mCS-light-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.9); }
475
+
476
+ .mCS-light-2.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px 0; }
477
+
478
+ .mCS-light-2.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -20px; }
479
+
480
+ .mCS-light-2.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -40px; }
481
+
482
+ .mCS-light-2.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -56px; }
483
+
484
+
485
+ /* theme: "dark-2" */
486
+
487
+ .mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail{
488
+ background-color: #000; background-color: rgba(0,0,0,0.1);
489
+ -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px;
490
+ }
491
+
492
+ .mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
493
+ background-color: #000; background-color: rgba(0,0,0,0.75);
494
+ -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px;
495
+ }
496
+
497
+ .mCS-dark-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); }
498
+
499
+ .mCS-dark-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
500
+ .mCS-dark-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); }
501
+
502
+ .mCS-dark-2.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px 0; }
503
+
504
+ .mCS-dark-2.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -20px; }
505
+
506
+ .mCS-dark-2.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -40px; }
507
+
508
+ .mCS-dark-2.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -56px; }
509
+
510
+ /* ---------------------------------------- */
511
+
512
+
513
+
514
+ /* theme: "light-thick", "dark-thick" */
515
+
516
+ .mCS-light-thick.mCSB_scrollTools .mCSB_draggerRail,
517
+ .mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail{
518
+ width: 4px;
519
+ background-color: #fff; background-color: rgba(255,255,255,0.1);
520
+ -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
521
+ }
522
+
523
+ .mCS-light-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
524
+ .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
525
+ width: 6px;
526
+ background-color: #fff; background-color: rgba(255,255,255,0.75);
527
+ -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
528
+ }
529
+
530
+ .mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail,
531
+ .mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail{
532
+ width: 100%;
533
+ height: 4px;
534
+ margin: 6px 0;
535
+ }
536
+
537
+ .mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
538
+ .mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
539
+ width: 100%;
540
+ height: 6px;
541
+ margin: 5px auto;
542
+ }
543
+
544
+ .mCS-light-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.85); }
545
+
546
+ .mCS-light-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
547
+ .mCS-light-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.9); }
548
+
549
+ .mCS-light-thick.mCSB_scrollTools .mCSB_buttonUp{ background-position: -16px 0; }
550
+
551
+ .mCS-light-thick.mCSB_scrollTools .mCSB_buttonDown{ background-position: -16px -20px; }
552
+
553
+ .mCS-light-thick.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -20px -40px; }
554
+
555
+ .mCS-light-thick.mCSB_scrollTools .mCSB_buttonRight{ background-position: -20px -56px; }
556
+
557
+
558
+ /* theme: "dark-thick" */
559
+
560
+ .mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail{
561
+ background-color: #000; background-color: rgba(0,0,0,0.1);
562
+ -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
563
+ }
564
+
565
+ .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
566
+ background-color: #000; background-color: rgba(0,0,0,0.75);
567
+ -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
568
+ }
569
+
570
+ .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); }
571
+
572
+ .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
573
+ .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); }
574
+
575
+ .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonUp{ background-position: -96px 0; }
576
+
577
+ .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonDown{ background-position: -96px -20px; }
578
+
579
+ .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -100px -40px; }
580
+
581
+ .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonRight{ background-position: -100px -56px; }
582
+
583
+ /* ---------------------------------------- */
584
+
585
+
586
+
587
+ /* theme: "light-thin", "dark-thin" */
588
+
589
+ .mCS-light-thin.mCSB_scrollTools .mCSB_draggerRail{ background-color: #fff; background-color: rgba(255,255,255,0.1); }
590
+
591
+ .mCS-light-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
592
+ .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 2px; }
593
+
594
+ .mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail,
595
+ .mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail{ width: 100%; }
596
+
597
+ .mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
598
+ .mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
599
+ width: 100%;
600
+ height: 2px;
601
+ margin: 7px auto;
602
+ }
603
+
604
+
605
+ /* theme "dark-thin" */
606
+
607
+ .mCS-dark-thin.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.15); }
608
+
609
+ .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); }
610
+
611
+ .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); }
612
+
613
+ .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
614
+ .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); }
615
+
616
+ .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonUp{ background-position: -80px 0; }
617
+
618
+ .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonDown{ background-position: -80px -20px; }
619
+
620
+ .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -80px -40px; }
621
+
622
+ .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonRight{ background-position: -80px -56px; }
623
+
624
+ /* ---------------------------------------- */
625
+
626
+
627
+
628
+ /* theme "rounded", "rounded-dark", "rounded-dots", "rounded-dots-dark" */
629
+
630
+ .mCS-rounded.mCSB_scrollTools .mCSB_draggerRail{ background-color: #fff; background-color: rgba(255,255,255,0.15); }
631
+
632
+ .mCS-rounded.mCSB_scrollTools .mCSB_dragger,
633
+ .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger,
634
+ .mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger,
635
+ .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger{ height: 14px; }
636
+
637
+ .mCS-rounded.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
638
+ .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
639
+ .mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
640
+ .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
641
+ width: 14px;
642
+ margin: 0 1px;
643
+ }
644
+
645
+ .mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger,
646
+ .mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger,
647
+ .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger,
648
+ .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger{ width: 14px; }
649
+
650
+ .mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
651
+ .mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
652
+ .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
653
+ .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
654
+ height: 14px;
655
+ margin: 1px 0;
656
+ }
657
+
658
+ .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
659
+ .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar,
660
+ .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
661
+ .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{
662
+ width: 16px; /* auto-expanded scrollbar */
663
+ height: 16px;
664
+ margin: -1px 0;
665
+ }
666
+
667
+ .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
668
+ .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
669
+ .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
670
+ .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{ width: 4px; /* auto-expanded scrollbar */ }
671
+
672
+ .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
673
+ .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar,
674
+ .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
675
+ .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{
676
+ height: 16px; /* auto-expanded scrollbar */
677
+ width: 16px;
678
+ margin: 0 -1px;
679
+ }
680
+
681
+ .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
682
+ .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
683
+ .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
684
+ .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{
685
+ height: 4px; /* auto-expanded scrollbar */
686
+ margin: 6px 0;
687
+ }
688
+
689
+ .mCS-rounded.mCSB_scrollTools .mCSB_buttonUp{ background-position: 0 -72px; }
690
+
691
+ .mCS-rounded.mCSB_scrollTools .mCSB_buttonDown{ background-position: 0 -92px; }
692
+
693
+ .mCS-rounded.mCSB_scrollTools .mCSB_buttonLeft{ background-position: 0 -112px; }
694
+
695
+ .mCS-rounded.mCSB_scrollTools .mCSB_buttonRight{ background-position: 0 -128px; }
696
+
697
+
698
+ /* theme "rounded-dark", "rounded-dots-dark" */
699
+
700
+ .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
701
+ .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); }
702
+
703
+ .mCS-rounded-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.15); }
704
+
705
+ .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
706
+ .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); }
707
+
708
+ .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
709
+ .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
710
+ .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
711
+ .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); }
712
+
713
+ .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -80px -72px; }
714
+
715
+ .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -80px -92px; }
716
+
717
+ .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -80px -112px; }
718
+
719
+ .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -80px -128px; }
720
+
721
+
722
+ /* theme "rounded-dots", "rounded-dots-dark" */
723
+
724
+ .mCS-rounded-dots.mCSB_scrollTools_vertical .mCSB_draggerRail,
725
+ .mCS-rounded-dots-dark.mCSB_scrollTools_vertical .mCSB_draggerRail{ width: 4px; }
726
+
727
+ .mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail,
728
+ .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail,
729
+ .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail,
730
+ .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{
731
+ background-color: transparent;
732
+ background-position: center;
733
+ }
734
+
735
+ .mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail,
736
+ .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail{
737
+ background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAANElEQVQYV2NkIAAYiVbw//9/Y6DiM1ANJoyMjGdBbLgJQAX/kU0DKgDLkaQAvxW4HEvQFwCRcxIJK1XznAAAAABJRU5ErkJggg==");
738
+ background-repeat: repeat-y;
739
+ opacity: 0.3;
740
+ filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)";
741
+ }
742
+
743
+ .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail,
744
+ .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{
745
+ height: 4px;
746
+ margin: 6px 0;
747
+ background-repeat: repeat-x;
748
+ }
749
+
750
+ .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonUp{ background-position: -16px -72px; }
751
+
752
+ .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonDown{ background-position: -16px -92px; }
753
+
754
+ .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -20px -112px; }
755
+
756
+ .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonRight{ background-position: -20px -128px; }
757
+
758
+
759
+ /* theme "rounded-dots-dark" */
760
+
761
+ .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail{
762
+ background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYV2NkIAAYSVFgDFR8BqrBBEifBbGRTfiPZhpYjiQFBK3A6l6CvgAAE9kGCd1mvgEAAAAASUVORK5CYII=");
763
+ }
764
+
765
+ .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -96px -72px; }
766
+
767
+ .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -96px -92px; }
768
+
769
+ .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -100px -112px; }
770
+
771
+ .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -100px -128px; }
772
+
773
+ /* ---------------------------------------- */
774
+
775
+
776
+
777
+ /* theme "3d", "3d-dark", "3d-thick", "3d-thick-dark" */
778
+
779
+ .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
780
+ .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
781
+ .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
782
+ .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
783
+ background-repeat: repeat-y;
784
+ background-image: -moz-linear-gradient(left, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0) 100%);
785
+ 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)));
786
+ background-image: -webkit-linear-gradient(left, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
787
+ background-image: -o-linear-gradient(left, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
788
+ background-image: -ms-linear-gradient(left, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
789
+ background-image: linear-gradient(to right, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
790
+ }
791
+
792
+ .mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
793
+ .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
794
+ .mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
795
+ .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
796
+ background-repeat: repeat-x;
797
+ background-image: -moz-linear-gradient(top, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0) 100%);
798
+ 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)));
799
+ background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
800
+ background-image: -o-linear-gradient(top, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
801
+ background-image: -ms-linear-gradient(top, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
802
+ background-image: linear-gradient(to bottom, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
803
+ }
804
+
805
+
806
+ /* theme "3d", "3d-dark" */
807
+
808
+ .mCS-3d.mCSB_scrollTools_vertical .mCSB_dragger,
809
+ .mCS-3d-dark.mCSB_scrollTools_vertical .mCSB_dragger{ height: 70px; }
810
+
811
+ .mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger,
812
+ .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger{ width: 70px; }
813
+
814
+ .mCS-3d.mCSB_scrollTools,
815
+ .mCS-3d-dark.mCSB_scrollTools{
816
+ opacity: 1;
817
+ filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)";
818
+ }
819
+
820
+ .mCS-3d.mCSB_scrollTools .mCSB_draggerRail,
821
+ .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
822
+ .mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail,
823
+ .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; }
824
+
825
+ .mCS-3d.mCSB_scrollTools .mCSB_draggerRail,
826
+ .mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail{
827
+ width: 8px;
828
+ background-color: #000; background-color: rgba(0,0,0,0.2);
829
+ box-shadow: inset 1px 0 1px rgba(0,0,0,0.5), inset -1px 0 1px rgba(255,255,255,0.2);
830
+ }
831
+
832
+ .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
833
+ .mCS-3d.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
834
+ .mCS-3d.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
835
+ .mCS-3d.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
836
+ .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
837
+ .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
838
+ .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
839
+ .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #555; }
840
+
841
+ .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
842
+ .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 8px; }
843
+
844
+ .mCS-3d.mCSB_scrollTools_horizontal .mCSB_draggerRail,
845
+ .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{
846
+ width: 100%;
847
+ height: 8px;
848
+ margin: 4px 0;
849
+ box-shadow: inset 0 1px 1px rgba(0,0,0,0.5), inset 0 -1px 1px rgba(255,255,255,0.2);
850
+ }
851
+
852
+ .mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
853
+ .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
854
+ width: 100%;
855
+ height: 8px;
856
+ margin: 4px auto;
857
+ }
858
+
859
+ .mCS-3d.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px -72px; }
860
+
861
+ .mCS-3d.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -92px; }
862
+
863
+ .mCS-3d.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -112px; }
864
+
865
+ .mCS-3d.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -128px; }
866
+
867
+
868
+ /* theme "3d-dark" */
869
+
870
+ .mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail{
871
+ background-color: #000; background-color: rgba(0,0,0,0.1);
872
+ box-shadow: inset 1px 0 1px rgba(0,0,0,0.1);
873
+ }
874
+
875
+ .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{ box-shadow: inset 0 1px 1px rgba(0,0,0,0.1); }
876
+
877
+ .mCS-3d-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px -72px; }
878
+
879
+ .mCS-3d-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -92px; }
880
+
881
+ .mCS-3d-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -112px; }
882
+
883
+ .mCS-3d-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -128px; }
884
+
885
+ /* ---------------------------------------- */
886
+
887
+
888
+
889
+ /* theme: "3d-thick", "3d-thick-dark" */
890
+
891
+ .mCS-3d-thick.mCSB_scrollTools,
892
+ .mCS-3d-thick-dark.mCSB_scrollTools{
893
+ opacity: 1;
894
+ filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)";
895
+ }
896
+
897
+ .mCS-3d-thick.mCSB_scrollTools,
898
+ .mCS-3d-thick-dark.mCSB_scrollTools,
899
+ .mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer,
900
+ .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer{ -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; }
901
+
902
+ .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
903
+ .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
904
+
905
+ .mCSB_inside + .mCS-3d-thick.mCSB_scrollTools_vertical,
906
+ .mCSB_inside + .mCS-3d-thick-dark.mCSB_scrollTools_vertical{ right: 1px; }
907
+
908
+ .mCS-3d-thick.mCSB_scrollTools_vertical,
909
+ .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); }
910
+
911
+ .mCS-3d-thick.mCSB_scrollTools_horizontal,
912
+ .mCS-3d-thick-dark.mCSB_scrollTools_horizontal{
913
+ bottom: 1px;
914
+ box-shadow: inset 0 1px 1px rgba(0,0,0,0.1), inset 0 0 14px rgba(0,0,0,0.5);
915
+ }
916
+
917
+ .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
918
+ .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
919
+ box-shadow: inset 1px 0 0 rgba(255,255,255,0.4);
920
+ width: 12px;
921
+ margin: 2px;
922
+ position: absolute;
923
+ height: auto;
924
+ top: 0;
925
+ bottom: 0;
926
+ left: 0;
927
+ right: 0;
928
+ }
929
+
930
+ .mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
931
+ .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ box-shadow: inset 0 1px 0 rgba(255,255,255,0.4); }
932
+
933
+ .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
934
+ .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
935
+ .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
936
+ .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #555; }
937
+
938
+ .mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
939
+ .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
940
+ height: 12px;
941
+ width: auto;
942
+ }
943
+
944
+ .mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer{
945
+ background-color: #000; background-color: rgba(0,0,0,0.05);
946
+ box-shadow: inset 1px 1px 16px rgba(0,0,0,0.1);
947
+ }
948
+
949
+ .mCS-3d-thick.mCSB_scrollTools .mCSB_draggerRail{ background-color: transparent; }
950
+
951
+ .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px -72px; }
952
+
953
+ .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -92px; }
954
+
955
+ .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -112px; }
956
+
957
+ .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -128px; }
958
+
959
+
960
+ /* theme: "3d-thick-dark" */
961
+
962
+ .mCS-3d-thick-dark.mCSB_scrollTools{ box-shadow: inset 0 0 14px rgba(0,0,0,0.2); }
963
+
964
+ .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); }
965
+
966
+ .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); }
967
+
968
+ .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); }
969
+
970
+ .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
971
+ .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
972
+ .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
973
+ .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #777; }
974
+
975
+ .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer{
976
+ background-color: #fff; background-color: rgba(0,0,0,0.05);
977
+ box-shadow: inset 1px 1px 16px rgba(0,0,0,0.1);
978
+ }
979
+
980
+ .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: transparent; }
981
+
982
+ .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px -72px; }
983
+
984
+ .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -92px; }
985
+
986
+ .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -112px; }
987
+
988
+ .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -128px; }
989
+
990
+ /* ---------------------------------------- */
991
+
992
+
993
+
994
+ /* theme: "minimal", "minimal-dark" */
995
+
996
+ .mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical,
997
+ .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical{
998
+ right: 0;
999
+ margin: 12px 0;
1000
+ }
1001
+
1002
+ .mCustomScrollBox.mCS-minimal + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
1003
+ .mCustomScrollBox.mCS-minimal + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
1004
+ .mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
1005
+ .mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal{
1006
+ bottom: 0;
1007
+ margin: 0 12px;
1008
+ }
1009
+
1010
+ /* RTL direction/left-side scrollbar */
1011
+ .mCS-dir-rtl > .mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical,
1012
+ .mCS-dir-rtl > .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical{
1013
+ left: 0;
1014
+ right: auto;
1015
+ }
1016
+
1017
+ .mCS-minimal.mCSB_scrollTools .mCSB_draggerRail,
1018
+ .mCS-minimal-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: transparent; }
1019
+
1020
+ .mCS-minimal.mCSB_scrollTools_vertical .mCSB_dragger,
1021
+ .mCS-minimal-dark.mCSB_scrollTools_vertical .mCSB_dragger{ height: 50px; }
1022
+
1023
+ .mCS-minimal.mCSB_scrollTools_horizontal .mCSB_dragger,
1024
+ .mCS-minimal-dark.mCSB_scrollTools_horizontal .mCSB_dragger{ width: 50px; }
1025
+
1026
+ .mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
1027
+ background-color: #fff; background-color: rgba(255,255,255,0.2);
1028
+ filter: "alpha(opacity=20)"; -ms-filter: "alpha(opacity=20)";
1029
+ }
1030
+
1031
+ .mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
1032
+ .mCS-minimal.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{
1033
+ background-color: #fff; background-color: rgba(255,255,255,0.5);
1034
+ filter: "alpha(opacity=50)"; -ms-filter: "alpha(opacity=50)";
1035
+ }
1036
+
1037
+
1038
+ /* theme: "minimal-dark" */
1039
+
1040
+ .mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
1041
+ background-color: #000; background-color: rgba(0,0,0,0.2);
1042
+ filter: "alpha(opacity=20)"; -ms-filter: "alpha(opacity=20)";
1043
+ }
1044
+
1045
+ .mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
1046
+ .mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{
1047
+ background-color: #000; background-color: rgba(0,0,0,0.5);
1048
+ filter: "alpha(opacity=50)"; -ms-filter: "alpha(opacity=50)";
1049
+ }
1050
+
1051
+ /* ---------------------------------------- */
1052
+
1053
+
1054
+
1055
+ /* theme "light-3", "dark-3" */
1056
+
1057
+ .mCS-light-3.mCSB_scrollTools .mCSB_draggerRail,
1058
+ .mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail{
1059
+ width: 6px;
1060
+ background-color: #000; background-color: rgba(0,0,0,0.2);
1061
+ }
1062
+
1063
+ .mCS-light-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
1064
+ .mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 6px; }
1065
+
1066
+ .mCS-light-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
1067
+ .mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
1068
+ .mCS-light-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,
1069
+ .mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_draggerRail{
1070
+ width: 100%;
1071
+ height: 6px;
1072
+ margin: 5px 0;
1073
+ }
1074
+
1075
+ .mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
1076
+ .mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
1077
+ .mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
1078
+ .mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{
1079
+ width: 12px;
1080
+ }
1081
+
1082
+ .mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
1083
+ .mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
1084
+ .mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
1085
+ .mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{
1086
+ height: 12px;
1087
+ margin: 2px 0;
1088
+ }
1089
+
1090
+ .mCS-light-3.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px -72px; }
1091
+
1092
+ .mCS-light-3.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -92px; }
1093
+
1094
+ .mCS-light-3.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -112px; }
1095
+
1096
+ .mCS-light-3.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -128px; }
1097
+
1098
+
1099
+ /* theme "dark-3" */
1100
+
1101
+ .mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); }
1102
+
1103
+ .mCS-dark-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); }
1104
+
1105
+ .mCS-dark-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
1106
+ .mCS-dark-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); }
1107
+
1108
+ .mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.1); }
1109
+
1110
+ .mCS-dark-3.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px -72px; }
1111
+
1112
+ .mCS-dark-3.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -92px; }
1113
+
1114
+ .mCS-dark-3.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -112px; }
1115
+
1116
+ .mCS-dark-3.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -128px; }
1117
+
1118
+ /* ---------------------------------------- */
1119
+
1120
+
1121
+
1122
+ /* theme "inset", "inset-dark", "inset-2", "inset-2-dark", "inset-3", "inset-3-dark" */
1123
+
1124
+ .mCS-inset.mCSB_scrollTools .mCSB_draggerRail,
1125
+ .mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail,
1126
+ .mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail,
1127
+ .mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,
1128
+ .mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail,
1129
+ .mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail{
1130
+ width: 12px;
1131
+ background-color: #000; background-color: rgba(0,0,0,0.2);
1132
+ }
1133
+
1134
+ .mCS-inset.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
1135
+ .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
1136
+ .mCS-inset-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
1137
+ .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
1138
+ .mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
1139
+ .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
1140
+ width: 6px;
1141
+ margin: 3px 5px;
1142
+ position: absolute;
1143
+ height: auto;
1144
+ top: 0;
1145
+ bottom: 0;
1146
+ left: 0;
1147
+ right: 0;
1148
+ }
1149
+
1150
+ .mCS-inset.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
1151
+ .mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
1152
+ .mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
1153
+ .mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
1154
+ .mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
1155
+ .mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
1156
+ height: 6px;
1157
+ margin: 5px 3px;
1158
+ position: absolute;
1159
+ width: auto;
1160
+ top: 0;
1161
+ bottom: 0;
1162
+ left: 0;
1163
+ right: 0;
1164
+ }
1165
+
1166
+ .mCS-inset.mCSB_scrollTools_horizontal .mCSB_draggerRail,
1167
+ .mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
1168
+ .mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
1169
+ .mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
1170
+ .mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,
1171
+ .mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{
1172
+ width: 100%;
1173
+ height: 12px;
1174
+ margin: 2px 0;
1175
+ }
1176
+
1177
+ .mCS-inset.mCSB_scrollTools .mCSB_buttonUp,
1178
+ .mCS-inset-2.mCSB_scrollTools .mCSB_buttonUp,
1179
+ .mCS-inset-3.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px -72px; }
1180
+
1181
+ .mCS-inset.mCSB_scrollTools .mCSB_buttonDown,
1182
+ .mCS-inset-2.mCSB_scrollTools .mCSB_buttonDown,
1183
+ .mCS-inset-3.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -92px; }
1184
+
1185
+ .mCS-inset.mCSB_scrollTools .mCSB_buttonLeft,
1186
+ .mCS-inset-2.mCSB_scrollTools .mCSB_buttonLeft,
1187
+ .mCS-inset-3.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -112px; }
1188
+
1189
+ .mCS-inset.mCSB_scrollTools .mCSB_buttonRight,
1190
+ .mCS-inset-2.mCSB_scrollTools .mCSB_buttonRight,
1191
+ .mCS-inset-3.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -128px; }
1192
+
1193
+
1194
+ /* theme "inset-dark", "inset-2-dark", "inset-3-dark" */
1195
+
1196
+ .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
1197
+ .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
1198
+ .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); }
1199
+
1200
+ .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
1201
+ .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
1202
+ .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); }
1203
+
1204
+ .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
1205
+ .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
1206
+ .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
1207
+ .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
1208
+ .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
1209
+ .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); }
1210
+
1211
+ .mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail,
1212
+ .mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,
1213
+ .mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.1); }
1214
+
1215
+ .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonUp,
1216
+ .mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonUp,
1217
+ .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px -72px; }
1218
+
1219
+ .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonDown,
1220
+ .mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonDown,
1221
+ .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -92px; }
1222
+
1223
+ .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonLeft,
1224
+ .mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonLeft,
1225
+ .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -112px; }
1226
+
1227
+ .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonRight,
1228
+ .mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonRight,
1229
+ .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -128px; }
1230
+
1231
+
1232
+ /* theme "inset-2", "inset-2-dark" */
1233
+
1234
+ .mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail,
1235
+ .mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail{
1236
+ background-color: transparent;
1237
+ border-width: 1px;
1238
+ border-style: solid;
1239
+ border-color: #fff;
1240
+ border-color: rgba(255,255,255,0.2);
1241
+ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
1242
+ }
1243
+
1244
+ .mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail{ border-color: #000; border-color: rgba(0,0,0,0.2); }
1245
+
1246
+
1247
+ /* theme "inset-3", "inset-3-dark" */
1248
+
1249
+ .mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail{ background-color: #fff; background-color: rgba(255,255,255,0.6); }
1250
+
1251
+ .mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.6); }
1252
+
1253
+ .mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); }
1254
+
1255
+ .mCS-inset-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); }
1256
+
1257
+ .mCS-inset-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
1258
+ .mCS-inset-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); }
1259
+
1260
+ .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.75); }
1261
+
1262
+ .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.85); }
1263
+
1264
+ .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
1265
+ .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); }
1266
+
1267
+ /* ---------------------------------------- */