/* == malihu jquery custom scrollbar plugin == Plugin URI: http://manos.malihu.gr/jquery-custom-content-scroller */ /* CONTENTS: 1. BASIC STYLE - Plugin's basic/essential CSS properties (normally, should not be edited). 2. VERTICAL SCROLLBAR - Positioning and dimensions of vertical scrollbar. 3. HORIZONTAL SCROLLBAR - Positioning and dimensions of horizontal scrollbar. 4. VERTICAL AND HORIZONTAL SCROLLBARS - Positioning and dimensions of 2-axis scrollbars. 5. TRANSITIONS - CSS3 transitions for hover events, auto-expanded and auto-hidden scrollbars. 6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS 6.1 THEMES - Scrollbar colors, opacity, dimensions, backgrounds etc. via ready-to-use themes. */ /* ------------------------------------------------------------------------------------------------------------------------ 1. BASIC STYLE ------------------------------------------------------------------------------------------------------------------------ */ .mCustomScrollbar{ -ms-touch-action: 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: 8px; -moz-border-radius: 8px; border-radius: 8px; 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 .2s ease-in-out, background-color .2s ease-in-out; -moz-transition: opacity .2s ease-in-out, background-color .2s ease-in-out; -o-transition: opacity .2s ease-in-out, background-color .2s ease-in-out; transition: opacity .2s ease-in-out, background-color .2s ease-in-out; } .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar, /* auto-expanded scrollbar */ .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail{ -webkit-transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out; -moz-transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out; -o-transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out; transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out; } /* ------------------------------------------------------------------------------------------------------------------------ 6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS ------------------------------------------------------------------------------------------------------------------------ */ /* ---------------------------------------- 6.1 THEMES ---------------------------------------- */ /* default theme ("light") */ .mCSB_scrollTools{ opacity: 0.75; filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; } .mCS-autoHide > .mCustomScrollBox > .mCSB_scrollTools, .mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools{ opacity: 0; filter: "alpha(opacity=0)"; -ms-filter: "alpha(opacity=0)"; } .mCustomScrollbar > .mCustomScrollBox > .mCSB_scrollTools.mCSB_scrollTools_onDrag, .mCustomScrollbar > .mCustomScrollBox ~ .mCSB_scrollTools.mCSB_scrollTools_onDrag, .mCustomScrollBox:hover > .mCSB_scrollTools, .mCustomScrollBox:hover ~ .mCSB_scrollTools, .mCS-autoHide:hover > .mCustomScrollBox > .mCSB_scrollTools, .mCS-autoHide:hover > .mCustomScrollBox ~ .mCSB_scrollTools{ opacity: 1; filter: "alpha(opacity=100)"; -ms-filter: "alpha(opacity=100)"; } .mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.4); filter: "alpha(opacity=40)"; -ms-filter: "alpha(opacity=40)"; } .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.75); filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; } .mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.85); filter: "alpha(opacity=85)"; -ms-filter: "alpha(opacity=85)"; } .mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.9); filter: "alpha(opacity=90)"; -ms-filter: "alpha(opacity=90)"; } .mCSB_scrollTools .mCSB_buttonUp, .mCSB_scrollTools .mCSB_buttonDown, .mCSB_scrollTools .mCSB_buttonLeft, .mCSB_scrollTools .mCSB_buttonRight{ background-image: url(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); } /* ---------------------------------------- */ /*主体样式*/ .wrap{width: 1202px;margin: 0 auto;} a:hover{color: #0068b7} h3,h4,h5{font-weight: normal;} .top{text-align: right;padding-top: 18px;} .top span a{color: #c0c0c0} .top span a:hover{color: #0068b7} .top .one a{padding-left: 22px; padding-right: 34px;} .top .one .s-one{background: url(../../images/pc/z-1.png) no-repeat 0px 4px;} .top .one .s-two{background: url(../../images/pc/z-2.png) no-repeat 0px 4px;} .top .one .s-three{background: url(../../images/pc/z-3.png) no-repeat 0px 4px;} .top span .s-three{padding-right: 0} .top .two i{ background: url(../../images/pc/z-4.png) no-repeat 0px 0px; width: 14px;height: 14px;display: inline-block; margin:0px 28px -2px 37px;} .top span .on{color: #0068b7} .head-top{padding-bottom: 36px;border-bottom: 2px solid #0068b7} .head-top h1{float: left;} .head-top ul{float: right;margin-top: 25px; } .head-top ul li{float: left;padding-left: 33px;font-size: 18px;} .head-top ul li .on{color: #0068b7} .banner ul{position: relative; overflow: hidden;margin-top: 1px} .banner ul li{float: left;overflow: hidden;} .banner ul li a{display: block;overflow: hidden;} .banner img{width: 100%;height:auto;overflow: hidden;} .main{margin-top: 34px;} .main .m-left{float: left;width: 217px;margin-right: 50px;} .main .m-left ul{padding-top: 50px;background: url(../../images/pc/z-5.png) no-repeat;} .main .m-left ul li{position: relative;padding-left: 70px; width: 147px; height: 47px;border-bottom: 1px solid #979797;line-height: 48px} .main .m-left ul li a{font-size: 18px; color: #9f9f9f;} .main .m-left ul li a:hover{color: #0068b7;} .main .m-left ul li a:active{color: #0068b7;} .main .m-left ul li .on{color: #0068b7} .main .m-left ul li .on i{display: inline-block;width: 11px; height: 13px;position: absolute;background: url(../../images/pc/icon-1.png) no-repeat; top: 16px; left: 37px;} .main .m-left ul li a:hover i{display: inline-block;width: 11px; height: 13px;position: absolute;background: url(../../images/pc/icon-1.png) no-repeat; top: 16px; left: 37px;} .main .m-right{float: right;width: 935px;} .main .m-r-top{font-size: 18px;color: #979797} .main .m-r-top span{color: #0066cc} .main .m-right h3{text-align: center;font-size: 24px;color: #0066cc;font-weight: normal;padding-top: 30px;padding-bottom: 52px; background: url(../../images/pc/b-1.png) no-repeat 384px 27px;} .main .m-right .img{position: relative;z-index: 1} .main .m-right .img-left{width: 614px; height: 289px;} .main .m-right .img-right{background: #0068b7;width: 320px;height:289px;position: absolute;top: 0;right: 0; z-index: 2 ;text-align: center;} .main .m-right .img-right h4{color: #fff;font-size: 30px;font-weight: normal;margin-top: 81px;} .main .m-right .img-right h5{color:#c3ebfe;font-size: 18px;font-weight: normal;margin-top: 61px; } .main .m-right .artical{font-size: 14px; color: #7c7c7c} .main .m-right .artical p{margin-top: 28px; text-indent: 2em;line-height: 23px;letter-spacing: 1px;} #f-f-mid{float: right;} .footer{background: #6a6a6a;margin-top: 100px;line-height: 85px;font-size: 12px;color: #959595} .footer .f-left{float: left;} .footer .f-mid{float: right;} .footer .f-mid ul li{float: left;padding-right: 24px;margin-right: 22px; background: url(../../images/pc/f-1.png) no-repeat 70px 35px;} .footer .f-mid ul .last{background: none} .footer .f-mid ul li a{color: #959595} .footer .f-mid ul li a:hover{color: #0068b7} .footer .f-right{float: left; position: relative;width:155px;} /*董事长致辞*/ .m-right .bot .left{float: left; width: 545px;height: 508px; background: url(../../images/pc/t-1.png) no-repeat 423px 340px;} .m-right .bot .left p{margin-bottom: 31px; text-indent: 2em;color: #7c7c7c;line-height: 30px;letter-spacing: 1px;} .m-right .bot .right{float: right;} /*公司战略*/ .c-o-bot .o-left{float: left;margin-left: 60px; margin-top: 60px;} .c-o-bot .o-left img{box-shadow: 17px -17px #e5e5e5} .c-o-bot .o-right{float: left;margin-left: 95px; margin-top: 10px;font-size: 18px;color: #1472b2;} .c-o-bot .o-right li{position: relative;margin-top:35px;} .c-o-bot .o-right li i {background: url(../../images/pc/z-8.png) no-repeat;width: 30px;height: 30px;display: inline-block;*display: inline;text-align: center;line-height:30px;color:#FFFFFF;margin-right:5px;} .cu-two{margin-top: 70px;} .cu-two .bbot{margin-top: 58px;margin-left: 25px;margin-right: 25px;} .cu-two .bbot li{float: left;width:33% ;} .cu-two .bbot .bot{height: 230px;position:relative;margin-left: 37px;width: 237px;} .cu-two .bbot .bot{background: url(../../images/pc/z-11.png) no-repeat;} .cu-two .bbot .bot2{background: url(../../images/pc/z-6.png) no-repeat;} .cu-two .bbot .bot3{background: url(../../images/pc/z-7.png) no-repeat;} .cu-two .bbot li h5{font-size: 30px;color: #1472b2;text-align: center;margin-bottom: 20px;} .cu-two .bbot .bot p{width: 120px;font-size: 18px;color: #1472b2;position: absolute;top: 65px;left: 45px;} .cu-three{margin-top: 50px;} .cu-three .head-b{margin-top: 60px;} .cu-three .head-b li{float: left;width: 165px;margin-right: 27px;} .cu-three .head-b .last{margin-right: 0} .cu-three .head-b li .num{font-size: 30px;background: url(../../images/pc/d-5.png) no-repeat 38px 0; text-align: center;color: #fff} .cu-three .head-b li .content{background: #eaeaea url(../../images/pc/j-13.png) no-repeat; width: 167px;height: 91px; text-align: center;line-height: 91px;font-size: 24px;color: #1472b2;letter-spacing: 2px;margin-top: 7px;} .cu-four{margin-top: 60px;margin-bottom: -40px;} .cu-four img{display: block;margin: 50px auto;} /*公司治理*/ .people{font-size: 23px;color: #7c7c7c;margin-top: -15px;} /*如果24号字体 第三行会多出来一个字*/ .people p{margin-top: 12px;} .people span{color: #000} .people .p-bottom{margin-top: 55px;} .main-peo{font-size: 24px;color: #0066cc;margin-top: 62px;} .main-peo li{float: left;text-align: center;margin-left: 27px;} .main-peo .first{margin-left: 0} .main-peo li p{margin-top: 25px;} /*公司治理-2*/ .heying{ margin-top: 105px;} .heying img{display: block; margin: 0 auto} .heying p {font-size: 24px;margin-left: 110px;margin-top: 35px;} .heying p a{margin-left: 120px;color: #0066cc} /*领导人*/ .yanjiu img{float: left;} .yanjiu .right{float: left;width: 503px;height:287px;padding:30px 25px 20px 15px; background: #eaeaea} .yanjiu .right p{font-size: 14px;color: #7c7c7c;line-height: 29px;} /*企业文化*/ .culture .head .l{border-bottom: 1px dashed #434343; width: 400px;float: left;margin-top: 10px;} .culture .head span{color: #434343; font-size: 20px;text-align: center;float: left;padding:0 30px; margin-top: -5px;} .culture .head .r{border-bottom: 1px dashed #434343; width: 400px;float: left;margin-top: 10px;} .culture .c-one .bottom {margin-top: 53px; } .culture .c-one .bottom .b-left{width: 460px; float: left;} .culture .c-one .bottom .b-left .sense{position: relative; height: 460px;width: 408px;background: cover;} .culture .c-one .bottom .b-left .sense img{height: 408px; width: 408px;} .culture .c-one .bottom .b-left .sense .word{width: 100%;height: 115px; background: #0066cc;position: absolute;bottom: 0} .culture .c-one .bottom .b-left .sense h4{font-size: 36px;margin-left: 48px; color: #fff;border-bottom: 1px solid #fff;width: 108px;margin-top: 35px;} .culture .c-one .bottom .b-left .sense h5{font-size: 30px;margin-left: 48px; color: #fff;margin-top: 18px; text-align: left;} .culture .c-one .bottom ul{float: left;margin-top: 90px;} .culture .c-one .bottom li{position: relative;background:url(../../images/pc/z-17.png) no-repeat 0 3px; padding-left: 43px; font-size: 20px;margin-top: 31px; text-align:left;} .culture .c-two{margin-top: 60px;} .culture .c-two .bottom{margin-top: 60px;} .culture .c-two .bottom li{float: left;height: 340px;background: #f1f1f1;padding-top: 60px;padding-left: 64px;padding-right: 64px;border-right: 1px solid #b0b0b0} .culture .c-two .bottom li img{width: 180px;height: 222px;} .culture .c-two .bottom li p{margin-top: 20px;} .culture .c-two .bottom li p a{color: #6a6a6a;font-size: 20px;} .culture .c-two .bottom li:hover {background: #0066cc} .culture .c-two .bottom li:hover a{color: #fff} .culture .c-three .head{margin-top: 60px;} .culture .c-three .head span{color: #434343; font-size: 20px;text-align: center;float: left;padding:0 25px; margin-top: -5px;} .culture .c-four .head span{color: #434343; font-size: 20px;text-align: center;float: left;padding:0 35px; margin-top: -5px;} .culture .c-three .bottom{position: relative; margin-top: 60px;height: 402px;} .culture .c-three .bottom li{width: 248px;height: 191px;} .culture .c-three .bottom .one{position: absolute;top:0;left: 0; } .culture .c-three .bottom .two{position: absolute;top:196px;left: 205px;} .culture .c-three .bottom .three{position: absolute;top:0px;left: 441px; } .culture .c-three .bottom .four{position: absolute;top:196px;left: 701px;} .culture .c-three .bottom li img{position: absolute; top: 0;left: 42px;} .culture .c-three .bottom li h2{font-size: 60px;color: #0066cc;position: absolute;top: 129px;left: 0} .culture .c-three .bottom li .p1{font-size: 20px;color: #434343;position: absolute;top: 134px;left: 75px;} .culture .c-three .bottom li .p2{font-size: 18px;color: #434343;position: absolute;top: 174px;left: 99px;} .culture .c-four{margin-top: 60px;} .culture .c-four .bottom{margin-top: 60px;} .culture .c-four .bottom .left{float: left;} .culture .c-four .bottom .left p{margin-top: 32px;font-size: 20px;color: #434343} .culture .c-four .bottom .right{float: right;} .culture .c-four .bottom .right img{width: 320px;height: 311px;} .culture .c-four .bottom .left .p1{padding-left: 45px;} .culture .c-four .bottom .left .p2{padding-left: 86px;} .culture .c-four .bottom .left .p3{padding-left: 45px;} .culture .c-four .bottom .left .p4{padding-left: 86px;} /*发展历程*/ .development ul{} .development .top ul li{float: left;width: 285px;height: 60px;position: relative;background: url(../../images/pc/z-l1.png) no-repeat 30px 0;cursor:pointer;} .development .top ul li.on{background: url(../../images/pc/z-l2.png) no-repeat 30px 0;;} .development .top ul li.on p{color:#0066cc;} .development .top ul li .da{border-bottom: 1px dashed #b7b7b7;width: 200px; position: absolute;top: 15px;left: 88px;} .development .top ul li p{font-size: 18px;color: #b7b7b7;position: absolute;bottom: 0;left: 0;width:100px;text-align: center;} .development .top ul .last{ width: 100px;position: relative;margin-left: -20px;} .development .top ul .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{border-radius:8px;} .development .bottom{margin-top: 38px; background: #E4F1FF;} .development .bottom ul{display: none;height:800px;overflow: hidden;} .development .bottom ul li:first-child{margin-top:20px;} .development .bottom ul .mCSB_scrollTools{width:20px;background:#58a3ee;} .development .bottom ul .mCSB_scrollTools .mCSB_draggerRail{width:20px;background:#58a3ee;} .development .bottom ul .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{width:20px;background:#dddde1;} .development .bottom h4{margin-left: 45px; font-size: 18px;color: #fff;background: #0066cc;width:140px;height:45px; line-height: 45px;text-align: center; border-radius: 25px; } .development .bottom .left{float: left; margin-left: 45px;width: 470px;margin-top: 12px;} .development .bottom .left p{font-size: 18px;color: #5f5f5f;padding-left: 35px;background: url(../../images/pc/p-icon.png) no-repeat 0 6px;margin-top: 10px; text-align: left;} .development .bottom .right{float: right;width:250px;} .development .bottom .right img{width: 235px;height: 152px;padding: 5px;border: 1px solid #0066cc;margin-top: 27px;margin-right: 156px;} .development .bottom .bbo{width: 890px;border-bottom: 1px dashed #a6b6b9;margin-top: 22px;margin-bottom: 22px;margin-left: 8px;} .development .bottom .bbo .last{margin-bottom: 35px;} /*全球发展*/ .earth .top li{margin-top: -20px; color: #fff; float: left;width:165px ;height: 51px;line-height: 51px;font-size: 18px;background: #c9c9ca;text-align: center;margin-right: 10px;cursor: pointer;} .earth .top .active{ background: #0066cc;} .earth .bottom .hide {display: none} .earth .bottom .aaa{display: block;} .earth .bottom .one .img{width: 935px;height: 570px;overflow: hidden;margin-top: 27px;} .earth .bottom .one img{margin-top: -160px;} .earth .bottom .artical{margin-top: 65px;padding-left: 8px;position: relative;text-align: left;} .earth .bottom .artical h6{font-weight: normal;margin-bottom: 40px;text-indent: 2em;} .earth .bottom .artical p{position: relative;background:url(../../images/pc/003.png) no-repeat 0px 5px;margin-bottom:0px;} /*2*/ .earth .bottom .two .img{margin-top: 27px;width: 935px;height: 570px;overflow: hidden;} .earth .bottom .two img{margin-top: -40px;} /*3*/ .earth .bottom .three h6{margin-top: -40px;} .earth .bottom .three .boot{background: #f2f2f2;margin-top: 50px;height: 411px;position: relative;} .earth .bottom .three .boot .i1{position: absolute;top:47px;left: 60px;} .earth .bottom .three .boot .i2{position: absolute;top:31px;left: 332px;} .earth .bottom .three .boot .i3{position: absolute;top:37px;left: 510px;} .earth .bottom .three .boot .i4{position: absolute;top:44px;left: 717px;} .earth .bottom .three .boot .i5{position: absolute;top:167px;left: 60px;} .earth .bottom .three .boot .i6{position: absolute;top:167px;left: 234px;} .earth .bottom .three .boot .i7{position: absolute;top:167px;left: 426px;} .earth .bottom .three .boot .i8{position: absolute;top:184px;left: 670px;} .earth .bottom .three .boot .i9{position: absolute;top:314px;left: 60px;} .earth .bottom .three .boot .i10{position: absolute;top:314px;left: 247px;} .earth .bottom .three .boot .i11{position: absolute;top:260px;left: 531px;} .earth .bottom .three .boot .i12{position: absolute;top:302px;left: 790px;} /*社会责任*/ .respon-top{font-size: 16px;color: #7c7c7c;text-indent: 2em;line-height: 1.75;margin-bottom: 42px;} .respon-bot div{width: 310px;height: 405px;float: left;line-height: 405px;text-align: center;color: #fff;font-size: 30px;cursor: pointer;margin-bottom: -5px;} .respon-bot div a{color: #fff} .respon-bot div a:hover{color: #0066cc} .respon-bot .one{background: url(../../images/pc/z-2a.png) no-repeat -109px -15px;margin-top: 88px;} .respon-bot .two{background: url(../../images/pc/z-2b.png) no-repeat -61px -15px;margin-top: 30px;} .respon-bot .three{background: url(../../images/pc/z-2d.png) no-repeat -136px 5px;margin-top: 83px;} /*1*/ .ccc{font-size: 18px;font-weight: thick;} .res{margin-top: 35px;} .res-left{float: left; width: 371px;} .res-left img{width: 370px; height: 200px;margin-bottom: 60px;} .res-right{float: left;width: 490px;margin-left: 37px;font-size: 14px;color: #7c7c7c;line-height: 1.8;margin-top: -10px;} .res-right p{padding-left: 40px;background: url(../../images/pc/z-555.png) no-repeat 0 9px;margin-bottom: 20px;} /*2*/ .res-t{margin-bottom: -50px;} /*3*/ /*产业布局*/ /* 1孵化器*/ .fuhua{font-size: 14px;color: #7c7c7c;line-height: 2.28;} .fuhua .top{margin-top: 20px;text-align: left;text-indent: 2em;} .fuhua .mid {background: url(../../images/pc/cc-1.png) no-repeat 80px 65px; height: 633px;} .fuhua .mid img{float: left;width: 467px;margin-top: 120px;margin-left: -25px;} .fuhua .mid .content{float: right;width: 480px;position: relative;height:600px;} .fuhua .mid .content p{font-size: 16px;color: #373737;position: absolute;} .fuhua .mid .content .c1{top: 68px;right: 65px;} .fuhua .mid .content .c2{top: 128px;right: 70px;} .fuhua .mid .content .c3{top: 190px;right: 32px; width: 343px;} .fuhua .mid .content .c4{top: 275px;right: 0px; width: 343px;} .fuhua .mid .content .c5{top: 360px;right: 0px; width: 378px;} .fuhua .mid .content .c6{top: 437px;right: 0px;} .fuhua .mid .content .c7{top: 497px;right: 80px;} .fuhua .bottom .b-top li{width: 300px;height: 280px;position: relative;float: left;margin-right: 15px;text-align: center;font-size: 18px; color: #0066cc;} .fuhua .bottom .b-top .last{margin-right: 0} .fuhua .bottom .b-top li div{width: 300px;height: 75px;} .fuhua .bottom .b-top li:hover div{background:#0066cc ;color: #fff;} .fuhua .bottom .b-top li:hover .img2{display: block;} .fuhua .bottom li .on{background: #0066cc; color: #fff;} .fuhua .bottom .b-top .on1 .img2 {display: block;} .fuhua .bottom .b-top li>img{position: relative;z-index:1;} .fuhua .bottom .b-top li .img2{position: absolute;top: 186px;left: 125px;display: none;z-index:2;} .mid-box{display: table;margin: 0 auto;position: relative;} .mid-i{display: table-cell;vertical-align: middle;width: 100%;text-align: center; *position:absolute; *top:50%; *left:50%;} /*多行文本垂直居中解决方案*/ .mid-i p{position:relative; *top:-50%; *left:-50%;line-height: 1.3;} .fuhua .bottom .b-bot{margin-top: 44px;position: relative;height: 95px} .fuhua .bottom .b-bot img{position: absolute; } .fuhua .bottom .b-bot .i0{top: 0 ;left: 0;} .fuhua .bottom .b-bot .i1{top: 5px ;left: 176px;} .fuhua .bottom .b-bot .i2{top: 0 ;left: 426px;} .fuhua .bottom .b-bot .i3{top: 0 ;left: 588px;} .fuhua .bottom .b-bot .i4{top: 0 ;left: 810px;} .fuhua .bottom .b-bot .i5{top: 65px ;left: 0px;} .fuhua .bottom .b-bot .i6{top: 30px ;left: 200px;} /*2科技产业*/ .keji .header{margin-top: 50px;} .keji .header li{float: left;width: 165px; height: 50px; background: #c9c9ca ;line-height: 50px;color: #fff;text-align: center;margin-right: 10px;position: relative;} .keji .header li:hover{background: #0066CC url(../../images/pc/ico-1.png) no-repeat 67px 35px;} .keji .header li:hover div{display: block;} .keji .header li a{font-size: 18px;color: #fff;} .keji .header .on{background: #0066CC url(../../images/pc/ico-1.png) no-repeat 67px 35px;} .keji .top{margin-top: 0px;} #keji1 .mid {background: url(../../images/pc/cc-11.png) no-repeat 78px 50px; height: 600px;} #keji1 .mid .img{float: left; width: 350px;height: 600px;overflow: hidden;background: url(../../images/pc/cc-4.png) no-repeat 0 132px;} .keji .mid .content p{line-height: 1.5;position: absolute;} .keji .mid .k1{top:72px ; right: 32px; width: 359px;} .keji .mid .k2{top:162px ; right: 2px;} .keji .mid .k3{top:242px ; right: 0px; width: 338px;} .keji .mid .k4{top:336px ; right: 0px; width: 338px;} .keji .mid .k5{top:433px ; width: 374px;left:80px;} .keji .bottom li div{width: 300px; height: 75px;background: #fff;} .keji .bottom li:hover div{background: #0066CC;color: #fff;} .keji .bottom li .on{background: #0066cc; color: #fff;} .keji .bottom .b-top .on .img2{display: block;} .keji .bottom .b-bot{margin-top: 0px;} .keji .bottom .b-bot .i7{top: 56px ;left: 0;} .keji .bottom .b-bot .i8{top: 66px ;left: 158px;} .keji .bottom .b-bot .i9{top: 50px ;left: 355px;} .keji .bottom .b-bot .i10{top: 60px ;left: 503px;} .keji .bottom .b-bot .i11{top: 60px ;left: 670px;} /*2科技产业(2)*/ #keji2 .mid .img{float: left; width: 350px;height: 600px;overflow: hidden;background: url(../../images/pc/cc-5.png) no-repeat 0 120px;} #keji2 .mid {background: url(../../images/pc/cct-11.png) no-repeat 78px 65px; height: 600px;} #keji2 .mid p{right: 0;} #keji2 .mid .k21{top: 70px; width: 430px;} #keji2 .mid .k22{top: 165px; width: 370px;} #keji2 .mid .k23{top: 245px; width: 370px;} #keji2 .mid .k24{top: 345px; width: 370px;} #keji2 .mid .k25{top: 455px; width: 420px;} #keji2 .bottom .b-top .mid-i{ font-size: 14px; color: #0066CC;} #keji2 .bottom .b-top li:hover p{font-size: 14px; color: #FFFFFF;} #keji2 .bottom .b-top .on p{font-size: 14px; color: #FFFFFF;} #keji2 .bottom .b-bot{margin-bottom: 45px;} #keji2 .bottom .b-bot .i12{top: 94px;left: 0;} #keji2 .bottom .b-bot .i13{top: 97px;left: 242px;} #keji2 .bottom .b-bot .i14{top: 99px;left: 410px;} #keji2 .bottom .b-bot .i15{top: 94px;left: 560px;} #keji2 .bottom .b-bot .i16{top: 90px;left: 710px;} /*2科技产业(3)*/ #keji3 .mid .img{float: left; width: 350px;height: 600px;overflow: hidden;background: url(../../images/pc/cc-6.png) no-repeat 0 140px;} #keji3 .mid {background: url(../../images/pc/cct-11.png) no-repeat 78px 40px; height: 600px;} #keji3 .mid p{right: 0;} #keji3 .mid .k31{top: 45px; width: 415px;} #keji3 .mid .k32{top: 130px; width: 370px;} #keji3 .mid .k33{top: 225px; width: 365px;} #keji3 .mid .k34{top: 325px; width: 370px;} #keji3 .mid .k35{top: 440px; width: 400px;} #keji3 .bottom .b-bot .i17{top: 50px;left: 0px;} #keji3 .bottom .b-bot .i18{top: 40px;left: 212px;} #keji3 .bottom .b-bot .i19{top: 45px;left: 400px;} /*3创新服务*/ #fuwu .top {margin-top: 15px;} #fuwu .mid .img{float: left; width: 350px;height: 600px;overflow: hidden;background: url(../../images/pc/cc-7.png) no-repeat 0 140px;} #fuwu .mid {background: url(../../images/pc/cc-12.png) no-repeat 65px 80px; height: 600px;margin-bottom: 80px;} #fuwu .mid p{right: 0;} #fuwu .mid .k41{top: 35px; width: 513px;} #fuwu .mid .k42{top: 105px; width: 415px;} #fuwu .mid .k43{top: 190px; width: 375px;} #fuwu .mid .k44{top: 280px; width: 365px;} #fuwu .mid .k45{top: 390px; width: 365px; right: 5px;} #fuwu .mid .k46{top: 450px; width: 405px;} #fuwu .mid .k47{top: 510px; width: 450px;} #fuwu .mid .k48{top: 570px; width: 460px; right: 30px;} #fuwu .bottom .b-bot .i20{top: 55px;left: 0;} #fuwu .bottom .b-bot .i29{top: 55px;left: 175px;} #fuwu .bottom .b-bot .i21{top: 55px;left: 355px;} /*4科技金融*/ #jinrong .top{margin-top: 15px;} #jinrong .mid .img{float: left;width :425px ;height: 600px; background: url(../../images/pc/cc-8.png) no-repeat -100px 145px;} #jinrong .mid {background: url(../../images/pc/cc-13.png) no-repeat 65px 60px; height: 600px;margin-bottom: 80px;} #jinrong .mid p{right: 0;} #jinrong .mid .k51{top: 50px; width: 395px;right:auto;left:50px;} #jinrong .mid .k52{top: 200px; width: 362px;} #jinrong .mid .k53{top: 325px; width: 355px;} #jinrong .mid .k54{top: 440px; width: 388px;right:auto;left:50px;} #jinrong .bottom {padding-bottom: 40px;} #jinrong .bottom .b-bot .i22{top: 100px; left: 0;} #jinrong .bottom .b-bot .i23{top: 100px; left: 189px;} /*5创意产业*/ #chanye .top{margin-top: 15px;} #chanye .mid .img{float: left;width :425px ;height: 600px; background: url(../../images/pc/cc-9.png) no-repeat 0px 145px;} #chanye .mid {background: url(../../images/pc/cc-13.png) no-repeat 65px 75px; height: 600px;margin-bottom: 80px;} #chanye .mid p{right: 0;} #chanye .mid .k61{top:80px;width: 395px; right: 18px;} #chanye .mid .k62{top:202px;width: 365px; } #chanye .mid .k63{top:350px;width: 365px; } #chanye .mid .k64{top:490px;width: 427px; } #chanye .bottom {padding-bottom: 20px;} #chanye .bottom .b-bot .i24{top:64px; left: 0;} #chanye .bottom .b-bot .i25{top:66px; left: 130px;} #chanye .bottom .b-bot .i26{top:64px; left: 309px;} #chanye .bottom .b-bot .i27{top:64px; left: 498px;} /*6在线教育*/ #education .top{margin-top: 15px;} #education .mid .img{float: left;width :425px ;height: 600px; background: url(../../images/pc/cc-10.png) no-repeat 0px 145px;} #education .mid {background: url(../../images/pc/cc-14.png) no-repeat 65px 75px; height: 600px;margin-bottom: 80px;} #education .mid .k71{top:30px;width: 414px; right: 10px;} #education .mid .k72{top:118px;width: 377px; right: 5px;} #education .mid .k73{top:242px;width: 360px; right: 0px;} #education .mid .k74{top:340px;width: 360px; right: 0px;} #education .mid .k75{top:350px;width: 378px; right: 0px;} #education .mid .k76{top:445px;width: 430px; right: 0px;} #education .bottom {margin-bottom: -62px;} #education .bottom .b-bot .i28{top:40px; left: 0;} /*创新创业*/ /*1技术创新*/ .chuang .top {text-align: left;text-indent: 2em;color: #434343;margin-top: 50px;letter-spacing: 1.5px;padding-bottom: 21px;border-bottom: 1px solid #c7c7c7; font-size: 16px;} .chuang .top h4{font-size: 18px; font-weight: 600;text-indent: 0;color: #0068b7;margin-bottom: 16px;} .chuang .mid ul li{float: left;width: 180px; height: 50px; background: #c9c9ca;line-height: 50px;text-align: center;margin-right: 5px;margin-top: 21px;position: relative;} .chuang .mid ul li a{font-size:18px; color: #FFFFFF;} .chuang .mid ul li:hover{background: #0066CC;} .chuang .mid ul li:hover i{display: block; width: 28px; height: 28px;background: url(../../images/pc/ico-0.png) no-repeat; position: absolute;bottom: -14px;left: 76px;} .chuang .mid ul .on{background: #0066CC;} .chuang .mid ul .on i{display: block; width: 28px; height: 28px;background: url(../../images/pc/ico-0.png) no-repeat; position: absolute;bottom: -14px;left: 76px;} .chuang .bottom .list {margin-top: 23px;font-size: 14px; color: #7c7c7c;} .chuang .bottom .list h4{font-size: 18px; text-align: left; } .chuang .bottom .list dl{margin:25px 0;position: relative;overflow: hidden;} .chuang .bottom .list dt{width: 355px;padding: 3px;border: 1px solid #e1e1e1;overflow: hidden;float: left;} .chuang .bottom .list dt a{height: auto;} .chuang .bottom .list dt img{width: 355px; height: 200px;} .chuang .bottom .list dd{margin:16px 0 16px 380px;width:520px;text-align:left;display: block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;} .chuang .bottom .list dl > dd + dd + dd + dd + dd + dd{display: none;} .chuang .bottom .list dd p{display: block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;} .chuang .bottom .list a{display: block;width: 100%; height: 38px;background: #dcdcdc;line-height: 38px;font-size: 18px;text-align: center;color: #fefefe;} .chuang .bottom .last{margin-bottom: -70px;} .chuang .bottom .last dl{margin-bottom: 20px;} .zhongda .top{padding-bottom: 5px;} /*重大成果创新*/ .chengguo .top{padding-bottom: 5px;} .chengguo .mid .bottom{height: 1250px;width: 1000px;} .chengguo .mid .bottom li{height: 250px; width: 220px;float: left;overflow: hidden;margin-top: 20px;margin-right: 20px;} .chengguo .mid .bottom li img{width: 220px;height: 145px;} .chengguo .mid .bottom li a{font-size: 14px;color: #0068b7; height: 90px;line-height: 24px;text-align: left;padding-top: 15px;letter-spacing: 2px;background-color: #FFFFFF;} .bottom {text-align: right;} .bottom-ad{margin-top: 30px;margin-bottom: -30px;} .bottom span {font-size: 14px; color: #7b7b7b;display: inline-block;letter-spacing: 2px;} .bottom a{display: inline-block;width: 30px;height: 30px;line-height: 30px;text-align: center;} .bottom a:hover{background: #0068b7;color: #FFFFFF;border-radius: 3px;} .bottom .next{width: 70px;background: #0068B7;border-radius: 3px;color: #FFFFFF;} .b-bott {margin-top: 20px;} /*双创基地*/ .shuangchuang .top{letter-spacing: 0; font-size:16px;border-bottom: 0;} .shuangchuang .mid {width: 100%; height: 730px;background: url(../../images/pc/map.png) no-repeat center center;border-bottom: 1px solid #c9c9c9;} .shuangchuang .mid a{display: block;width: 100%;height:730px;} .shuangchuang .bottom{padding-top: 50px;padding-left: 40px;margin-bottom: -35px;} .shuangchuang .bottom h4{padding-left: 35px;background: url(../../images/pc/ico-4.png) no-repeat left top; font-size: 18px; color: #0066cc; text-align: left;} .shuangchuang .bottom .h4{background: url(../../images/pc/ico-5.png) no-repeat left top;} .shuangchuang .bottom .b-bottom{ margin-top: 60px;} /*双创基地2*/ #s-zhankai .content{width: 715px; height: 280px; margin: 180px auto; background: #f6f6f6;padding-top: 30px;padding-left:45px;} #s-zhankai .content li{width: 150px; height: 60px;text-align: left;line-height: 25px;background: none; border-top: 1px solid; padding-top: 10px;font-size: 16px; color: #161616;margin-left: 20px;} /*创业课堂*/ .ketang .top{ margin-top: 50px;font-size: 16px; color: #5f5e5e;text-align: left;text-indent: 2em;line-height: 24px; border-bottom: 4px solid #7C7C7C;padding-bottom: 35px;} .ketang .mid { margin-top: 2px;border-top: 1px solid #7C7C7C;} .ketang .mid dl {margin-top: 35px;} .ketang .mid dt{float: left;width: 463px; height: 250px;overflow: hidden;} .ketang .mid dt img{border: 1px solid #d7d7d7; width: 460px; height: 248px;} .ketang .mid dd{float: left;width: 452px;margin-left: 15px;font-size: 14px; color: #959595;letter-spacing: 0.5px;text-indent: 2em;margin-top: 90px;} .ketang .mid dd h4{font-size: 18px;margin-left:5px; background: url(../../images/pc/ico-6.png) no-repeat left center;margin-bottom: 25px;} .ketang .mid .two img{margin-left: -60px;margin-top: -40px;} .ketang .mid .two dd{margin-top: 62px;} .ketang .mid .three dd{margin-top: 93px;} .ketang .mid .four dd{margin-top: 72px;} .ketang .mid .five dd{margin-top: 45px;} .ketang .bottom {text-align: right;margin-top: 70px;margin-bottom: -30px;} .ketang .bottom span {font-size: 14px; color: #7b7b7b;display: inline-block;letter-spacing: 2px;} .ketang .bottom a{display: inline-block;width: 30px;height: 30px;line-height: 30px;text-align: center;} .ketang .bottom a:hover{background: #0068b7;color: #FFFFFF;border-radius: 3px;} .ketang .bottom .next{width: 70px; background: #0068B7;border-radius: 3px;} /*创业导师*/ .daoshi .top{margin-top: 50px; font-size: 16px;color: #5F5E5E;text-align: left;text-indent: 2em;line-height: 20px;border-bottom: 1px solid #7C7C7C;padding-bottom: 20px;} .daoshi .mid{margin-bottom: -50px;} .daoshi .left{float: left;width: 34px;background: #e5e5e5;margin-top: 30px;height: 793px;text-align: center;line-height: 793px;} .daoshi .left a{color: #FFFFFF;font-size: 28px; display: block;} .daoshi ul{float: left;width: 850px;margin-left: 5px;margin-top: 32px;} .daoshi ul li{float: left;width: 420px;height: 270px;position: relative;} .daoshi ul li dt{float: left;overflow: hidden;width: 218px;} .daoshi ul li dt img{width: 211px; height: 242px;padding: 4px 2px 2px;border: 1px solid #919191;} .daoshi ul li dd{float: left;margin-left: 12px;width: 180px;height: 175px; overflow: hidden;text-overflow: ellipsis;} .daoshi ul li dd h4{font-size: 16px;color: #0066cc;font-weight: bold;padding-bottom: 15px;border-bottom: 1px solid #d6d6d6;} .daoshi ul li dd p{width: 180px;color: #2e2e2e;margin-top: 8px;text-overflow: ellipsis;} .daoshi ul li dd a{position: absolute; right: 0; bottom: 20px;color: #cbcbcb;} .daoshi .right{float: right;width: 34px;background: #e5e5e5;margin-top: 30px;height: 793px;text-align: center;line-height: 793px;} .daoshi .right a{color: #FFFFFF;font-size: 28px; display: block;} .daoshi a:hover{color: #0066CC;} .keji .contents .con{display:none;} .textIndent div,.textIndent p{text-indent: 2em;} .select-box1 .dt a.le{width:11px;height:12px;float: left;margin-top:6px;} .select-box1 .dt a.ri{width:120px;height:21px;float: right;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;} .select-box1 .dd{background:url(../../images/al-2.png) no-repeat left center;padding-left:16px;margin-left:12px;} .header-m .select-box1 dd{padding:0 10px;width:170px;} .select-box1 .dt a.main1{margin-bottom:0;margin-top:0;border-bottom:0;display: block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;} .header-m .select-box1 .dd a{display: block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;text-align: left;} .select-box1 .dl .dd{display: none;} .header-m .select-box1 dd{height: auto;height:170px;} .header-m .select-box1.click:hover dd{display:none;} .header-m .select-box1.click{cursor: pointer;}