From fb06141b8d50e772ade37d060544f7bc42f8bb16 Mon Sep 17 00:00:00 2001 From: guy Date: Wed, 22 Mar 2017 15:14:25 +0800 Subject: [PATCH] add --- dist/base.css | 2005 ++++------------- dist/core.js | 276 ++- src/core/base.js | 8 +- src/css/base/pager/pager.all.css | 14 - src/css/base/pager/pager.number.css | 11 - src/css/base/pager/pager.skip.css | 11 - .../base/third/jquery.mCustomScrollbar.css | 1481 ------------ 7 files changed, 691 insertions(+), 3115 deletions(-) delete mode 100644 src/css/base/pager/pager.all.css delete mode 100644 src/css/base/pager/pager.number.css delete mode 100644 src/css/base/pager/pager.skip.css delete mode 100644 src/css/base/third/jquery.mCustomScrollbar.css diff --git a/dist/base.css b/dist/base.css index 6505eea15..867afd467 100644 --- a/dist/base.css +++ b/dist/base.css @@ -1,6 +1,38 @@ /****添加计算宽度的--运算符直接需要space****/ /****** common color(常用颜色,可用于普遍场景) *****/ /**** custom color(自定义颜色,用于特定场景) ****/ +@font-face { + font-family: 'bbr'; + src: url('/resources/fonts/iconfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/resources/fonts/iconfont.woff') format('woff'), /* chrome、firefox */ url('/resources/fonts/iconfont.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/ url('/resources/fonts/iconfont.svg#svgFontName') format('svg'); + + /* iOS 4.1- */ +} +.b-font { + font-family: "bi"; + font-style: normal; + -webkit-font-smoothing: antialiased; + -webkit-text-stroke-width: 0.2px; + -moz-osx-font-smoothing: grayscale; +} +.bi-base-request-fail-mask .mask-pane { + background: #ffffff; + opacity: 0.8; + filter: alpha(opacity=80); +} +/****添加计算宽度的--运算符直接需要space****/ +/****** common color(常用颜色,可用于普遍场景) *****/ +/**** custom color(自定义颜色,用于特定场景) ****/ +/****添加计算宽度的--运算符直接需要space****/ +/****** common color(常用颜色,可用于普遍场景) *****/ +/**** custom color(自定义颜色,用于特定场景) ****/ +.bi-combine-chart .bi-linkage-list { + background-color: #ffffff; + border: 1px solid #eaeaea; + z-index: 1000000000; +} +.bi-combine-chart .bi-linkage-list .bi-linkage-list-item:hover { + background-color: #f4f4f4; +} /****添加计算宽度的--运算符直接需要space****/ /****** common color(常用颜色,可用于普遍场景) *****/ /**** custom color(自定义颜色,用于特定场景) ****/ @@ -41,6 +73,26 @@ /****添加计算宽度的--运算符直接需要space****/ /****** common color(常用颜色,可用于普遍场景) *****/ /**** custom color(自定义颜色,用于特定场景) ****/ +.bi-bubble-popup-view { + -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); + -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); + box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); +} +.bi-bubble-popup-view .bubble-popup-line { + background-color: #009de3; +} +/****添加计算宽度的--运算符直接需要space****/ +/****** common color(常用颜色,可用于普遍场景) *****/ +/**** custom color(自定义颜色,用于特定场景) ****/ +/************hing light*****************/ +.bi-z-index-mask { + background-color: #1a1a1a; + opacity: 0.5; + filter: alpha(opacity=50); +} +/****添加计算宽度的--运算符直接需要space****/ +/****** common color(常用颜色,可用于普遍场景) *****/ +/**** custom color(自定义颜色,用于特定场景) ****/ /* BASICS */ .CodeMirror { /* Set height, width, borders, and global font properties here */ @@ -586,62 +638,65 @@ li.CodeMirror-hint-active { /****添加计算宽度的--运算符直接需要space****/ /****** common color(常用颜色,可用于普遍场景) *****/ /**** custom color(自定义颜色,用于特定场景) ****/ -.bi-all-pager .pager-editor { - background-color: #ffffff; +.bi-login-timeout-center .input-wrapper { + border-bottom: 1px solid #eaeaea; } -.bi-all-pager .all-pager-prev { +.bi-login-timeout-center .input-wrapper .login-input { font-size: 16px; - background: #f4f4f4; } -.bi-all-pager .all-pager-next { +.bi-login-timeout-center .input-wrapper .error-mask { + background: #1a1a1a; + opacity: 0.25; + filter: alpha(opacity=25); + color: #ffffff; font-size: 16px; - background: #f4f4f4; } -/****添加计算宽度的--运算符直接需要space****/ -/****** common color(常用颜色,可用于普遍场景) *****/ -/**** custom color(自定义颜色,用于特定场景) ****/ -.bi-pager .page-item { - border: 1px solid #d4dadd; - -webkit-border-radius: 2px; - -moz-border-radius: 2px; - border-radius: 2px; -} -.bi-pager .page-item.active { +.bi-login-timeout-center .login-button { background: #009de3; + -webkit-border-radius: 25px; + -moz-border-radius: 25px; + border-radius: 25px; + font-size: 22px; color: #ffffff; } +.bi-login-timeout-center .login-button:hover { + opacity: 0.8; + filter: alpha(opacity=80); +} +.bi-login-timeout-south .keep-state { + font-size: 14px; + color: #808080; +} /****添加计算宽度的--运算符直接需要space****/ /****** common color(常用颜色,可用于普遍场景) *****/ /**** custom color(自定义颜色,用于特定场景) ****/ -.bi-direction-pager .direction-pager-prev { +.bi-all-count-pager .all-pager-prev { font-size: 16px; - background: #f4f4f4; } -.bi-direction-pager .direction-pager-next { +.bi-all-count-pager .all-pager-next { font-size: 16px; - background: #f4f4f4; } /****添加计算宽度的--运算符直接需要space****/ /****** common color(常用颜色,可用于普遍场景) *****/ /**** custom color(自定义颜色,用于特定场景) ****/ -.bi-number-pager .number-pager-prev { - font-size: 16px; - background: #f4f4f4; +.bi-pager .page-item { + border: 1px solid #d4dadd; + -webkit-border-radius: 2px; + -moz-border-radius: 2px; + border-radius: 2px; } -.bi-number-pager .number-pager-next { - font-size: 16px; - background: #f4f4f4; +.bi-pager .page-item.active { + background: #009de3; + color: #ffffff; } /****添加计算宽度的--运算符直接需要space****/ /****** common color(常用颜色,可用于普遍场景) *****/ /**** custom color(自定义颜色,用于特定场景) ****/ -.bi-skip-pager .skip-pager-prev { +.bi-direction-pager .direction-pager-prev { font-size: 16px; - background: #f4f4f4; } -.bi-skip-pager .skip-pager-next { +.bi-direction-pager .direction-pager-next { font-size: 16px; - background: #f4f4f4; } /****添加计算宽度的--运算符直接需要space****/ /****** common color(常用颜色,可用于普遍场景) *****/ @@ -652,10 +707,16 @@ li.CodeMirror-hint-active { filter: alpha(opacity=80); } .bi-request-loading .loading-comment { - font-size: 14px; + font-size: 20px; + color: #808080; } .bi-request-loading .load-fail-comment { - font-size: 14px; + font-size: 20px; + color: #808080; +} +.bi-request-loading .load-timeout-warning { + font-size: 16px; + color: #e85050; } /****添加计算宽度的--运算符直接需要space****/ /****** common color(常用颜色,可用于普遍场景) *****/ @@ -857,22 +918,14 @@ li.CodeMirror-hint-active { /****添加计算宽度的--运算符直接需要space****/ /****** common color(常用颜色,可用于普遍场景) *****/ /**** custom color(自定义颜色,用于特定场景) ****/ -.bi-state-editor { - font-size: 12px; -} .bi-state-editor .state-editor-infinite-text { - font-size: 12px; - color: #1a1a1a; + color: #cccccc; } /****添加计算宽度的--运算符直接需要space****/ /****** common color(常用颜色,可用于普遍场景) *****/ /**** custom color(自定义颜色,用于特定场景) ****/ -.bi-simple-state-editor { - font-size: 12px; -} .bi-simple-state-editor .state-editor-infinite-text { - font-size: 12px; - color: #1a1a1a; + color: #cccccc; } /****添加计算宽度的--运算符直接需要space****/ /****** common color(常用颜色,可用于普遍场景) *****/ @@ -930,7 +983,7 @@ li.CodeMirror-hint-active { text-overflow: ellipsis; overflow-x: hidden; white-space: nowrap; - word-break: break-word; + word-break: break-all; } /****添加计算宽度的--运算符直接需要space****/ /****** common color(常用颜色,可用于普遍场景) *****/ @@ -1271,1487 +1324,6 @@ li.CodeMirror-hint-active { overflow: hidden; background: url(${servletURL}?op=resource&resource=/com/fr/bi/web/css/base/third/farbtastic/marker.png) no-repeat; } -/* -== malihu jquery custom scrollbar plugin == -Plugin URI: http://manos.malihu.gr/jquery-custom-content-scroller -*/ -/* -CONTENTS: - 1. BASIC STYLE - Plugin's basic/essential CSS properties (normally, should not be edited). - 2. VERTICAL SCROLLBAR - Positioning and dimensions of vertical scrollbar. - 3. HORIZONTAL SCROLLBAR - Positioning and dimensions of horizontal scrollbar. - 4. VERTICAL AND HORIZONTAL SCROLLBARS - Positioning and dimensions of 2-axis scrollbars. - 5. TRANSITIONS - CSS3 transitions for hover events, auto-expanded and auto-hidden scrollbars. - 6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS - 6.1 THEMES - Scrollbar colors, opacity, dimensions, backgrounds etc. via ready-to-use themes. -*/ -/* ------------------------------------------------------------------------------------------------------------------------- -1. BASIC STYLE ------------------------------------------------------------------------------------------------------------------------- -*/ -/****添加计算宽度的--运算符直接需要space****/ -/****** common color(常用颜色,可用于普遍场景) *****/ -/**** custom color(自定义颜色,用于特定场景) ****/ -.mCustomScrollbar { - -ms-touch-action: pinch-zoom; - touch-action: pinch-zoom; - /* direct pointer events to js */ -} -.mCustomScrollbar.mCS_no_scrollbar, -.mCustomScrollbar.mCS_touch_action { - -ms-touch-action: auto; - touch-action: auto; -} -.mCustomScrollBox { - /* contains plugin's markup */ - position: relative; - overflow: hidden; - height: 100%; - max-width: 100%; - outline: none; - direction: ltr; -} -.mCSB_container { - /* contains the original content */ - overflow: hidden; - width: auto; - height: auto; -} -/* ------------------------------------------------------------------------------------------------------------------------- -2. VERTICAL SCROLLBAR -y-axis ------------------------------------------------------------------------------------------------------------------------- -*/ -.mCSB_inside > .mCSB_container { - margin-right: 30px; -} -.mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden { - margin-right: 0; -} -/* non-visible scrollbar */ -.mCS-dir-rtl > .mCSB_inside > .mCSB_container { - /* RTL direction/left-side scrollbar */ - margin-right: 0; - margin-left: 30px; -} -.mCS-dir-rtl > .mCSB_inside > .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden { - margin-left: 0; -} -/* RTL direction/left-side scrollbar */ -.mCSB_scrollTools { - /* contains scrollbar markup (draggable element, dragger rail, buttons etc.) */ - position: absolute; - width: 16px; - height: auto; - left: auto; - top: 0; - right: 0; - bottom: 0; -} -.mCSB_outside + .mCSB_scrollTools { - right: -26px; -} -/* scrollbar position: outside */ -.mCS-dir-rtl > .mCSB_inside > .mCSB_scrollTools, -.mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools { - /* RTL direction/left-side scrollbar */ - right: auto; - left: 0; -} -.mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools { - left: -26px; -} -/* RTL direction/left-side scrollbar (scrollbar position: outside) */ -.mCSB_scrollTools .mCSB_draggerContainer { - /* contains the draggable element and dragger rail markup */ - position: absolute; - top: 0; - left: 0; - bottom: 0; - right: 0; - height: auto; -} -.mCSB_scrollTools a + .mCSB_draggerContainer { - margin: 20px 0; -} -.mCSB_scrollTools .mCSB_draggerRail { - width: 2px; - height: 100%; - margin: 0 auto; - -webkit-border-radius: 16px; - -moz-border-radius: 16px; - border-radius: 16px; -} -.mCSB_scrollTools .mCSB_dragger { - /* the draggable element */ - cursor: pointer; - width: 100%; - height: 30px; - /* minimum dragger height */ - z-index: 1; -} -.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - /* the dragger element */ - position: relative; - width: 4px; - height: 100%; - margin: 0 auto; - -webkit-border-radius: 16px; - -moz-border-radius: 16px; - border-radius: 16px; - text-align: center; -} -.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, -.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar { - width: 12px; - /* auto-expanded scrollbar */ -} -.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, -.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { - width: 8px; - /* auto-expanded scrollbar */ -} -.mCSB_scrollTools .mCSB_buttonUp, -.mCSB_scrollTools .mCSB_buttonDown { - display: block; - position: absolute; - height: 20px; - width: 100%; - overflow: hidden; - margin: 0 auto; - cursor: pointer; -} -.mCSB_scrollTools .mCSB_buttonDown { - bottom: 0; -} -/* ------------------------------------------------------------------------------------------------------------------------- -3. HORIZONTAL SCROLLBAR -x-axis ------------------------------------------------------------------------------------------------------------------------- -*/ -.mCSB_horizontal.mCSB_inside > .mCSB_container { - margin-right: 0; - margin-bottom: 30px; -} -.mCSB_horizontal.mCSB_outside > .mCSB_container { - min-height: 100%; -} -.mCSB_horizontal > .mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden { - margin-bottom: 0; -} -/* non-visible scrollbar */ -.mCSB_scrollTools.mCSB_scrollTools_horizontal { - width: auto; - height: 16px; - top: auto; - right: 0; - bottom: 0; - left: 0; -} -.mCustomScrollBox + .mCSB_scrollTools.mCSB_scrollTools_horizontal, -.mCustomScrollBox + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal { - bottom: -26px; -} -/* scrollbar position: outside */ -.mCSB_scrollTools.mCSB_scrollTools_horizontal a + .mCSB_draggerContainer { - margin: 0 20px; -} -.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail { - width: 100%; - height: 2px; - margin: 7px 0; -} -.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger { - width: 30px; - /* minimum dragger width */ - height: 100%; - left: 0; -} -.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { - width: 100%; - height: 4px; - margin: 6px auto; -} -.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, -.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar { - height: 12px; - /* auto-expanded scrollbar */ - margin: 2px auto; -} -.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, -.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { - height: 8px; - /* auto-expanded scrollbar */ - margin: 4px 0; -} -.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft, -.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight { - display: block; - position: absolute; - width: 20px; - height: 100%; - overflow: hidden; - margin: 0 auto; - cursor: pointer; -} -.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft { - left: 0; -} -.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight { - right: 0; -} -/* ------------------------------------------------------------------------------------------------------------------------- -4. VERTICAL AND HORIZONTAL SCROLLBARS -yx-axis ------------------------------------------------------------------------------------------------------------------------- -*/ -.mCSB_container_wrapper { - position: absolute; - height: auto; - width: auto; - overflow: hidden; - top: 0; - left: 0; - right: 0; - bottom: 0; - margin-right: 30px; - margin-bottom: 30px; -} -.mCSB_container_wrapper > .mCSB_container { - padding-right: 30px; - padding-bottom: 30px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; -} -.mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_vertical { - bottom: 20px; -} -.mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_horizontal { - right: 20px; -} -/* non-visible horizontal scrollbar */ -.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden + .mCSB_scrollTools.mCSB_scrollTools_vertical { - bottom: 0; -} -/* non-visible vertical scrollbar/RTL direction/left-side scrollbar */ -.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal, -.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal { - right: 0; -} -/* RTL direction/left-side scrollbar */ -.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal { - left: 20px; -} -/* non-visible scrollbar/RTL direction/left-side scrollbar */ -.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal { - left: 0; -} -.mCS-dir-rtl > .mCSB_inside > .mCSB_container_wrapper { - /* RTL direction/left-side scrollbar */ - margin-right: 0; - margin-left: 30px; -} -.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden > .mCSB_container { - padding-right: 0; -} -.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden > .mCSB_container { - padding-bottom: 0; -} -.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden { - margin-right: 0; - /* non-visible scrollbar */ - margin-left: 0; -} -/* non-visible horizontal scrollbar */ -.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden { - margin-bottom: 0; -} -/* ------------------------------------------------------------------------------------------------------------------------- -5. TRANSITIONS ------------------------------------------------------------------------------------------------------------------------- -*/ -.mCSB_scrollTools, -.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCSB_scrollTools .mCSB_buttonUp, -.mCSB_scrollTools .mCSB_buttonDown, -.mCSB_scrollTools .mCSB_buttonLeft, -.mCSB_scrollTools .mCSB_buttonRight { - -webkit-transition: opacity 0.2s ease-in-out, background-color 0.2s ease-in-out; - -moz-transition: opacity 0.2s ease-in-out, background-color 0.2s ease-in-out; - -o-transition: opacity 0.2s ease-in-out, background-color 0.2s ease-in-out; - transition: opacity 0.2s ease-in-out, background-color 0.2s ease-in-out; -} -.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar, -.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail, -.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar, -.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail { - -webkit-transition: width 0.2s ease-out 0.2s, height 0.2s ease-out 0.2s, margin-left 0.2s ease-out 0.2s, margin-right 0.2s ease-out 0.2s, margin-top 0.2s ease-out 0.2s, margin-bottom 0.2s ease-out 0.2s, opacity 0.2s ease-in-out, background-color 0.2s ease-in-out; - -moz-transition: width 0.2s ease-out 0.2s, height 0.2s ease-out 0.2s, margin-left 0.2s ease-out 0.2s, margin-right 0.2s ease-out 0.2s, margin-top 0.2s ease-out 0.2s, margin-bottom 0.2s ease-out 0.2s, opacity 0.2s ease-in-out, background-color 0.2s ease-in-out; - -o-transition: width 0.2s ease-out 0.2s, height 0.2s ease-out 0.2s, margin-left 0.2s ease-out 0.2s, margin-right 0.2s ease-out 0.2s, margin-top 0.2s ease-out 0.2s, margin-bottom 0.2s ease-out 0.2s, opacity 0.2s ease-in-out, background-color 0.2s ease-in-out; - transition: width 0.2s ease-out 0.2s, height 0.2s ease-out 0.2s, margin-left 0.2s ease-out 0.2s, margin-right 0.2s ease-out 0.2s, margin-top 0.2s ease-out 0.2s, margin-bottom 0.2s ease-out 0.2s, opacity 0.2s ease-in-out, background-color 0.2s ease-in-out; -} -/* ------------------------------------------------------------------------------------------------------------------------- -6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS ------------------------------------------------------------------------------------------------------------------------- -*/ -/* ----------------------------------------- -6.1 THEMES ----------------------------------------- -*/ -/* default theme ("light") */ -.mCSB_scrollTools { - opacity: 0.75; - filter: "alpha(opacity=75)"; - -ms-filter: "alpha(opacity=75)"; -} -.mCS-autoHide > .mCustomScrollBox > .mCSB_scrollTools, -.mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools { - opacity: 0; - filter: "alpha(opacity=0)"; - -ms-filter: "alpha(opacity=0)"; -} -.mCustomScrollbar > .mCustomScrollBox > .mCSB_scrollTools.mCSB_scrollTools_onDrag, -.mCustomScrollbar > .mCustomScrollBox ~ .mCSB_scrollTools.mCSB_scrollTools_onDrag, -.mCustomScrollBox:hover > .mCSB_scrollTools, -.mCustomScrollBox:hover ~ .mCSB_scrollTools, -.mCS-autoHide:hover > .mCustomScrollBox > .mCSB_scrollTools, -.mCS-autoHide:hover > .mCustomScrollBox ~ .mCSB_scrollTools { - opacity: 1; - filter: "alpha(opacity=100)"; - -ms-filter: "alpha(opacity=100)"; -} -.mCSB_scrollTools .mCSB_draggerRail { - background-color: #000; - background-color: rgba(0, 0, 0, 0.4); - filter: "alpha(opacity=40)"; - -ms-filter: "alpha(opacity=40)"; -} -.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.75); - filter: "alpha(opacity=75)"; - -ms-filter: "alpha(opacity=75)"; -} -.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.85); - filter: "alpha(opacity=85)"; - -ms-filter: "alpha(opacity=85)"; -} -.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.9); - filter: "alpha(opacity=90)"; - -ms-filter: "alpha(opacity=90)"; -} -.mCSB_scrollTools .mCSB_buttonUp, -.mCSB_scrollTools .mCSB_buttonDown, -.mCSB_scrollTools .mCSB_buttonLeft, -.mCSB_scrollTools .mCSB_buttonRight { - background-image: url('background/mCSB_buttons.png'); - /* css sprites */ - background-repeat: no-repeat; - opacity: 0.4; - filter: "alpha(opacity=40)"; - -ms-filter: "alpha(opacity=40)"; -} -.mCSB_scrollTools .mCSB_buttonUp { - background-position: 0 0; - /* - sprites locations - light: 0 0, -16px 0, -32px 0, -48px 0, 0 -72px, -16px -72px, -32px -72px - dark: -80px 0, -96px 0, -112px 0, -128px 0, -80px -72px, -96px -72px, -112px -72px - */ -} -.mCSB_scrollTools .mCSB_buttonDown { - background-position: 0 -20px; - /* - sprites locations - light: 0 -20px, -16px -20px, -32px -20px, -48px -20px, 0 -92px, -16px -92px, -32px -92px - dark: -80px -20px, -96px -20px, -112px -20px, -128px -20px, -80px -92px, -96px -92px, -112 -92px - */ -} -.mCSB_scrollTools .mCSB_buttonLeft { - background-position: 0 -40px; - /* - sprites locations - light: 0 -40px, -20px -40px, -40px -40px, -60px -40px, 0 -112px, -20px -112px, -40px -112px - dark: -80px -40px, -100px -40px, -120px -40px, -140px -40px, -80px -112px, -100px -112px, -120px -112px - */ -} -.mCSB_scrollTools .mCSB_buttonRight { - background-position: 0 -56px; - /* - sprites locations - light: 0 -56px, -20px -56px, -40px -56px, -60px -56px, 0 -128px, -20px -128px, -40px -128px - dark: -80px -56px, -100px -56px, -120px -56px, -140px -56px, -80px -128px, -100px -128px, -120px -128px - */ -} -.mCSB_scrollTools .mCSB_buttonUp:hover, -.mCSB_scrollTools .mCSB_buttonDown:hover, -.mCSB_scrollTools .mCSB_buttonLeft:hover, -.mCSB_scrollTools .mCSB_buttonRight:hover { - opacity: 0.75; - filter: "alpha(opacity=75)"; - -ms-filter: "alpha(opacity=75)"; -} -.mCSB_scrollTools .mCSB_buttonUp:active, -.mCSB_scrollTools .mCSB_buttonDown:active, -.mCSB_scrollTools .mCSB_buttonLeft:active, -.mCSB_scrollTools .mCSB_buttonRight:active { - opacity: 0.9; - filter: "alpha(opacity=90)"; - -ms-filter: "alpha(opacity=90)"; -} -/* theme: "dark" */ -.mCS-dark.mCSB_scrollTools .mCSB_draggerRail { - background-color: #000; - background-color: rgba(0, 0, 0, 0.15); -} -.mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.75); -} -.mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { - background-color: rgba(0, 0, 0, 0.85); -} -.mCS-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: rgba(0, 0, 0, 0.9); -} -.mCS-dark.mCSB_scrollTools .mCSB_buttonUp { - background-position: -80px 0; -} -.mCS-dark.mCSB_scrollTools .mCSB_buttonDown { - background-position: -80px -20px; -} -.mCS-dark.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -80px -40px; -} -.mCS-dark.mCSB_scrollTools .mCSB_buttonRight { - background-position: -80px -56px; -} -/* ---------------------------------------- */ -/* theme: "light-2", "dark-2" */ -.mCS-light-2.mCSB_scrollTools .mCSB_draggerRail, -.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail { - width: 4px; - background-color: #fff; - background-color: rgba(255, 255, 255, 0.1); - -webkit-border-radius: 1px; - -moz-border-radius: 1px; - border-radius: 1px; -} -.mCS-light-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - width: 4px; - background-color: #fff; - background-color: rgba(255, 255, 255, 0.75); - -webkit-border-radius: 1px; - -moz-border-radius: 1px; - border-radius: 1px; -} -.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_draggerRail, -.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_draggerRail, -.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { - width: 100%; - height: 4px; - margin: 6px auto; -} -.mCS-light-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.85); -} -.mCS-light-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-light-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.9); -} -.mCS-light-2.mCSB_scrollTools .mCSB_buttonUp { - background-position: -32px 0; -} -.mCS-light-2.mCSB_scrollTools .mCSB_buttonDown { - background-position: -32px -20px; -} -.mCS-light-2.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -40px -40px; -} -.mCS-light-2.mCSB_scrollTools .mCSB_buttonRight { - background-position: -40px -56px; -} -/* theme: "dark-2" */ -.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail { - background-color: #000; - background-color: rgba(0, 0, 0, 0.1); - -webkit-border-radius: 1px; - -moz-border-radius: 1px; - border-radius: 1px; -} -.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.75); - -webkit-border-radius: 1px; - -moz-border-radius: 1px; - border-radius: 1px; -} -.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.85); -} -.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-dark-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.9); -} -.mCS-dark-2.mCSB_scrollTools .mCSB_buttonUp { - background-position: -112px 0; -} -.mCS-dark-2.mCSB_scrollTools .mCSB_buttonDown { - background-position: -112px -20px; -} -.mCS-dark-2.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -120px -40px; -} -.mCS-dark-2.mCSB_scrollTools .mCSB_buttonRight { - background-position: -120px -56px; -} -/* ---------------------------------------- */ -/* theme: "light-thick", "dark-thick" */ -.mCS-light-thick.mCSB_scrollTools .mCSB_draggerRail, -.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail { - width: 4px; - background-color: #fff; - background-color: rgba(255, 255, 255, 0.1); - -webkit-border-radius: 2px; - -moz-border-radius: 2px; - border-radius: 2px; -} -.mCS-light-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - width: 6px; - background-color: #fff; - background-color: rgba(255, 255, 255, 0.75); - -webkit-border-radius: 2px; - -moz-border-radius: 2px; - border-radius: 2px; -} -.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail, -.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail { - width: 100%; - height: 4px; - margin: 6px 0; -} -.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { - width: 100%; - height: 6px; - margin: 5px auto; -} -.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.85); -} -.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-light-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.9); -} -.mCS-light-thick.mCSB_scrollTools .mCSB_buttonUp { - background-position: -16px 0; -} -.mCS-light-thick.mCSB_scrollTools .mCSB_buttonDown { - background-position: -16px -20px; -} -.mCS-light-thick.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -20px -40px; -} -.mCS-light-thick.mCSB_scrollTools .mCSB_buttonRight { - background-position: -20px -56px; -} -/* theme: "dark-thick" */ -.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail { - background-color: #000; - background-color: rgba(0, 0, 0, 0.1); - -webkit-border-radius: 2px; - -moz-border-radius: 2px; - border-radius: 2px; -} -.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.75); - -webkit-border-radius: 2px; - -moz-border-radius: 2px; - border-radius: 2px; -} -.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.85); -} -.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.9); -} -.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonUp { - background-position: -96px 0; -} -.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonDown { - background-position: -96px -20px; -} -.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -100px -40px; -} -.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonRight { - background-position: -100px -56px; -} -/* ---------------------------------------- */ -/* theme: "light-thin", "dark-thin" */ -.mCS-light-thin.mCSB_scrollTools .mCSB_draggerRail { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.1); -} -.mCS-light-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - width: 2px; -} -.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail, -.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail { - width: 100%; -} -.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { - width: 100%; - height: 2px; - margin: 7px auto; -} -/* theme "dark-thin" */ -.mCS-dark-thin.mCSB_scrollTools .mCSB_draggerRail { - background-color: #000; - background-color: rgba(0, 0, 0, 0.15); -} -.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.75); -} -.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.85); -} -.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.9); -} -.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonUp { - background-position: -80px 0; -} -.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonDown { - background-position: -80px -20px; -} -.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -80px -40px; -} -.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonRight { - background-position: -80px -56px; -} -/* ---------------------------------------- */ -/* theme "rounded", "rounded-dark", "rounded-dots", "rounded-dots-dark" */ -.mCS-rounded.mCSB_scrollTools .mCSB_draggerRail { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.15); -} -.mCS-rounded.mCSB_scrollTools .mCSB_dragger, -.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger, -.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger, -.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger { - height: 14px; -} -.mCS-rounded.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - width: 14px; - margin: 0 1px; -} -.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger, -.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger, -.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger, -.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger { - width: 14px; -} -.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { - height: 14px; - margin: 1px 0; -} -.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, -.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar, -.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, -.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar { - width: 16px; - /* auto-expanded scrollbar */ - height: 16px; - margin: -1px 0; -} -.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, -.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, -.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, -.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { - width: 4px; - /* auto-expanded scrollbar */ -} -.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, -.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar, -.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, -.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar { - height: 16px; - /* auto-expanded scrollbar */ - width: 16px; - margin: 0 -1px; -} -.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, -.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, -.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, -.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { - height: 4px; - /* auto-expanded scrollbar */ - margin: 6px 0; -} -.mCS-rounded.mCSB_scrollTools .mCSB_buttonUp { - background-position: 0 -72px; -} -.mCS-rounded.mCSB_scrollTools .mCSB_buttonDown { - background-position: 0 -92px; -} -.mCS-rounded.mCSB_scrollTools .mCSB_buttonLeft { - background-position: 0 -112px; -} -.mCS-rounded.mCSB_scrollTools .mCSB_buttonRight { - background-position: 0 -128px; -} -/* theme "rounded-dark", "rounded-dots-dark" */ -.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.75); -} -.mCS-rounded-dark.mCSB_scrollTools .mCSB_draggerRail { - background-color: #000; - background-color: rgba(0, 0, 0, 0.15); -} -.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, -.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.85); -} -.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, -.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.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); -} -.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonUp { - background-position: -80px -72px; -} -.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonDown { - background-position: -80px -92px; -} -.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -80px -112px; -} -.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonRight { - background-position: -80px -128px; -} -/* theme "rounded-dots", "rounded-dots-dark" */ -.mCS-rounded-dots.mCSB_scrollTools_vertical .mCSB_draggerRail, -.mCS-rounded-dots-dark.mCSB_scrollTools_vertical .mCSB_draggerRail { - width: 4px; -} -.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail, -.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail, -.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail, -.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail { - background-color: transparent; - background-position: center; -} -.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail, -.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail { - background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAANElEQVQYV2NkIAAYiVbw//9/Y6DiM1ANJoyMjGdBbLgJQAX/kU0DKgDLkaQAvxW4HEvQFwCRcxIJK1XznAAAAABJRU5ErkJggg=="); - background-repeat: repeat-y; - opacity: 0.3; - filter: "alpha(opacity=30)"; - -ms-filter: "alpha(opacity=30)"; -} -.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail, -.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail { - height: 4px; - margin: 6px 0; - background-repeat: repeat-x; -} -.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonUp { - background-position: -16px -72px; -} -.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonDown { - background-position: -16px -92px; -} -.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -20px -112px; -} -.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonRight { - background-position: -20px -128px; -} -/* theme "rounded-dots-dark" */ -.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail { - background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYV2NkIAAYSVFgDFR8BqrBBEifBbGRTfiPZhpYjiQFBK3A6l6CvgAAE9kGCd1mvgEAAAAASUVORK5CYII="); -} -.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonUp { - background-position: -96px -72px; -} -.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonDown { - background-position: -96px -92px; -} -.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -100px -112px; -} -.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonRight { - background-position: -100px -128px; -} -/* ---------------------------------------- */ -/* theme "3d", "3d-dark", "3d-thick", "3d-thick-dark" */ -.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-repeat: repeat-y; - background-image: -moz-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); - 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))); - background-image: -webkit-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); - background-image: -o-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); - background-image: -ms-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); - background-image: linear-gradient(to right, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); -} -.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { - background-repeat: repeat-x; - background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); - 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))); - background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); - background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); - background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); - background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); -} -/* theme "3d", "3d-dark" */ -.mCS-3d.mCSB_scrollTools_vertical .mCSB_dragger, -.mCS-3d-dark.mCSB_scrollTools_vertical .mCSB_dragger { - height: 70px; -} -.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger, -.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger { - width: 70px; -} -.mCS-3d.mCSB_scrollTools, -.mCS-3d-dark.mCSB_scrollTools { - opacity: 1; - filter: "alpha(opacity=30)"; - -ms-filter: "alpha(opacity=30)"; -} -.mCS-3d.mCSB_scrollTools .mCSB_draggerRail, -.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail, -.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - -webkit-border-radius: 16px; - -moz-border-radius: 16px; - border-radius: 16px; -} -.mCS-3d.mCSB_scrollTools .mCSB_draggerRail, -.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail { - width: 8px; - background-color: #000; - background-color: rgba(0, 0, 0, 0.2); - box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.5), inset -1px 0 1px rgba(255, 255, 255, 0.2); -} -.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, -.mCS-3d.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-3d.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, -.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, -.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: #555; -} -.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - width: 8px; -} -.mCS-3d.mCSB_scrollTools_horizontal .mCSB_draggerRail, -.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail { - width: 100%; - height: 8px; - margin: 4px 0; - box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.5), inset 0 -1px 1px rgba(255, 255, 255, 0.2); -} -.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { - width: 100%; - height: 8px; - margin: 4px auto; -} -.mCS-3d.mCSB_scrollTools .mCSB_buttonUp { - background-position: -32px -72px; -} -.mCS-3d.mCSB_scrollTools .mCSB_buttonDown { - background-position: -32px -92px; -} -.mCS-3d.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -40px -112px; -} -.mCS-3d.mCSB_scrollTools .mCSB_buttonRight { - background-position: -40px -128px; -} -/* theme "3d-dark" */ -.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail { - background-color: #000; - background-color: rgba(0, 0, 0, 0.1); - box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1); -} -.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail { - box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1); -} -.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonUp { - background-position: -112px -72px; -} -.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonDown { - background-position: -112px -92px; -} -.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -120px -112px; -} -.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonRight { - background-position: -120px -128px; -} -/* ---------------------------------------- */ -/* theme: "3d-thick", "3d-thick-dark" */ -.mCS-3d-thick.mCSB_scrollTools, -.mCS-3d-thick-dark.mCSB_scrollTools { - opacity: 1; - filter: "alpha(opacity=30)"; - -ms-filter: "alpha(opacity=30)"; -} -.mCS-3d-thick.mCSB_scrollTools, -.mCS-3d-thick-dark.mCSB_scrollTools, -.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer, -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer { - -webkit-border-radius: 7px; - -moz-border-radius: 7px; - border-radius: 7px; -} -.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - -webkit-border-radius: 5px; - -moz-border-radius: 5px; - border-radius: 5px; -} -.mCSB_inside + .mCS-3d-thick.mCSB_scrollTools_vertical, -.mCSB_inside + .mCS-3d-thick-dark.mCSB_scrollTools_vertical { - right: 1px; -} -.mCS-3d-thick.mCSB_scrollTools_vertical, -.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); -} -.mCS-3d-thick.mCSB_scrollTools_horizontal, -.mCS-3d-thick-dark.mCSB_scrollTools_horizontal { - bottom: 1px; - box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.5); -} -.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.4); - width: 12px; - margin: 2px; - position: absolute; - height: auto; - top: 0; - bottom: 0; - left: 0; - right: 0; -} -.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4); -} -.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, -.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: #555; -} -.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { - height: 12px; - width: auto; -} -.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer { - background-color: #000; - background-color: rgba(0, 0, 0, 0.05); - box-shadow: inset 1px 1px 16px rgba(0, 0, 0, 0.1); -} -.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerRail { - background-color: transparent; -} -.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonUp { - background-position: -32px -72px; -} -.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonDown { - background-position: -32px -92px; -} -.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -40px -112px; -} -.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonRight { - background-position: -40px -128px; -} -/* theme: "3d-thick-dark" */ -.mCS-3d-thick-dark.mCSB_scrollTools { - box-shadow: inset 0 0 14px rgba(0, 0, 0, 0.2); -} -.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); -} -.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); -} -.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); -} -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: #777; -} -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer { - background-color: #fff; - background-color: rgba(0, 0, 0, 0.05); - box-shadow: inset 1px 1px 16px rgba(0, 0, 0, 0.1); -} -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerRail { - background-color: transparent; -} -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonUp { - background-position: -112px -72px; -} -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonDown { - background-position: -112px -92px; -} -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -120px -112px; -} -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonRight { - background-position: -120px -128px; -} -/* ---------------------------------------- */ -/* theme: "minimal", "minimal-dark" */ -.mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical, -.mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical { - right: 0; - margin: 12px 0; -} -.mCustomScrollBox.mCS-minimal + .mCSB_scrollTools.mCSB_scrollTools_horizontal, -.mCustomScrollBox.mCS-minimal + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal, -.mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools.mCSB_scrollTools_horizontal, -.mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal { - bottom: 0; - margin: 0 12px; -} -/* RTL direction/left-side scrollbar */ -.mCS-dir-rtl > .mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical, -.mCS-dir-rtl > .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical { - left: 0; - right: auto; -} -.mCS-minimal.mCSB_scrollTools .mCSB_draggerRail, -.mCS-minimal-dark.mCSB_scrollTools .mCSB_draggerRail { - background-color: transparent; -} -.mCS-minimal.mCSB_scrollTools_vertical .mCSB_dragger, -.mCS-minimal-dark.mCSB_scrollTools_vertical .mCSB_dragger { - height: 50px; -} -.mCS-minimal.mCSB_scrollTools_horizontal .mCSB_dragger, -.mCS-minimal-dark.mCSB_scrollTools_horizontal .mCSB_dragger { - width: 50px; -} -.mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.2); - filter: "alpha(opacity=20)"; - -ms-filter: "alpha(opacity=20)"; -} -.mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-minimal.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.5); - filter: "alpha(opacity=50)"; - -ms-filter: "alpha(opacity=50)"; -} -/* theme: "minimal-dark" */ -.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.2); - filter: "alpha(opacity=20)"; - -ms-filter: "alpha(opacity=20)"; -} -.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.5); - filter: "alpha(opacity=50)"; - -ms-filter: "alpha(opacity=50)"; -} -/* ---------------------------------------- */ -/* theme "light-3", "dark-3" */ -.mCS-light-3.mCSB_scrollTools .mCSB_draggerRail, -.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail { - width: 6px; - background-color: #000; - background-color: rgba(0, 0, 0, 0.2); -} -.mCS-light-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - width: 6px; -} -.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_draggerRail, -.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_draggerRail { - width: 100%; - height: 6px; - margin: 5px 0; -} -.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, -.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, -.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, -.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { - width: 12px; -} -.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, -.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, -.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, -.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { - height: 12px; - margin: 2px 0; -} -.mCS-light-3.mCSB_scrollTools .mCSB_buttonUp { - background-position: -32px -72px; -} -.mCS-light-3.mCSB_scrollTools .mCSB_buttonDown { - background-position: -32px -92px; -} -.mCS-light-3.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -40px -112px; -} -.mCS-light-3.mCSB_scrollTools .mCSB_buttonRight { - background-position: -40px -128px; -} -/* theme "dark-3" */ -.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.75); -} -.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.85); -} -.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-dark-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.9); -} -.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail { - background-color: #000; - background-color: rgba(0, 0, 0, 0.1); -} -.mCS-dark-3.mCSB_scrollTools .mCSB_buttonUp { - background-position: -112px -72px; -} -.mCS-dark-3.mCSB_scrollTools .mCSB_buttonDown { - background-position: -112px -92px; -} -.mCS-dark-3.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -120px -112px; -} -.mCS-dark-3.mCSB_scrollTools .mCSB_buttonRight { - background-position: -120px -128px; -} -/* ---------------------------------------- */ -/* theme "inset", "inset-dark", "inset-2", "inset-2-dark", "inset-3", "inset-3-dark" */ -.mCS-inset.mCSB_scrollTools .mCSB_draggerRail, -.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail, -.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail, -.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail, -.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail, -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail { - width: 12px; - background-color: #000; - background-color: rgba(0, 0, 0, 0.2); -} -.mCS-inset.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-inset-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - width: 6px; - margin: 3px 5px; - position: absolute; - height: auto; - top: 0; - bottom: 0; - left: 0; - right: 0; -} -.mCS-inset.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { - height: 6px; - margin: 5px 3px; - position: absolute; - width: auto; - top: 0; - bottom: 0; - left: 0; - right: 0; -} -.mCS-inset.mCSB_scrollTools_horizontal .mCSB_draggerRail, -.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail, -.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_draggerRail, -.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail, -.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_draggerRail, -.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail { - width: 100%; - height: 12px; - margin: 2px 0; -} -.mCS-inset.mCSB_scrollTools .mCSB_buttonUp, -.mCS-inset-2.mCSB_scrollTools .mCSB_buttonUp, -.mCS-inset-3.mCSB_scrollTools .mCSB_buttonUp { - background-position: -32px -72px; -} -.mCS-inset.mCSB_scrollTools .mCSB_buttonDown, -.mCS-inset-2.mCSB_scrollTools .mCSB_buttonDown, -.mCS-inset-3.mCSB_scrollTools .mCSB_buttonDown { - background-position: -32px -92px; -} -.mCS-inset.mCSB_scrollTools .mCSB_buttonLeft, -.mCS-inset-2.mCSB_scrollTools .mCSB_buttonLeft, -.mCS-inset-3.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -40px -112px; -} -.mCS-inset.mCSB_scrollTools .mCSB_buttonRight, -.mCS-inset-2.mCSB_scrollTools .mCSB_buttonRight, -.mCS-inset-3.mCSB_scrollTools .mCSB_buttonRight { - background-position: -40px -128px; -} -/* theme "inset-dark", "inset-2-dark", "inset-3-dark" */ -.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.75); -} -.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, -.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.85); -} -.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, -.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.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); -} -.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail, -.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail, -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail { - background-color: #000; - background-color: rgba(0, 0, 0, 0.1); -} -.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonUp, -.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonUp, -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonUp { - background-position: -112px -72px; -} -.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonDown, -.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonDown, -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonDown { - background-position: -112px -92px; -} -.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonLeft, -.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonLeft, -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -120px -112px; -} -.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonRight, -.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonRight, -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonRight { - background-position: -120px -128px; -} -/* theme "inset-2", "inset-2-dark" */ -.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail, -.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail { - background-color: transparent; - border-width: 1px; - border-style: solid; - border-color: #fff; - border-color: rgba(255, 255, 255, 0.2); - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; -} -.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail { - border-color: #000; - border-color: rgba(0, 0, 0, 0.2); -} -/* theme "inset-3", "inset-3-dark" */ -.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.6); -} -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail { - background-color: #000; - background-color: rgba(0, 0, 0, 0.6); -} -.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.75); -} -.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.85); -} -.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-inset-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.9); -} -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.75); -} -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.85); -} -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.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); -} -/* ---------------------------------------- */ -/* theme "bi-default" */ -.mCS-bi-default { - background-color: #dddddd; -} -.mCS-bi-default .mCSB_scrollTools.mCSB_scrollTools_horizontal { - height: 18px; -} -.mCS-bi-default .mCSB_scrollTools.mCSB_scrollTools_vertical { - width: 18px; -} -.mCS-bi-default .mCSB_scrollTools .mCSB_draggerRail { - border-radius: 0px; -} -.mCS-bi-default .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - border-radius: 2px; -} -.mCS-bi-default .mCSB_scrollTools.mCSB_scrollTools_horizontal a + .mCSB_draggerContainer { - margin: 0 18px; -} -.mCS-bi-default .mCSB_scrollTools.mCSB_scrollTools_vertical a + .mCSB_draggerContainer { - margin: 18px 0; -} -.mCS-bi-default.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - width: 14px; - margin: 0 2px; -} -.mCS-bi-default.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { - width: 100%; - height: 14px; - margin: 2px auto; -} -.mCS-bi-default.mCSB_scrollTools .mCSB_draggerRail { - width: 18px; - height: 100%; - margin: 0; -} -.mCS-bi-default.mCSB_scrollTools_horizontal .mCSB_draggerRail { - width: 100%; - height: 18px; - margin: 0; -} -.mCS-bi-default.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, -.mCS-bi-default.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { - width: 14px; -} -.mCS-bi-default.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, -.mCS-bi-default.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { - height: 14px; - margin: 2px 0; -} -.mCS-bi-default.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-color: #f4f4f4; -} -.mCS-bi-default.mCSB_scrollTools .mCSB_draggerRail { - background-color: #dddddd; -} -.mCS-bi-default.mCSB_scrollTools .mCSB_buttonUp, -.mCS-bi-default.mCSB_scrollTools .mCSB_buttonDown, -.mCS-bi-default.mCSB_scrollTools .mCSB_buttonLeft, -.mCS-bi-default.mCSB_scrollTools .mCSB_buttonRight { - width: 16px; - height: 16px; - background-color: #f4f4f4; - border: 1px solid #eaeaea; - opacity: 1; - filter: alpha(opacity=100); -} -.mCS-bi-default.mCSB_scrollTools .mCSB_buttonUp { - background-position: -128px -1px; -} -.mCS-bi-default.mCSB_scrollTools .mCSB_buttonDown { - background-position: -128px -21px; -} -.mCS-bi-default.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -142px -40px; -} -.mCS-bi-default.mCSB_scrollTools .mCSB_buttonRight { - background-position: -141px -56px; -} -/* ---------------------------------------- */ /* required styles */ .leaflet-pane, .leaflet-tile, @@ -3255,13 +1827,10 @@ website: http://code.google.com/p/jquerytree/ .ztree * { padding: 0; margin: 0; - font-size: 12px; - font-family: Verdana, Arial, Helvetica, AppleGothic, sans-serif; } .ztree { margin: 0; padding: 5px; - color: #333333; } .ztree li { padding: 0; @@ -3277,14 +1846,13 @@ website: http://code.google.com/p/jquerytree/ padding: 0 0 0 18px; } .ztree li ul.line { - background: url(icon/tree-vertical-line-1.png) 0 0 repeat-y; + background: url(${servletURL}?op=resource&resource=/com/fr/bi/web/images/icon/tree-vertical-line-1.png) 0 0 repeat-y; } .ztree li a { padding: 1px 3px 0 0; margin: 0; cursor: pointer; height: 24px; - color: #333; background-color: transparent; text-decoration: none; vertical-align: top; @@ -3343,31 +1911,31 @@ website: http://code.google.com/p/jquerytree/ cursor: auto; } .ztree li span.button.chk.checkbox_false_full { - background-image: url("icon/check-box-normal.png"); + background-image: url("${servletURL}?op=resource&resource=/com/fr/bi/web/images/icon/check-box-normal.png"); } .ztree li span.button.chk.checkbox_false_full_focus { - background-image: url("icon/check-box-normal.png"); + background-image: url("${servletURL}?op=resource&resource=/com/fr/bi/web/images/icon/check-box-normal.png"); } .ztree li span.button.chk.checkbox_false_part { - background-image: url("icon/half_selected.png"); + background-image: url("${servletURL}?op=resource&resource=/com/fr/bi/web/images/icon/half_selected.png"); } .ztree li span.button.chk.checkbox_false_part_focus { - background-image: url("icon/half_selected.png"); + background-image: url("${servletURL}?op=resource&resource=/com/fr/bi/web/images/icon/half_selected.png"); } .ztree li span.button.chk.checkbox_false_disable { background-position: 0 -56px; } .ztree li span.button.chk.checkbox_true_full { - background-image: url("icon/check-box-active.png"); + background-image: url("${servletURL}?op=resource&resource=/com/fr/bi/web/images/icon/check-box-active.png"); } .ztree li span.button.chk.checkbox_true_full_focus { - background-image: url("icon/check-box-active.png"); + background-image: url("${servletURL}?op=resource&resource=/com/fr/bi/web/images/icon/check-box-active.png"); } .ztree li span.button.chk.checkbox_true_part { - background-image: url("icon/half_selected.png"); + background-image: url("${servletURL}?op=resource&resource=/com/fr/bi/web/images/icon/half_selected.png"); } .ztree li span.button.chk.checkbox_true_part_focus { - background-image: url("icon/half_selected.png"); + background-image: url("${servletURL}?op=resource&resource=/com/fr/bi/web/images/icon/half_selected.png"); } .ztree li span.button.chk.checkbox_true_disable { background-position: -14px -56px; @@ -3407,28 +1975,28 @@ website: http://code.google.com/p/jquerytree/ height: 25px; } .ztree li span.button.root_open { - background-image: url("icon/tree-expand-1.png"); + background-image: url("${servletURL}?op=resource&resource=/com/fr/bi/web/images/icon/tree-expand-1.png"); } .ztree li span.button.root_close { - background-image: url("icon/tree-collapse-1.png"); + background-image: url("${servletURL}?op=resource&resource=/com/fr/bi/web/images/icon/tree-collapse-1.png"); } .ztree li span.button.roots_open { - background-image: url("icon/tree-expand-2.png"); + background-image: url("${servletURL}?op=resource&resource=/com/fr/bi/web/images/icon/tree-expand-2.png"); } .ztree li span.button.roots_close { - background-image: url("icon/tree-collapse-2.png"); + background-image: url("${servletURL}?op=resource&resource=/com/fr/bi/web/images/icon/tree-collapse-2.png"); } .ztree li span.button.center_open { - background-image: url("icon/tree-expand-3.png"); + background-image: url("${servletURL}?op=resource&resource=/com/fr/bi/web/images/icon/tree-expand-3.png"); } .ztree li span.button.center_close { - background-image: url("icon/tree-collapse-3.png"); + background-image: url("${servletURL}?op=resource&resource=/com/fr/bi/web/images/icon/tree-collapse-3.png"); } .ztree li span.button.bottom_open { - background-image: url("icon/tree-expand-4.png"); + background-image: url("${servletURL}?op=resource&resource=/com/fr/bi/web/images/icon/tree-expand-4.png"); } .ztree li span.button.bottom_close { - background-image: url("icon/tree-collapse-4.png"); + background-image: url("${servletURL}?op=resource&resource=/com/fr/bi/web/images/icon/tree-collapse-4.png"); } .ztree li span.button.noline_open { background-position: -92px -72px; @@ -3440,13 +2008,13 @@ website: http://code.google.com/p/jquerytree/ background: none; } .ztree li span.button.roots_docu { - background-image: url("icon/tree-vertical-line-2.png"); + background-image: url("${servletURL}?op=resource&resource=/com/fr/bi/web/images/icon/tree-vertical-line-2.png"); } .ztree li span.button.center_docu { - background-image: url("icon/tree-vertical-line-3.png"); + background-image: url("${servletURL}?op=resource&resource=/com/fr/bi/web/images/icon/tree-vertical-line-3.png"); } .ztree li span.button.bottom_docu { - background-image: url("icon/tree-vertical-line-4.png"); + background-image: url("${servletURL}?op=resource&resource=/com/fr/bi/web/images/icon/tree-vertical-line-4.png"); } .ztree li span.button.noline_docu { background: none; @@ -3538,6 +2106,40 @@ ul.ztree.zTreeDragUL { /****添加计算宽度的--运算符直接需要space****/ /****** common color(常用颜色,可用于普遍场景) *****/ /**** custom color(自定义颜色,用于特定场景) ****/ +.bi-timeout-toast { + font-size: 14px; + -webkit-border-radius: 2px; + -moz-border-radius: 2px; + border-radius: 2px; + background: #fddddd; + color: #e85050; +} +.bi-timeout-toast .cancel-button { + background: #ffffff; + border: 1px solid #d4dadd; + color: #1a1a1a; + -webkit-border-radius: 2px; + -moz-border-radius: 2px; + border-radius: 2px; +} +.bi-timeout-toast .cancel-button:hover { + opacity: 0.8; + filter: alpha(opacity=80); +} +.bi-timeout-toast .retry-button { + background: #009de3; + -webkit-border-radius: 2px; + -moz-border-radius: 2px; + border-radius: 2px; + color: #ffffff; +} +.bi-timeout-toast .retry-button:hover { + opacity: 0.8; + filter: alpha(opacity=80); +} +/****添加计算宽度的--运算符直接需要space****/ +/****** common color(常用颜色,可用于普遍场景) *****/ +/**** custom color(自定义颜色,用于特定场景) ****/ .bi-branch-tree .bi-branch-tree-view { min-width: 300px; } @@ -3637,6 +2239,7 @@ ul.ztree.zTreeDragUL { -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; + color: #1a1a1a; background: #ffffff; } .bi-list-view .list-view-toolbar { @@ -3668,6 +2271,312 @@ ul.ztree.zTreeDragUL { .bi-scroll-view .scroll-drop-down-icon:active { background: #d4dadd; } +.bi-flex-center-layout { + display: box; + /* OLD - Android 4.4- */ + display: -webkit-box; + /* OLD - iOS 6-, Safari 3.1-6 */ + display: -moz-box; + /* OLD - Firefox 19- (buggy but mostly works) */ + display: -ms-flexbox; + /* TWEENER - IE 10 */ + display: -webkit-flex; + /* NEW - Chrome */ + display: flex; + /* NEW, Spec - Opera 12.1, Firefox 20+ */ + /* 09版 */ + -webkit-box-orient: horizontal; + /* 12版 */ + -webkit-flex-direction: row; + -moz-flex-direction: row; + -ms-flex-direction: row; + -o-flex-direction: row; + flex-direction: row; + /* 09版 */ + -webkit-box-pack: center; + /* 12版 */ + -webkit-justify-content: center; + -moz-justify-content: center; + -ms-justify-content: center; + -o-justify-content: center; + justify-content: center; + /* 09版 */ + -webkit-box-align: center; + /* 12版 */ + -webkit-align-items: center; + -moz-align-items: center; + -ms-align-items: center; + -o-align-items: center; + align-items: center; +} +.bi-flex-horizontal-layout { + display: box; + /* OLD - Android 4.4- */ + display: -webkit-box; + /* OLD - iOS 6-, Safari 3.1-6 */ + display: -moz-box; + /* OLD - Firefox 19- (buggy but mostly works) */ + display: -ms-flexbox; + /* TWEENER - IE 10 */ + display: -webkit-flex; + /* NEW - Chrome */ + display: flex; + /* NEW, Spec - Opera 12.1, Firefox 20+ */ + /* 09版 */ + -webkit-box-orient: horizontal; + /* 12版 */ + -webkit-flex-direction: row; + -moz-flex-direction: row; + -ms-flex-direction: row; + -o-flex-direction: row; + flex-direction: row; + /* 09版 */ + -webkit-box-pack: flex-start; + /* 12版 */ + -webkit-justify-content: flex-start; + -moz-justify-content: flex-start; + -ms-justify-content: flex-start; + -o-justify-content: flex-start; + justify-content: flex-start; + /* 09版 */ + -webkit-box-align: flex-start; + /* 12版 */ + -webkit-align-items: flex-start; + -moz-align-items: flex-start; + -ms-align-items: flex-start; + -o-align-items: flex-start; + align-items: flex-start; + /* 09版 */ + /*-webkit-box-lines: multiple;*/ + /* 12版 */ + -webkit-flex-wrap: nowrap; + -moz-flex-wrap: nowrap; + -ms-flex-wrap: nowrap; + -o-flex-wrap: nowrap; + flex-wrap: nowrap; +} +.bi-flex-horizontal-layout.middle { + /* 09版 */ + -webkit-box-align: center; + /* 12版 */ + -webkit-align-items: center; + -moz-align-items: center; + -ms-align-items: center; + -o-align-items: center; + align-items: center; +} +.bi-flex-horizontal-layout.bottom { + /* 09版 */ + -webkit-box-align: flex-end; + /* 12版 */ + -webkit-align-items: flex-end; + -moz-align-items: flex-end; + -ms-align-items: flex-end; + -o-align-items: flex-end; + align-items: flex-end; +} +.bi-flex-vertical-center { + display: box; + /* OLD - Android 4.4- */ + display: -webkit-box; + /* OLD - iOS 6-, Safari 3.1-6 */ + display: -moz-box; + /* OLD - Firefox 19- (buggy but mostly works) */ + display: -ms-flexbox; + /* TWEENER - IE 10 */ + display: -webkit-flex; + /* NEW - Chrome */ + display: flex; + /* NEW, Spec - Opera 12.1, Firefox 20+ */ + /* 09版 */ + -webkit-box-orient: horizontal; + /* 12版 */ + -webkit-flex-direction: row; + -moz-flex-direction: row; + -ms-flex-direction: row; + -o-flex-direction: row; + flex-direction: row; + /* 09版 */ + -webkit-box-pack: flex-start; + /* 12版 */ + -webkit-justify-content: flex-start; + -moz-justify-content: flex-start; + -ms-justify-content: flex-start; + -o-justify-content: flex-start; + justify-content: flex-start; + /* 09版 */ + -webkit-box-align: center; + /* 12版 */ + -webkit-align-items: center; + -moz-align-items: center; + -ms-align-items: center; + -o-align-items: center; + align-items: center; + /* 09版 */ + /*-webkit-box-lines: multiple;*/ + /* 12版 */ + -webkit-flex-wrap: nowrap; + -moz-flex-wrap: nowrap; + -ms-flex-wrap: nowrap; + -o-flex-wrap: nowrap; + flex-wrap: nowrap; +} +.bi-flex-wrapper-center-layout .flex-wrapper-center-layout-wrapper { + display: box; + /* OLD - Android 4.4- */ + display: -webkit-box; + /* OLD - iOS 6-, Safari 3.1-6 */ + display: -moz-box; + /* OLD - Firefox 19- (buggy but mostly works) */ + display: -ms-flexbox; + /* TWEENER - IE 10 */ + display: -webkit-flex; + /* NEW - Chrome */ + display: flex; + /* NEW, Spec - Opera 12.1, Firefox 20+ */ + /* 09版 */ + -webkit-box-orient: horizontal; + /* 12版 */ + -webkit-flex-direction: row; + -moz-flex-direction: row; + -ms-flex-direction: row; + -o-flex-direction: row; + flex-direction: row; + /* 09版 */ + -webkit-box-pack: center; + /* 12版 */ + -webkit-justify-content: center; + -moz-justify-content: center; + -ms-justify-content: center; + -o-justify-content: center; + justify-content: center; + /* 09版 */ + -webkit-box-align: center; + /* 12版 */ + -webkit-align-items: center; + -moz-align-items: center; + -ms-align-items: center; + -o-align-items: center; + align-items: center; + min-width: 100%; + min-height: 100%; + float: left; +} +.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper { + display: box; + /* OLD - Android 4.4- */ + display: -webkit-box; + /* OLD - iOS 6-, Safari 3.1-6 */ + display: -moz-box; + /* OLD - Firefox 19- (buggy but mostly works) */ + display: -ms-flexbox; + /* TWEENER - IE 10 */ + display: -webkit-flex; + /* NEW - Chrome */ + display: flex; + /* NEW, Spec - Opera 12.1, Firefox 20+ */ + /* 09版 */ + -webkit-box-orient: horizontal; + /* 12版 */ + -webkit-flex-direction: row; + -moz-flex-direction: row; + -ms-flex-direction: row; + -o-flex-direction: row; + flex-direction: row; + /* 09版 */ + -webkit-box-pack: flex-start; + /* 12版 */ + -webkit-justify-content: flex-start; + -moz-justify-content: flex-start; + -ms-justify-content: flex-start; + -o-justify-content: flex-start; + justify-content: flex-start; + /* 09版 */ + -webkit-box-align: flex-start; + /* 12版 */ + -webkit-align-items: flex-start; + -moz-align-items: flex-start; + -ms-align-items: flex-start; + -o-align-items: flex-start; + align-items: flex-start; + /* 09版 */ + /*-webkit-box-lines: multiple;*/ + /* 12版 */ + -webkit-flex-wrap: nowrap; + -moz-flex-wrap: nowrap; + -ms-flex-wrap: nowrap; + -o-flex-wrap: nowrap; + flex-wrap: nowrap; + min-height: 100%; +} +.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.middle { + /* 09版 */ + -webkit-box-align: center; + /* 12版 */ + -webkit-align-items: center; + -moz-align-items: center; + -ms-align-items: center; + -o-align-items: center; + align-items: center; +} +.bi-flex-wrapper-horizontal-layout .flex-wrapper-horizontal-layout-wrapper.bottom { + /* 09版 */ + -webkit-box-align: flex-end; + /* 12版 */ + -webkit-align-items: flex-end; + -moz-align-items: flex-end; + -ms-align-items: flex-end; + -o-align-items: flex-end; + align-items: flex-end; +} +.bi-flex-wrapper-vertical-center .flex-wrapper-vertical-center-wrapper { + display: box; + /* OLD - Android 4.4- */ + display: -webkit-box; + /* OLD - iOS 6-, Safari 3.1-6 */ + display: -moz-box; + /* OLD - Firefox 19- (buggy but mostly works) */ + display: -ms-flexbox; + /* TWEENER - IE 10 */ + display: -webkit-flex; + /* NEW - Chrome */ + display: flex; + /* NEW, Spec - Opera 12.1, Firefox 20+ */ + /* 09版 */ + -webkit-box-orient: horizontal; + /* 12版 */ + -webkit-flex-direction: row; + -moz-flex-direction: row; + -ms-flex-direction: row; + -o-flex-direction: row; + flex-direction: row; + /* 09版 */ + -webkit-box-pack: flex-start; + /* 12版 */ + -webkit-justify-content: flex-start; + -moz-justify-content: flex-start; + -ms-justify-content: flex-start; + -o-justify-content: flex-start; + justify-content: flex-start; + /* 09版 */ + -webkit-box-align: center; + /* 12版 */ + -webkit-align-items: center; + -moz-align-items: center; + -ms-align-items: center; + -o-align-items: center; + align-items: center; + /* 09版 */ + /*-webkit-box-lines: multiple;*/ + /* 12版 */ + -webkit-flex-wrap: nowrap; + -moz-flex-wrap: nowrap; + -ms-flex-wrap: nowrap; + -o-flex-wrap: nowrap; + flex-wrap: nowrap; + min-height: 100%; + float: left; +} /****添加计算宽度的--运算符直接需要space****/ /****** common color(常用颜色,可用于普遍场景) *****/ /**** custom color(自定义颜色,用于特定场景) ****/ diff --git a/dist/core.js b/dist/core.js index 61b8b721e..918dffeab 100644 --- a/dist/core.js +++ b/dist/core.js @@ -12906,7 +12906,7 @@ if (!window.BI) { //Utility _.extend(BI, { i18nText: function (key) { - var localeText = key; + var localeText = ""; if (!localeText) { localeText = key; } @@ -12923,7 +12923,7 @@ if (!window.BI) { assert: function (v, is) { if (this.isFunction(is)) { if (!is(v)) { - throw new Error(v + "值不合法"); + throw new Error(v + " error"); } else { return true; } @@ -12932,7 +12932,7 @@ if (!window.BI) { is = [is]; } if (!this.deepContains(is, v)) { - throw new Error(v + "值不合法"); + throw new Error(v + " error"); } }, @@ -12954,9 +12954,33 @@ if (!window.BI) { return widget instanceof BI.Widget || (BI.View && widget instanceof BI.View); }, + createWidget: function (item, options) { + var el; + options || (options = {}); + if (BI.isEmpty(item) && BI.isEmpty(options)) { + return BI.Plugin.getObject("bi.layout", BI.createWidget({ + type: "bi.layout" + })); + } + if (BI.isWidget(item)) { + return item; + } + if (item && (item.type || options.type)) { + el = BI.extend({}, options, item); + return BI.Plugin.getObject(el.type, FR.createWidget(BI.Plugin.getWidget(el.type, el), true)); + } + if (item && item.el && (item.el.type || options.type)) { + el = BI.extend({}, options, item.el); + return BI.Plugin.getObject(el.type, FR.createWidget(BI.Plugin.getWidget(el.type, el), true)); + } + if (item && BI.isWidget(item.el)) { + return item.el; + } + }, + createWidgets: function (items, options) { if (!BI.isArray(items)) { - throw new Error("无法根据items创建组件?") + throw new Error("cannot create Widgets") } return BI.map(BI.flatten(items), function (i, item) { return BI.createWidget(item, BI.deepClone(options)); @@ -13127,7 +13151,9 @@ if (!window.BI) { backAny: function (obj, predicate, context) { predicate = BI.iteratee(predicate, context); for (var index = obj.length - 1; index >= 0; index--) { - if (predicate(index, obj[index], obj)) return true; + if (predicate(index, obj[index], obj)) { + return true; + } } return false; }, @@ -13135,7 +13161,9 @@ if (!window.BI) { backEvery: function (obj, predicate, context) { predicate = BI.iteratee(predicate, context); for (var index = obj.length - 1; index >= 0; index--) { - if (!predicate(index, obj[index], obj)) return false; + if (!predicate(index, obj[index], obj)) { + return false; + } } return true; }, @@ -13261,7 +13289,9 @@ if (!window.BI) { }, uniq: function (array, isSorted, iteratee, context) { - if (array == null) return []; + if (array == null) { + return []; + } if (!_.isBoolean(isSorted)) { context = iteratee; iteratee = isSorted; @@ -13423,11 +13453,15 @@ if (!window.BI) { isDeepMatch: function (object, attrs) { var keys = BI.keys(attrs), length = keys.length; - if (object == null) return !length; + if (object == null) { + return !length; + } var obj = Object(object); for (var i = 0; i < length; i++) { var key = keys[i]; - if (!BI.isEqual(attrs[key], obj[key]) || !(key in obj)) return false; + if (!BI.isEqual(attrs[key], obj[key]) || !(key in obj)) { + return false; + } } return true; }, @@ -13453,20 +13487,24 @@ if (!window.BI) { }, deepRemove: function (obj, target) { + var done = false; var i; if (BI.isArray(obj)) { for (i = 0; i < obj.length; i++) { if (BI.isEqual(target, obj[i])) { obj.splice(i--, 1); + done = true; } } } else { BI.each(obj, function (i, v) { if (BI.isEqual(target, obj[i])) { delete obj[i]; + done = true; } }); } + return done; }, deepWithout: function (obj, target) { @@ -13489,8 +13527,14 @@ if (!window.BI) { } }, - deepUniq: function () { - + deepUnique: function (array) { + var result = []; + BI.each(array, function (i, item) { + if (!BI.deepContains(result, item)) { + result.push(item); + } + }); + return result; }, //比较两个对象得出不一样的key值 @@ -13541,31 +13585,54 @@ if (!window.BI) { var copies = callbacks.slice(0); callbacks = []; for (var i = 0; i < copies.length; i++) { - copies[i].func.apply(null, copies[i].args); + copies[i](); } } + if (typeof Promise !== 'undefined') { + var p = Promise.resolve(); + timerFunc = function () { + p.then(nextTickHandler); + } + } else + /* istanbul ignore if */ if (typeof MutationObserver !== 'undefined') { var counter = 1; var observer = new MutationObserver(nextTickHandler); - var textNode = document.createTextNode(counter); + var textNode = document.createTextNode(counter + ""); observer.observe(textNode, { characterData: true }); timerFunc = function () { counter = (counter + 1) % 2; - textNode.data = counter; + textNode.data = counter + ""; } } else { - timerFunc = setTimeout + timerFunc = function () { + setTimeout(nextTickHandler, 0) + } } - return function (cb) { + return function queueNextTick(cb) { + var _resolve; var args = [].slice.call(arguments, 1); - callbacks.push({func: cb, args: args}); - if (pending) return; - pending = true; - timerFunc(nextTickHandler, 0); + callbacks.push(function () { + if (cb) { + cb.apply(null, args); + } + if (_resolve) { + _resolve.apply(null, args); + } + }); + if (!pending) { + pending = true; + timerFunc(); + } + if (!cb && typeof Promise !== 'undefined') { + return new Promise(function (resolve) { + _resolve = resolve + }) + } } })() }); @@ -13599,7 +13666,7 @@ if (!window.BI) { try { return parseInt(number, radix); } catch (e) { - throw new Error("转成int类型失败"); + throw new Error(number + "parse int error"); return NaN; } }, @@ -13608,7 +13675,7 @@ if (!window.BI) { try { return parseFloat(number); } catch (e) { - throw new Error("转成float类型失败"); + throw new Error(number + "parse float error"); return NaN; } }, @@ -13670,9 +13737,9 @@ if (!window.BI) { var sum = 0; BI.each(array, function (i, item) { if (iteratee) { - sum += new Number(iteratee.apply(context, [i, item])); + sum += Number(iteratee.apply(context, [i, item])); } else { - sum += new Number(item); + sum += Number(item); } }); return sum; @@ -13735,6 +13802,10 @@ if (!window.BI) { return BI.isString(str) && BI.isEmpty(str); }, + contentFormat: function () { + return FR.contentFormat.apply(FR, arguments); + }, + /** * 对字符串进行加密 {@link #decrypt} * @static @@ -13848,23 +13919,23 @@ if (!window.BI) { //浏览器相关方法 _.extend(BI, { isIE: function () { - return $.browser.msie; + return /(msie|trident)/i.test(navigator.userAgent.toLowerCase()); }, isChrome: function () { - return $.browser.chrome; + return /chrome/i.test(navigator.userAgent.toLowerCase()); }, isFireFox: function () { - return $.browser.mozilla; + return /firefox/i.test(navigator.userAgent.toLowerCase()); }, isOpera: function () { - return $.browser.opera; + return /opera/i.test(navigator.userAgent.toLowerCase()); }, isSafari: function () { - return $.browser.safari; + return /safari/i.test(navigator.userAgent.toLowerCase()); }, isKhtml: function () { @@ -13898,6 +13969,124 @@ if (!window.BI) { //BI请求 _.extend(BI, { + ajax: (function () { + var loading, timeoutToast; + return function (option) { + option || (option = {}); + option.data = BI.extend({}, Data.SharingPool.cat("urlParameters"), option.data); + //encode + encodeBIParam(option.data); + + var async = true; + if (BI.isNotNull(option.async)) { + async = option.async; + } + + if (BI.isNull(loading)) { + loading = BI.createWidget({ + type: "bi.request_loading" + }); + } + + if (BI.isNull(timeoutToast)) { + timeoutToast = BI.createWidget({ + type: "bi.timeout_toast" + }); + timeoutToast.setCallback(function (op) { + decodeBIParam(op.data); + BI.ajax(op); + }); + } + timeoutToast.addReq(option); + + FR.ajax({ + url: option.url, + type: "POST", + data: option.data, + async: async, + error: function () { + if (!timeoutToast.hasReq(option)) { + return; + } + timeoutToast.removeReq(option); + //失败 取消、重新加载 + loading.setCallback(function () { + decodeBIParam(option.data); + BI.ajax(option); + }); + loading.showError(); + }, + complete: function (res, status) { + if (!timeoutToast.hasReq(option)) { + return; + } + timeoutToast.removeReq(option); + //登录超时 + if (BI.isNotNull(res.responseText) && + res.responseText.indexOf("fs-login-content") > -1 && + res.responseText.indexOf("fs-login-input-password-confirm") === -1) { + if (BI.Popovers.isVisible(BI.LoginTimeOut.POPOVER_ID)) { + return; + } + if (BI.isNotNull(BI.Popovers.get(BI.LoginTimeOut.POPOVER_ID))) { + BI.Popovers.open(BI.LoginTimeOut.POPOVER_ID); + return; + } + var loginTimeout = BI.createWidget({ + type: "bi.login_timeout" + }); + loginTimeout.on(BI.LoginTimeOut.EVENT_LOGIN, function () { + decodeBIParam(option.data); + BI.ajax(option); + BI.Popovers.remove(BI.LoginTimeOut.POPOVER_ID); + }); + BI.Popovers.create(BI.LoginTimeOut.POPOVER_ID, loginTimeout, { + width: 600, + height: 400 + }).open(BI.LoginTimeOut.POPOVER_ID); + } else if (BI.isNotNull(res.responseText) && + res.responseText.indexOf("script") > -1 && + res.responseText.indexOf("Session Timeout...") > -1) { + //登录失效 + loading.setCallback(function () { + location.reload(); + }); + loading.showError(); + + } else if (status === "success" && BI.isFunction(option.success)) { + option.success(FR.jsonDecode(res.responseText)); + } + if (BI.isFunction(option.complete)) { + option.complete(FR.jsonDecode(res.responseText), status); + } + } + }); + + return function cancel() { + timeoutToast.removeReq(option); + }; + + function encodeBIParam(data) { + for (var key in data) { + if (_.isObject(data[key])) { + data[key] = window.encodeURIComponent(FR.jsonEncode(data[key])); + } else { + data[key] = window.encodeURIComponent(data[key]); + } + } + } + + function decodeBIParam(data) { + for (var key in data) { + data[key] = window.decodeURIComponent(data[key]); + if (_.isObject(data[key])) { + data[key] = FR.jsonDecode(data[key]); + } + } + } + } + })(), + /** * 异步ajax请求 * @param {String} op op参数 @@ -13907,38 +14096,29 @@ if (!window.BI) { * @param {Function} complete 回调 */ requestAsync: function (op, cmd, data, callback, complete) { - // if (BI.isNull(BI.REQUEST_LOADING)) { - // BI.REQUEST_LOADING = BI.createWidget({ - // type: "bi.request_loading" - // }); - // } data = data || {}; if (!BI.isKey(op)) { op = 'fr_bi_dezi'; } - if (op === "fr_bi_dezi") { + if (op === "fr_bi_dezi" || op === "fr_bi_configure") { data.sessionID = Data.SharingPool.get("sessionID"); } var url = FR.servletURL + '?op=' + op + '&cmd=' + cmd + "&_=" + Math.random(); - (BI.ajax || FR.ajax)({ + return (BI.ajax)({ url: url, type: 'POST', data: data, error: function () { // BI.Msg.toast(BI.i18nText("BI-Ajax_Error")); - //失败 取消、重新加载 - // BI.REQUEST_LOADING.setCallback(function () { - // BI.requestAsync(op, cmd, data, callback, complete); - // }); - // BI.REQUEST_LOADING.showError(); }, - complete: function (res, status) { - if (BI.isFunction(callback) && status === 'success') { - callback(BI.jsonDecode(res.responseText)); - BI.Maskers.hide(BI.RequstLoading.MASK_ID); + success: function (res) { + if (BI.isFunction(callback)) { + callback(res); } + }, + complete: function (res, status) { if (BI.isFunction(complete)) { - complete(); + complete(res); } } }); @@ -13961,7 +14141,7 @@ if (!window.BI) { } var url = FR.servletURL + '?op=' + op + '&cmd=' + cmd + "&_=" + Math.random(); var result = {}; - (BI.ajax || FR.ajax)({ + (BI.ajax)({ url: url, type: 'POST', async: false, @@ -13971,7 +14151,7 @@ if (!window.BI) { }, complete: function (res, status) { if (status === 'success') { - result = BI.jsonDecode(res.responseText); + result = res; } } }); diff --git a/src/core/base.js b/src/core/base.js index 0ea04ee91..aa33e64a3 100644 --- a/src/core/base.js +++ b/src/core/base.js @@ -33,7 +33,7 @@ if (!window.BI) { //Utility _.extend(BI, { i18nText: function (key) { - var localeText = FR.i18n[key]; + var localeText = ""; if (!localeText) { localeText = key; } @@ -485,7 +485,11 @@ if (!window.BI) { }, isWidthOrHeight: function (w) { - return FR.isWidthOrHeight(w); + if (typeof w == 'number') { + return w >= 0; + } else if (typeof w == 'string') { + return /^\d{1,3}%$/.exec(w) || w == 'auto' || /^\d+px$/.exec(w); + } }, isNotNull: function (obj) { diff --git a/src/css/base/pager/pager.all.css b/src/css/base/pager/pager.all.css deleted file mode 100644 index 278e4a9b7..000000000 --- a/src/css/base/pager/pager.all.css +++ /dev/null @@ -1,14 +0,0 @@ -/****添加计算宽度的--运算符直接需要space****/ -/****** common color(常用颜色,可用于普遍场景) *****/ -/**** custom color(自定义颜色,用于特定场景) ****/ -.bi-all-pager .pager-editor { - background-color: #ffffff; -} -.bi-all-pager .all-pager-prev { - font-size: 16px; - background: #f4f4f4; -} -.bi-all-pager .all-pager-next { - font-size: 16px; - background: #f4f4f4; -} diff --git a/src/css/base/pager/pager.number.css b/src/css/base/pager/pager.number.css deleted file mode 100644 index 637e904e2..000000000 --- a/src/css/base/pager/pager.number.css +++ /dev/null @@ -1,11 +0,0 @@ -/****添加计算宽度的--运算符直接需要space****/ -/****** common color(常用颜色,可用于普遍场景) *****/ -/**** custom color(自定义颜色,用于特定场景) ****/ -.bi-number-pager .number-pager-prev { - font-size: 16px; - background: #f4f4f4; -} -.bi-number-pager .number-pager-next { - font-size: 16px; - background: #f4f4f4; -} diff --git a/src/css/base/pager/pager.skip.css b/src/css/base/pager/pager.skip.css deleted file mode 100644 index 26b5a82ab..000000000 --- a/src/css/base/pager/pager.skip.css +++ /dev/null @@ -1,11 +0,0 @@ -/****添加计算宽度的--运算符直接需要space****/ -/****** common color(常用颜色,可用于普遍场景) *****/ -/**** custom color(自定义颜色,用于特定场景) ****/ -.bi-skip-pager .skip-pager-prev { - font-size: 16px; - background: #f4f4f4; -} -.bi-skip-pager .skip-pager-next { - font-size: 16px; - background: #f4f4f4; -} diff --git a/src/css/base/third/jquery.mCustomScrollbar.css b/src/css/base/third/jquery.mCustomScrollbar.css deleted file mode 100644 index b42acb6ec..000000000 --- a/src/css/base/third/jquery.mCustomScrollbar.css +++ /dev/null @@ -1,1481 +0,0 @@ -/* -== malihu jquery custom scrollbar plugin == -Plugin URI: http://manos.malihu.gr/jquery-custom-content-scroller -*/ -/* -CONTENTS: - 1. BASIC STYLE - Plugin's basic/essential CSS properties (normally, should not be edited). - 2. VERTICAL SCROLLBAR - Positioning and dimensions of vertical scrollbar. - 3. HORIZONTAL SCROLLBAR - Positioning and dimensions of horizontal scrollbar. - 4. VERTICAL AND HORIZONTAL SCROLLBARS - Positioning and dimensions of 2-axis scrollbars. - 5. TRANSITIONS - CSS3 transitions for hover events, auto-expanded and auto-hidden scrollbars. - 6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS - 6.1 THEMES - Scrollbar colors, opacity, dimensions, backgrounds etc. via ready-to-use themes. -*/ -/* ------------------------------------------------------------------------------------------------------------------------- -1. BASIC STYLE ------------------------------------------------------------------------------------------------------------------------- -*/ -/****添加计算宽度的--运算符直接需要space****/ -/****** common color(常用颜色,可用于普遍场景) *****/ -/**** custom color(自定义颜色,用于特定场景) ****/ -.mCustomScrollbar { - -ms-touch-action: pinch-zoom; - touch-action: pinch-zoom; - /* direct pointer events to js */ -} -.mCustomScrollbar.mCS_no_scrollbar, -.mCustomScrollbar.mCS_touch_action { - -ms-touch-action: auto; - touch-action: auto; -} -.mCustomScrollBox { - /* contains plugin's markup */ - position: relative; - overflow: hidden; - height: 100%; - max-width: 100%; - outline: none; - direction: ltr; -} -.mCSB_container { - /* contains the original content */ - overflow: hidden; - width: auto; - height: auto; -} -/* ------------------------------------------------------------------------------------------------------------------------- -2. VERTICAL SCROLLBAR -y-axis ------------------------------------------------------------------------------------------------------------------------- -*/ -.mCSB_inside > .mCSB_container { - margin-right: 30px; -} -.mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden { - margin-right: 0; -} -/* non-visible scrollbar */ -.mCS-dir-rtl > .mCSB_inside > .mCSB_container { - /* RTL direction/left-side scrollbar */ - margin-right: 0; - margin-left: 30px; -} -.mCS-dir-rtl > .mCSB_inside > .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden { - margin-left: 0; -} -/* RTL direction/left-side scrollbar */ -.mCSB_scrollTools { - /* contains scrollbar markup (draggable element, dragger rail, buttons etc.) */ - position: absolute; - width: 16px; - height: auto; - left: auto; - top: 0; - right: 0; - bottom: 0; -} -.mCSB_outside + .mCSB_scrollTools { - right: -26px; -} -/* scrollbar position: outside */ -.mCS-dir-rtl > .mCSB_inside > .mCSB_scrollTools, -.mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools { - /* RTL direction/left-side scrollbar */ - right: auto; - left: 0; -} -.mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools { - left: -26px; -} -/* RTL direction/left-side scrollbar (scrollbar position: outside) */ -.mCSB_scrollTools .mCSB_draggerContainer { - /* contains the draggable element and dragger rail markup */ - position: absolute; - top: 0; - left: 0; - bottom: 0; - right: 0; - height: auto; -} -.mCSB_scrollTools a + .mCSB_draggerContainer { - margin: 20px 0; -} -.mCSB_scrollTools .mCSB_draggerRail { - width: 2px; - height: 100%; - margin: 0 auto; - -webkit-border-radius: 16px; - -moz-border-radius: 16px; - border-radius: 16px; -} -.mCSB_scrollTools .mCSB_dragger { - /* the draggable element */ - cursor: pointer; - width: 100%; - height: 30px; - /* minimum dragger height */ - z-index: 1; -} -.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - /* the dragger element */ - position: relative; - width: 4px; - height: 100%; - margin: 0 auto; - -webkit-border-radius: 16px; - -moz-border-radius: 16px; - border-radius: 16px; - text-align: center; -} -.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, -.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar { - width: 12px; - /* auto-expanded scrollbar */ -} -.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, -.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { - width: 8px; - /* auto-expanded scrollbar */ -} -.mCSB_scrollTools .mCSB_buttonUp, -.mCSB_scrollTools .mCSB_buttonDown { - display: block; - position: absolute; - height: 20px; - width: 100%; - overflow: hidden; - margin: 0 auto; - cursor: pointer; -} -.mCSB_scrollTools .mCSB_buttonDown { - bottom: 0; -} -/* ------------------------------------------------------------------------------------------------------------------------- -3. HORIZONTAL SCROLLBAR -x-axis ------------------------------------------------------------------------------------------------------------------------- -*/ -.mCSB_horizontal.mCSB_inside > .mCSB_container { - margin-right: 0; - margin-bottom: 30px; -} -.mCSB_horizontal.mCSB_outside > .mCSB_container { - min-height: 100%; -} -.mCSB_horizontal > .mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden { - margin-bottom: 0; -} -/* non-visible scrollbar */ -.mCSB_scrollTools.mCSB_scrollTools_horizontal { - width: auto; - height: 16px; - top: auto; - right: 0; - bottom: 0; - left: 0; -} -.mCustomScrollBox + .mCSB_scrollTools.mCSB_scrollTools_horizontal, -.mCustomScrollBox + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal { - bottom: -26px; -} -/* scrollbar position: outside */ -.mCSB_scrollTools.mCSB_scrollTools_horizontal a + .mCSB_draggerContainer { - margin: 0 20px; -} -.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail { - width: 100%; - height: 2px; - margin: 7px 0; -} -.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger { - width: 30px; - /* minimum dragger width */ - height: 100%; - left: 0; -} -.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { - width: 100%; - height: 4px; - margin: 6px auto; -} -.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, -.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar { - height: 12px; - /* auto-expanded scrollbar */ - margin: 2px auto; -} -.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, -.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { - height: 8px; - /* auto-expanded scrollbar */ - margin: 4px 0; -} -.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft, -.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight { - display: block; - position: absolute; - width: 20px; - height: 100%; - overflow: hidden; - margin: 0 auto; - cursor: pointer; -} -.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft { - left: 0; -} -.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight { - right: 0; -} -/* ------------------------------------------------------------------------------------------------------------------------- -4. VERTICAL AND HORIZONTAL SCROLLBARS -yx-axis ------------------------------------------------------------------------------------------------------------------------- -*/ -.mCSB_container_wrapper { - position: absolute; - height: auto; - width: auto; - overflow: hidden; - top: 0; - left: 0; - right: 0; - bottom: 0; - margin-right: 30px; - margin-bottom: 30px; -} -.mCSB_container_wrapper > .mCSB_container { - padding-right: 30px; - padding-bottom: 30px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; -} -.mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_vertical { - bottom: 20px; -} -.mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_horizontal { - right: 20px; -} -/* non-visible horizontal scrollbar */ -.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden + .mCSB_scrollTools.mCSB_scrollTools_vertical { - bottom: 0; -} -/* non-visible vertical scrollbar/RTL direction/left-side scrollbar */ -.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal, -.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal { - right: 0; -} -/* RTL direction/left-side scrollbar */ -.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal { - left: 20px; -} -/* non-visible scrollbar/RTL direction/left-side scrollbar */ -.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal { - left: 0; -} -.mCS-dir-rtl > .mCSB_inside > .mCSB_container_wrapper { - /* RTL direction/left-side scrollbar */ - margin-right: 0; - margin-left: 30px; -} -.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden > .mCSB_container { - padding-right: 0; -} -.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden > .mCSB_container { - padding-bottom: 0; -} -.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden { - margin-right: 0; - /* non-visible scrollbar */ - margin-left: 0; -} -/* non-visible horizontal scrollbar */ -.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden { - margin-bottom: 0; -} -/* ------------------------------------------------------------------------------------------------------------------------- -5. TRANSITIONS ------------------------------------------------------------------------------------------------------------------------- -*/ -.mCSB_scrollTools, -.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCSB_scrollTools .mCSB_buttonUp, -.mCSB_scrollTools .mCSB_buttonDown, -.mCSB_scrollTools .mCSB_buttonLeft, -.mCSB_scrollTools .mCSB_buttonRight { - -webkit-transition: opacity 0.2s ease-in-out, background-color 0.2s ease-in-out; - -moz-transition: opacity 0.2s ease-in-out, background-color 0.2s ease-in-out; - -o-transition: opacity 0.2s ease-in-out, background-color 0.2s ease-in-out; - transition: opacity 0.2s ease-in-out, background-color 0.2s ease-in-out; -} -.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar, -.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail, -.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar, -.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail { - -webkit-transition: width 0.2s ease-out 0.2s, height 0.2s ease-out 0.2s, margin-left 0.2s ease-out 0.2s, margin-right 0.2s ease-out 0.2s, margin-top 0.2s ease-out 0.2s, margin-bottom 0.2s ease-out 0.2s, opacity 0.2s ease-in-out, background-color 0.2s ease-in-out; - -moz-transition: width 0.2s ease-out 0.2s, height 0.2s ease-out 0.2s, margin-left 0.2s ease-out 0.2s, margin-right 0.2s ease-out 0.2s, margin-top 0.2s ease-out 0.2s, margin-bottom 0.2s ease-out 0.2s, opacity 0.2s ease-in-out, background-color 0.2s ease-in-out; - -o-transition: width 0.2s ease-out 0.2s, height 0.2s ease-out 0.2s, margin-left 0.2s ease-out 0.2s, margin-right 0.2s ease-out 0.2s, margin-top 0.2s ease-out 0.2s, margin-bottom 0.2s ease-out 0.2s, opacity 0.2s ease-in-out, background-color 0.2s ease-in-out; - transition: width 0.2s ease-out 0.2s, height 0.2s ease-out 0.2s, margin-left 0.2s ease-out 0.2s, margin-right 0.2s ease-out 0.2s, margin-top 0.2s ease-out 0.2s, margin-bottom 0.2s ease-out 0.2s, opacity 0.2s ease-in-out, background-color 0.2s ease-in-out; -} -/* ------------------------------------------------------------------------------------------------------------------------- -6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS ------------------------------------------------------------------------------------------------------------------------- -*/ -/* ----------------------------------------- -6.1 THEMES ----------------------------------------- -*/ -/* default theme ("light") */ -.mCSB_scrollTools { - opacity: 0.75; - filter: "alpha(opacity=75)"; - -ms-filter: "alpha(opacity=75)"; -} -.mCS-autoHide > .mCustomScrollBox > .mCSB_scrollTools, -.mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools { - opacity: 0; - filter: "alpha(opacity=0)"; - -ms-filter: "alpha(opacity=0)"; -} -.mCustomScrollbar > .mCustomScrollBox > .mCSB_scrollTools.mCSB_scrollTools_onDrag, -.mCustomScrollbar > .mCustomScrollBox ~ .mCSB_scrollTools.mCSB_scrollTools_onDrag, -.mCustomScrollBox:hover > .mCSB_scrollTools, -.mCustomScrollBox:hover ~ .mCSB_scrollTools, -.mCS-autoHide:hover > .mCustomScrollBox > .mCSB_scrollTools, -.mCS-autoHide:hover > .mCustomScrollBox ~ .mCSB_scrollTools { - opacity: 1; - filter: "alpha(opacity=100)"; - -ms-filter: "alpha(opacity=100)"; -} -.mCSB_scrollTools .mCSB_draggerRail { - background-color: #000; - background-color: rgba(0, 0, 0, 0.4); - filter: "alpha(opacity=40)"; - -ms-filter: "alpha(opacity=40)"; -} -.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.75); - filter: "alpha(opacity=75)"; - -ms-filter: "alpha(opacity=75)"; -} -.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.85); - filter: "alpha(opacity=85)"; - -ms-filter: "alpha(opacity=85)"; -} -.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.9); - filter: "alpha(opacity=90)"; - -ms-filter: "alpha(opacity=90)"; -} -.mCSB_scrollTools .mCSB_buttonUp, -.mCSB_scrollTools .mCSB_buttonDown, -.mCSB_scrollTools .mCSB_buttonLeft, -.mCSB_scrollTools .mCSB_buttonRight { - background-image: url('background/mCSB_buttons.png'); - /* css sprites */ - background-repeat: no-repeat; - opacity: 0.4; - filter: "alpha(opacity=40)"; - -ms-filter: "alpha(opacity=40)"; -} -.mCSB_scrollTools .mCSB_buttonUp { - background-position: 0 0; - /* - sprites locations - light: 0 0, -16px 0, -32px 0, -48px 0, 0 -72px, -16px -72px, -32px -72px - dark: -80px 0, -96px 0, -112px 0, -128px 0, -80px -72px, -96px -72px, -112px -72px - */ -} -.mCSB_scrollTools .mCSB_buttonDown { - background-position: 0 -20px; - /* - sprites locations - light: 0 -20px, -16px -20px, -32px -20px, -48px -20px, 0 -92px, -16px -92px, -32px -92px - dark: -80px -20px, -96px -20px, -112px -20px, -128px -20px, -80px -92px, -96px -92px, -112 -92px - */ -} -.mCSB_scrollTools .mCSB_buttonLeft { - background-position: 0 -40px; - /* - sprites locations - light: 0 -40px, -20px -40px, -40px -40px, -60px -40px, 0 -112px, -20px -112px, -40px -112px - dark: -80px -40px, -100px -40px, -120px -40px, -140px -40px, -80px -112px, -100px -112px, -120px -112px - */ -} -.mCSB_scrollTools .mCSB_buttonRight { - background-position: 0 -56px; - /* - sprites locations - light: 0 -56px, -20px -56px, -40px -56px, -60px -56px, 0 -128px, -20px -128px, -40px -128px - dark: -80px -56px, -100px -56px, -120px -56px, -140px -56px, -80px -128px, -100px -128px, -120px -128px - */ -} -.mCSB_scrollTools .mCSB_buttonUp:hover, -.mCSB_scrollTools .mCSB_buttonDown:hover, -.mCSB_scrollTools .mCSB_buttonLeft:hover, -.mCSB_scrollTools .mCSB_buttonRight:hover { - opacity: 0.75; - filter: "alpha(opacity=75)"; - -ms-filter: "alpha(opacity=75)"; -} -.mCSB_scrollTools .mCSB_buttonUp:active, -.mCSB_scrollTools .mCSB_buttonDown:active, -.mCSB_scrollTools .mCSB_buttonLeft:active, -.mCSB_scrollTools .mCSB_buttonRight:active { - opacity: 0.9; - filter: "alpha(opacity=90)"; - -ms-filter: "alpha(opacity=90)"; -} -/* theme: "dark" */ -.mCS-dark.mCSB_scrollTools .mCSB_draggerRail { - background-color: #000; - background-color: rgba(0, 0, 0, 0.15); -} -.mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.75); -} -.mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { - background-color: rgba(0, 0, 0, 0.85); -} -.mCS-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: rgba(0, 0, 0, 0.9); -} -.mCS-dark.mCSB_scrollTools .mCSB_buttonUp { - background-position: -80px 0; -} -.mCS-dark.mCSB_scrollTools .mCSB_buttonDown { - background-position: -80px -20px; -} -.mCS-dark.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -80px -40px; -} -.mCS-dark.mCSB_scrollTools .mCSB_buttonRight { - background-position: -80px -56px; -} -/* ---------------------------------------- */ -/* theme: "light-2", "dark-2" */ -.mCS-light-2.mCSB_scrollTools .mCSB_draggerRail, -.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail { - width: 4px; - background-color: #fff; - background-color: rgba(255, 255, 255, 0.1); - -webkit-border-radius: 1px; - -moz-border-radius: 1px; - border-radius: 1px; -} -.mCS-light-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - width: 4px; - background-color: #fff; - background-color: rgba(255, 255, 255, 0.75); - -webkit-border-radius: 1px; - -moz-border-radius: 1px; - border-radius: 1px; -} -.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_draggerRail, -.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_draggerRail, -.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { - width: 100%; - height: 4px; - margin: 6px auto; -} -.mCS-light-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.85); -} -.mCS-light-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-light-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.9); -} -.mCS-light-2.mCSB_scrollTools .mCSB_buttonUp { - background-position: -32px 0; -} -.mCS-light-2.mCSB_scrollTools .mCSB_buttonDown { - background-position: -32px -20px; -} -.mCS-light-2.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -40px -40px; -} -.mCS-light-2.mCSB_scrollTools .mCSB_buttonRight { - background-position: -40px -56px; -} -/* theme: "dark-2" */ -.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail { - background-color: #000; - background-color: rgba(0, 0, 0, 0.1); - -webkit-border-radius: 1px; - -moz-border-radius: 1px; - border-radius: 1px; -} -.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.75); - -webkit-border-radius: 1px; - -moz-border-radius: 1px; - border-radius: 1px; -} -.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.85); -} -.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-dark-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.9); -} -.mCS-dark-2.mCSB_scrollTools .mCSB_buttonUp { - background-position: -112px 0; -} -.mCS-dark-2.mCSB_scrollTools .mCSB_buttonDown { - background-position: -112px -20px; -} -.mCS-dark-2.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -120px -40px; -} -.mCS-dark-2.mCSB_scrollTools .mCSB_buttonRight { - background-position: -120px -56px; -} -/* ---------------------------------------- */ -/* theme: "light-thick", "dark-thick" */ -.mCS-light-thick.mCSB_scrollTools .mCSB_draggerRail, -.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail { - width: 4px; - background-color: #fff; - background-color: rgba(255, 255, 255, 0.1); - -webkit-border-radius: 2px; - -moz-border-radius: 2px; - border-radius: 2px; -} -.mCS-light-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - width: 6px; - background-color: #fff; - background-color: rgba(255, 255, 255, 0.75); - -webkit-border-radius: 2px; - -moz-border-radius: 2px; - border-radius: 2px; -} -.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail, -.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail { - width: 100%; - height: 4px; - margin: 6px 0; -} -.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { - width: 100%; - height: 6px; - margin: 5px auto; -} -.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.85); -} -.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-light-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.9); -} -.mCS-light-thick.mCSB_scrollTools .mCSB_buttonUp { - background-position: -16px 0; -} -.mCS-light-thick.mCSB_scrollTools .mCSB_buttonDown { - background-position: -16px -20px; -} -.mCS-light-thick.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -20px -40px; -} -.mCS-light-thick.mCSB_scrollTools .mCSB_buttonRight { - background-position: -20px -56px; -} -/* theme: "dark-thick" */ -.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail { - background-color: #000; - background-color: rgba(0, 0, 0, 0.1); - -webkit-border-radius: 2px; - -moz-border-radius: 2px; - border-radius: 2px; -} -.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.75); - -webkit-border-radius: 2px; - -moz-border-radius: 2px; - border-radius: 2px; -} -.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.85); -} -.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.9); -} -.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonUp { - background-position: -96px 0; -} -.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonDown { - background-position: -96px -20px; -} -.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -100px -40px; -} -.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonRight { - background-position: -100px -56px; -} -/* ---------------------------------------- */ -/* theme: "light-thin", "dark-thin" */ -.mCS-light-thin.mCSB_scrollTools .mCSB_draggerRail { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.1); -} -.mCS-light-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - width: 2px; -} -.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail, -.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail { - width: 100%; -} -.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { - width: 100%; - height: 2px; - margin: 7px auto; -} -/* theme "dark-thin" */ -.mCS-dark-thin.mCSB_scrollTools .mCSB_draggerRail { - background-color: #000; - background-color: rgba(0, 0, 0, 0.15); -} -.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.75); -} -.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.85); -} -.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.9); -} -.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonUp { - background-position: -80px 0; -} -.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonDown { - background-position: -80px -20px; -} -.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -80px -40px; -} -.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonRight { - background-position: -80px -56px; -} -/* ---------------------------------------- */ -/* theme "rounded", "rounded-dark", "rounded-dots", "rounded-dots-dark" */ -.mCS-rounded.mCSB_scrollTools .mCSB_draggerRail { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.15); -} -.mCS-rounded.mCSB_scrollTools .mCSB_dragger, -.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger, -.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger, -.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger { - height: 14px; -} -.mCS-rounded.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - width: 14px; - margin: 0 1px; -} -.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger, -.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger, -.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger, -.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger { - width: 14px; -} -.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { - height: 14px; - margin: 1px 0; -} -.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, -.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar, -.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, -.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar { - width: 16px; - /* auto-expanded scrollbar */ - height: 16px; - margin: -1px 0; -} -.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, -.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, -.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, -.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { - width: 4px; - /* auto-expanded scrollbar */ -} -.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, -.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar, -.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, -.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar { - height: 16px; - /* auto-expanded scrollbar */ - width: 16px; - margin: 0 -1px; -} -.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, -.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, -.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, -.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { - height: 4px; - /* auto-expanded scrollbar */ - margin: 6px 0; -} -.mCS-rounded.mCSB_scrollTools .mCSB_buttonUp { - background-position: 0 -72px; -} -.mCS-rounded.mCSB_scrollTools .mCSB_buttonDown { - background-position: 0 -92px; -} -.mCS-rounded.mCSB_scrollTools .mCSB_buttonLeft { - background-position: 0 -112px; -} -.mCS-rounded.mCSB_scrollTools .mCSB_buttonRight { - background-position: 0 -128px; -} -/* theme "rounded-dark", "rounded-dots-dark" */ -.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.75); -} -.mCS-rounded-dark.mCSB_scrollTools .mCSB_draggerRail { - background-color: #000; - background-color: rgba(0, 0, 0, 0.15); -} -.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, -.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.85); -} -.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, -.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.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); -} -.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonUp { - background-position: -80px -72px; -} -.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonDown { - background-position: -80px -92px; -} -.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -80px -112px; -} -.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonRight { - background-position: -80px -128px; -} -/* theme "rounded-dots", "rounded-dots-dark" */ -.mCS-rounded-dots.mCSB_scrollTools_vertical .mCSB_draggerRail, -.mCS-rounded-dots-dark.mCSB_scrollTools_vertical .mCSB_draggerRail { - width: 4px; -} -.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail, -.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail, -.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail, -.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail { - background-color: transparent; - background-position: center; -} -.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail, -.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail { - background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAANElEQVQYV2NkIAAYiVbw//9/Y6DiM1ANJoyMjGdBbLgJQAX/kU0DKgDLkaQAvxW4HEvQFwCRcxIJK1XznAAAAABJRU5ErkJggg=="); - background-repeat: repeat-y; - opacity: 0.3; - filter: "alpha(opacity=30)"; - -ms-filter: "alpha(opacity=30)"; -} -.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail, -.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail { - height: 4px; - margin: 6px 0; - background-repeat: repeat-x; -} -.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonUp { - background-position: -16px -72px; -} -.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonDown { - background-position: -16px -92px; -} -.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -20px -112px; -} -.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonRight { - background-position: -20px -128px; -} -/* theme "rounded-dots-dark" */ -.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail { - background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYV2NkIAAYSVFgDFR8BqrBBEifBbGRTfiPZhpYjiQFBK3A6l6CvgAAE9kGCd1mvgEAAAAASUVORK5CYII="); -} -.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonUp { - background-position: -96px -72px; -} -.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonDown { - background-position: -96px -92px; -} -.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -100px -112px; -} -.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonRight { - background-position: -100px -128px; -} -/* ---------------------------------------- */ -/* theme "3d", "3d-dark", "3d-thick", "3d-thick-dark" */ -.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-repeat: repeat-y; - background-image: -moz-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); - 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))); - background-image: -webkit-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); - background-image: -o-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); - background-image: -ms-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); - background-image: linear-gradient(to right, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); -} -.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { - background-repeat: repeat-x; - background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); - 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))); - background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); - background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); - background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); - background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); -} -/* theme "3d", "3d-dark" */ -.mCS-3d.mCSB_scrollTools_vertical .mCSB_dragger, -.mCS-3d-dark.mCSB_scrollTools_vertical .mCSB_dragger { - height: 70px; -} -.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger, -.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger { - width: 70px; -} -.mCS-3d.mCSB_scrollTools, -.mCS-3d-dark.mCSB_scrollTools { - opacity: 1; - filter: "alpha(opacity=30)"; - -ms-filter: "alpha(opacity=30)"; -} -.mCS-3d.mCSB_scrollTools .mCSB_draggerRail, -.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail, -.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - -webkit-border-radius: 16px; - -moz-border-radius: 16px; - border-radius: 16px; -} -.mCS-3d.mCSB_scrollTools .mCSB_draggerRail, -.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail { - width: 8px; - background-color: #000; - background-color: rgba(0, 0, 0, 0.2); - box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.5), inset -1px 0 1px rgba(255, 255, 255, 0.2); -} -.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, -.mCS-3d.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-3d.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, -.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, -.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: #555; -} -.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - width: 8px; -} -.mCS-3d.mCSB_scrollTools_horizontal .mCSB_draggerRail, -.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail { - width: 100%; - height: 8px; - margin: 4px 0; - box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.5), inset 0 -1px 1px rgba(255, 255, 255, 0.2); -} -.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { - width: 100%; - height: 8px; - margin: 4px auto; -} -.mCS-3d.mCSB_scrollTools .mCSB_buttonUp { - background-position: -32px -72px; -} -.mCS-3d.mCSB_scrollTools .mCSB_buttonDown { - background-position: -32px -92px; -} -.mCS-3d.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -40px -112px; -} -.mCS-3d.mCSB_scrollTools .mCSB_buttonRight { - background-position: -40px -128px; -} -/* theme "3d-dark" */ -.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail { - background-color: #000; - background-color: rgba(0, 0, 0, 0.1); - box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1); -} -.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail { - box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1); -} -.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonUp { - background-position: -112px -72px; -} -.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonDown { - background-position: -112px -92px; -} -.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -120px -112px; -} -.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonRight { - background-position: -120px -128px; -} -/* ---------------------------------------- */ -/* theme: "3d-thick", "3d-thick-dark" */ -.mCS-3d-thick.mCSB_scrollTools, -.mCS-3d-thick-dark.mCSB_scrollTools { - opacity: 1; - filter: "alpha(opacity=30)"; - -ms-filter: "alpha(opacity=30)"; -} -.mCS-3d-thick.mCSB_scrollTools, -.mCS-3d-thick-dark.mCSB_scrollTools, -.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer, -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer { - -webkit-border-radius: 7px; - -moz-border-radius: 7px; - border-radius: 7px; -} -.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - -webkit-border-radius: 5px; - -moz-border-radius: 5px; - border-radius: 5px; -} -.mCSB_inside + .mCS-3d-thick.mCSB_scrollTools_vertical, -.mCSB_inside + .mCS-3d-thick-dark.mCSB_scrollTools_vertical { - right: 1px; -} -.mCS-3d-thick.mCSB_scrollTools_vertical, -.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); -} -.mCS-3d-thick.mCSB_scrollTools_horizontal, -.mCS-3d-thick-dark.mCSB_scrollTools_horizontal { - bottom: 1px; - box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.5); -} -.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.4); - width: 12px; - margin: 2px; - position: absolute; - height: auto; - top: 0; - bottom: 0; - left: 0; - right: 0; -} -.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4); -} -.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, -.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: #555; -} -.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { - height: 12px; - width: auto; -} -.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer { - background-color: #000; - background-color: rgba(0, 0, 0, 0.05); - box-shadow: inset 1px 1px 16px rgba(0, 0, 0, 0.1); -} -.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerRail { - background-color: transparent; -} -.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonUp { - background-position: -32px -72px; -} -.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonDown { - background-position: -32px -92px; -} -.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -40px -112px; -} -.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonRight { - background-position: -40px -128px; -} -/* theme: "3d-thick-dark" */ -.mCS-3d-thick-dark.mCSB_scrollTools { - box-shadow: inset 0 0 14px rgba(0, 0, 0, 0.2); -} -.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); -} -.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); -} -.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); -} -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: #777; -} -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer { - background-color: #fff; - background-color: rgba(0, 0, 0, 0.05); - box-shadow: inset 1px 1px 16px rgba(0, 0, 0, 0.1); -} -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerRail { - background-color: transparent; -} -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonUp { - background-position: -112px -72px; -} -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonDown { - background-position: -112px -92px; -} -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -120px -112px; -} -.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonRight { - background-position: -120px -128px; -} -/* ---------------------------------------- */ -/* theme: "minimal", "minimal-dark" */ -.mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical, -.mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical { - right: 0; - margin: 12px 0; -} -.mCustomScrollBox.mCS-minimal + .mCSB_scrollTools.mCSB_scrollTools_horizontal, -.mCustomScrollBox.mCS-minimal + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal, -.mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools.mCSB_scrollTools_horizontal, -.mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal { - bottom: 0; - margin: 0 12px; -} -/* RTL direction/left-side scrollbar */ -.mCS-dir-rtl > .mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical, -.mCS-dir-rtl > .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical { - left: 0; - right: auto; -} -.mCS-minimal.mCSB_scrollTools .mCSB_draggerRail, -.mCS-minimal-dark.mCSB_scrollTools .mCSB_draggerRail { - background-color: transparent; -} -.mCS-minimal.mCSB_scrollTools_vertical .mCSB_dragger, -.mCS-minimal-dark.mCSB_scrollTools_vertical .mCSB_dragger { - height: 50px; -} -.mCS-minimal.mCSB_scrollTools_horizontal .mCSB_dragger, -.mCS-minimal-dark.mCSB_scrollTools_horizontal .mCSB_dragger { - width: 50px; -} -.mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.2); - filter: "alpha(opacity=20)"; - -ms-filter: "alpha(opacity=20)"; -} -.mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-minimal.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.5); - filter: "alpha(opacity=50)"; - -ms-filter: "alpha(opacity=50)"; -} -/* theme: "minimal-dark" */ -.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.2); - filter: "alpha(opacity=20)"; - -ms-filter: "alpha(opacity=20)"; -} -.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.5); - filter: "alpha(opacity=50)"; - -ms-filter: "alpha(opacity=50)"; -} -/* ---------------------------------------- */ -/* theme "light-3", "dark-3" */ -.mCS-light-3.mCSB_scrollTools .mCSB_draggerRail, -.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail { - width: 6px; - background-color: #000; - background-color: rgba(0, 0, 0, 0.2); -} -.mCS-light-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - width: 6px; -} -.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_draggerRail, -.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_draggerRail { - width: 100%; - height: 6px; - margin: 5px 0; -} -.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, -.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, -.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, -.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { - width: 12px; -} -.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, -.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, -.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, -.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { - height: 12px; - margin: 2px 0; -} -.mCS-light-3.mCSB_scrollTools .mCSB_buttonUp { - background-position: -32px -72px; -} -.mCS-light-3.mCSB_scrollTools .mCSB_buttonDown { - background-position: -32px -92px; -} -.mCS-light-3.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -40px -112px; -} -.mCS-light-3.mCSB_scrollTools .mCSB_buttonRight { - background-position: -40px -128px; -} -/* theme "dark-3" */ -.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.75); -} -.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.85); -} -.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-dark-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.9); -} -.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail { - background-color: #000; - background-color: rgba(0, 0, 0, 0.1); -} -.mCS-dark-3.mCSB_scrollTools .mCSB_buttonUp { - background-position: -112px -72px; -} -.mCS-dark-3.mCSB_scrollTools .mCSB_buttonDown { - background-position: -112px -92px; -} -.mCS-dark-3.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -120px -112px; -} -.mCS-dark-3.mCSB_scrollTools .mCSB_buttonRight { - background-position: -120px -128px; -} -/* ---------------------------------------- */ -/* theme "inset", "inset-dark", "inset-2", "inset-2-dark", "inset-3", "inset-3-dark" */ -.mCS-inset.mCSB_scrollTools .mCSB_draggerRail, -.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail, -.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail, -.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail, -.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail, -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail { - width: 12px; - background-color: #000; - background-color: rgba(0, 0, 0, 0.2); -} -.mCS-inset.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-inset-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - width: 6px; - margin: 3px 5px; - position: absolute; - height: auto; - top: 0; - bottom: 0; - left: 0; - right: 0; -} -.mCS-inset.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, -.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { - height: 6px; - margin: 5px 3px; - position: absolute; - width: auto; - top: 0; - bottom: 0; - left: 0; - right: 0; -} -.mCS-inset.mCSB_scrollTools_horizontal .mCSB_draggerRail, -.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail, -.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_draggerRail, -.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail, -.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_draggerRail, -.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail { - width: 100%; - height: 12px; - margin: 2px 0; -} -.mCS-inset.mCSB_scrollTools .mCSB_buttonUp, -.mCS-inset-2.mCSB_scrollTools .mCSB_buttonUp, -.mCS-inset-3.mCSB_scrollTools .mCSB_buttonUp { - background-position: -32px -72px; -} -.mCS-inset.mCSB_scrollTools .mCSB_buttonDown, -.mCS-inset-2.mCSB_scrollTools .mCSB_buttonDown, -.mCS-inset-3.mCSB_scrollTools .mCSB_buttonDown { - background-position: -32px -92px; -} -.mCS-inset.mCSB_scrollTools .mCSB_buttonLeft, -.mCS-inset-2.mCSB_scrollTools .mCSB_buttonLeft, -.mCS-inset-3.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -40px -112px; -} -.mCS-inset.mCSB_scrollTools .mCSB_buttonRight, -.mCS-inset-2.mCSB_scrollTools .mCSB_buttonRight, -.mCS-inset-3.mCSB_scrollTools .mCSB_buttonRight { - background-position: -40px -128px; -} -/* theme "inset-dark", "inset-2-dark", "inset-3-dark" */ -.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.75); -} -.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, -.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.85); -} -.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, -.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.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); -} -.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail, -.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail, -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail { - background-color: #000; - background-color: rgba(0, 0, 0, 0.1); -} -.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonUp, -.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonUp, -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonUp { - background-position: -112px -72px; -} -.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonDown, -.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonDown, -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonDown { - background-position: -112px -92px; -} -.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonLeft, -.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonLeft, -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -120px -112px; -} -.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonRight, -.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonRight, -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonRight { - background-position: -120px -128px; -} -/* theme "inset-2", "inset-2-dark" */ -.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail, -.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail { - background-color: transparent; - border-width: 1px; - border-style: solid; - border-color: #fff; - border-color: rgba(255, 255, 255, 0.2); - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; -} -.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail { - border-color: #000; - border-color: rgba(0, 0, 0, 0.2); -} -/* theme "inset-3", "inset-3-dark" */ -.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.6); -} -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail { - background-color: #000; - background-color: rgba(0, 0, 0, 0.6); -} -.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.75); -} -.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.85); -} -.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.mCS-inset-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { - background-color: #000; - background-color: rgba(0, 0, 0, 0.9); -} -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.75); -} -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { - background-color: #fff; - background-color: rgba(255, 255, 255, 0.85); -} -.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, -.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); -} -/* ---------------------------------------- */ -/* theme "bi-default" */ -.mCS-bi-default { - background-color: #dddddd; -} -.mCS-bi-default .mCSB_scrollTools.mCSB_scrollTools_horizontal { - height: 18px; -} -.mCS-bi-default .mCSB_scrollTools.mCSB_scrollTools_vertical { - width: 18px; -} -.mCS-bi-default .mCSB_scrollTools .mCSB_draggerRail { - border-radius: 0px; -} -.mCS-bi-default .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - border-radius: 2px; -} -.mCS-bi-default .mCSB_scrollTools.mCSB_scrollTools_horizontal a + .mCSB_draggerContainer { - margin: 0 18px; -} -.mCS-bi-default .mCSB_scrollTools.mCSB_scrollTools_vertical a + .mCSB_draggerContainer { - margin: 18px 0; -} -.mCS-bi-default.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - width: 14px; - margin: 0 2px; -} -.mCS-bi-default.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { - width: 100%; - height: 14px; - margin: 2px auto; -} -.mCS-bi-default.mCSB_scrollTools .mCSB_draggerRail { - width: 18px; - height: 100%; - margin: 0; -} -.mCS-bi-default.mCSB_scrollTools_horizontal .mCSB_draggerRail { - width: 100%; - height: 18px; - margin: 0; -} -.mCS-bi-default.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, -.mCS-bi-default.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { - width: 14px; -} -.mCS-bi-default.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, -.mCS-bi-default.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { - height: 14px; - margin: 2px 0; -} -.mCS-bi-default.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { - background-color: #f4f4f4; -} -.mCS-bi-default.mCSB_scrollTools .mCSB_draggerRail { - background-color: #dddddd; -} -.mCS-bi-default.mCSB_scrollTools .mCSB_buttonUp, -.mCS-bi-default.mCSB_scrollTools .mCSB_buttonDown, -.mCS-bi-default.mCSB_scrollTools .mCSB_buttonLeft, -.mCS-bi-default.mCSB_scrollTools .mCSB_buttonRight { - width: 16px; - height: 16px; - background-color: #f4f4f4; - border: 1px solid #eaeaea; - opacity: 1; - filter: alpha(opacity=100); -} -.mCS-bi-default.mCSB_scrollTools .mCSB_buttonUp { - background-position: -128px -1px; -} -.mCS-bi-default.mCSB_scrollTools .mCSB_buttonDown { - background-position: -128px -21px; -} -.mCS-bi-default.mCSB_scrollTools .mCSB_buttonLeft { - background-position: -142px -40px; -} -.mCS-bi-default.mCSB_scrollTools .mCSB_buttonRight { - background-position: -141px -56px; -} -/* ---------------------------------------- */