/* == malihu jquery custom scrollbar plugin == Plugin URI: http://manos.malihu.gr/jquery-custom-content-scroller */ /* CONTENTS: 1. BASIC STYLE - Plugin's basic/essential CSS properties (normally, should not be edited). 2. VERTICAL SCROLLBAR - Positioning and dimensions of vertical scrollbar. 3. HORIZONTAL SCROLLBAR - Positioning and dimensions of horizontal scrollbar. 4. VERTICAL AND HORIZONTAL SCROLLBARS - Positioning and dimensions of 2-axis scrollbars. 5. TRANSITIONS - CSS3 transitions for hover events, auto-expanded and auto-hidden scrollbars. 6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS 6.1 THEMES - Scrollbar colors, opacity, dimensions, backgrounds etc. via ready-to-use themes. */ /* ------------------------------------------------------------------------------------------------------------------------ 1. BASIC STYLE ------------------------------------------------------------------------------------------------------------------------ */ .mCustomScrollbar{ -ms-touch-action: none; touch-action: none; /* MSPointer events - direct all pointer events to js */ } .mCustomScrollbar.mCS_no_scrollbar{ -ms-touch-action: auto; touch-action: auto; } .mCustomScrollBox{ /* contains plugin's markup */ position: relative; overflow: hidden; height: 100%; max-width: 100%; outline: none; direction: ltr; } .mCSB_container{ /* contains the original content */ overflow: hidden; width: auto; height: auto; } /* ------------------------------------------------------------------------------------------------------------------------ 2. VERTICAL SCROLLBAR y-axis ------------------------------------------------------------------------------------------------------------------------ */ .mCSB_inside > .mCSB_container{ margin-right: 30px; } .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden{ margin-right: 0; } /* non-visible scrollbar */ .mCS-dir-rtl > .mCSB_inside > .mCSB_container{ /* RTL direction/left-side scrollbar */ margin-right: 0; margin-left: 30px; } .mCS-dir-rtl > .mCSB_inside > .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden{ margin-left: 0; } /* RTL direction/left-side scrollbar */ .mCSB_scrollTools{ /* contains scrollbar markup (draggable element, dragger rail, buttons etc.) */ position: absolute; width: 6px; height: auto; left: auto; top: 0; right: 0; bottom: 0; background-color:#dddddd; } .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: 6px; height: 100%; margin: 0 auto; text-align: center; } .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{ width: 12px; /* auto-expanded scrollbar */ } .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{ width: 8px; /* auto-expanded scrollbar */ } .mCSB_scrollTools .mCSB_buttonUp, .mCSB_scrollTools .mCSB_buttonDown{ display: block; position: absolute; height: 20px; width: 100%; overflow: hidden; margin: 0 auto; cursor: pointer; } .mCSB_scrollTools .mCSB_buttonDown{ bottom: 0; } /* ------------------------------------------------------------------------------------------------------------------------ 3. HORIZONTAL SCROLLBAR x-axis ------------------------------------------------------------------------------------------------------------------------ */ .mCSB_horizontal.mCSB_inside > .mCSB_container{ margin-right: 0; margin-bottom: 30px; } .mCSB_horizontal.mCSB_outside > .mCSB_container{ min-height: 100%; } .mCSB_horizontal > .mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden{ margin-bottom: 0; } /* non-visible scrollbar */ .mCSB_scrollTools.mCSB_scrollTools_horizontal{ width: auto; height: 16px; top: auto; right: 0; bottom: 0; left: 0; } .mCustomScrollBox + .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal{ bottom: -26px; } /* scrollbar position: outside */ .mCSB_scrollTools.mCSB_scrollTools_horizontal a + .mCSB_draggerContainer{ margin: 0 20px; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail{ width: 100%; height: 2px; margin: 7px 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger{ width: 30px; /* minimum dragger width */ height: 100%; left: 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ width: 100%; height: 4px; margin: 6px auto; } .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{ height: 12px; /* auto-expanded scrollbar */ margin: 2px auto; } .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{ height: 8px; /* auto-expanded scrollbar */ margin: 4px 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft, .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight{ display: block; position: absolute; width: 20px; height: 100%; overflow: hidden; margin: 0 auto; cursor: pointer; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft{ left: 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight{ right: 0; } /* ------------------------------------------------------------------------------------------------------------------------ 4. VERTICAL AND HORIZONTAL SCROLLBARS yx-axis ------------------------------------------------------------------------------------------------------------------------ */ .mCSB_container_wrapper{ position: absolute; height: auto; width: auto; overflow: hidden; top: 0; left: 0; right: 0; bottom: 0; margin-right: 30px; margin-bottom: 30px; } .mCSB_container_wrapper > .mCSB_container{ padding-right: 30px; padding-bottom: 30px; } .mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_vertical{ bottom: 20px; } .mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_horizontal{ right: 20px; } /* non-visible horizontal scrollbar */ .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden + .mCSB_scrollTools.mCSB_scrollTools_vertical{ bottom: 0; } /* non-visible vertical scrollbar/RTL direction/left-side scrollbar */ .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal{ right: 0; } /* RTL direction/left-side scrollbar */ .mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal{ left: 20px; } /* non-visible scrollbar/RTL direction/left-side scrollbar */ .mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal{ left: 0; } .mCS-dir-rtl > .mCSB_inside > .mCSB_container_wrapper{ /* RTL direction/left-side scrollbar */ margin-right: 0; margin-left: 30px; } .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden > .mCSB_container{ padding-right: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden > .mCSB_container{ padding-bottom: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden{ margin-right: 0; /* non-visible scrollbar */ margin-left: 0; } /* non-visible horizontal scrollbar */ .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden{ margin-bottom: 0; } /* ------------------------------------------------------------------------------------------------------------------------ 5. TRANSITIONS ------------------------------------------------------------------------------------------------------------------------ */ .mCSB_scrollTools, .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCSB_scrollTools .mCSB_buttonUp, .mCSB_scrollTools .mCSB_buttonDown, .mCSB_scrollTools .mCSB_buttonLeft, .mCSB_scrollTools .mCSB_buttonRight{ -webkit-transition: opacity .2s ease-in-out, background-color .2s ease-in-out; -moz-transition: opacity .2s ease-in-out, background-color .2s ease-in-out; -o-transition: opacity .2s ease-in-out, background-color .2s ease-in-out; transition: opacity .2s ease-in-out, background-color .2s ease-in-out; } .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar, /* auto-expanded scrollbar */ .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail{ -webkit-transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out; -moz-transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out; -o-transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out; transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out; } /* ------------------------------------------------------------------------------------------------------------------------ 6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS ------------------------------------------------------------------------------------------------------------------------ */ /* ---------------------------------------- 6.1 THEMES ---------------------------------------- */ /* default theme ("light") */ .mCSB_scrollTools{ opacity: 0.75; filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; } .mCS-autoHide > .mCustomScrollBox > .mCSB_scrollTools, .mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools{ opacity: 0; filter: "alpha(opacity=0)"; -ms-filter: "alpha(opacity=0)"; } .mCustomScrollbar > .mCustomScrollBox > .mCSB_scrollTools.mCSB_scrollTools_onDrag, .mCustomScrollbar > .mCustomScrollBox ~ .mCSB_scrollTools.mCSB_scrollTools_onDrag, .mCustomScrollBox:hover > .mCSB_scrollTools, .mCustomScrollBox:hover ~ .mCSB_scrollTools, .mCS-autoHide:hover > .mCustomScrollBox > .mCSB_scrollTools, .mCS-autoHide:hover > .mCustomScrollBox ~ .mCSB_scrollTools{ opacity: 1; filter: "alpha(opacity=100)"; -ms-filter: "alpha(opacity=100)"; } .mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.4); filter: "alpha(opacity=40)"; -ms-filter: "alpha(opacity=40)"; } .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.75); filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; } .mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.85); filter: "alpha(opacity=85)"; -ms-filter: "alpha(opacity=85)"; } .mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.9); filter: "alpha(opacity=90)"; -ms-filter: "alpha(opacity=90)"; } .mCSB_scrollTools .mCSB_buttonUp, .mCSB_scrollTools .mCSB_buttonDown, .mCSB_scrollTools .mCSB_buttonLeft, .mCSB_scrollTools .mCSB_buttonRight{ background-image: url(http://www.zhenguigu.com/rz/images/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("http://www.zhenguigu.com/rz/images/059ff6c084b44a4b94234e3f010eb321.gif"); 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("http://www.zhenguigu.com/rz/images/5a98831f42ce48d3911a2de5e8f6fbec.gif"); } .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: -1px; margin: 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: #999999; 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); } /* ---------------------------------------- */ /*未选择模式*/ .copera-mod{padding:15px 0 0;} .copera-mod h5{margin-left:15px;margin-bottom:10px;font-size:12px; color:#333333; font-weight:700;} .copera-mod ul{margin-left:15px;} .copera-mod li{float:left; width:25%; + width:24.9%; text-align: center; } .copera-mod li .inner{width:76%; padding:60px 8% 15px; border: 1px solid #f8f8f8;background: url(http://www.zhenguigu.com/rz/images/icon_model.png) no-repeat center 0; background-color:#f8f8f8;} .copera-mod li.hover .inner{background-color:#fff; border:1px solid #e6e6e6;} .copera-mod li.ic1 .inner{background-position:center 10px;} .copera-mod li.ic2 .inner{background-position:center -256px;} .copera-mod li.ic3 .inner{background-position:center -497px;} .copera-mod li.ic4 .inner{background-position:center -727px;} .copera-mod li h3{font-size:14px; line-height: 30px; color:#333333;} .copera-mod li p{line-height: 20px;} .copera-mod li .sBtn{margin-top:15px;} .rule-mod{float:left; width:45%; padding:0 15px;margin:15px 0 0;border-right:1px dashed #ccc;} .rule-mod-last{border:none;} .rule-mod .hd{margin-bottom:10px;} .rule-mod .hd h3{float:left;font-weight:700;color:#333;} .rule-mod .hd a{float:right; color:#3377cc;} .rule-mod ul{padding-right:15px; } .rule-mod li{margin-bottom:12px; height: 20px; line-height: 20px; overflow: hidden; text-overflow: ellipsis;} .rule-mod li a{color:#666;} .rule-mod li a:hover ,.rule-mod .hd a:hover ,.nominate-lesson-info .lesson-title a:hover,.sellerTrain-right .sellerTrain-r0 ul li a:hover{color:#FF7700;} .noticeinfo .notice-left .notice-text{color:#666;} .main .business-info .info-main .info-img{border:1px solid #ddd;} .sellerTrain-bot .keyword-title img{margin-left:6px;} /*已选模式*/ .move-com .mo-enterFlow{padding:10px 0 25px;} .move-com .mo-enterFlow .e-tip{padding-left:36px;line-height:32px;color:#999;} .move-com .mo-enterFlow .e-tip strong{color:#666;} .move-com .mo-enterFlow .con{position:relative;margin:20px auto 0;width:90%;height:232px;overflow:hidden;} .move-com .mo-enterFlow .con .s1{float:left;width:44%;height:47px;background:url(http://www.zhenguigu.com/rz/images/allrpeat-x.png) repeat-x;overflow:hidden;} .move-com .mo-enterFlow .con .s2{float:left;width:56%;height:47px;background:url(http://www.zhenguigu.com/rz/images/allrpeat-x.png) repeat-x;overflow:hidden;} .move-com .mo-enterFlow .con1 .s1, .move-com .mo-enterFlow .con1 .s2{background-position:0 -25px;} .move-com .mo-enterFlow .con2 .s1{background-position:0 -75px;} .move-com .mo-enterFlow .con2 .s2{background-position:0 -25px;} .move-com .mo-enterFlow .con3 .s1, .move-com .mo-enterFlow .con3 .s2{background-position:0 -75px;} .move-com .mo-enterFlow .con dl{position:absolute;top:0;} .move-com .mo-enterFlow .con .flow1{left:0;width:165px;} .move-com .mo-enterFlow .con .flow2{left:43%;width:165px;} .move-com .mo-enterFlow .con .flow3{right:0;width:135px;} .move-com .mo-enterFlow .con dt{margin-bottom:6px;height:90px;overflow:hidden;} .move-com .mo-enterFlow .con dd{padding-left:20px;color:#999;font-family:SimSun;} .move-com .mo-enterFlow .con dd h3{margin-bottom:5px;margin-left:-15px;font-size:14px; color:#333;} .move-com .mo-enterFlow .con dd h3 i{margin-right:5px;display:inline-block; width:16px; height:16px; text-align: center; line-height:16px; background: url(http://www.zhenguigu.com/rz/images/icon_grey.png) no-repeat 0 0; font-size:14px; color:#fff; font-family: arial;} .move-com .mo-enterFlow .con dd h3 i.on{background: url(http://www.zhenguigu.com/rz/images/icon_grey_on.png) no-repeat 0 0;} .move-com .mo-enterFlow .con dd h3 i.pass{background: url(http://www.zhenguigu.com/rz/images/icon_grey_pass.png) no-repeat 0 0;} .move-com .mo-enterFlow .con .b{margin-top:25px;padding-left:14px;} .move-com .mo-enterFlow2 .con .flow1,.move-com .mo-enterFlow2 .con .flow2,.move-com .mo-enterFlow2 .con .flow3{width:170px;} .move-com .mo-enterFlow2 .con .flow4{width:135px;} .move-com .mo-enterFlow2 .con .flow2{left:27%;} .move-com .mo-enterFlow2 .con .flow3{left:54%;} .move-com .mo-enterFlow2 .con .flow4{right:0;} .move-com .mo-enterFlow2 .con{width:93%;} .move-com .mo-enterFlow2 .con3 .s1{width:30%;} .move-com .mo-enterFlow2 .con3 .s2{width:30%;background-position:0 -75px;} .move-com .mo-enterFlow2 .con3 .s3 ,.move-com .mo-enterFlow2 .con2 .s3{float:left;width:30%;height:47px; background:url(http://www.zhenguigu.com/rz/images/allrpeat-x.png) repeat-x;background-position:0 -25px;} .move-com .mo-enterFlow2 .con4 .s3{background-position:0 -75px;} .move-com .mo-enterFlow2 .con2 .s1{width:30%;} .move-com .mo-enterFlow2 .con2 .s2{width:30%;background-position:0 -25px;} .move-com .mo-enterFlow2 .con2 .s3{width:30%;background-position:0 -25px;} /*已合作*/ .value-added{padding:15px 0 0 15px;} .value-added p{margin-bottom:10px;} .value-added p a{display:inline-block; width:60px; color:#666;} .value-added p span{color:#ccc; padding:0 15px;} .snservice{padding:15px 0 0 15px;} .snservice li{padding-left:25px;height:20px; line-height:20px;margin-bottom:15px; background: url(http://www.zhenguigu.com/rz/images/icon_snservice.png) no-repeat 0 0;} .snservice li.ic1{background-position:0 2px;} .snservice li.ic2{background-position:0 -31px;} .snservice li.ic3{background-position:0 -60px;} .snservice li.ic4{background-position:0 -95px;} .snservice li.ic5{background-position:0 -127px;} .snservice li.ic6{background-position:0 -159px;} .snservice li.lianzh{background: url(http://www.zhenguigu.com/rz/images/lianzh.png) no-repeat 0 0;} .snservice li a{color:#2272c8;} .snservice li a:hover{color:#ff7700;} .snservice li.ic2{position:relative;} .snservice li.ic2 span{display:none;padding-left:17px;width:81px; height:26px; background: url(http://www.zhenguigu.com/rz/images/bg_sntips.png) no-repeat 0 0; line-height:26px ; color:#333;} .snservice li.ic2-hover{position:relative;} .snservice li.ic2-hover span{position:absolute;left:135px; top:-2px;display:block;} .snservice li.ic6{position:relative;} .snservice li.ic6 i{display:none; width:204px; height:54px; line-height:18px; padding:10px; position:absolute; left:0; top:20px; background: url(http://www.zhenguigu.com/rz/images/icon_help.png) no-repeat 0 0;} .snservice li.ic6 i em,.snservice li.ic4 div em{font-weight:700;} .snservice li.ic6 b,.snservice li.ic4 b{display:inline-block; width:16px; height:16px; background: url(http://www.zhenguigu.com/rz/images/icon_help.gif) no-repeat 0 0; vertical-align: -3px; margin-left:10px;} .arrowup{display:none; width:13px; height:13px;background:url(http://www.zhenguigu.com/rz/images/allicon.png) 0 -193px no-repeat; position: absolute;top: 15px;right: 18px;z-index:2;} .arrowCon{display:none;position: absolute;top: 24px;right: 5px;width:150px;padding:0 5px;border:1px solid #FFCC66;background:#FFFFF0;z-index: 1;border-radius:3px;} /* 弹出框 */ /*pop-box*/ .pop-box{display:none;position:absolute;padding:6px;z-index:9999;overflow:hidden;} .pop-box .pop-box-bg{position:absolute;left:0;top:0;width:9999px;height:9999px;background:#000;opacity:.2;filter:alpha(opacity=20);z-index:10;} .pop-box .pop-box-title{position:relative;padding-left:15px;height:35px;background:#EEE;border-bottom:1px solid #CCC;font-size:14px;font-weight:700;line-height:34px;color:#333;z-index:20;} .pop-box .pop-box-title .close{position:absolute;top:12px;right:15px;display:block;width:12px;height:12px;background:url(http://www.zhenguigu.com/rz/images/allicon.png) no-repeat 0 0;overflow:hidden;} .pop-box .pop-box-title .close:hover{background-position:0 -12px;} .pop-box .pop-box-main{position:relative;background:#FFF;z-index:20;} .choicemodel{padding: 0; padding-top: 20px;} /*用户安保弹框*/ .tipIcon{ display: inline-block; vertical-align: middle; background: url(http://www.zhenguigu.com/rz/images/tipicon.png) no-repeat;} .tipInfo3{ width:32px; height:32px; background-position: -120px -140px;} .priceSubmit{ position: relative;} .priceSubmit .popTips{ padding: 26px 50px 0 66px} .priceSubmit .popTips .tipText{ margin-left: 38px; font-size: 14px; font-weight: bold; line-height: 28px} .priceSubmit .popTips .tipText a{ color: #2272c8; font-family: simsun} .priceSubmit .popTips .tipText span{} .priceSubmit .btnBox{ text-align: left; padding: 16px 0 28px 105px} .priceSubmit .sBtn{ margin-right: 10px; padding-left: 26px} .priceSubmit .sBtn span{ padding-right: 26px} .priceSubmit .enterin{margin-top: 20px;text-align: center;} .priceSubmit .sBtn:hover{text-decoration:none} /*info-confirm*/ .warm-prompt {padding: 60px 70px 70px 170px;background: url(http://www.zhenguigu.com/rz/images/bg_face_01.png) no-repeat 75px center;color: #666;line-height: 22px;} .warm-prompt-two {padding: 60px 70px 70px 170px;background: url(http://www.zhenguigu.com/rz/images/bg_face_02.png) no-repeat 75px center;color: #666;line-height: 22px;} .warm-prompt h3 {margin-bottom: 25px;font-size: 24px;color: #666;font-family: 'Microsoft YaHei';font-weight: normal;} .info-confirm .confirm-tips{padding:20px;text-align:center;} .info-confirm .confirm-tips p{margin-bottom:20px;} .info-confirm .confirm-tips p a{margin:0 10px;} .w330{width:330px;} .w680{width:680px;} /*20150818 V20150927 账号融合三期 我的云台新增样式 */ /* *@author:shenben *@update:2015/08/13 */ /* 模式选择-第一次入驻 */ .indexIcon{ display: inline-block; background: url(http://www.zhenguigu.com/rz/images/index-icon.png) 0 0 no-repeat} .mod-box{ margin: 0 15px; border: 1px solid #e6e6e6; border-right: 0 none; border-bottom: 0 none} .mod-box dl dt{ padding: 16px 0; text-align: center; font-size: 14px; font-weight: bold;} .mod-box dl dd{ padding: 0 30px; color: #666; line-height: 22px;} .mod-box dl dd.btn-box{ padding: 15px 0 20px; text-align: center;} .mod-box dl dd.btn-box .sBtn{ margin-right: 10px; } .copera-mod .mod-box ul{ position: relative; margin-left: 0} .copera-mod .mod-box li .inner{ width: auto; padding-top: 70px; border: 1px solid #e6e6e6; border-left: 0 none} .copera-mod .mod-box1 li.hover .inner{ border-top:0 none;} .mode-list0 li:hover .inner{ background-color: #fcfcfc; cursor: pointer;} .mode-list0 li.on .inner{ background-color: #fff;} .btn-spread{ padding: 10px 15px;} .btn-spread .indexIcon{ width: 13px; height: 13px; margin-right: 5px; vertical-align: middle; background-position: right -80px; cursor: pointer;} .btn-spread .indexIcon.spread{ background-position: right -94px;} .copera-mod .mod-box2{ display: none; border-top:0 none;} .copera-mod .mod-box2 li{ position: relative; height: 117px; overflow: hidden; cursor: pointer;} .copera-mod .mod-box2 li .mode-intro{ height: 114px; background-color: #fff} .copera-mod .mod-box2 li .mode-intro p{ padding: 70px 20px 0; text-align: left; color: #666; line-height: 18px;} .copera-mod .mod-box2 li .mode-wrap{ height: 117px; background-color: #fff;overflow: hidden;position: relative;} .copera-mod .mod-box li.ic1 .inner{background-position:center 20px;} .copera-mod .mod-box li.ic2 .inner{background-position:center -246px;} .copera-mod .mod-box li.ic3 .inner{background-position:center -487px;} .copera-mod .mod-box li.ic4 .inner{background-position:center -717px;} .copera-mod .mod-box li.ic5 .inner{background-position:center -880px;} .copera-mod .mod-box li.ic6 .inner{background-position:center -1040px;} .copera-mod .mod-box li.ic7 .inner{background-position:center -1205px;} .copera-mod .mod-box li.ic8 .inner{background-position:center -1368px;} .copera-mod .mod-box2 li.active .mode-wrap{ height: 114px; border: 1px solid #ff7701;} .copera-mod .mod-box2 li.active .mode-intro p{ padding-top: 20px} /* 弹窗 */ .mode-choice-tip{ position: relative;} .mode-choice-tip .popTips{ padding: 26px 50px 0} .mode-choice-tip .popTips .tipText{ margin-left: 42px; padding-top: 4px; font-size: 14px; font-weight: bold; line-height: 24px} .mode-choice-tip .popTips .tipText a{ color: #2272c8; font-family: simsun} .mode-choice-tip .btnBox{ text-align: center; padding: 25px 0 20px} .mode-choice-tip .sBtn{ margin-right: 10px; padding-left: 26px} .mode-choice-tip .sBtn span{ padding-right: 26px} /* 弹窗 */ .mode-change-tip{ padding: 20px 15px 15px;} .mode-change-tip .popTips{ padding: 6px 0 0 9px; border: 1px solid #ffcc66; background-color: #fffff0} .mode-change-tip .popTips .tipText{ margin:-2px 0 8px 22px; font-size: 12px; color: #333; line-height: 18px} .mode-change-tip .popTips .tipText a{ color: #2272c8; font-family: simsun} .mode-change-tip .current-mode,.mode-change-tip .rechoose-mode{ margin-top: 18px; font-weight: bold; color: #333} .mode-change-tip .other-mode{ border-top:0 none;} .mode-change-tip .other-mode li{ position: relative; float: left; width: 167px; overflow: hidden; height: 116px; margin:10px 10px 0 0; border:1px solid #e6e6e6;} .mode-change-tip .other-mode li.choosed-item .inner{ background-color: #fff} .mode-change-tip .other-mode1 li{ cursor: pointer;} .mode-change-tip .other-mode li .mode-wrap{ height: 116px; background-color: #fff;overflow: hidden;position: relative;} .mode-change-tip .other-mode li .inner{ padding:80px 8% 15px; border: 1px solid #f8f8f8;background: url(http://www.zhenguigu.com/rz/images/icon_model.png) no-repeat center 0; background-color:#f8f8f8; text-align: center;} .mode-change-tip .other-mode li.hover .inner{background-color:#fff; border:1px solid #e6e6e6; border-top:0 none;} .mode-change-tip .other-mode li .inner .choice-mark{ display: none; position: absolute; bottom: 0; right: 0; width: 32px; height: 32px; background: url(http://www.zhenguigu.com/rz/images/index-icon.png) no-repeat right -160px; } .mode-change-tip .other-mode li .mode-intro{ display: none; position: relative; height: 114px; background-color: #fff} .mode-change-tip .other-mode li .mode-intro p{ margin-bottom: -15px; padding: 0 20px; text-align: left; color: #666; line-height: 18px; padding-top: 20px;} .mode-change-tip .other-mode li .mode-intro a{ margin-left: 20px; position: absolute; bottom: 22px;} .mode-change-tip .other-mode li .mode-intro .choice-mark{ position: absolute; bottom: 0; right: 0; width: 32px; height: 32px; background: url(http://www.zhenguigu.com/rz/images/index-icon.png) no-repeat right -126px; } .mode-change-tip .other-mode li .mode-intro em.choosed{background-position:right -160px; } .mode-change-tip .other-mode li.ic1 .inner{background-position:center 20px; border-right: 0 none} .mode-change-tip .other-mode li.ic2 .inner{background-position:center -246px;} .mode-change-tip .other-mode li.ic3 .inner{background-position:center -487px;} .mode-change-tip .other-mode li.ic4 .inner{background-position:center -717px;} .mode-change-tip .other-mode li.ic5 .inner{background-position:center -880px;} .mode-change-tip .other-mode li.ic6 .inner{background-position:center -1040px;} .mode-change-tip .other-mode li.ic7 .inner{background-position:center -1205px; border-right: 0 none} .mode-change-tip .other-mode li.ic8 .inner{background-position:center -1368px;} .mode-change-tip .other-mode li.active .mode-wrap{ height: 114px; border: 1px solid #ff7701;} .mode-change-tip .other-mode li.active .mode-intro p{ padding-top: 20px} .mode-change-tip .btnBox{ margin: 20px; text-align: center;} .mode-change-tip .btnBox a{ margin-right: 8px;} .mode-change-tip .btnBox .sBtn span{ padding-right:30px;} .mode-change-tip .btnBox .sBtn{ padding-left: 30px} .mode-change-tip .redTips{ padding: 6px 0 0 9px;} .mode-change-tip .redTips .tipText{ margin:-2px 0 8px 22px; font-size: 12px; color: red; line-height: 18px} .manage .step-title{ padding:16px 15px 0; font-weight: bold; font-size: 14px;} .manage .step-title span{ color: #fe7800} .manage .step-title a{ font-size: 12px; font-weight: normal; float: right;} .active .mode-intro{ -ms-animation-name:fadeInUp;-ms-animation-duration:.3s;-ms-animation-delay:0s;-ms-animation-fill-mode:both; -moz-animation-name:fadeInUp;-moz-animation-duration:.3s;-moz-animation-delay:0s;-moz-animation-fill-mode:both; -webkit-animation-name:fadeInUp;-webkit-animation-duration:.3s;-webkit-animation-delay:0s;-webkit-animation-fill-mode:both; animation-name:fadeInUp;animation-duration:.3s;animation-delay:0s;animation-fill-mode:both; } @-ms-keyframes fadeInUp{ 0%{opacity:0;-ms-transform:translate(0,30px);} 100%{opacity:1;-ms-transform:none;} } @-moz-keyframes fadeInUp{ 0%{opacity:0;-moz-transform:translate(0,30px);} 100%{opacity:1;-moz-transform:none;} } @-webkit-keyframes fadeInUp{ 0%{opacity:0;-webkit-transform:translate(0,30px);} 100%{opacity:1;-webkit-transform:none;} } @keyframes fadeInUp{ 0%{opacity:0;transform:translate(0,30px);} 100%{opacity:1;transform:none;} } /* tip提示icon */ .tipIcon{ display: inline-block; vertical-align: middle; background: url(http://www.zhenguigu.com/rz/images/tipicon.png) no-repeat;} /* tipTxt 蓝色感叹号 */ .exclamTip1{ width:64px; height:64px; background-position: 0 -140px;} .exclamTip2{ width:48px; height:48px; background-position: -70px -140px;} .exclamTip3{ width:32px; height:32px; background-position: -120px -140px;} .exclamTip4{ width:24px; height:24px; background-position: -155px -140px;} .exclamTip5{ width:16px; height:16px; background-position: -180px -140px;} .exclamTip6{ width:12px; height:12px; background-position: -200px -140px;} /* tipTxt 红色叉号 */ .errorTip1{ width:64px; height:64px; background-position: 0 -70px;} .errorTip2{ width:48px; height:48px; background-position: -70px -70px;} .errorTip3{ width:32px; height:32px; background-position: -120px -70px;} .errorTip4{ width:24px; height:24px; background-position: -155px -70px;} .errorTip5{ width:16px; height:16px; background-position: -180px -70px;} .errorTip6{ width:12px; height:12px; background-position: -200px -70px;} /* tipTxt 绿色对号 */ .fitTip1{ width:64px; height:64px; background-position: 0 0;} .fitTip2{ width:48px; height:48px; background-position: -70px 0;} .fitTip3{ width:32px; height:32px; background-position: -120px 0;} .fitTip4{ width:24px; height:24px; background-position: -155px 0;} .fitTip5{ width:16px; height:16px; background-position: -180px 0;} .fitTip6{ width:12px; height:12px; background-position: -200px 0;} /* tipTxt 绿色问号 */ .enquireTip1{ width:64px; height:64px; background-position: 0 -210px;} .enquireTip2{ width:48px; height:48px; background-position: -70px -210px;} .enquireTip3{ width:32px; height:32px; background-position: -120px -210px;} .enquireTip4{ width:24px; height:24px; background-position: -155px -210px;} .enquireTip5{ width:16px; height:16px; background-position: -180px -210px;} .enquireTip6{ width:12px; height:12px; background-position: -200px -210px;} /* tipTxt 红色警告 */ .warnTip1{ width:64px; height:64px; background-position: 0 -280px;} .warnTip2{ width:48px; height:48px; background-position: -70px -280px;} .warnTip3{ width:32px; height:32px; background-position: -120px -280px;} .warnTip4{ width:24px; height:24px; background-position: -155px -280px;} .warnTip5{ width:16px; height:16px; background-position: -180px -280px;} .warnTip6{ width:12px; height:12px; background-position: -200px -280px;} /* 07-公司账号-商家中心-公司层级 */ .copera-mod h5 .l{ +margin-left: 15px;} .copera-mod h5 .r{ margin-right: 8px; font-weight: normal;} .cooper-mode-box .mod-box ul{ height: 117px; overflow: hidden;} .cooper-mode-box .uncooper-mode li{ } .cooper-mode-box .uncooper-mode li .inner{ background: url(http://www.zhenguigu.com/rz/images/icon_model0.png) no-repeat center 0;} .cooper-mode-box .uncooper-mode li h3{ color: #9dabbf} .cooper-mode-box .spread-more{ padding: 10px 15px;} .cooper-mode-box .spread-more .indexIcon{ width: 13px; height: 13px; margin-right: 5px; vertical-align: middle; background-position: right -80px; cursor: pointer;} .cooper-mode-box .spread-more .indexIcon.spread{ background-position: right -94px;} .merchant-info{ padding: 20px 20px} .merchant-info h5 .r{ color: #2272c8; font-weight: normal;} .merchant-info table{ margin: 10px; border:1px solid #ddd } .merchant-info table th{ height: 34px; background-color: #f0f0f0; border-right:1px solid #ddd } .merchant-info table td{ height: 34px; text-align: center; border-right:1px solid #eee; border-top:1px solid #eee } .merchant-info table tr.tr-bg{ background-color: #f9f9f9} .qualification-audit .rule-mod{ float: none; width:auto} .qualification-audit .rule-mod ul{ padding-right: 0} .qualification-audit .rule-mod .r em{ font-family: Arial; color: #999} .qualification-audit .rule-mod .r em:first-child{ margin-right: 10px} .main .business-info .company-intro{ padding-bottom: 0} .main .business-info .company-intro p{ padding: 5px 0 0 15px; color: #666; line-height: 30px;} /** * Created with WebStorm. * User: 14091150 * Date: 14-11-3 * Time: 下午2:28 * To change this template use File | Settings | File Templates. */ /*popWin*/ /* popwin mask */ .popWinMask{ width: 100%; height: 100%; position: absolute; top:0; left: 0; background: #000; opacity: 0.3; filter: alpha(opacity=30);} iframe.popWinFrame{ position: absolute; top:0; left: 0; background: transparent; z-index: 9; filter: alpha(opacity=0); opacity: 0; width: 100%;} /* popwin box */ .popWin{ position: fixed; _position: absolute; left: 50%; top: 50%; margin: -63px 0 0 -186px; padding: 6px; border-radius: 1px; box-shadow: 1px 1px 3px #666; overflow: hidden;} .popWinBg{ position: absolute; left: 0; top: 0; width: 9999px; height: 9999px; background: #000; opacity: .2; filter: alpha(opacity=20); z-index: -1;} .popWinTitle{ padding: 0 0 0 15px; height: 35px; line-height: 34px; background: #eee; border-bottom: 1px solid #ccc; font-size: 14px; font-weight: 700; color: #333; border-radius: 1px 1px 0 0;/* *position: absolute; *left: 6px; *right: 6px; *z-index: 1; _width: 100%; _padding: 0; _text-indent: 1em;*/} a.popWinClose,a.popWinClose:active{ background: transparent; position: absolute; top: 16px;/* *top: 10px;*/ right: 15px; /**right: 10px;*/ z-index: 2; display: block; width: 15px; height: 15px; line-height: 15px; font-size: 20px; font-weight: bold; color: #000; text-align: center; overflow: hidden; /*_text-indent: 0;*/} a.popWinClose:hover{ color: #666;} .popWinMain{ padding: 0 15px;/* *padding: 65px 15px 30px;*/ background: #fff;} .popWinLoading{ text-align: center;} .popWinLoading i{ background: url("http://www.zhenguigu.com/rz/images/popwinload.gif") no-repeat center center; display: inline-block; width: 16px; height: 16px; vertical-align: middle; margin: 0 10px 0 0;} /* popwin btns*/ .popWinBtns{ background: #fff; text-align: center; padding: 10px 0; border-top: 1px solid #e7e7e7; border-radius: 0 0 1px 1px;} .popWinBtns a{ display: inline-block; margin: 0 10px; padding: .4em 2em; text-decoration: none; border-radius: 1px; box-shadow: 0 1px 1px #ddd; font-size: 12px;} .popWinBtns a:hover{ text-decoration: none;} .popWinBtnYes{ border: 1px solid #ec8001; background: #ec8001; background: linear-gradient(to top, #f88700, #fe9900); color:#fff;} .popWinBtnYes:hover{ border: 1px solid #fe9900; background: #fe9900; background: linear-gradient(to top, #fe9900, #ffa800);} .popWinBtnNo{ border: 1px solid #ccc; background: #ccc; background: linear-gradient(to top, #eee, #fafafa); color: #333;} .popWinBtnNo:hover{ border: 1px solid #ccc; background: #fff; background: linear-gradient(to top, #f4f4f4, #fff);} .popWinBtns-left{ text-align: left;} .popWinBtns-right{ text-align: right;} /* popwin theme(example) */ .mask_z{ /* background: #000; */opacity:0; filter: alpha(opacity=0);} .z .popWinBg{ /* background: #000; */ } .z .popWinTitle{ /* background: #eee; border-bottom: 1px solid #ccc; color: #333; */ } .z .popWinMain{ /* background: #fff; */ } .z a.popWinClose,.z a.popWinClose:active{ /* color: #666; */ } .z a.popWinClose:hover{ /* color: #666; */ } .z .popWinBtns{ /* background: #fff; border-top: 1px solid #e7e7e7; */ } .z .popWinBtns a{ /* color: #333; box-shadow: 0 1px 1px #ddd; font-size: 12px; */ } .z .popWinBtnYes{ /* border: 1px solid #ec8001; background: #ec8001; background: linear-gradient(to top, #f88700, #fe9900); */} .z .popWinBtnYes:hover{ /* border: 1px solid #fe9900; background: #fe9900; background: linear-gradient(to top, #fe9900, #ffa800); */} .z .popWinBtnNo{ /* border: 1px solid #ccc; background: #ccc; background: linear-gradient(to top, #eee, #fafafa); */} .z .popWinBtnNo:hover{ /* border: 1px solid #ccc; background: #fff; background: linear-gradient(to top, #f4f4f4, #fff); */} /* popwin theme(b) */ /*.mask_b{ background: #9cf; }*/ /*.b .popWinBg{ background: #66f; }*/ .b .popWinTitle{ background: #fff; border-bottom: 1px solid #f5f5f5; color: #333; } .b .popWinMain{ background: #fff; } .b a.popWinClose,.b a.popWinClose:active{ color: #333;} .b a.popWinClose:hover{ color: #666; } .b .popWinBtns{ background: #fff; border-top: 1px solid #f5f5f5; } .b .popWinBtns a{ color: #fff; box-shadow: 0 1px 1px #ddd; font-size: 14px; } .b .popWinBtnYes{ border: 0; background: #069; background: linear-gradient(to top, #06c, #069); } .b .popWinBtnYes:hover{ border: 0; background: #06c; background: linear-gradient(to top, #069, #06c); } .b .popWinBtnNo{ border: 0; background: #069; background: linear-gradient(to top, #06c, #069); } .b .popWinBtnNo:hover{ border: 0; background: #06c; background: linear-gradient(to top, #069, #06c);} /* popwin theme(g) */ .g .popWinTitle{ background: #eee; border-bottom: 1px solid #ccc; color: #333; } .g .popWinMain{ background: #fff; } .g a.popWinClose,.g a.popWinClose:active{ color: #333;} .g a.popWinClose:hover{ color: #666; } .g .popWinBtns{ background: #fff; border-top: 1px solid #f5f5f5; } .g .popWinBtns a{ color: #fff; box-shadow: 0 1px 1px #ddd; font-size: 14px; } .g .popWinBtnYes{ border: 0; background: #069; background: linear-gradient(to top, #06c, #069); } .g .popWinBtnYes:hover{ border: 0; background: #06c; background: linear-gradient(to top, #069, #06c); } .g .popWinBtnNo{ border: 0; background: #069; background: linear-gradient(to top, #06c, #069); } .g .popWinBtnNo:hover{ border: 0; background: #06c; background: linear-gradient(to top, #069, #06c);} /* popwin theme(z) */ /*.mask_b{ background: #9cf; }*/ /*.z .popWinBg{ background: #66f; }*/ .z .popWinTitle{ background: #fcfcfc; border-bottom: 1px solid #f5f5f5; color: #333; } .z .popWinMain{ background: #fcfcfc; padding: 0;} .z a.popWinClose,.z a.popWinClose:active{ color: #333;} .z a.popWinClose:hover{ color: #666; } .z .popWinBtns{ background: #fcfcfc; border-top: 1px solid #f5f5f5; } .z .popWinBtns a{ color: #fff; box-shadow: 0 1px 1px #ddd; font-size: 14px; } .z .popWinBtnYes{ border: 0; background: #069;} .z .popWinBtnYes:hover{ border: 0; background: #06c;} .z .popWinBtnNo{ border: 0; background: #069;} .z .popWinBtnNo:hover{ border: 0; background: #06c;} /* popwin theme(c) */ .mask_c{ background: #000; } .c .popWinBg{ background: #c00; } .c .popWinTitle{ background: #c00; border-bottom: 1px solid #600; color: #fff; } .c .popWinMain{ background: #fee; } .c a.popWinClose,.c a.popWinClose:active{ color: #fff; } .c a.popWinClose:hover{ color: #fcc; } .c .popWinBtns{ background: #fee; border-top: 1px solid #fdd; } .c .popWinBtns a{ box-shadow: 0 1px 1px #ddd; font-size: 12px; } .c .popWinBtnYes{ border: 1px solid #900; color: #fff; background: #c00; background: linear-gradient(to top, #c00, #f33);} .c .popWinBtnYes:hover{ border: 1px solid #900; color: #fff; background: #c00; background: linear-gradient(to top, #f33, #c00); } .c .popWinBtnNo{ border: 1px solid #fcc; color: #c00; background: #c66; background: linear-gradient(to top, #fcc, #fff); } .c .popWinBtnNo:hover{ border: 1px solid #fcc; color: #c00; background: #fcc; background: linear-gradient(to top, #fff, #fcc); } /* popwin theme(f) */ .mask_f{background: #000; opacity: 0.1; filter: alpha(opacity=10);} .f{box-shadow:none;} .f .popWinBg{background:none;} .f .popWinMain{ background:none; } body,h1,h2,h3,h4,h5,h6,hr,p,dl,dt,dd,ul,ol,li,form,fieldset,legend,button,input,textarea,th,td{margin:0;padding:0;} body,button,input,select,textarea{font:12px/1.5 'MicroSoft YaHei',arial,tahoma,\5b8b\4f53;color:#333;} h1,h2,h3,h4,h5,h6{font-size:100%;} em,i{font-style:normal;} fieldset,img{border:0;} img{vertical-align:top;} ul,ol{list-style:none;} a{color:#2272CB;text-decoration:none;outline:none;} a:hover{color:#2090FF;text-decoration:underline;} .clear{clear:both;display:block;height:0;overflow:hidden;font-size:0;} button,input,select,textarea{font-size:100%;outline:none} table{border-collapse:collapse;border-spacing:0;} .hide{display:none;} .l{float:left;} .r{float:right;} .clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden;} .clearfix{zoom:1;} .mt10{margin-top:10px!important;} .mr10{margin-right:10px!important;} .mb10{margin-bottom:10px!important;} .ml10{margin-left:10px!important;} .w1190{width:1190px;margin:0 auto;} body{background:#f5f5f5;} /*头部*/ .g-header {width:100%; min-width:1190px;background:#333;} .g-header .topArea {width:1190px;height:40px;line-height:40px;margin:0 auto;} .g-header .topArea .back-index{display:inline-block; margin-right:18px; color:#bbb;} .g-header .topArea .back-index i{display:inline-block; width:14px; height:14px; margin-right:5px; background:url('../image/a-1003.png'); vertical-align:-3px;} .g-header .topArea > span{display:inline-block; margin-right:18px; color:#bbb;} .g-header .topArea .head-login{display:inline-block; color:#2090FF ; margin-right:18px;} .g-header .topArea .head-register{display:inline-block; color:#bbb; margin-right:18px;} .g-header .topArea .grey{color:#bbb;} .g-header .topArea .name{padding-right:15px;color:#bbb;} /* 页头商户图标 */ .g-header .topArea .shang-icon{display:inline-block; width:14px; height:18px; margin-left:5px; background:url('../image/a-1003.png') -230px 0; vertical-align:-4px;} /* 页头供应商图标 */ .g-header .topArea .gong-icon{display:inline-block; width:14px; height:18px; margin-left:5px; background:url('../image/a-1003.png') -245px 0; vertical-align:-4px;} /* 页头站内信图标 */ .mail-icon{display:inline-block; width:19px; height:18px; margin-right:3px; background:url('../image/a-1003.png') -260px 0; vertical-align:-2px;} .g-header .topArea .headerMenu{float:right;} .topArea .headerMenu > li{float:left; position:relative; padding:0 10px; line-height:40px;} .topArea .headerMenu a{color:#bbb;} .topArea .headerMenu a:hover{color:#bbb;} .topArea .headerMenu a.new {color: #ff5555;} .topArea .headerMenu a.new i {display: inline-block;width: 14px;height: 16px;margin-left: 5px;background-image: url(http://www.zhenguigu.com/rz/images/a-new.png);vertical-align: middle;background-size: 14px 16px;} .topArea .headerMenu .head-map{height:40px; padding:0;} .topArea .headerMenu .head-map-hand{padding:0 10px; color:#bbb; cursor:pointer;} .topArea .headerMenu .head-phone-code{height:40px; padding:0;} .topArea .headerMenu .head-map-icon{display:inline-block; width:14px; height:14px; margin-right:5px; background:url('../image/a-1003.png') -16px 0; vertical-align:-2px;} .topArea .headerMenu .head-down{display:inline-block; width:12px; height:14px; margin-left:5px; background:url('../image/a-1003.png') -46px 0; vertical-align:-3px;} .topArea .headerMenu .head-phone{display:inline-block; width:11px; height:14px; margin-right:5px; background:url('../image/a-1003.png') -32px 0; vertical-align:-2px;} .topArea .headerMenu li.on{background:#fff; border:1px solid #e6e6e6; border-width:0 1px;} .topArea .headerMenu li.on .head-map-hand{position:relative; border-bottom:1px solid #fff; z-index:100;} .head-map-con{display:none; position:absolute; width:718px; height:148px; margin-top:-1px; padding:25px 0; background:#fff; border:1px solid #e6e6e6; z-index:99; right:-1px;} .head-map-con ul{float:left; height:148px; padding:0 30px; border-right:1px solid #eee;} .head-map-con ul:last-of-type{border-right:0;} .head-map-con ul li{width:66px; font:12px/24px 'MicroSoft YaHei'; color:#666;} .head-map-con ul li:first-of-type{padding-bottom:10px; font:14px/20px 'MicroSoft YaHei'; color:#333;} .head-phone-con{display:none; position:absolute; margin-top:-1px; padding:10px; border:1px solid #e6e6e6; background:#fff; z-index:99; right:-1px;} /* 页面底部 */ .i-footer{position:relative; width:100%; min-width:1190px; height:125px; background:#222; font:12px/26px 'MicroSoft YaHei'; text-align:center; color:#999;} .i-footer a{padding:0 5px; color:#999;} .i-footer a:hover, .i-footer a.blue:hover, .i-footer a.orange{color:#f70;} .i-footer a.blue{color:#39e;} .footer-lion{position:absolute; width:100px; height:57px; margin-left:-50px; background:url('../image/a-1003.png') no-repeat -110px -15px; top:-52px; left:50%;} .pt10{padding-top:10px;} .mt30{margin-top:30px;} .pt30{padding-top:30px;} /*导航*/ .g-top{width:100%; min-width:1190px;background:#FFF;} .topBG{width:1190px;height:90px;margin:0 auto;overflow:hidden;} .topBG .logo{float:left;margin-top:33px;} .topBG .nav{float:right;position:relative;} .topBG .nav .nav-slide{position:absolute;top:0;left:0;width:100px;height:77px;background:#FAFAFA;border-top:3px solid #F70;z-index:1;} .topBG .nav ul{float:left;position:relative;z-index:2;} .topBG .nav li{float:left;height:80px;} .topBG .nav li a{display:block;padding:0 30px;font:18px/76px 'Microsoft YaHei';color:#222;} .topBG .nav li a:hover{color:#F70;text-decoration:none;} .topBG .nav li.on a{color:#F70;} body{font-family:'Microsoft Yahei'; background:#fff;} .w1190{width:1190px; margin:auto;} iframe{vertical-align:top;} /* 页面顶部 */ .s-cloud-top{width:100%; height:100px; background:#fff;} .flex-between{display:flex; justify-content:space-between; align-items:center;} .s-cloud-top .logo img{width:271px; height:24px;} .s-cloud-top ul{display:flex; flex-direction:row; } .s-cloud-top ul a{position:relative; display:block; margin-left:40px; font-size:16px; line-height:100px; color:#333; text-decoration:none; transition: all 0.3s linear;} .s-cloud-top ul a::after{content:''; position:absolute; width:0; height:3px; background:#2090FF; bottom:0; left:50%; transition: all 0.3s linear; transform:translateX(-50%);} .s-cloud-top ul a:hover::after, .s-cloud-top ul li.on a::after{width:100%;} .s-cloud-top ul a:hover, .s-cloud-top ul li.on a{color:#2090FF;} /* banner轮播图 */ .focusImages{ position: relative; z-index: 1; width: 100%; height:380px; overflow: hidden;} .focusImages li{ position: absolute; width: 100%; z-index: 1; left: 0; top: 0; overflow: hidden; text-align:center;} .focusNumBox{ position: absolute; height:2px; z-index: 2; left:50%; bottom:20px;} .focusNumBox a{display:inline-block; width:50px; height:2px; background: #666; margin: 0 5px;} .focusNumBox a.hideNumTxt{ text-indent: -99em;} .focusNumBox a i{display:inline-block; height:2px; vertical-align:top;} .focusNumBox a.focusSel i{ background: #fff; color: #000; animation:mymove 4s linear;} .focusPreArr{display:none; position:absolute; width:21px; height:65px; top:50%; left: 20px; background:url("http://www.zhenguigu.com/rz/images/focus-prev.png") no-repeat center; z-index:5;} .focusNextArr{display:none; position:absolute; width:21px; height:65px; top:50%; right: 20px; background:url("http://www.zhenguigu.com/rz/images/focus-next.png") no-repeat center; z-index:5;} .focusBox:hover .focusPreArr, .focusBox:hover .focusNextArr{display:inline-block;} @keyframes mymove { 0% {width:0;} 100% {width:100%;} } /* 信息公告 */ .index-notice-box{min-height:300px; background:#fff;} .index-notice{display:flex; width:1190px; padding:52px 0 0; margin:auto; flex-direction:row; justify-content:space-between;} .index-notice > li{float:left; width:260px; min-height:170px; text-align:center;} .index-notice > li.index-notice-last{text-align:left;} .index-notice h1{padding-bottom:15px; font:bold 18px/24px 'MicroSoft YaHei'; color:#333;} .index-notice p{margin:0 0 30px; font:14px/24px 'MicroSoft YaHei'; color:#666;} a.index-notice-btn{position:relative; display:inline-block; width:160px; height:46px; border-radius:4px; border:1px solid #2090FF; text-align:center; font-size:16px; line-height:46px; color:#2090FF; z-index:1; transition:all 0.3s ease-in;} a.index-notice-btn::before{position: absolute; content:''; width:0; height:46px; left:auto; right:0; background:#409FFF; top:0; z-index:-1; transition:all 0.3s ease-in;} a.index-notice-btn:hover{color:#fff; text-decoration:none;} a.index-notice-btn:hover::before{width:100%; right:auto; left:0;} a.index-notice-btn-dark{display:inline-block; width:160px; height:46px;background-image: linear-gradient(-90deg, #0DAEFF 0%, #3377FF 100%); border-radius:4px; border:1px solid #2090FF; text-align:center; font-size:16px; line-height:46px; color:#fff; text-decoration:none;} a.index-notice-btn-dark:hover{background:#409FFF;} .index-cloud-show{display:block; text-align:center; font:14px/49px 'Microsoft Yahei'; color:#2090FF;} .index-list li{height:30px; padding-left:12px; background:url('../image/a-1003.png') no-repeat -397px 15px; font:14px/30px 'MicroSoft YaHei'; color:#666; } .index-list li a{display:inline-block; max-width:236px; height:30px; color:#666; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .index-list li a:hover{color:#2090FF; text-decoration:none;} .index-list li em{position: absolute; width:14px; height:16px; margin:5px 0 0 5px; background:url('http://www.zhenguigu.com/rz/images/a-1002.png'); background-size:cover;} /* 入驻流程模块 */ .s-cloud-model1{height:560px; background:#ebebf0; text-align:center;} .s-cloud-model1 h1{font:bold 30px/40px 'Microsoft Yahei'; padding-top:50px; } .s-cloud-show-detailed{display:inline-block; font:14px/19px 'Microsoft Yahei'; color:#2090FF; padding:10px 0 30px;} .s-cloud-box{display:flex; flex-direction:row; justify-content:space-between;} .s-cloud-single{position:relative; width:287px; height:340px; background:#fff; border-radius:4px;} .s-cloud-single img{width:64px; height:64px; padding:32px 0;} .s-cloud-single h2{font:bold 20px/26px 'Microsoft Yahei'; color:#333; padding-bottom:10px;} .s-cloud-single span{display:inline-block; font:12px/16px 'Microsoft Yahei'; color:#999; padding-bottom:10px;} .s-cloud-single p{font:12px/24px 'Microsoft Yahei'; color:#666;} .s-cloud-single::after{position:absolute; content:''; width:50px; height:50px; font-size:30px; color:#bbb; text-align:center; background:#ebebf0 url('../image/a-1001.png') no-repeat center center; background-size:25%; border-radius:25px; right:-32px; top:50%; transform:translateY(-50%); z-index:2;} .s-cloud-single:last-child::after{display:none;} /* 提供更多服务 */ .s-cloud-model-service{height:560px; text-align:center;} .s-cloud-model-service h1{font:bold 30px/40px 'Microsoft Yahei'; padding:50px 0; } .s-cloud-model-service-box{display:flex; flex-direction:row; justify-content:space-between;} .service-single{position:relative; width:260px; height:350px; padding:30px 20px 0;} .service-single img{width:120px; height:120px; padding-bottom:30px;} .service-single h2{font:bold 20px/26px 'Microsoft Yahei'; color:#333; padding-bottom:15px;} .service-single p{font:14px/24px 'Microsoft Yahei'; color:#666;} .service-single a{opacity:0; display:inline-block; margin-top:15px; font:14px/20px 'Microsoft Yahei'; color:#2090FF; text-decoration:none;} .service-single a span{color:#999; margin-left:5px;} .service-single:hover{box-shadow: 0 4px 14px 0 rgba(0,0,0,0.10); margin-top:-20px; transition:all 0.3s linear;} .service-single:hover a{opacity:1; transition:all 0.3s linear;} /* 招商大会页面 */ .banner-img{width:100%; min-width:1190px; height:420px; background:#03092d url('http://www.zhenguigu.com/rz/images/banner-9.jpg') no-repeat center center;} .invest-notice-bg{width:100%; height:90px; background:#fff; box-shadow: 0 2px 3px 0 rgba(0,0,0,0.5);} .invest-notice-box{display:flex;height:90px; align-items:center; justify-content:space-between;} .invest-notice-single{height:40px; padding:0 8px; border:1px solid #ddd; border-radius:4px; font:14px/38px 'Microsoft Yahei'; color:#bbb;} input.invest-notice-single{color:#666;} input::-webkit-input-placeholder{color: #bbb;} input::-moz-placeholder{color: #bbb;} input:-ms-input-placeholder{color: #bbb;} .invest-flex{display:flex; justify-content:space-between;} .invest-notice-single span{display:inline-block; } .invest-notice-single input{border:0; line-height:38px;} .rangeSelector_display{width:200px; border:0; line-height:38px;} .invest-notice-single select{border:0; line-height:40px;} a.invest-notice-btn{width:130px; height:40px; line-height:40px; font-size:14px;} .w260{width:242px;} .w200{width:182px;} .w100{width:95px;} .w150{width:135px;} .invest-select{display:inline-block; position:relative; border:0; background:none; text-align:right; cursor:pointer;} .select-input input{width:calc(100% - 26px); padding-right:26px; background:none; font-size:14px; text-align:right;} .select-input::after{content:''; position:absolute; width:8px; height:8px; border:1px solid #999; border-width:0 1px 1px 0; transform:translateY(-76%) rotate(45deg); right:5px; top:50%;} .invest-select .item-list{display:none; position:absolute; width:100%; max-height:320px; padding:10px 0; overflow:hidden; overflow-y:auto; background:#fff;box-shadow: 0 1px 5px 0 rgba(0,0,0,0.20); border-radius: 4px;} .invest-select .item-list li{text-align:center; font:14px/32px 'Microsoft Yahei'; color:#666;} .invest-select .item-list li:hover, .invest-select .item-list li.on{background: rgba(51,119,255,0.15);} .s-invest-model1{width:100%; min-width:1190px; padding-bottom:50px; text-align:center; background:#ebebf0;} .s-invest-model1 h1{font:bold 30px/40px 'Microsoft Yahei'; padding:50px 0; } .s-invest-box{display:flex; flex-direction:row; flex-wrap:wrap; justify-content:flex-start;} .s-invest-single{width:287px; height:439px; margin-right:14px; margin-bottom:20px; background:#fff; border-radius:4px; text-align:left;} .s-invest-single:nth-child(4n){margin-right:0;} .s-invest-single .s-invest-img{display:block; position:relative;} /*.s-invest-single .s-invest-img[data-love]::after{content:''; position: absolute; width:30px; height:30px; background:rgba(0,0,0,0.5) url('http://www.zhenguigu.com/rz/images/icon-03.png') no-repeat center center; border-radius:15px; left:20px; bottom:20px; z-index:2;}*/ .s-invest-single .s-invest-img[data-love] span{position: absolute; width:0; height:30px; padding:0 0 0 30px; background:rgba(0,0,0,0.5) url('http://www.zhenguigu.com/rz/images/icon-03.png') no-repeat 7px center; border-radius:15px; line-height:28px; color:#fff; left:20px; bottom:20px; z-index:2; overflow:hidden; transition: width 0.5s ease-in;} .s-invest-single .s-invest-img[data-love] span:hover {width:auto; padding-right:10px; transition: width 0.5s ease-in;} .s-invest-single img{width:287px; height:200px; border-radius:4px 4px 0 0;} .s-invest-single-word{padding:20px; text-align:center;} .s-invest-single-title{display:inline-block; padding-bottom:15px; font:bold 14px/20px 'Microsoft Yahei'; color:#333; text-align:left;width:100%; height:20px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .s-invest-single-word li{font:12px/22px 'Microsoft Yahei'; color:#666; text-align:left;} .s-invest-single-word li span{display:inline-block; width:62px; height:22px; text-align:justify; vertical-align:top;} .s-invest-single-word li span::after{content:''; display:inline-block; padding-left:100%;} .s-invest-single-address{display:flex; justify-content:space-between; padding:20px 0; font:12px/16px 'Microsoft Yahei'; color:#999;} .s-invest-single-address span::before{content:''; display:inline-block; width:12px; height:16px; margin-right:5px; background:url('http://www.zhenguigu.com/rz/images/invest-address@2x.png'); background-size:cover; vertical-align:top;} .s-invest-single-address span.time::before{width:15px; height:15px; background:url('http://www.zhenguigu.com/rz/images/invest-time@2x.png'); background-size:cover;} a.invest-model1-btn{width:200px; height:40px; line-height:40px; font-size:14px;} a.invest-model1-btn[disabled]{background:#EBEBF0; color:#BABDCC; cursor:not-allowed; border-color:#EBEBF0;} /* 弹框 */ .pop-content{padding:10px 0;} .pop-content li{margin-bottom:20px;} .pop-content li span{display:inline-block; width:140px; text-align:right; font:14px/32px 'Microsoft Yahei'; color:#2a2a2a;} .pop-content li span em{color:#f00;} .pop-content li p{display:inline-block; color:#f00; width:calc(100% - 140px);} .pop-content li input{width:188px; height:30px; padding:0 5px; border:1px solid #ddd; border-radius:4px; } .pop-content li select{width:200px; height:32px; border:1px solid #ddd; border-radius:4px; } .pop-content li img{width:100px; height:32px; vertical-align:top;} .s .popWinTitle{height:46px; font-size:16px; line-height:46px; background:#fff; border:0;} .s.popWin{padding:0; border-radius:4px;} .s .popWinBtns{padding:15px 0;} .s .popWinBtnYes,.s .popWinBtnYes:hover{background:#2090FF; border:1px solid #2090FF; border-radius:4px; color:#fff;} .s .popWinBtnNo,.s .popWinBtnNo:hover{background:#fff; border:1px solid #ddd; border-radius:4px; color:#666;} /* 招商大会详情页 */ .s-invest-detail-model1{width:100%; min-width:1190px; padding:20px 0; text-align:left; background:#ebebf0;} .s-invest-detail{display:flex; width:100%; height:340px; background:#fff; border-radius:4px;} .s-invest-detail img{width:480px; height:340px; border-radius:4px 0 0 4px;} .s-invest-right{position:relative; width:100%; padding:30px 0 0 40px;} .s-invest-right::after{content:attr(data-href); position: absolute; width:120px; height:59px; padding-top:15px; background:url('http://www.zhenguigu.com/rz/images/icon-over@2x.png'); background-size:cover; text-align:center; font:bold 18px/24px 'Microsoft Yahei'; color:#bbb; top:0; right:20px;} .s-invest-rest::after{background:url('http://www.zhenguigu.com/rz/images/icon-over-blue@2x.png'); background-size:cover; color:#fff;} .s-invest-right h2{display:inline-block; padding-bottom:20px; font:bold 20px/26px 'Microsoft Yahei'; color:#333;} .s-invest-right li{font:14px/28px 'Microsoft Yahei'; color:#666; text-align:left;} .s-invest-right li span{display:inline-block; width:88px; height:28px; text-align:justify; vertical-align:top;} .s-invest-right li span::after{content:''; display:inline-block; padding-left:100%;} .s-invest-detail-address{padding:20px 0; font:12px/26px 'Microsoft Yahei'; color:#999; text-align:left;} .s-invest-detail-address div::before{content:''; display:inline-block; width:12px; height:16px; margin-right:5px; background:url('http://www.zhenguigu.com/rz/images/invest-address@2x.png'); background-size:cover; vertical-align:middle;} .s-invest-detail-address .time::before{width:15px; height:15px; background:url('http://www.zhenguigu.com/rz/images/invest-time@2x.png'); background-size:cover;} .s-invest-right a.invest-model1-btn{width:158px; height:40px; line-height:40px; font-size:14px;} .s-invest-right a.invest-model1-btn[disabled]{background:#EBEBF0; color:#BABDCC; cursor:not-allowed; border-color:#EBEBF0;} .s-invest-detail-model1 h1{font:bold 30px/40px 'Microsoft Yahei'; padding:50px 0 30px; text-align:center;} .s-invest-detail-content{background:#fff; border-radius:4px; padding:30px 20px;} .s-invest-detail-content p{padding-bottom:10px; font:14px/24px 'Microsoft Yahei'; color:#666;} /* 20191012 ywx 导航 */ .s-slide{position: fixed;_position:absolute;right:20px;z-index: 900;top:50%; transform:translateY(-50%);} .s-slide-con{position:relative;padding-top:77px;} .s-slide-shizi{position: absolute;top:4px;left:0px;width:80px;height:77px;background:url(http://www.zhenguigu.com/rz/images/shizi.png);background-size:contain;} .s-slide-nav{width:80px;background: #2090FF;border-radius: 4px;padding:10px 0;} .s-slide-nav a{display: block;height:30px;line-height: 30px;color: #fff;text-align: center;} .s-slide-nav a.mt5{margin-top:5px;} .s-slide-nav a:hover{background: #1D84EB;text-decoration: none;} body, h1, h2, h3, h4, h5, h6, hr, p, dl, dt, dd, ul, ol, li, form, fieldset, legend, button, input, textarea, th, td { margin: 0; padding: 0; font-weight: normal } body, button, input, select, textarea { font: 12px/1.5 arial, tahoma, 'Hiragino Sans GB', "Microsoft YaHei", "\5b8b\4f53"; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-weight: normal } body { background: #fff; } h1, h2, h3, h4, h5, h6 { font-size: 100% } em, i { font-style: normal } fieldset, img { border: 0 } img { vertical-align: top } ul, ol { list-style: none } button, input, select, textarea { font-size: 100%; outline: none } table { border-collapse: collapse; border-spacing: 0 } a { color: #2272c8; text-decoration: none; outline: none; cursor: pointer } a:hover { color: #FF7700; text-decoration: none } .clear { clear: both; display: block; height: 0; overflow: hidden; font-size: 0 } .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden } .clearfix { zoom: 1 } .vanish { display: none } .nobd { border: 0 none !important } .bd { border: 1px solid #e0e0e0 !important } .over { overflow: hidden } .fl { float: left !important } .fr { float: right !important } .tl { text-align: left !important } .tc { text-align: center !important } .tr { text-align: right !important } .s-page { min-width: 1280px; color: #666; -webkit-box-sizing: border-box; box-sizing: border-box; } .s-global-width { width: 1200px !important; margin: 0 auto; } /* 头部内容 */ .s-header { min-width: 500px; position: fixed; top: 0; left: 0; right: 0; height: 80px; /* background: rgba(0, 0, 0, 0.70);*/ color: #fff; font-size: 14px; padding: 0 30px; z-index: 9999; } .s-header:hover { background: rgba(0, 0, 0, 0.70); } .s-header a { color: #fff; } .s-unlogin, .s-login, .s-platform-btn, .s-logo { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .s-logo { left: 30px; display: block; width: 271px; height: 24px; } .s-logo>img { width: 100%; height: 100%; } .s-menu { position: absolute; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); top: 50%; left: 50%; min-width: 510px; } .s-menu-item { position: relative; line-height: 80px; cursor: pointer; display: inline-block; margin: 0 20px; } .s-menu-item::before { position: absolute; content: ''; bottom: -1px; height: 3px; background: #2090FF; width: 0; -webkit-transition-duration: .3s; transition-duration: .3s; -webkit-transform-origin: center; transform-origin: center; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .s-menu-item.active, .s-menu-item:hover { border-color: #2090ff; color: #2090FF; } .s-menu-item:hover .s-sub-menu { display: block; } .s-menu-item:hover>a { color: #2090FF; } .s-menu-item.active::before, .s-menu-item:hover::before { width: 100%; } .s-sub-menu { position: absolute; display: none; top: 100%; left: 50%; width: 120px; -webkit-transform: translateX(-50%); transform: translateX(-50%); -webkit-box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.20); box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.20); background: rgba(0, 0, 0, 0.70); padding: 0 0 10px; } .s-sub-menu li a { font-size: 12px; display: block; color: #fff; text-align: center; padding: 10px 0; line-height: 1; } .s-sub-menu li a:hover { color: #2090FF; } .s-login-box a:hover { color: #2090ff; } .s-login { right: 170px; font-size: 14px; cursor: pointer; padding-left: 7px; } .s-unlogin { display: none; right: 170px; } .s-unlogin a { display: inline-block; padding: 0 20px; line-height: 20px; border-right: 1px solid #fff; } .s-unlogin a:last-child { border-right: none; padding-right: 0; } .s-login-name { padding: 25px 0 24px; } .s-unlogin-box .s-unlogin { display: block; } .s-unlogin-box .s-login { display: none; } .s-user-icon { display: inline-block; height: 20px; width: 19px; background: url(http://www.zhenguigu.com/rz/images/user-icon.png) no-repeat; background-size: contain; vertical-align: top; margin-right: 10px; } .s-suppiler-icon { display: inline-block; height: 17px; width: 19px; background: url(http://www.zhenguigu.com/rz/images/suning-suppiler.png) no-repeat; background-size: contain; vertical-align: middle; margin-left: 10px; } .s-user-name { display: inline-block; cursor: pointer; line-height: 1; width: 100px; overflow: hidden; white-space: nowrap; word-break: break-all; text-overflow: ellipsis; } .s-login.on .s-login-menu { display: block; } .s-login-menu { display: none; position: absolute; left: 50%; top: 100%; width: 120px; margin-left: -60px; background: rgba(0, 0, 0, 0.70); } .s-login-menu li { height: 36px; line-height: 36px; padding: 0 20px; font-size: 12px; } .s-login-menu li:hover a { color: #2090FF; } .s-platform-btn { right: 30px; display: inline-block; padding: 0 24px; border: 1px solid #666666; height: 36px; line-height: 34px; font-size: 14px; color: #FFFFFF; } .s-platform-btn:hover { border-color: transparent; background-image: -webkit-gradient(linear, left top, right top, from(#3377FF), to(#0DAEFF)); background-image: linear-gradient(90deg, #3377FF 0%, #0DAEFF 100%); color:#fff ; } /* banner */ .s-banner { height: 600px; overflow: hidden; position: relative; background: #010019; color: #fff; } .s-banner-news { position: absolute; bottom: 0; left: 50%; width: 100%; height: 60px; line-height: 60px; overflow: hidden; -webkit-transform: translateX(-50%); transform: translateX(-50%); z-index: 3; background: rgba(0, 0, 0, 0.3); color: #fff; text-align: center; } .s-board { font-weight: bold; font-size: 14px; } .s-board-icon { display: inline-block; vertical-align: middle; margin: -2px 5px 0 0; width: 21px; height: 18px; background: url('../image/board.png') no-repeat; background-size: contain; } .s-news-wrap { width: 999px; margin: 0 40px; overflow: hidden; } .s-news-list { width: auto; text-align: left; display: -webkit-box; display: -ms-flexbox; display: flex; position: relative; } .s-news-list li { position: relative; width: 313px; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; margin-right: 20px; height: 60px; overflow: hidden; position: relative; } /* .s-news-list li:first-child { -webkit-transition: all 5s; transition: all 5s; } */ .s-news-list li a { display: inline-block; max-width: 318px; text-overflow: ellipsis; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding-left: 14px; color: #fff; position: relative; } .s-news-list li a::before { position: absolute; left: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); content: ""; width: 4px; height: 4px; border-radius: 2px; background: #fff; } .s-hot-icon { display: inline-block; width: 14px; height: 16px; vertical-align: middle; margin-left: 10px; background: url(http://www.zhenguigu.com/rz/images/hot-icon.png) no-repeat; background-size: cover; } .s-news-list li .s-hot-icon { vertical-align: top; margin-top: 21px; } .s-banner-title { font-size: 70px; color: #FFFFFF; text-align: center; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); white-space: nowrap; } .s-news-more { color: #fff; } .s-news-more:hover { color: #fff; } .s-more-icon { display: inline-block; width: 7px; height: 12px; background: url('http://www.zhenguigu.com/rz/images/right-icon.png') no-repeat; background-size: contain; vertical-align: middle; margin: -4px 0 0; } /* 轮播相关 */ .focusImages { position: relative; z-index: 1; width: 100%; height: 380px; overflow: hidden; } .focusImages li { position: absolute; width: 100%; z-index: 1; left: 0; top: 0; overflow: hidden; text-align: center; } .focusImages img { width: 100%; } .focusNumBox { position: absolute; z-index: 2; left: 50%; bottom: 80px; height: 2px; } .focusNumBox a { display: inline-block; width: 50px; height: 2px; background: #666; margin: 0 5px; vertical-align: top; } .focusNumBox a.hideNumTxt { text-indent: -99em; } .focusNumBox a i { display: inline-block; vertical-align: top; height: 2px; } @-webkit-keyframes mymove { 0% { width: 0; } 100% { width: 100%; } } @keyframes mymove { 0% { width: 0; } 100% { width: 100%; } } .focusNumBox a.focusSel i { background: #fff; color: #000; -webkit-animation: mymove 4s linear; animation: mymove 4s linear; } /* 公共模块样式 */ .s-part { position: relative; overflow: hidden; text-align: center; } .s-part-title { padding: 60px 0 15px; line-height: 40px; font-size: 30px; color: #333; font-weight: bold; position: relative; z-index: 11; } .s-part-subtitle { font-size: 16px; line-height: 21px; color: #999; } .s-part-white-title { color: #fff; } .s-part-content { z-index: 11; } /* 选择云台 */ .s-cloud-wrap { position: relative; padding: 150px 0 50px; } .s-cloud-img { top: 50px; left: 42%; position: absolute; } .animate_up_down { -webkit-animation: up-down 3s .25s infinite linear; animation: up-down 3s .25s infinite linear } @-webkit-keyframes up-down { 0%, 100% { -webkit-transform: translateY(0); transform: translateY(0) } 50% { -webkit-transform: translateY(-30px); transform: translateY(-30px) } } @keyframes up-down { 0%, 100% { -webkit-transform: translateY(0); transform: translateY(0) } 50% { -webkit-transform: translateY(-10px); transform: translateY(-10px) } } .s-cloud-light { position: absolute; -webkit-transform-origin: bottom center; transform-origin: bottom center; -webkit-animation: lightIn 1.5s infinite linear; animation: lightIn 1.5s infinite linear } @-webkit-keyframes lightIn { 0% { opacity: .3 } 50% { opacity: 1 } 100% { opacity: .3 } } @keyframes lightIn { 0% { opacity: .4 } 50% { opacity: 1 } 100% { opacity: .4 } } .s-cloud-light1 { top: 43px; left: 379px; } .s-cloud-light2 { left: 515px; top: 151px; } @keyframes warn { 0% { -webkit-transform: scale(0); transform: scale(0); opacity: 0 } 25% { -webkit-transform: scale(0); transform: scale(0); opacity: .1 } 50% { -webkit-transform: scale(.1); transform: scale(.1); opacity: .3 } 75% { -webkit-transform: scale(.5); transform: scale(.5); opacity: .5 } 100% { -webkit-transform: scale(1); transform: scale(1); opacity: 0 } } @-webkit-keyframes warn { 0% { -webkit-transform: scale(0); opacity: 0 } 25% { -webkit-transform: scale(0); opacity: .1 } 50% { -webkit-transform: scale(.1); opacity: .3 } 75% { -webkit-transform: scale(.5); opacity: .5 } 100% { -webkit-transform: scale(1); opacity: 0 } } .s-cloud-info { position: absolute; width: 360px; background-image: -webkit-gradient(linear, left top, right top, from(#3377FF), to(#0DAEFF)); background-image: linear-gradient(90deg, #3377FF 0%, #0DAEFF 100%); padding: 15px 20px; text-align: left; color: #fff; border-radius: 5px; font-size: 14px; display: none; opacity: 0; } .s-cloud-info.s-hover { opacity: 1; } .s-cloud-info-title { font-size: 16px; font-weight: bold; line-height: 1; margin-bottom: 8px; } .s-cloud-info1 { top: 14px; right: 60px; } .s-cloud-info2 { top: 84px; right: 30px; } .s-cloud-info.s-cloud-info2::before, .s-cloud-info.s-cloud-info2::after { left: 173px; } .s-cloud-info3 { right: 107px; bottom: 160px; } .s-cloud-info4 { bottom: 176px; left: 376px; } .s-cloud-info5 { bottom: 240px; left: 158px; } .s-cloud-info6 { top: -15px; left: 295px; } .s-cloud-info-txt { margin-bottom: 8px; } .s-cloud-info a { color: #fff; } .s-cloud-info .s-more-icon { vertical-align: middle; margin-top: -2px; } .s-cloud-info::after, .s-cloud-info::before { content: ""; position: absolute; display: inline-block; bottom: -23px; left: 34px; width: 0; height: 0; border-width: 12px; border-color: #2e7eff transparent transparent transparent; border-style: solid; } .s-info-area { position: absolute; width: 140px; height: 90px; opacity: 0; cursor: pointer; } .s-info-1 .s-info-area { top: 177px; right: 304px; } .s-info-2 .s-info-area { right: 133px; top: 250px; } .s-info-3 .s-info-area { bottom: 52px; right: 349px; } .s-info-4 .s-info-area { bottom: 68px; left: 352px; } .s-info-5 .s-info-area { bottom: 134px; left: 135px; } .s-info-6 .s-info-area { top: 151px; left: 269px; } /* 欢迎加入 */ .s-part-two { height: 666px; position: relative; background: url('http://www.zhenguigu.com/rz/images/join-bg.png') no-repeat; background-size: cover; } .s-part-two .s-part-wrap { position: relative; z-index: 1; } .s-intro-list { margin: 40px 0 70px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .s-intro-box { position: relative; -webkit-box-sizing: border-box; box-sizing: border-box; width: 300px; height: 420px; padding: 30px; vertical-align: top; -webkit-transition: all .3s; transition: all .3s; -webkit-transition: all .3s; transition: all .3s; overflow: hidden; } .s-intro-box::after { position: absolute; left: 0; top: 0; width: 100%; height: 100%; content: ""; z-index: 1; background: rgba(0, 0, 0, 0.50); opacity: 0.5; } .s-intro-box:hover::after { -webkit-transition: all 550ms cubic-bezier(.23, 1, .32, 1); transition: all 550ms cubic-bezier(.23, 1, .32, 1); opacity: 0.7; background: #3378FF; } .s-intro-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; } .s-intro-content { position: absolute; top: 120px; left: 0; z-index: 2; width: 100%; -webkit-transition: top 1s cubic-bezier(.23, 1, .32, 1); transition: top 1s cubic-bezier(.23, 1, .32, 1); color: #fff; } .s-intro-box:hover .s-intro-content { top: 40px; } .s-intro-icon { width: 90px; height: 90px; } .s-intro-title { font-size: 24px; text-align: center; line-height: 31px; font-weight: bold; margin: 30px 0 20px; } .s-intro-txt { font-size: 14px; line-height: 19px; padding: 0 20px; height: 90px; overflow: hidden; margin-bottom: 38px; } .s-intro-hover { opacity: 0; -webkit-transition: all 1s ease-in-out; transition: all 1s ease-in-out; } .s-intro-box:hover .s-intro-hover { opacity: 1; position: relative; z-index: 3; } .s-intro-btn { -webkit-box-sizing: border-box; box-sizing: border-box; display: block; position: relative; font-size: 14px; color: #fff; width: 160px; height: 40px; line-height: 40px; margin: 0 auto; text-align: center; -webkit-transition: all 1s ease-in-out; transition: all 1s ease-in-out; cursor: pointer; } .s-intro-btn:after { -webkit-box-sizing: border-box; box-sizing: border-box; position: absolute; top: 0; left: 0; content: ""; width: 100%; height: 100%; border: 1px solid #FFFFFF; -webkit-transition: all .5s ease-in-out; transition: all .5s ease-in-out; opacity: 1; } .s-intro-btn:hover { color: #fff; background-image: -webkit-gradient(linear, left top, right top, from(#3377FF), to(#0DAEFF)); background-image: linear-gradient(90deg, #3377FF 0%, #0DAEFF 100%); } .s-intro-btn:hover:after { opacity: 0; } .s-intro-btns { width: 200px; margin: 0 auto; } .s-intro-btns .s-intro-btn { width: 100%; margin-bottom: 20px; } /* 合作伙伴 */ .s-part-three { background: #F0F0F0; } .s-part-three .s-part-content { margin: 45px 0 50px; } .s-part-list { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .s-part-list>li { width: 220px; height: 120px; margin: 0 25px 20px 0; } .s-part-list>li>img { width: 100%; height: 100%; } .s-part-list>li:nth-child(5n) { margin-right: 0; } div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td { margin: 0; padding: 0; border: 0; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } table { border-collapse: collapse; border-spacing: 0; } fieldset, img { border: 0; } address, cite, code, dfn, em, strong, th, var { font-style: normal; font-weight: normal; } ul, ol, li { list-style: none; } th { text-align: left; } h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; } q:before, q:after { content: ''; } abbr, acronym { border: 0; font-variant: normal; } sup { vertical-align: text-top; } sub { vertical-align: text-bottom; } input, textarea, select { font-family: inherit; font-size: inherit; font-weight: inherit; font-size: 100%; } legend { color: #000; } strong, b { font-weight: bold; } a { text-decoration: none; color: #3399ff; } a:link, a:hover, a:active { text-decoration: none; } .cf:before, .cf:after { content: ""; display: table; } .cf:after { clear: both; } /* 取消安卓端a标签点击出现蓝色边框(针对feedback弹出框) */ a, button, input { -webkit-tap-highlight-color: rgba(255, 0, 0, 0); } html, body { margin: 0; width: 100%; height: 100%; } .pplive-player { font-family: 'PingFang SC', 'arial', 'Microsoft Yahei', 'SimSun', 'tahoma', 'sans-serif'; color: #ffffff; width: 100%; height: 100%; background: #000000; z-index: 0; } .pplive-player { position: relative; width: 100%; overflow: hidden; /*暂停，播放，放大缩小全局设置*/ /*暂停，播放，放大缩小自适应宽高*/ /*Vipuser弹出层UI*/ /*正片播放titile样式*/ } .pplive-player .common1 { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 80; } .pplive-player .p-video-vastad { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 80; } .pplive-player .p-vastad-box { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 80; } .pplive-player .p-video-button { z-index: 90; position: absolute; width: 25%; height: 25%; left: 0; top: 0; right: 0; bottom: 0; margin: auto; background: url(http://www.zhenguigu.com/rz/images/m_btn_play.png) no-repeat center center; background-size: contain; } .pplive-player .control { position: absolute; z-index: 105; width: 100%; height: 1.2rem; bottom: -1.2rem; } .pplive-player .p-video { width: 100%; height: 100%; } .pplive-player .p-video .p-video-box { position: relative; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 80; background: url(http://www.zhenguigu.com/rz/images/slogan.gif) no-repeat 50% 50%; } .pplive-player .p-video .p-video-box-university { position: relative; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 80; background: url(http://www.zhenguigu.com/rz/images/slogan2.gif) no-repeat 50% 50%; } .pplive-player .p-video .p-video-box-sport { position: relative; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 80; background: url(http://www.zhenguigu.com/rz/images/slogan_sport.gif) no-repeat 50% 50%; } .pplive-player .p-video .p-video-box-xunlei { position: relative; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 80; background: url(http://www.zhenguigu.com/rz/images/786bcaf768b94c2ab6bad0a5cb6a1d10.gif) no-repeat 50% 50%; } .pplive-player .p-video .p-video-poster { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 80; background: #000; } .pplive-player .p-video .p-video-loading { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 80; background: url(http://www.zhenguigu.com/rz/images/6ef80f7e65fe4a818118f7ae3dbf252f.gif) no-repeat 50% 50%; } .pplive-player .p-pause { cursor: pointer; float: left; background: url(http://www.zhenguigu.com/rz/images/m_player_sprite.png) no-repeat 38% 98%; background-size: 3.6rem 2.5rem; text-indent: -9999px; width: 0.5rem; height: 0.5rem; position: absolute; left: 0.5rem; top: 0.5rem; margin: -0.25rem 0 0 -0.25rem; } .pplive-player .p-go { cursor: pointer; display: inline; background: url(http://www.zhenguigu.com/rz/images/m_player_sprite.png) no-repeat 56.5% 98%; background-size: 3.6rem 2.5rem; text-indent: -9999px; width: 0.5rem; height: 0.5rem; position: absolute; left: 0.5rem; top: 0.5rem; margin: -0.25rem 0 0 -0.25rem; } .pplive-player .p-pause, .pplive-player .p-go, .pplive-player .zoomIn, .pplive-player .zoomOut, .pplive-player .progress { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .pplive-player .time { color: #fff; position: absolute; bottom: 0.04rem; font-size: 0.3rem; line-height: 0.5rem; } .pplive-player .time span { padding: 0 2px; } .pplive-player .time .current { cursor: default; float: left; } .pplive-player .time .total { cursor: default; float: right; } .pplive-player .common6 { width: 0.5rem; height: 0.5rem; position: absolute; left: 0.5rem; top: 0.5rem; margin: -0.25rem 0 0 -0.25rem; } .pplive-player .zoomIn { cursor: pointer; float: right; background: url(http://www.zhenguigu.com/rz/images/m_player_sprite.png) no-repeat 74% 98%; background-size: 3.6rem 2.5rem; text-indent: -9999px; width: 0.5rem; height: 0.5rem; position: absolute; left: 0.5rem; top: 0.5rem; margin: -0.25rem 0 0 -0.25rem; } .pplive-player .zoomOut { cursor: pointer; float: right; background: url(http://www.zhenguigu.com/rz/images/m_player_sprite.png) no-repeat 91% 98%; background-size: 3.6rem 2.5rem; text-indent: -9999px; width: 0.5rem; height: 0.5rem; position: absolute; left: 0.5rem; top: 0.5rem; margin: -0.25rem 0 0 -0.25rem; } .pplive-player .progress { position: absolute; top: 0.6rem; height: 0.04rem; background: rgba(250, 250, 250, 0.6); } .pplive-player .progress .drag { display: none; position: absolute; right: -0.15rem; top: -0.15rem; width: 0.3rem; height: 0.3rem; border-radius: 0.4rem; -webkit-border-radius: 0.4rem; background: #ffffff; border: 0.02rem solid rgba(31, 31, 31, 0.3); } .pplive-player .bufferBar, .pplive-player .posiBar { position: absolute; top: 0; left: 0; height: 100%; background: #439ce0; } .pplive-player .common5 { background: rgba(31, 31, 31, 0.3); -webkit-border-radius: 1rem; border-radius: 1rem; height: 1rem; width: 1rem; position: relative; margin: 0.1rem 0.1rem; } .pplive-player .p-play-container { background: rgba(31, 31, 31, 0.3); -webkit-border-radius: 1rem; border-radius: 1rem; height: 1rem; width: 1rem; position: relative; margin: 0.1rem 0.1rem; float: left; } .pplive-player .p-zoom-container { background: rgba(31, 31, 31, 0.3); -webkit-border-radius: 1rem; border-radius: 1rem; height: 1rem; width: 1rem; position: relative; margin: 0.1rem 0.1rem; float: right; } .pplive-player .common7 { display: none; } .pplive-player .tip { display: none; position: absolute; top: 0; left: 0; width: 95%; height: 40px; line-height: 40px; padding: 0 2.5%; background: rgba(51, 51, 51, 0.6); overflow: hidden; z-index: 1000; } .pplive-player .tip .common8 { float: left; display: inline; font-size: 14px; color: #fff; vertical-align: top; } .pplive-player .tip p { float: left; display: inline; font-size: 14px; color: #fff; vertical-align: top; } .pplive-player .tip a { float: left; display: inline; font-size: 14px; color: #fff; vertical-align: top; } .pplive-player .tip .viewall { height: 26px; line-height: 26px; padding: 0 8px; margin: 8px 0 0 10px; border-radius: 3px; -webkit-border-radius: 3px; background: #1982C6; } .pplive-player .tip .close { float: right; font-size: 24px; font-weight: bold; margin: 0 0 0 5px; } .pplive-player .tip2 { display: none; } .pplive-player .tip2 img { float: left; width: 24px; height: 24px; margin: 8px 5px 0 0; } .pplive-player .tip2 dl { float: left; line-height: 14px; margin: 6px 0 0 5px; text-align: left; color: #fff; } .pplive-player .tip2 dd { font-size: 14px; } .pplive-player #p-countdown { text-align: center; position: absolute; top: 50%; font-size: 100%; color: #3299ff; margin: -0.15rem auto; z-index: 999; width: 100%; background: rgba(0, 0, 0, 0.5); height: 30px; line-height: 30px; } .pplive-player .p-video-tip3 { display: none; position: absolute; margin: auto; left: 0; top: 0; right: 0; bottom: 0; text-align: center; border-radius: 5px; -webkit-border-radius: 5px; color: #fff; z-index: 1000; } .pplive-player .p-video-tip3 .wrap { position: absolute; left: 0; top: 0; right: 0; bottom: 0; margin: auto; height: 50%; } .pplive-player .p-video-tip3 p { font-size: 100%; line-height: 170%; display: inline-block; position: relative; } .pplive-player .p-video-tip3 .common9 { height: auto; overflow: hidden; width: 60%; left: 19%; position: relative; top: 10%; } .pplive-player .p-video-tip3 .common10 { display: block; width: 40%; float: left; height: 100%; line-height: 200%; text-align: center; font-size: 90%; color: #fff; border-radius: 4px; -webkit-border-radius: 4px; } .pplive-player .p-video-tip3 .btns { height: auto; overflow: hidden; width: 60%; left: 19%; position: relative; top: 10%; } .pplive-player .p-video-tip3 .btns a { display: block; float: left; height: 100%; line-height: 200%; text-align: center; font-size: 90%; color: #fff; border-radius: 4px; -webkit-border-radius: 4px; width: 40%; } .pplive-player .p-video-tip3 .btns .right { border: 1px solid #ff9312; float: right; background: #ff9313; } .pplive-player .p-video-tip3 .btns .left { border: 1px solid #ff9312; } .pplive-player .p-video-tip3 .btns .center { border: 1px solid #ff9312; background: #ff9313; margin: 0 auto; float: none; width: 60%; } .pplive-player .p-video-tip3 .oths { height: auto; overflow: hidden; width: 60%; left: 19%; position: relative; top: 10%; } .pplive-player .p-video-tip3 .oths a { display: block; width: 40%; float: left; height: 100%; line-height: 200%; text-align: center; font-size: 90%; color: #fff; border-radius: 4px; -webkit-border-radius: 4px; width: 56%; } .pplive-player .p-video-tip3 .oths .center { border: 1px solid #ff9312; background: #ff9313; margin-left: 23%; } .pplive-player .p-video-tip3 .rightCorner { float: right; width: 33%; height: 12%; font-size: 80%; overflow: hidden; top: 3%; position: relative; right: 3%; /*右上角tips：已是VIP会员请登录 或者: 已购买片包,请登录*/ } .pplive-player .p-video-tip3 .rightCorner span { display: block; width: 100%; height: 100%; color: #F1A837; } .pplive-player .error-content { position: absolute; } .pplive-player .error-content .error-img { background: url(http://www.zhenguigu.com/rz/images/m_player_sprite.png) no-repeat 100% 0; width: 1.6rem; height: 1.6rem; position: absolute; background-size: 3.5rem 2.4rem; } .pplive-player .error-content .error-txt { font-size: 0.26rem; line-height: .45rem; overflow: hidden; margin-left: 2rem; } .pplive-player .error-content .error-txt .feedbackbtn { display: block; border: 1px solid #00afec; background: #00afec; color: #fff; height: 0.5rem; width: 1.8rem; line-height: 0.5rem; text-align: center; border-radius: 4px; -webkit-border-radius: 4px; position: relative; top: 0.17rem; } .pplive-player .newerror-content { position: absolute; font-size: 12px; color: #666; } .pplive-player .newerror-content p { margin: 45px 0 0; text-align: center; } .pplive-player .newerror-content .m-txt { margin-top: 0; font-size: 100%; } .pplive-player .newerror-content .m-errorText { font-size: 100%; margin-top: 0; } .pplive-player .newerror-content .pic { margin: 20px 0; text-align: center; } .pplive-player .newerror-content .pic span { display: inline-block; width: 42px; height: 42px; } .pplive-player .newerror-content .pic span.ic1 { background: url(http://www.zhenguigu.com/rz/images/9f5a14b0827f402e94746f14a1178255.gif) no-repeat; } .pplive-player .newerror-content .pic span.ic2 { background: url(http://www.zhenguigu.com/rz/images/242f27e2c8724736af81581616f85d14.gif) no-repeat; } .pplive-player .newerror-content .pic span.ic3 { background: url(http://www.zhenguigu.com/rz/images/1c34f22b430a46f58e14c15e6a53251e.gif) no-repeat; } .pplive-player .newerror-content .pic i { display: inline-block; width: 93px; height: 2px; margin: 0 7px; vertical-align: 17px; border-top: 2px dotted #2C2C2C; } .pplive-player .newerror-content .txt { width: 450px; margin: 0 auto; text-align: center; } .pplive-player .newerror-content .txt li { display: inline-block; width: 120px; margin: 0 15px; color: #999; } .pplive-player .newerror-content .txt li a { margin: 0 0 0 3px; color: #F5C042; } .pplive-player .newerror-content .errorcode { margin: 30px 0 0; } .pplive-player .newerror-content .m-refresh { display: block; width: 38%; height: 100%; line-height: 300%; margin: 3% auto 0; font-size: 100%; color: #fff; border-radius: 16px; background: #4599F7; } .pplive-player .newerror-content .m-refresh i { display: inline-block; width: 21px; height: 21px; margin: 0 5% 0 14%; vertical-align: -5px; background: url(http://www.zhenguigu.com/rz/images/1b0a36a1ae2a4828a32504f8e9d2273d.gif) no-repeat; background-size: 100% 100%; } .pplive-player .newerror-content .m-refresh * { vertical-align: middle; } .pplive-player .newerror-content .m-feedbackbtn { position: absolute; right: -10%; bottom: -10%; font-size: 100%; width: 35%; color: #4599F7; } .pplive-player .newerror-content .m-feedbackbtn i { display: inline-block; width: 17px; height: 17px; margin: 0 3% 0 0%; vertical-align: -2px; background: url(http://www.zhenguigu.com/rz/images/a185c5a769564d85b4f6318d9b15ec88.gif) no-repeat; background-size: 100% 100%; } .pplive-player .newerror-content .m-success { position: absolute; left: 50%; top: 50%; width: 50%; height: 50%; margin-left: -25%; margin-top: 0%; line-height: 300%; text-align: center; border-radius: 19px; color: #FAA519; background: rgba(0, 0, 0, 0.7); } .pplive-player .feedback { position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 999; } .pplive-player .feedback .mask { position: absolute; top: 0; left: 0; width: 6rem; height: 3.8rem; z-index: 1; font-size: .25rem; overflow: hidden; color: #333; margin: auto; right: 0; bottom: 0; border-radius: 6px; } .pplive-player .feedback .mask-hd { height: .6rem; line-height: .6rem; width: 6rem; font-weight: 600; overflow: hidden; background: #eee; border-radius: 5px 5px 0 0; } .pplive-player .feedback .mask-hd h3 { float: left; font-size: 0.3rem; font-weight: 600; margin-left: 0.3rem; } .pplive-player .feedback .mask-hd .mask-close { float: right; display: inline-block; width: 0.4rem; height: 0.6rem; text-align: center; margin-right: 0.2rem; } .pplive-player .feedback .mask-bd { background: #fff; height: 3.2rem; width: 6rem; overflow: hidden; } .pplive-player .feedback .mask-bd p { line-height: .42rem; margin: 0.1rem 0 0.1rem 0.3rem; } .pplive-player .feedback .mask-bd .mask_form .con { margin: .04rem 0; height: 3.3rem; line-height: .45rem; overflow: hidden; margin-top: .04rem; height: 100%; float: left; width: 6rem; margin: 0.1rem 0 0 0; } .pplive-player .feedback .mask-bd .mask_form .con span { display: inline-block; width: 1.2rem; text-align: center; } .pplive-player .feedback .mask-bd .mask_form .con input { border: 1px solid #eee; width: 4rem; box-sizing: border-box; outline: none; background: #f8f8f8; padding: 0 0 0 0.24rem; height: 0.45rem; } .pplive-player .feedback .mask-bd .mask_form .qq { margin-bottom: 0.1rem; } .pplive-player .feedback .cont_txt { width: 2.3rem; height: 0.55rem; float: left; margin: 0.25rem 0 0 0.25rem; line-height: 0.55rem; color: #ff0000; display: none; } .pplive-player .feedback .mask-btn { float: right; margin: .25rem 0.3rem 0 0; } .pplive-player .feedback .mask-btn a { border-radius: 8px; display: inline-block; width: 1.4rem; height: 0.55rem; background: red; margin: 0 0.05rem; text-align: center; line-height: .55rem; background: #999; color: #fff; } .pplive-player .feedback .mask-btn .submit { background: #ff7400; margin-right: 0.2rem; } .pplive-player .p-video-title { width: 100%; height: auto; font-size: 0.26rem; color: white; position: absolute; background: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(255, 255, 255, 0)); z-index: 999; } .pplive-player .p-video-title span { position: relative; display: block; top: 0.16rem; left: 0.2rem; width: 7rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .pplive-player .p-tips { width: 100%; height: auto; font-size: 0.26rem; color: #ffffff; position: absolute; bottom: 1.1rem; z-index: 110; } .pplive-player .p-video-countdown { width: 100%; height: auto; font-size: 0.26rem; color: white; position: absolute; z-index: 999; } .pplive-player .p-video-countdown span { position: relative; display: block; top: 0.16rem; left: 0.2rem; width: 7rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .pplive-player .countdown-btn { height: auto; overflow: hidden; width: 4.6rem; left: 67%; top: 0.2rem; position: absolute; display: none; z-index: 999; } .pplive-player .countdown-btn a { display: block; width: 2.2rem; float: left; height: 0.6rem; line-height: 0.55rem; text-align: center; font-size: 0.26rem; color: #fff; border-radius: 16px; -webkit-border-radius: 16px; border: 1px solid #ff9312; background: #ff9313; } /*************************************************** PC端样式 ****************************************************/ .p-video-player::-moz-media-controls, .p-video-player::-webkit-media-controls { display: none !important; } .p-video-player { object-fit: contain; } .pplive-player .common1 { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 80; } .pplive-player .w-video { width: 100%; height: 100%; } .pplive-player .w-video .w-video-box { position: relative; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 80; background: url(http://www.zhenguigu.com/rz/images/slogan.gif) no-repeat 50% 50%; } .pplive-player .w-video .w-video-box-university { position: relative; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 80; background: url(http://www.zhenguigu.com/rz/images/slogan2.gif) no-repeat 50% 50%; } .pplive-player .w-video .w-video-box-sport { position: relative; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 80; background: url(http://www.zhenguigu.com/rz/images/slogan_sport.gif) no-repeat 50% 50%; } .pplive-player .w-video .w-video-box-xunlei { position: relative; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 80; background: url(http://www.zhenguigu.com/rz/images/786bcaf768b94c2ab6bad0a5cb6a1d10.gif) no-repeat 50% 50%; } .pplive-player .w-video .w-video-poster { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 80; } .pplive-player .w-video .w-video-loading { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 80; } .pplive-player .w-video-vastad { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 110; pointer-events: none; } .pplive-player .w-recom { position: absolute; width: 100%; height: auto; background: #181818; top: 0; left: 0; bottom: 0; z-index: 99; } .pplive-player .w-recom .w-recom-content { position: absolute; overflow: hidden; } .pplive-player .w-recom .w-recom-content li { position: relative; float: left; margin: 0 5px 5px 0; border: 1px solid #666; width: 120px; height: 97px; } .pplive-player .w-recom .w-recom-content li img { width: 120px; height: auto; } .pplive-player .w-recom .w-recom-content li span { position: absolute; top: 67px; left: 0px; font-size: 12px; color: #ffffff; width: 120px; height: 30px; background: rgba(51, 51, 51, 0.9); text-align: center; line-height: 30px; overflow: hidden; } .pplive-player .w-recom .w-recom-btn { position: absolute; } .pplive-player .w-recom .w-recom-btn .w-recom-dot { position: relative; } .pplive-player .w-recom .w-recom-btn .w-recom-dot span { cursor: pointer; position: relative; width: 12px; height: 12px; background: none; border: 1px #8f8f8f solid; border-radius: 50%; display: inline-block; box-sizing: border-box; margin: auto 5px; } .pplive-player .w-recom .w-recom-btn .w-recom-dot span.select:after { position: absolute; width: 8px; height: 8px; border-radius: 8px; content: ''; top: 1px; left: 1px; background: #3399ff; } .pplive-player .w-recom .w-recom-btn a:hover { color: #3399ff; } .pplive-player .w-recom .w-recom-btn a { width: 30px; height: 50px; display: block; color: #9b999b; } .pplive-player .w-recom .w-recom-btn a span { display: block; width: 35px; height: 25px; font-size: 15px; position: relative; top: -5px; } .pplive-player .w-recom .w-recom-btn a .w-recom-share { height: 9px; width: 9px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; box-shadow: inset 0 0 0 32px, 22px -11px 0 0, 22px 11px 0 0; margin: 10px 24px 13px 1px; display: inline-block; vertical-align: middle; position: relative; font-style: normal; text-align: left; text-indent: -9999px; direction: ltr; transform: scale(0.8); cursor: pointer; } .pplive-player .w-recom .w-recom-btn a .w-recom-share:before, .pplive-player .w-recom .w-recom-btn a .w-recom-share:after { position: absolute; width: 24px; height: 2px; box-shadow: inset 0 0 0 32px; left: 0; content: ''; pointer-events: none; } .pplive-player .w-recom .w-recom-btn a .w-recom-share:before { top: -2px; -webkit-transform: rotate(-25deg); -moz-transform: rotate(-25deg); -ms-transform: rotate(-25deg); -o-transform: rotate(-25deg); transform: rotate(-25deg); } .pplive-player .w-recom .w-recom-btn a .w-recom-share:after { top: 9px; -webkit-transform: rotate(25deg); -moz-transform: rotate(25deg); -ms-transform: rotate(25deg); -o-transform: rotate(25deg); transform: rotate(25deg); } .pplive-player .w-tips { position: absolute; width: 100%; height: auto; bottom: 37px; z-index: 101; left: 5px; font-size: 12px; color: #ffffff; } .pplive-player .w-tips a { padding: 0 3px; color: #4599F7; } .pplive-player .w-tips .single-tip { width: auto; position: absolute; height: auto; display: block; padding: 3px 0 5px 0; background-color: rgba(51, 51, 51, 0.9); } .pplive-player .w-tips .single-tip .w-tips-content { float: left; } .pplive-player .w-tips .single-tip .w-tips-content span { float: left; margin-top: 4px; line-height: 22px; margin-right: 6px; margin-left: 6px; } .pplive-player .w-tips .single-tip .w-tips-content span a { cursor: pointer; } .pplive-player .w-tips .single-tip .w-tips-content span.download { width: 310px; height: 45px; float: left; line-height: 45px; padding: 10px 0px 10px 15px; } .pplive-player .w-tips .w-btn { display: block; background: #00afec; color: #fff; width: 70px; height: 22px; line-height: 22px; margin-left: 5px; text-align: center; border-radius: 2px; font-size: 13px; float: left; margin-right: 5px; } .pplive-player .w-tips .w-logo { display: block; width: 220px; height: 46px; float: left; background: url(http://www.zhenguigu.com/rz/images/fc934799cdd7433ba23585a162ed9c0c.gif) no-repeat 0 0; } .pplive-player .w-tips .w-close { float: right; color: #fff; width: 12px; text-align: center; cursor: pointer; padding-right: 6px; margin-top: 6px; } .pplive-player .w-big-button { cursor: pointer; z-index: 99; position: absolute; bottom: 20px; width: 42px; height: 42px; margin: auto; border-radius: 5px; overflow: hidden; background: rgba(0, 0, 0, 0.6) url(http://www.zhenguigu.com/rz/images/w_player_sprite_new.png) no-repeat; } .pplive-player .w-no-prompt { float: right; width: 60px; height: 19px; cursor: pointer; overflow: hidden; color: #fff; z-index: 99; font-size: 14px; position: absolute; top: 6px; right: 27px; display: none; } .pplive-player .w-restart-tip { float: right; margin-right: 10%; position: absolute; top: 5px; right: 52px; z-index: 99; display: none; background: #000; opacity: 0.6; font-size: 12px; padding: 0 5px 0 5px; } .pplive-player .w-restart-tip .triangle { width: 0; height: 0; border-width: 4.5px; border-style: solid; border-color: transparent transparent transparent #000; float: right; position: absolute; top: 6px; right: -9px; z-index: 99; } .pplive-player .w-play-button { left: 20px; background-position: -5px -57px; } .pplive-player .w-play-button:hover { background-position: -109px -57px; } .pplive-player .w-stop-button { background-position: -5px -5px; } .pplive-player .w-stop-button:hover { background-position: -109px -5px; } .pplive-player .w-sound-button { right: 20px; background-position: -99px -103px; } .pplive-player .w-sound-button:hover { background-position: -151px 1px; } .pplive-player .w-mute-button { right: 20px; background-position: 1px -195px; } .pplive-player .w-mute-button:hover { background-position: -79px -155px; } .pplive-player .w-control { position: absolute; z-index: 99; width: 100%; height: 0; bottom: 0; background: rgba(0, 0, 0, 0.6); padding: 0 0 0 0 ; transition: all .15s ease; transform-origin: bottom center; } .pplive-player .w-control .w-control-left { position: absolute; width: auto; left: 10px; margin: 5px 0 0 0; } .pplive-player .w-control .w-control-left .w-play-container { float: left; height: 32px; display: none; cursor: pointer; } .pplive-player .w-control .w-control-left .w-play-container .w-play, .pplive-player .w-control .w-control-left .w-play-container .w-pause, .pplive-player .w-control .w-control-left .w-play-container .w-repeat { background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new.png); background-repeat: no-repeat; } .pplive-player .w-control .w-control-left .w-play-container .w-play { background-position: -10px -10px; width: 50px; height: 32px; } .pplive-player .w-control .w-control-left .w-play-container .w-play:hover { background-position: -114px -10px; width: 50px; height: 32px; } .pplive-player .w-control .w-control-left .w-play-container .w-pause { background-position: -10px -62px; width: 50px; height: 32px; } .pplive-player .w-control .w-control-left .w-play-container .w-pause:hover { background-position: -114px -62px; width: 50px; height: 32px; } .pplive-player .w-control .w-control-left .w-play-container .w-repeat { background-position: -62px -10px; width: 50px; height: 32px; } .pplive-player .w-control .w-control-left .w-play-container .w-repeat:hover { background-position: -10px -114px; width: 50px; height: 32px; } .pplive-player .w-control .w-control-left .w-play-container .common { width: 50px; height: 32px; } .pplive-player .w-control .w-control-left .w-next-container { display: none; float: left; width: 40px; height: 32px; cursor: pointer; } .pplive-player .w-control .w-control-left .w-next-container .w-next { background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new.png); background-repeat: no-repeat; background-position: -62px -114px; width: 32px; height: 32px; } .pplive-player .w-control .w-control-left .w-next-container .w-next:hover { background-position: -62px -62px; width: 32px; height: 32px; } .pplive-player .w-control .w-control-left .w-next-container .common { width: 32px; height: 32px; } .pplive-player .w-control .w-control-left .w-stop-container { display: none; float: left; width: 36px; height: 32px; cursor: pointer; } .pplive-player .w-control .w-control-left .w-stop-container .w-stop { background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite.png); background-repeat: no-repeat; background-position: 42.25% 100%; width: 36px; height: 32px; } .pplive-player .w-control .w-control-left .w-stop-container .w-stop:hover { background-position: 54.85% 100%; width: 36px; height: 32px; } .pplive-player .w-control .w-control-left .w-stop-container .common { width: 36px; height: 32px; } .pplive-player .w-control .w-control-left .w-time { color: #9b999b; font-size: 12px; float: left; width: auto; height: 32px; line-height: 32px; display: none; text-align: center; padding: 0 8px; } .pplive-player .w-control .w-control-left .w-total { display: inline-block; } .pplive-player .w-control .w-control-left .w-total span { margin: 0 0 0 20px; color: #999; padding: 4px 10px; font-size: 12px; background: rgba(0, 0, 0, 0.6); border-radius: 20px; position: relative; } .pplive-player .w-control .w-control-left .w-total span:before { position: absolute; width: 8px; height: 8px; border-radius: 50%; content: ''; top: 8px; left: 6px; background: url(http://www.zhenguigu.com/rz/images/38c86d9cc0254db6baf34f350da2ce3d.gif) no-repeat 50% 50%; background-size: 8px auto; } .pplive-player .w-control .w-control-right { position: absolute; width: auto; right: 0; margin: 2px 0 0 0; padding: 8px 0 0 0; } .pplive-player .w-control .w-control-right .w-zoom-container { float: left; width: 40px; display: none; height: auto; cursor: pointer; } .pplive-player .w-control .w-control-right .w-zoom-container .w-zoomIn { background-position: -166px -90px; width: 40px; height: 22px; background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new.png); background-repeat: no-repeat; } .pplive-player .w-control .w-control-right .w-zoom-container .w-zoomIn:hover { background-position: -50px -206px; width: 40px; height: 22px; background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new.png); background-repeat: no-repeat; } .pplive-player .w-control .w-control-right .w-zoom-container .w-zoomOut { background-position: -206px -50px; width: 40px; height: 22px; background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new.png); background-repeat: no-repeat; } .pplive-player .w-control .w-control-right .w-zoom-container .w-zoomOut:hover { background-position: -50px -166px; width: 40px; height: 22px; background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new.png); background-repeat: no-repeat; } .pplive-player .w-control .w-control-right .w-zoom-container .common { width: 40px; height: 22px; background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new.png); background-repeat: no-repeat; } .pplive-player .w-control .w-control-right .w-expand-container { float: left; width: 40px; display: none; height: auto; cursor: pointer; } .pplive-player .w-control .w-control-right .w-expand-container .w-expandIn { background-position: -166px -50px; width: 40px; height: 22px; background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new.png); background-repeat: no-repeat; } .pplive-player .w-control .w-control-right .w-expand-container .w-expandIn:hover { background-position: -130px -166px; width: 40px; height: 22px; background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new.png); background-repeat: no-repeat; } .pplive-player .w-control .w-control-right .w-expand-container .w-expandOut { background-position: -206px -10px; width: 40px; height: 22px; background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new.png); background-repeat: no-repeat; } .pplive-player .w-control .w-control-right .w-expand-container .w-expandOut:hover { background-position: -206px -130px; width: 40px; height: 22px; background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new.png); background-repeat: no-repeat; } .pplive-player .w-control .w-control-right .w-expand-container .common { width: 40px; height: 22px; background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new.png); background-repeat: no-repeat; } .pplive-player .w-control .w-control-right .w-setup-container { display: none; float: left; width: 40px; height: 32px; cursor: pointer; } .pplive-player .w-control .w-control-right .w-setup-container .w-setup { background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new.png); background-repeat: no-repeat; background-position: -206px -90px; width: 40px; height: 22px; } .pplive-player .w-control .w-control-right .w-setup-container .w-setup:hover { background-position: -10px -166px; width: 40px; height: 22px; } .pplive-player .w-control .w-control-right .w-setup-container .common { width: 40px; height: 22px; } .pplive-player .w-control .w-control-right .w-sound-container { float: left; width: 40px; display: none; height: auto; cursor: pointer; } .pplive-player .w-control .w-control-right .w-sound-container .bordercommon { border: 2px solid transparent; border-radius: 50%; } .pplive-player .w-control .w-control-right .w-sound-container .arc_2 { border: 2px solid transparent; border-radius: 50%; width: 22px; height: 22px; margin: 0; position: absolute; pointer-events: none; top: 5px; } .pplive-player .w-control .w-control-right .w-sound-container .arc_1 { border: 2px solid transparent; border-radius: 50%; width: 15px; height: 14px; margin: 2px 1px; } .pplive-player .w-control .w-control-right .w-sound-container .arc_0 { border: 2px solid transparent; border-radius: 50%; width: 14px; height: 7px; margin: 2px -5px; } .pplive-player .w-control .w-control-right .w-sound-container .arc_cur { border-right: 2px solid #fff; } .pplive-player .w-control .w-control-right .w-sound-container .w-sound { background-position: -114px -114px; width: 40px; height: 22px; background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new.png); background-repeat: no-repeat; } .pplive-player .w-control .w-control-right .w-sound-container .w-mute { background-position: -10px -206px; width: 40px; height: 22px; background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new.png); background-repeat: no-repeat; } .pplive-player .w-control .w-control-right .w-sound-container .common { width: 40px; height: 22px; background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new.png); background-repeat: no-repeat; } .pplive-player .w-control .w-control-right .w-sound-container:hover .w-sound { background-position: -166px -10px; } .pplive-player .w-control .w-control-right .w-sound-container:hover .w-mute { background-position: -90px -166px; } .pplive-player .w-control .w-control-right .w-sound-container:hover .arc_cur { border-right: 2px solid #3399ff; } .pplive-player .w-control .w-control-right .w-barrage-container { padding: 0 15px 0 0; display: none; cursor: pointer; float: left; width: 38px; text-align: center; } .pplive-player .w-control .w-control-right .w-barrage-container .w-barrage { background: rgba(0, 0, 0, 0); width: 38px; height: 20px; } .pplive-player .w-control .w-control-right .w-barrage-container .w-barrage .w-barrage-open { position: relative; margin: 0; display: inline-block; width: 38px; height: 20px; background-image: url(http://www.zhenguigu.com/rz/images/976536da4e4449db854962bfbc0ca087.gif); background-position: 50% 50%; background-repeat: no-repeat; background-size: 38px 20px; } .pplive-player .w-control .w-control-right .w-barrage-container .w-barrage .w-barrage-close { position: relative; margin: 0; display: inline-block; width: 38px; height: 20px; background-image: url(http://www.zhenguigu.com/rz/images/df0eca43c38e474b9a8e58d1e663354e.gif); background-position: 50% 50%; background-repeat: no-repeat; background-size: 38px 20px; } .pplive-player .w-control .w-control-right .w-ft, .pplive-player .w-control .w-control-right .w-lang, .pplive-player .w-control .w-control-right .w-speed, .pplive-player .w-control .w-control-right .w-focus { float: left; display: none; height: auto; cursor: pointer; text-align: center; font-size: 14px; padding: 0 15px 0 0; } .pplive-player .w-control .w-control-right .w-ft .w-btn-text, .pplive-player .w-control .w-control-right .w-lang .w-btn-text, .pplive-player .w-control .w-control-right .w-speed .w-btn-text, .pplive-player .w-control .w-control-right .w-focus .w-btn-text { font-weight: bold; color: #fff; border: none; line-height: 20px; width: 40px; height: 20px; margin: 0; border-radius: 2px; font-size: 14px; } .pplive-player .w-control .w-control-right .w-ft .w-btn-text:hover, .pplive-player .w-control .w-control-right .w-lang .w-btn-text:hover, .pplive-player .w-control .w-control-right .w-speed .w-btn-text:hover, .pplive-player .w-control .w-control-right .w-focus .w-btn-text:hover { color: #3399ff; background: none; border: none; line-height: 20px; width: 40px; height: 20px; margin: 0; border-radius: 2px; font-size: 14px; } .pplive-player .w-control .w-control-right .w-ft .w-btn-speed, .pplive-player .w-control .w-control-right .w-lang .w-btn-speed, .pplive-player .w-control .w-control-right .w-speed .w-btn-speed, .pplive-player .w-control .w-control-right .w-focus .w-btn-speed { font-weight: bold; color: #fff; border: none; line-height: 20px; width: 40px; height: 20px; margin: 0; border-radius: 2px; font-size: 14px; } .pplive-player .w-control .w-control-right .w-ft .w-btn-speed:hover, .pplive-player .w-control .w-control-right .w-lang .w-btn-speed:hover, .pplive-player .w-control .w-control-right .w-speed .w-btn-speed:hover, .pplive-player .w-control .w-control-right .w-focus .w-btn-speed:hover { color: #3399ff; border: none; background: none; line-height: 20px; width: 40px; height: 20px; margin: 0; border-radius: 2px; font-size: 14px; } .pplive-player .w-control .w-control-right .w-ft .w-btn-focus, .pplive-player .w-control .w-control-right .w-lang .w-btn-focus, .pplive-player .w-control .w-control-right .w-speed .w-btn-focus, .pplive-player .w-control .w-control-right .w-focus .w-btn-focus { width: 50px !important; font-weight: bold; color: #fff; border: none; line-height: 20px; width: 40px; height: 20px; margin: 0; border-radius: 2px; font-size: 14px; } .pplive-player .w-control .w-control-right .w-ft .w-btn-focus img, .pplive-player .w-control .w-control-right .w-lang .w-btn-focus img, .pplive-player .w-control .w-control-right .w-speed .w-btn-focus img, .pplive-player .w-control .w-control-right .w-focus .w-btn-focus img { display: inline-block; width: 15px; height: 15px; margin: 0 0 0 3px; vertical-align: -3px; border-radius: 15px; border: 1px solid #3399ff; } .pplive-player .w-control .w-control-right .w-ft .w-btn-focus:hover, .pplive-player .w-control .w-control-right .w-lang .w-btn-focus:hover, .pplive-player .w-control .w-control-right .w-speed .w-btn-focus:hover, .pplive-player .w-control .w-control-right .w-focus .w-btn-focus:hover { width: 50px !important; color: #3399ff; border: none; background: none; line-height: 20px; width: 40px; height: 20px; margin: 0; border-radius: 2px; font-size: 14px; } .pplive-player .w-control .w-control-right .w-ft .common, .pplive-player .w-control .w-control-right .w-lang .common, .pplive-player .w-control .w-control-right .w-speed .common, .pplive-player .w-control .w-control-right .w-focus .common { line-height: 20px; width: 40px; height: 20px; margin: 0; border-radius: 2px; font-size: 14px; } .pplive-player .w-control .w-control-right .w-lang { display: none; } .pplive-player .w-control .w-control-content { display: none; } .pplive-player .w-control .w-progress { position: absolute; left: 0; top: -8px; width: 100%; height: 8px; cursor: pointer; } .pplive-player .w-control .w-progress .w-progress-slider { position: absolute; left: 0; top: 0; width: 100%; height: 8px; } .pplive-player .w-control .w-progress .w-progress-slider .w-point, .pplive-player .w-control .w-progress .w-progress-slider .w-point3 { cursor: pointer; position: absolute; bottom: 0px; width: 8px; height: 8px; background: #FFFFFF; border: none; border-radius: 50%; transform: scale(0); transition: all .15s ease; transform-origin: bottom center; z-index: 1; } .pplive-player .w-control .w-progress .w-progress-slider .w-point2 { cursor: pointer; position: absolute; bottom: -2px; width: 1px; height: 4px; background: #F5C142; border: none; transition: all .15s ease; transform-origin: bottom center; } .pplive-player .w-control .w-progress .w-progress-slider .w-posiBar { position: absolute; top: 0; left: 0; height: 8px; background: #4599F7; transform: scaleY(0.25); transition: all .15s ease; transform-origin: bottom center; } .pplive-player .w-control .w-progress .w-progress-slider .w-bufferBar { position: absolute; top: 0; left: 0; height: 8px; background: #999; transform: scaleY(0.25); transition: all .15s ease; transform-origin: bottom center; } .pplive-player .w-control .w-progress .w-progress-slider .w-active { cursor: pointer; height: 10px; width: 100%; margin: -9px auto; background: transparent; } .pplive-player .w-control .w-progress .w-progress-slider .w-drag { position: absolute; top: -7px; margin-left: -11px; z-index: 10; width: 22px; height: 22px; border-radius: 50%; background-image: url(http://www.zhenguigu.com/rz/images/576e33694564482292e0b3aaf6ef1c84.gif); background-repeat: no-repeat; background-position: 50% 50%; border: none; transform: scale(0); transition: all .15s ease; transform-origin: center center; } .pplive-player .w-control .w-progress .w-progress-slider .w-drag-progress { margin-left: -25px; background-repeat: no-repeat; background-position: 50% 50%; width: 50px; height: 50px; border-radius: 0; z-index: 0; } .pplive-player .w-control .w-progress .w-progress-slider:after { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(51, 51, 51, 0.6); z-index: -1; transform: scaleY(0.25); transition: all .15s ease; transform-origin: bottom center; } .pplive-player .w-set-barrage { display: flex; flex: auto; position: absolute; top: 6px; height: 32px; font-size: 12px; display: none; } .pplive-player .w-set-barrage .w-set-barrage-left { flex: auto; position: relative; background: #333; border-radius: 16px 0 0 16px; } .pplive-player .w-set-barrage .w-set-barrage-left input { display: block; flex: auto; color: #999; background: none; width: 100%; height: 32px; line-height: 32px; padding: 0px 40px 0 10px; box-sizing: border-box; } .pplive-player .w-set-barrage .w-set-barrage-left .w-set-barrage-seticon { position: absolute; top: 6px; right: 10px; width: 20px; height: 20px; background-image: url(http://www.zhenguigu.com/rz/images/7873c183b7774ec4bf1da65bbc64a6bd.gif); background-repeat: no-repeat; background-position: -148px -10px; cursor: pointer; } .pplive-player .w-set-barrage .w-set-barrage-left .w-set-barrage-seticon:hover { background-position: -148px -50px; } .pplive-player .w-set-barrage .w-set-barrage-right { width: 56px; height: 32px; background: #049BFE; text-align: center; line-height: 32px; border-radius: 0 16px 16px 0; cursor: pointer; } .pplive-player .w-set-barrage .w-set-barrage-right:hover { background: #00B6FD; } .pplive-player .w-set-barrage .disable { background: #999; cursor: default; } .pplive-player .w-set-barrage .disable:hover { background: #999; } .pplive-player .w-barrage-mask { position: absolute; top: auto; bottom: 100px; left: 50%; margin-left: -256px; width: 512px; height: 44px; background: rgba(0, 0, 0, 0.8); border-radius: 5px; z-index: 99; cursor: move; display: none; } .pplive-player .w-barrage-mask .w-set-barrage { display: flex; left: 12px; width: 466px; } .pplive-player .w-barrage-mask:before { content: ''; width: 20px; height: 20px; background: url(http://www.zhenguigu.com/rz/images/7873c183b7774ec4bf1da65bbc64a6bd.gif) no-repeat -148px -111px; position: absolute; top: 12px; right: 10px; } .pplive-player .w-float-wrap { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 90; pointer-events: none; } .pplive-player .w-float-wrap * { pointer-events: all; } .pplive-player .w-control.w-control-select { height: 44px; } .pplive-player .w-control.w-control-select .w-control-content { display: block; } .pplive-player .w-control.w-control-select .w-progress .w-progress-slider .w-point, .pplive-player .w-control.w-control-select .w-progress .w-progress-slider .w-point3 { transform: scale(0.5); } .pplive-player .w-control.w-control-select .w-progress .w-progress-slider .w-point2 { height: 4px; bottom: 0; } .pplive-player .w-control.w-control-select .w-progress .w-progress-slider .w-posiBar { transform: scaleY(0.5); background: #4599F7; } .pplive-player .w-control.w-control-select .w-progress .w-progress-slider .w-bufferBar { transform: scaleY(0.5); background: #999; } .pplive-player .w-control.w-control-select .w-progress .w-progress-slider .w-drag { transform: scale(0.6); top: -4px; } .pplive-player .w-control.w-control-select .w-progress .w-progress-slider .w-drag-progress { transform: scale(1); top: -20px; } .pplive-player .w-control.w-control-select .w-progress .w-progress-slider:after { transform: scaleY(0.5); } .pplive-player .w-control.w-control-select .w-progress:hover .w-progress-slider .w-posiBar { transform: scaleY(1); } .pplive-player .w-control.w-control-select .w-progress:hover .w-progress-slider .w-bufferBar { transform: scaleY(1); } .pplive-player .w-control.w-control-select .w-progress:hover .w-progress-slider .w-point, .pplive-player .w-control.w-control-select .w-progress:hover .w-progress-slider .w-point3 { transform: scale(1); } .pplive-player .w-control.w-control-select .w-progress:hover .w-progress-slider .w-point2 { height: 8px; bottom: 0; } .pplive-player .w-control.w-control-select .w-progress:hover .w-progress-slider .w-drag { width: 22px; height: 22px; transform: scale(1); top: -6px; } .pplive-player .w-control.w-control-select .w-progress:hover .w-progress-slider .w-drag-progress { width: 50px; height: 50px; transform: scale(1); top: -22px; } .pplive-player .w-control.w-control-select .w-progress:hover .w-progress-slider:after { transform: scaleY(1); } .pplive-player .w-colorset { display: none; position: absolute; top: 0; left: 0; width: 370px; height: 244px; background: #181818; border-radius: 3px; font-size: 12px; line-height: 24px; z-index: 102; } .pplive-player .w-colorset dt { padding: 13px 0 5px 0; text-indent: 20px; clear: both; } .pplive-player .w-colorset .w-takecolor { padding: 5px 0 0 36px; margin-bottom: -5px; } .pplive-player .w-colorset .w-takecolor a { position: relative; display: block; float: left; width: 64px; height: 24px; margin: 0 14px 10px 0; text-align: center; background: #222222; box-sizing: border-box; border-radius: 12px; border: 1px solid #222222; } .pplive-player .w-colorset .w-takecolor a i { display: none; position: absolute; right: 0; bottom: 0; background: url(http://www.zhenguigu.com/rz/images/7873c183b7774ec4bf1da65bbc64a6bd.gif) no-repeat -148px -90px; width: 10px; height: 10px; } .pplive-player .w-colorset .w-takecolor ._ffffff { color: #ffffff; } .pplive-player .w-colorset .w-takecolor ._ffef00 { color: #ffef00; } .pplive-player .w-colorset .w-takecolor ._ff9000 { color: #ff9000; } .pplive-player .w-colorset .w-takecolor ._ff0000 { color: #ff0000; } .pplive-player .w-colorset .w-takecolor ._ff008c { color: #ff008c; } .pplive-player .w-colorset .w-takecolor ._00fcff { color: #00fcff; } .pplive-player .w-colorset .w-takecolor ._2a90ff { color: #2a90ff; } .pplive-player .w-colorset .w-takecolor ._7c00ff { color: #7c00ff; } .pplive-player .w-colorset .w-takecolor ._c2ab32 { color: #c2ab32; } .pplive-player .w-colorset .w-takecolor ._00ff0d { color: #00ff0d; } .pplive-player .w-colorset .w-takecolor a:hover { border: 1px solid #4599F7; } .pplive-player .w-colorset .w-takecolor .active { border: 1px solid #4599F7; } .pplive-player .w-colorset .w-takecolor .active i { display: block; } .pplive-player .w-colorset .w-posset { padding: 4px 0 11px 29px; } .pplive-player .w-colorset .w-posset div { width: 78px; float: left; text-align: center; color: #fff; cursor: pointer; } .pplive-player .w-colorset .w-posset div i { display: block; width: 22px; height: 20px; margin: 0 auto; background-image: url(http://www.zhenguigu.com/rz/images/7873c183b7774ec4bf1da65bbc64a6bd.gif); background-repeat: no-repeat; } .pplive-player .w-colorset .w-posset div:hover, .pplive-player .w-colorset .w-posset div.active { color: #4599F7; } .pplive-player .w-colorset .w-posset .w-pos-move i { background-position: -12px -14px; } .pplive-player .w-colorset .w-posset .w-pos-move:hover i { background-position: -12px -60px; } .pplive-player .w-colorset .w-posset .w-pos-move.active i { background-position: -12px -106px; } .pplive-player .w-colorset .w-posset .w-pos-top i { background-position: -58px -14px; } .pplive-player .w-colorset .w-posset .w-pos-top:hover i { background-position: -58px -60px; } .pplive-player .w-colorset .w-posset .w-pos-top.active i { background-position: -58px -106px; } .pplive-player .w-colorset .w-posset .w-pos-bottom i { background-position: -104px -14px; } .pplive-player .w-colorset .w-posset .w-pos-bottom:hover i { background-position: -104px -60px; } .pplive-player .w-colorset .w-posset .w-pos-bottom.active i { background-position: -104px -106px; } .pplive-player .w-handy { width: 60px; height: 130px; position: absolute; z-index: 99; display: none; } .pplive-player .w-handy .w-handy-child { width: 60px; height: 60px; background: rgba(34, 34, 34, 0.8); border: 0px solid #ff0; border-radius: 3px; } .pplive-player .w-handy .w-share { cursor: pointer; } .pplive-player .w-handy .w-share i { background: url(http://www.zhenguigu.com/rz/images/w_oth_sprite.png) no-repeat 70.3% 31%; width: 22px; height: 26px; position: absolute; margin-top: 17px; margin-left: 19px; text-indent: -9999px; font-size: 12px; color: #3399ff; font-style: normal; } .pplive-player .w-handy .w-share:hover i { background: none; text-indent: 0; width: 60px; height: 60px; font-size: 15px; color: #3399ff; letter-spacing: 2px; text-align: center; line-height: 60px; margin: auto; } .pplive-player .w-handy .w-qrcode { margin-top: 10px; cursor: pointer; } .pplive-player .w-handy .w-qrcode i { background: url(http://www.zhenguigu.com/rz/images/w_oth_sprite.png) no-repeat 75% 30.5%; width: 18px; height: 26px; position: absolute; margin-top: 17px; margin-left: 21px; text-indent: -9999px; font-size: 12px; color: #3399ff; font-style: normal; } .pplive-player .w-handy .w-qrcode:hover i { background: none; text-indent: 0; width: 60px; height: 60px; font-size: 15px; color: #3399ff; text-align: center; line-height: 60px; margin: auto; } .pplive-player .w-head { width: 100%; position: absolute; top: 30px; left: 0; line-height: 18px; height: 18px; z-index: 99; display: none; } .pplive-player .w-head .w-head-child { position: absolute; top: 0; } .pplive-player .w-head .w-title { font-size: 16px; left: 30px; } .pplive-player .w-head .w-title i { width: 44px; height: 18px; display: inline-block; background: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new.png) no-repeat -93px -206px; margin-right: 10px; display: none; } .pplive-player .w-head .w-title span { vertical-align: 3px; } .pplive-player .w-head .w-time { font-size: 18px; right: 30px; } .pplive-player #p-error { position: absolute; width: 100%; height: 100%; background: #181818; top: 0; left: 0; z-index: 99; } .pplive-player #p-error .err-download-box { background: url(http://www.zhenguigu.com/rz/images/p-player.jpg) no-repeat center; background-size: cover; width: 100%; height: 100%; overflow: hidden; } .pplive-player #p-error .err-download-box .text { margin-top: 1.39rem; width: 100%; height: 0.42rem; text-align: center; line-height: 0.42rem; font-size: 0.3rem; display: block; } .pplive-player #p-error .err-download-box .button { width: 2rem; height: 0.6rem; text-align: center; line-height: 0.6rem; margin: 0.4rem auto; background-color: #FAA519; font-size: 0.26rem; color: #fff; border-radius: 0.04rem; display: block; } .pplive-player #p-error .w-error-content { position: absolute; } .pplive-player #p-error .w-error-content .w-error-img { background: url(http://www.zhenguigu.com/rz/images/w_player_sprite.png) no-repeat 100% 0%; background-size: 200% 160%; width: 110px; height: 113px; position: absolute; filter: drop-shadow(0px 0px 4px #ffffff); } .pplive-player #p-error .w-error-content .w-error-txt { margin-left: 125px; line-height: 24px; font-size: 13px; } .pplive-player #p-error .w-error-content .w-error-txt .w-feedbackbtn, .pplive-player #p-error .w-error-content .w-error-txt .w-changeflash { display: block; border: 1px solid #00afec; background: #00afec; color: #000; height: 25px; width: 70px; line-height: 25px; text-align: center; border-radius: 2px; position: relative; top: 10px; font-size: 13px; } .pplive-player #p-error .w-error-content .w-error-txt .udpate { cursor: pointer; } .pplive-player #p-error .w-error-content .w-error-txt .f_txt { font-size: 16px; font-weight: bold; } .pplive-player #p-error .w-error-content .w-error-txt .s_txt { font-size: 12px; } .pplive-player #p-error .w-error-content .w-error-txt .t_txt { font-size: 13px; } .pplive-player #p-error .w-error-content .w-copyright-text span { line-height: 35px; } .pplive-player #p-error .w-error-content .w-copyright-image div { margin-top: 25px; } .pplive-player #p-error .w-error-content .w-copyright-image .w-download-client { width: 282px; height: 52px; background: url(http://www.zhenguigu.com/rz/images/w_oth_sprite.png) no-repeat 0% 64.5%; position: relative; left: 0; cursor: pointer; text-align: center; line-height: 52px; color: #ffcf8d; font-size: 18px; } .pplive-player #p-error .w-error-content .w-copyright-image .w-copyright { position: relative; width: 290px; height: 72px; background: url(http://www.zhenguigu.com/rz/images/w_oth_sprite.png) no-repeat 0% 37%; } .pplive-player #p-error .w-error-content .w-copyright-image .w-download-app { width: 275px; height: 100px; background: #1b1b1b; padding: 4px; border: 1px solid #363636; border-radius: 3px; } .pplive-player #p-error .w-error-content .w-copyright-image .w-download-app span { position: absolute; margin: 25px 15px; color: #b5b5b5; } .pplive-player .w-copy-url { width: 10px; height: 10px; float: left; position: absolute; top: 0; left: -100px; z-index: -10; background: #000; opacity: 0.1; } .pplive-player .copied { position: absolute; width: auto; height: 20px; top: 45%; left: 45%; z-index: 99; color: #A0A0A0; padding: 0 6px; line-height: 20px; border-radius: 9px; background: rgba(0, 0, 0, 0.7); } .pplive-player .w-feedback { position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 99; color: #A0A0A0; background: rgba(0, 0, 0, 0.6); } .pplive-player .w-feedback .w-mask { position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 394px; height: 320px; z-index: 1; font-size: 12px; overflow: hidden; color: #333; border-radius: 6px; } .pplive-player .w-feedback .w-mask-hd { height: 40px; line-height: 40px; width: 100%; font-weight: bold; overflow: hidden; background: #181818; } .pplive-player .w-feedback .w-mask-hd h3 { float: left; font-size: 16px; margin-left: 16px; color: #fff; } .pplive-player .w-feedback .w-mask-hd .w-mask-close { float: right; display: inline-block; width: 20px; height: 20px; margin: 0px 4px; font-size: 28px; font-weight: normal; color: #333; } .pplive-player .w-feedback .w-mask-hd .w-mask-close:hover { color: #fff; } .pplive-player .w-feedback .w-mask-bd { background: #181818; height: 280px; width: 100%; font-size: 12px; color: #A0A0A0; overflow: hidden; } .pplive-player .w-feedback .w-mask-bd p { margin: 0 0 0 16px; } .pplive-player .w-feedback .w-mask-bd .w-mask_form { margin: 15px 0 0 16px; } .pplive-player .w-feedback .w-mask-bd .w-mask_form .w-qa { overflow: hidden; } .pplive-player .w-feedback .w-mask-bd .w-mask_form .w-qa span { float: left; width: 75px; } .pplive-player .w-feedback .w-mask-bd .w-mask_form .w-qa .w-checkbox { float: left; width: 290px; } .pplive-player .w-feedback .w-mask-bd .w-mask_form .w-qa .w-checkbox ul { overflow: hidden; } .pplive-player .w-feedback .w-mask-bd .w-mask_form .w-qa .w-checkbox ul li { float: left; display: inline; width: 80px; margin: 0 10px 10px 0; } .pplive-player .w-feedback .w-mask-bd .w-mask_form .w-qa .w-checkbox ul li input { vertical-align: -3px; margin: 0 5px 0 0; } .pplive-player .w-feedback .w-mask-bd .w-mask_form .w-qa .w-checkbox textarea { width: 278px; height: 58px; margin: 10px 0 0; padding: 5px; color: #666; border-radius: 2px; border: 1px solid #333; background: #333; } .pplive-player .w-feedback .w-mask-bd .w-mask_form .w-qa .w-checkbox textarea:focus { color: #fff; border: 1px solid #4599F7; } .pplive-player .w-feedback .w-mask-bd .w-mask_form .w-con { height: 100%; float: left; width: 100%; margin: 8px 0 0 0; } .pplive-player .w-feedback .w-mask-bd .w-mask_form .w-con span { display: inline-block; width: 75px; } .pplive-player .w-feedback .w-mask-bd .w-mask_form .w-con input { border-radius: 2px; width: 276px; padding: 0 6px; background: #333; height: 24px; line-height: 24px; color: #666; border: 1px solid #333; } .pplive-player .w-feedback .w-mask-bd .w-mask_form .w-con input:focus { color: #fff; border: 1px solid #4599F7; } .pplive-player .w-feedback .w-mask-bd .w-mask_form .w-cont_txt { width: 125px; height: 20px; float: left; margin: 18px 0 0 0; line-height: 20px; color: #ff0000; display: none; font-size: 12px; } .pplive-player .w-feedback .w-mask-bd .w-mask_form .w-mask-btn { float: right; margin: 20px 16px 0 0; } .pplive-player .w-feedback .w-mask-bd .w-mask_form .w-mask-btn a { border-radius: 2px; display: inline-block; width: 76px; height: 26px; text-align: center; line-height: 26px; color: #fff; } .pplive-player .w-feedback .w-mask-bd .w-mask_form .w-mask-btn .w-submit { background: #4599F7; } .pplive-player .w-feedback .w-mask-bd .w-mask_form .w-mask-btn .w-submit:hover { background: #4BB7FF; } .pplive-player .w-feedback .w-mask-bd .w-mask_form .w-mask-btn .w-cancel { background: #666666; } @keyframes BX__SprAniKey1 { 0% { background-position: 0px 0px; } 2.86% { background-position: -100px 0px; } 5.71% { background-position: -200px 0px; } 8.57% { background-position: -300px 0px; } 11.43% { background-position: -400px 0px; } 14.29% { background-position: -500px 0px; } 17.14% { background-position: -600px 0px; } 20.00% { background-position: -700px 0px; } 22.86% { background-position: -800px 0px; } 25.71% { background-position: -900px 0px; } 28.57% { background-position: -1000px 0px; } 31.43% { background-position: -1100px 0px; } 34.29% { background-position: -1200px 0px; } 37.14% { background-position: -1300px 0px; } 40.00% { background-position: -1400px 0px; } 42.86% { background-position: -1500px 0px; } 45.71% { background-position: -1600px 0px; } 48.57% { background-position: -1700px 0px; } 51.43% { background-position: -1800px 0px; } 54.29% { background-position: -1900px 0px; } 57.14% { background-position: -2000px 0px; } 60.00% { background-position: -2100px 0px; } 62.86% { background-position: -2200px 0px; } 65.71% { background-position: -2300px 0px; } 68.57% { background-position: -2400px 0px; } 71.43% { background-position: -2500px 0px; } 74.29% { background-position: -2600px 0px; } 77.14% { background-position: -2700px 0px; } 80.00% { background-position: -2800px 0px; } 82.86% { background-position: -2900px 0px; } 85.71% { background-position: -3000px 0px; } 88.57% { background-position: -3100px 0px; } 91.43% { background-position: -3200px 0px; } 94.29% { background-position: -3300px 0px; } 97.14% { background-position: -3400px 0px; } } .pplive-player .w-video .w-video-loading { position: absolute; width: 100%; height: 100%; font-size: 12px; font-family: 'Microsoft Yahei'; color: #fff; left: 0px; top: 0px; z-index: 99; text-align: center; } .pplive-player .w-video .w-video-loading .BX__AEComposition { background: transparent; width: 100px; height: 100px; overflow: hidden; position: absolute; transform: translate3D(0, 0, 0) scale(1, 1); transform-origin: 50% 0%; left: 50%; top: 50%; margin-top: -50px; margin-left: -50px; } .pplive-player .w-video .w-video-loading .BX__Class1 { left: 0.00px; top: 0.00px; width: 100px; height: 100px; transform-style: preserve-3d; transform: translate3D(0, 0, 0px) rotate(0deg) scale(1, 1); opacity: 1.00; transform-origin: 50.00% 50.00%; display: block; position: absolute; } .pplive-player .w-video .w-video-loading .BX__BG1 { background: transparent; } .pplive-player .w-video .w-video-loading .BX__Ani1 { animation: BX__AniKey1 1.4s steps(1) 0s infinite normal none; } .pplive-player .w-video .w-video-loading .BX__Sprite1 { background-image: url("http://www.zhenguigu.com/rz/images/57affb28e287b493725e396446b8a74b.png"); width: 100px; height: 100px; animation: BX__SprAniKey1 1.4s steps(1) 0s infinite normal none; } .pplive-player .w-video .w-video-fast { position: absolute; width: 100%; height: 100%; font-size: 14px; font-family: 'Microsoft Yahei'; color: #fff; left: 0px; top: 0px; z-index: 99; text-align: center; } .pplive-player .w-video .w-video-fast div { position: absolute; width: 76px; height: 30px; top: 50%; left: 50%; overflow: hidden; margin-top: -16px; margin-left: -36px; border-radius: 20px; background: rgba(0, 0, 0, 0.75); } .pplive-player .w-video .w-video-fast div img { width: 24px; height: 24px; float: left; margin-top: 3px; margin-left: 12px; } .pplive-player .w-video .w-video-fast div span { width: 23px; height: 16px; float: right; line-height: 30px; margin-right: 10px; } .pplive-player #w-button-tip { position: absolute; font-size: 13px; z-index: 100; } .pplive-player #w-button-tip .w-content { position: relative; border-radius: 3px; background: rgba(0, 0, 0, 0.8); text-align: center; line-height: 30px; color: #9b999b; } .pplive-player #w-button-tip .w-content .w-ftname { cursor: pointer; position: relative; } .pplive-player #w-button-tip .w-content .w-ftname:hover { color: #4599F7; } .pplive-player #w-button-tip .w-content .w-rate { width: auto; text-align: left; padding: 10px 35px; position: relative; } .pplive-player #w-button-tip .w-content .w-rate .current { color: #4599F7; } .pplive-player #w-button-tip .w-content span { white-space: nowrap; } .pplive-player #w-button-tip .w-content .begin-skip { min-width: 185px; } .pplive-player #w-button-tip .w-content .w-ftname .ftico { position: absolute; top: 2px; right: -30px; } .pplive-player #w-button-tip .w-content .w-ftname .ftico span { display: block; width: 26px; height: 10px; margin-bottom: 2px; } .pplive-player #w-button-tip .w-content .w-ftname .ftico .ico_vip { background: url(http://www.zhenguigu.com/rz/images/802521a442b14149a937c7dae0d30549.gif) no-repeat; } .pplive-player #w-button-tip .w-content .w-ftname .ftico .ico_fps { background: url(http://www.zhenguigu.com/rz/images/6ec524b71e2b4200af8c23a5bca8d875.gif) no-repeat; } .pplive-player #w-button-tip .w-triangle { border-left: none; border-right: none; border-top: none; position: absolute; display: block; background: rgba(0, 0, 0, 0); height: 16px; } .pplive-player #volume_tip { position: absolute; font-size: 16px; color: #fff; left: 20px; top: 20px; z-index: 99; filter: drop-shadow(2px 2px 1px #000); } .pplive-player #w-center { z-index: 100; width: 350px; height: 220px; background: rgba(0, 0, 0, 0.8); border-radius: 2px; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; } .pplive-player #w-center .common { position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; } .pplive-player #w-center .w-center-title { font-size: 16px; color: #ffffff; margin-top: 8px; margin-left: 20px; float: left; } .pplive-player #w-center .w-center-close { font-size: 16px; color: #ffffff; margin-top: 10px; margin-right: 8px; float: right; width: 20px; height: 20px; cursor: pointer; text-align: center; } .pplive-player #w-center .w-center-content { font-size: 14px; width: 320px; height: 170px; margin-top: 40px; margin-left: 20px; } .pplive-player #w-center .w-center-content a:link, .pplive-player #w-center .w-center-content a:hover, .pplive-player #w-center .w-center-content a:active { text-decoration: underline; } .pplive-player #w-center .w-center-content .w-content-qrcode { width: 150px; height: 150px; background: #ffffff; float: left; position: absolute; } .pplive-player #w-center .w-center-content .w-content-qrcode i { background: url(http://www.zhenguigu.com/rz/images/d3a267ba8947d99a30240604748beecf.png); width: 20px; height: 20px; z-index: 99; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; } .pplive-player #w-center .w-center-content .w-content-qrcode img { width: 150px; height: 150px; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; } .pplive-player #w-center .w-center-content .w-pre-video { width: 210px; height: 120px; background: #000; float: left; position: absolute; } .pplive-player #w-center .w-center-content .w-share-icon i { width: 16px; height: 16px; float: left; margin: 0 4px 0 0; } .pplive-player #w-center .w-center-content .w-share-copy { font-size: 12px; margin-top: 55px; line-height: 22px; } .pplive-player #w-center .w-center-content .w-share-copy a.live { cursor: pointer; width: 100px; display: block; } .pplive-player #w-center .w-center-content .w-share-copy a.vod { cursor: pointer; width: 100px; display: block; margin-right: 5px; float: left; color: #8f8f8f; text-decoration: none; } .pplive-player #w-center .w-center-content .w-share-copy span { position: relative; width: 12px; height: 12px; background: none; border: 1px #8f8f8f solid; border-radius: 50%; display: inline-block; box-sizing: border-box; margin-right: 5px; } .pplive-player #w-center .w-center-content .w-share-copy span.select:after { position: absolute; width: 8px; height: 8px; border-radius: 8px; content: ''; top: 1px; left: 1px; background: #3399ff; } .pplive-player #w-center .w-center-content .w-copy-txt { width: 260px; height: 30px; background: #666666; line-height: 30px; font-size: 12px; color: #fff; white-space: nowrap; } .pplive-player #w-center .w-center-content .w-copy-txt span { overflow: hidden; margin: 0 5px; width: 250px; display: block; } .pplive-player #w-center .w-center-content .w-copy-btn { width: 50px; height: 30px; background: #3399ff; float: right; margin-top: -30px; text-align: center; line-height: 30px; cursor: pointer; } .pplive-player #w-center .w-center-content .w-pre-slider { float: left; margin-top: 15px; width: 310px; height: 4px; background: #666; font-size: 12px; } .pplive-player #w-center .w-center-content .w-pre-slider .w-pre-posi { float: left; width: 310px; height: 4px; background: #3399ff; position: absolute; } .pplive-player #w-center .w-center-content .w-pre-start-drag { cursor: pointer; margin-left: 0px; } .pplive-player #w-center .w-center-content .w-pre-start-drag div { width: 6px; height: 14px; background: #ffffff; margin: -5px -3px; position: absolute; } .pplive-player #w-center .w-center-content .w-pre-end-drag { cursor: pointer; margin-left: 310px; } .pplive-player #w-center .w-center-content .w-pre-end-drag div { width: 6px; height: 14px; background: #ffffff; margin: -5px -3px; position: absolute; } .pplive-player #w-center .w-center-content .w-pre-start { float: left; margin-top: 10px; } .pplive-player #w-center .w-center-content .w-pre-end { float: right; margin-top: 10px; } .pplive-player #w-pay { width: 100%; height: 100%; top: 0; left: 0; position: absolute; background: #222; z-index: 110; } .pplive-player #w-pay .w-pay-content { position: absolute; max-width: 515px; font-size: 12px; } .pplive-player #w-pay .w-pay-content .w-pay-title-center { font-size: 20px; color: #ffcf8d; top: 0; right: 0; bottom: 0; left: 0; margin: auto; text-align: center; max-width: 500px; max-height: 70px; overflow: hidden; } .pplive-player #w-pay .w-pay-content .w-pay-title-normal { font-size: 20px; color: #ffcf8d; text-align: left; } .pplive-player #w-pay .w-pay-content .w-pay-deadline { color: #616161; margin-top: 12px; font-size: 15px; } .pplive-player #w-pay .w-pay-content .w-pay-desc { color: #ffffff; margin-top: 12px; } .pplive-player #w-pay .w-pay-content .w-pay-desc a { color: #e69900; cursor: pointer; } .pplive-player #w-pay .w-pay-content .w-pay-desc a:hover { color: #ffcf8d; } .pplive-player #w-pay .w-pay-content .w-pay-error { color: #ffffff; margin-top: 35px; } .pplive-player #w-pay .w-pay-content .w-pay-button { position: absolute; margin-top: 15px; overflow: hidden; height: 42px; } .pplive-player #w-pay .w-pay-content .w-pay-button a { margin: 0 5px; } .pplive-player #w-pay .w-pay-content .w-pay-button :first-child { margin-left: 0; } .pplive-player #w-pay .w-pay-content .w-pay-button .w-pay-xinying { margin-top: 55px; font-size: 14px; color: #e69900; cursor: pointer; float: left; left: -4px; position: absolute; } .pplive-player #w-pay .w-pay-content .w-pay-button .w-pay-xinying:hover { color: #ffcf8d; } .pplive-player #w-pay .w-pay-content .w-pay-button .w-pay-buyticket, .pplive-player #w-pay .w-pay-content .w-pay-button .w-pay-buyvip { background: url(http://www.zhenguigu.com/rz/images/w_oth_sprite.png) no-repeat 59.5% 100%; cursor: pointer; width: 162px; height: 42px; text-align: center; font-size: 16px; color: #ffcf8d; line-height: 42px; float: left; } .pplive-player #w-pay .w-pay-content .w-pay-button .w-pay-buyticket:hover, .pplive-player #w-pay .w-pay-content .w-pay-button .w-pay-buyvip:hover { background: url(http://www.zhenguigu.com/rz/images/w_oth_sprite.png) no-repeat 0% 100%; } .pplive-player #w-pay .w-pay-content .w-pay-button .w-pay-buymovie { background: url(http://www.zhenguigu.com/rz/images/w_oth_sprite.png) no-repeat 59.5% 83%; cursor: pointer; width: 162px; height: 42px; text-align: center; font-size: 16px; color: #ffffff; line-height: 42px; float: left; } .pplive-player #w-pay .w-pay-content .w-pay-button .w-pay-buymovie:hover { background: url(http://www.zhenguigu.com/rz/images/w_oth_sprite.png) no-repeat 0% 83%; } .pplive-player #w-pay .w-pay-content .w-pay-button .w-pay-play { background: url(http://www.zhenguigu.com/rz/images/w_oth_sprite.png) no-repeat 59.5% 65.5%; cursor: pointer; width: 162px; height: 42px; text-align: center; font-size: 16px; color: #ffffff; line-height: 42px; float: left; margin-top: 55px; } .pplive-player #w-pay .w-pay-content .w-pay-button .w-pay-play:hover { background: url(http://www.zhenguigu.com/rz/images/w_oth_sprite.png) no-repeat 0% 65.5%; } .pplive-player #w-pay .w-pay-content .w-pay-privilege { background: url(http://www.zhenguigu.com/rz/images/w_oth_sprite.png) no-repeat 0% 0%; width: 434px; height: 80px; margin-top: 105px; margin-left: -3px; } .pplive-player .volume-progress { width: 30px; height: 110px; } .pplive-player .volume-progress .volume-rate { line-height: 30px; font-size: 10px; } .pplive-player .volume-progress .volume-bufferBar { width: 4px; height: 72px; background: #666666; left: 0; right: 0; margin: auto; position: absolute; top: 30px; } .pplive-player .volume-progress .volume-posiBar { width: 4px; height: 30px; background: #3399ff; left: 0; right: 0; margin: auto; position: absolute; top: 10px; } .pplive-player .volume-progress .volume-drag { cursor: pointer; width: 12px; height: 12px; background-image: url(http://www.zhenguigu.com/rz/images/e3df381d192f4fc8be026421d9554102.gif); background-repeat: no-repeat; background-position: 50% 50%; background-size: 12px 12px; left: 0; right: 0; margin: auto; position: absolute; top: 60px; } .pplive-player .w-setting { font-size: 12px; line-height: 22px; } .pplive-player .w-setting .w-content .setPage1 div { width: auto; text-align: left; } .pplive-player .w-setting .w-content .setPage1 .set-float { color: #666; } .pplive-player .w-setting .setPage1, .pplive-player .w-setting .setPage2 { padding-top: 11px; font-size: 12px; } .pplive-player .w-setting a { cursor: pointer; width: auto; display: block; width: 230px; padding: 5px 12px; margin: 0 0 5px 0; color: #fff; text-decoration: none; text-align: left; font-weight: bold; } .pplive-player .w-setting span.select { background: #3399ff; } .pplive-player .w-setting span:after { position: absolute; width: 20px; height: 20px; border-radius: 50%; content: ''; top: -3px; left: 0px; background: #666; } .pplive-player .w-setting span { position: relative; float: right; width: 30px; height: 14px; background: #333; border: none; border-radius: 7px; box-sizing: border-box; margin: 3px 6px -1px 5px; } .pplive-player .w-setting span.select:after { position: absolute; width: 20px; height: 20px; border-radius: 50%; content: ''; top: -3px; left: 11px; background: #fff; } .pplive-player .w-setting i { float: right; height: 20px; width: 20px; background: url(http://www.zhenguigu.com/rz/images/1f3164006c8846338ac41f7672c8ab07.gif) no-repeat 50% 50%; background-size: 15px 15px; } .pplive-player .w-setting i:hover { float: right; height: 20px; width: 20px; background: url(http://www.zhenguigu.com/rz/images/4c26bc4748594bb3ade6a66522cd44da.gif) no-repeat 50% 50%; background-size: 15px 15px; } .pplive-player .w-setting .setPage2 dl { width: 230px; height: 46px; padding: 0 12px; text-align: left; } .pplive-player .w-setting .setPage2 dl dt { float: left; width: 52px; line-height: 36px; } .pplive-player .w-setting .setPage2 dl dd { float: left; width: 172px; } .pplive-player .w-setting .setPage2 dl .option-bar { position: relative; padding-top: 14px; height: 10px; } .pplive-player .w-setting .setPage2 dl .option-bar .option-bufferBar { width: 100%; height: 4px; border-radius: 2px; background: #333; } .pplive-player .w-setting .setPage2 dl .option-bar .option-posiBar { width: 0; height: 4px; border-radius: 2px; background: #049bfe; position: absolute; left: 0; top: 14px; } .pplive-player .w-setting .setPage2 dl .option-bar .option-drag { cursor: pointer; width: 14px; height: 14px; border-radius: 50%; background: #fff; position: absolute; left: auto; left: 0; top: 9px; } .pplive-player .w-setting .setPage2 dl .option-percent { height: 22px; } .pplive-player .w-setting .setPage2 dl .option-end { float: right; } .pplive-player .w-setting .setPage2 .set-bottom { clear: both; padding: 20px 16px 0 12px; height: 33px; line-height: 16px; } .pplive-player .w-setting .setPage2 .set-bottom div { cursor: pointer; color: #666; } .pplive-player .w-setting .setPage2 .set-bottom div:before { content: ''; width: 16px; height: 16px; margin-right: 5px; display: inline-block; background-image: url(http://www.zhenguigu.com/rz/images/4ab510f57598461a824c30645c6e0b10.gif); background-repeat: no-repeat; vertical-align: -3px; } .pplive-player .w-setting .setPage2 .set-bottom .set-renew { float: right; text-align: right; width: 93px; } .pplive-player .w-setting .setPage2 .set-bottom .set-renew:before { background-position: -10px -10px; } .pplive-player .w-setting .setPage2 .set-bottom .set-renew:hover { color: #049bfe; } .pplive-player .w-setting .setPage2 .set-bottom .set-renew:hover:before { background-position: -46px -10px; } .pplive-player .w-setting .setPage2 .set-bottom .set-back { float: left; } .pplive-player .w-setting .setPage2 .set-bottom .set-back:before { background-position: -10px -46px; } .pplive-player .w-setting .setPage2 .set-bottom .set-back:hover { color: #049bfe; } .pplive-player .w-setting .setPage2 .set-bottom .set-back:hover:before { background-position: -46px -46px; } .pplive-player #w-menu { display: block; background: #2D2D2D; opacity: 0.9; border-radius: 5px; position: absolute; z-index: 2147483648; width: 220px; padding: 10px 0; color: #cacaca; font-size: 12px; } .pplive-player #w-menu .w-menuitem { padding-left: 15px; height: 30px; line-height: 30px; cursor: pointer; max-width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .pplive-player #w-menu .w-menuitem:hover { background: #4599F7; color: #fff; } .pplive-player #w-countdown { text-align: center; position: absolute; top: 0; font-size: 18px; background: radial-gradient(80% 80% at 50% 130%, #90C5E8, #2D659D, #0A2151, #000000); margin: 0; z-index: 99; width: 100%; height: 100%; } .pplive-player #w-countdown .countdown-content { position: absolute; width: 100%; height: 70px; top: 50%; left: 0; color: #fff; line-heigth: 30px; margin-top: -35px; } .pplive-player #w-countdown .countdown-content b { font-size: 30px; font-weight: bold; } .speed-dialog { padding: 0 20px; text-align: center; display: block !important; } .speed-dialog .current { color: #4599F7; } .w-speedname { cursor: pointer; font-size: 14px; line-height: 34px; } .w-speedname:hover { color: #4599F7; } .w-current span { color: #fff; } .des { position: absolute; right: 0; top: 52px; background: rgba(0, 0, 0, 0.8); font-size: 12px; padding: 0 7px; } #dom_danmu { background-color: rgba(0, 0, 0, 0); margin-top: 10px; } #dom_danmu > div { will-change: transform; display: flex; align-items: center; white-space: nowrap; border-radius: 24px; border: 1px solid transparent; padding: 5px; position: absolute; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; -webkit-perspective: 1000; -moz-perspective: 1000; -ms-perspective: 1000; perspective: 1000; } #dom_danmu > div > .mx_start { height: 100%; margin-left: -1px; display: flex; align-items: center; color: #FEDF27; } #dom_danmu > div > .mx_start img { height: 115%; display: block; border-radius: 50%; margin-right: 6px; } #dom_danmu > div .vip_icon1, #dom_danmu > div .vip_icon2 { display: none; } #dom_danmu > div img { height: 100%; } #dom_danmu .vip_icon::after, #dom_danmu .vip_icon::before { content: " "; position: absolute; background: url(""/rz/css/)%20no-repeat%20center%20center;%0A%20%20background-size:%20100%25%20100%25;%0A%7D%0A"") no-repeat center center; background-size: 100% 100%; } #dom_danmu .report-shield .report:hover, #dom_danmu .report-shield .shield:hover { color: #ffffff; background-color: #000; } #dom_danmu .report-shield .report > i { background-image: url(http://www.zhenguigu.com/rz/images/bf909a5995c24e07a5b814aeb2c6baba.gif); } #dom_danmu .report-shield .report:hover > i { background-image: url(http://www.zhenguigu.com/rz/images/772eca93164e491db290325b17e17e91.gif); } #dom_danmu .report-shield .shield { margin-top: 10px; } #dom_danmu .report-shield .shield:hover > i { background-image: url(http://www.zhenguigu.com/rz/images/8b5b9daa99dc4389b9519e808ad4b9f0.gif); } #dom_danmu .report-shield .shield i { background-image: url(http://www.zhenguigu.com/rz/images/70ebaeb344a74f44a8af85cf221367f0.gif); } #dom_danmu #like { cursor: pointer; display: flex; align-items: center; margin-left: 10px; position: relative; } #dom_danmu #like .like-icon { background: url(http://www.zhenguigu.com/rz/images/6d173ce739e14e4985c7cd6f0ecf0228.gif) no-repeat center center; background-size: 100% 100%; } #dom_danmu #like .like-num { color: #ffffff; padding-left: 3px; font-size: 20px; } #dom_danmu #like #num { position: absolute; top: 0; left: 15px; transform: translateX(-50%); color: #FEDF27; transition: top 0.5s ease-out; transition-property: top, left; font-size: 14px; font-weight: 500; } #dom_danmu .toast { position: absolute; top: 50%; left: 50%; font-size: 14px; transform: translate(-50%, -50%); background-color: rgba(0, 0, 0, 0.8); text-align: center; padding: 5px 10px; border-radius: 19px; } .focus-pop { width: 240px; height: auto; border-radius: 3px; } .focus-pop ul li { width: 240px; min-height: 42px; margin: 8px 0; cursor: pointer; } .focus-pop ul li .headpic { position: relative; float: left; margin: 0 0 0 16px; } .focus-pop ul li .headpic img { display: block; width: 40px; height: 40px; border: 1px solid transparent; border-radius: 40px; background: url(http://www.zhenguigu.com/rz/images/3ff9bf3b2aaf4feabeddfb2b176f3b1f.gif) no-repeat center; } .focus-pop ul li .headpic i { display: none; position: absolute; width: 16px; height: 16px; background: url(http://www.zhenguigu.com/rz/images/16fedecb75bc42e28d4e482b3739faf3.gif) no-repeat center; left: 30px; top: 30px; border-radius: 16px; } .focus-pop ul li .focusname { float: left; width: 174px; margin: 0 0 0 8px; text-align: left; } .focus-pop ul li .focusname h1 { width: 150px; margin: 6px 0 0; max-height: 32px; font-size: 14px; line-height: 16px; color: #fff; overflow: hidden; -webkit-line-clamp: 2; -moz-line-clamp: 2; -ms-line-clamp: 2; -o-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; -moz-box-orient: vertical; -ms-box-orient: vertical; -o-box-orient: vertical; box-orient: vertical; word-break: break-all; } .focus-pop ul li .focusname .time { position: static; font-size: 12px; color: #999; } .focus-pop ul li:hover .headpic img { border: 1px solid #4599F7; } .focus-pop ul li:hover h1 { color: #4599F7; } .focus-pop ul li.selected .headpic img { border: 1px solid #4599F7; } .focus-pop ul li.selected .headpic i { display: block; } .focus-pop ul li.selected h1 { color: #4599F7; } .focus-pop ul li.all .focusname h1 { margin: 0; line-height: 40px; } .pplive-player-red .w-tips a { color: #CD000C; } .pplive-player-red .w-set-barrage .w-set-barrage-right { background: #CD000C; } .pplive-player-red .w-set-barrage .w-set-barrage-right:hover { background: #F00000; } .pplive-player-red .w-control.w-control-select .w-progress .w-progress-slider .w-posiBar { background: #CD000C; } .pplive-player-red .w-control .w-control-left .w-play-container .w-play, .pplive-player-red .w-control .w-control-left .w-play-container .w-pause, .pplive-player-red .w-control .w-control-left .w-play-container .w-repeat { background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new_red.png); } .pplive-player-red .w-control .w-control-left .w-next-container .w-next { background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new_red.png); } .pplive-player-red .w-control .w-control-right .w-ft .w-btn-text:hover, .pplive-player-red .w-control .w-control-right .w-lang .w-btn-text:hover, .pplive-player-red .w-control .w-control-right .w-speed .w-btn-text:hover, .pplive-player-red .w-control .w-control-right .w-focus .w-btn-text:hover { color: #CD000C; } .pplive-player-red .w-control .w-control-right .w-ft .w-btn-speed:hover, .pplive-player-red .w-control .w-control-right .w-lang .w-btn-speed:hover, .pplive-player-red .w-control .w-control-right .w-speed .w-btn-speed:hover, .pplive-player-red .w-control .w-control-right .w-focus .w-btn-speed:hover { color: #CD000C; } .pplive-player-red .w-control .w-control-right .w-ft .w-btn-focus img, .pplive-player-red .w-control .w-control-right .w-lang .w-btn-focus img, .pplive-player-red .w-control .w-control-right .w-speed .w-btn-focus img, .pplive-player-red .w-control .w-control-right .w-focus .w-btn-focus img { border: 1px solid #CD000C; } .pplive-player-red .w-control .w-control-right .w-ft .w-btn-focus:hover, .pplive-player-red .w-control .w-control-right .w-lang .w-btn-focus:hover, .pplive-player-red .w-control .w-control-right .w-speed .w-btn-focus:hover, .pplive-player-red .w-control .w-control-right .w-focus .w-btn-focus:hover { color: #CD000C; } .pplive-player-red .w-control .w-control-right .w-sound-container .w-sound { background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new_red.png); } .pplive-player-red .w-control .w-control-right .w-sound-container .w-mute { background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new_red.png); } .pplive-player-red .w-control .w-control-right .w-sound-container .common { background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new_red.png); } .pplive-player-red .w-control .w-control-right .w-sound-container:hover .arc_cur { border-right: 2px solid #F00000; } .pplive-player-red .w-control .w-control-right .w-setup-container .w-setup { background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new_red.png); } .pplive-player-red .w-control .w-control-right .w-expand-container .w-expandIn, .pplive-player-red .w-control .w-control-right .w-expand-container .w-expandIn:hover, .pplive-player-red .w-control .w-control-right .w-expand-container .w-expandOut, .pplive-player-red .w-control .w-control-right .w-expand-container .w-expandOut:hover { background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new_red.png); } .pplive-player-red .w-control .w-control-right .w-expand-container .common { background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new_red.png); } .pplive-player-red .w-control .w-control-right .w-zoom-container .w-zoomIn, .pplive-player-red .w-control .w-control-right .w-zoom-container .w-zoomIn:hover, .pplive-player-red .w-control .w-control-right .w-zoom-container .w-zoomOut, .pplive-player-red .w-control .w-control-right .w-zoom-container .w-zoomOut:hover { background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new_red.png); } .pplive-player-red .w-control .w-control-right .w-zoom-container .common { background-image: url(http://www.zhenguigu.com/rz/images/w_player_sprite_new_red.png); } .pplive-player-red .w-control .w-control-right .w-barrage-container .w-barrage .w-barrage-open { background-image: url(http://www.zhenguigu.com/rz/images/c89954cfa7bd4e0a98d55aa85fb1a385.gif); } .pplive-player-red .w-control .w-progress .w-progress-slider .w-drag { background-image: url(http://www.zhenguigu.com/rz/images/72cbb1823ce54f8aaf6908c84bded17d.gif); } .pplive-player-red .w-control .w-progress .w-progress-slider .w-point2 { background: #CD000C; } .pplive-player-red .w-control .w-progress .w-progress-slider .w-posiBar { background: #CD000C; } .pplive-player-red .w-setting span.select { background: #CD000C; } .pplive-player-red .w-setting .setPage2 dl .option-bar .option-posiBar { background: #CD000C; } .pplive-player-red .w-setting .setPage2 .set-bottom div:before { background-image: url(http://www.zhenguigu.com/rz/images/5c90f0f5434d454e8abcd7beedc5c1c7.gif); } .pplive-player-red .w-setting .setPage2 .set-bottom .set-renew:hover { color: #CD000C; } .pplive-player-red .w-setting .setPage2 .set-bottom .set-back:hover { color: #CD000C; } .pplive-player-red .w-big-button { background: rgba(0, 0, 0, 0.6) url(http://www.zhenguigu.com/rz/images/w_player_sprite_new_red.png) no-repeat; } .pplive-player-red #w-button-tip .w-content .speed-dialog .current { color: #CD000C; } .pplive-player-red #w-button-tip .w-content .speed-dialog .w-speedname:hover { color: #F00000; } .pplive-player-red #w-button-tip .w-content .w-ftname:hover { color: #F00000; } .pplive-player-red #w-button-tip .w-content .w-rate .current { color: #CD000C; } .pplive-player-red #w-button-tip .w-content .volume-progress .volume-posiBar { background: #CD000C; } .pplive-player-red #w-button-tip .w-content .volume-progress .volume-drag { background-image: url(http://www.zhenguigu.com/rz/images/4e60a35a0ef14656b3f04dbbe95b795d.gif); } .pplive-player-red .w-recom .w-recom-btn .w-recom-dot span.select:after { background: #CD000C; } .pplive-player-red .w-recom .w-recom-btn a:hover { color: #CD000C; } .pplive-player-red #w-center .w-center-content .w-share-copy span.select:after { background: #CD000C; } .pplive-player-red #w-center .w-center-content .w-copy-btn { background: #CD000C; } .pplive-player-red #w-menu .w-menuitem:hover { background: #CD000C; } .pplive-player-red .w-feedback .w-mask-bd .w-mask_form .w-qa .w-checkbox textarea:focus { border: 1px solid #CD000C; } .pplive-player-red .w-feedback .w-mask-bd .w-mask_form .w-con input:focus { border: 1px solid #CD000C; } .pplive-player-red .w-feedback .w-mask-bd .w-mask_form .w-mask-btn .w-submit { background: #CD000C; } .pplive-player-red .w-feedback .w-mask-bd .w-mask_form .w-mask-btn .w-submit:hover { background: #F00000; } .pplive-player-red .focus-pop ul li .headpic i { background-image: url(http://www.zhenguigu.com/rz/images/cb5403c2fe9b4ec88066829ce15a2086.gif); } .pplive-player-red .focus-pop ul li:hover .headpic img { border: 1px solid #CD000C; } .pplive-player-red .focus-pop ul li:hover h1 { color: #CD000C; } .pplive-player-red .focus-pop ul li.selected .headpic img { border: 1px solid #CD000C; } .pplive-player-red .focus-pop ul li.selected h1 { color: #CD000C; } @keyframes BX__SprAniKey2 { 0% { background-position: 0px 0px; } 5% { background-position: -72px 0px; } 10% { background-position: -144px 0px; } 15% { background-position: -216px 0px; } 20% { background-position: -288px 0px; } 25% { background-position: -360px 0px; } 30% { background-position: -432px 0px; } 35% { background-position: -504px 0px; } 40% { background-position: -576px 0px; } 45% { background-position: -648px 0px; } 50% { background-position: -720px 0px; } 55% { background-position: -792px 0px; } 60% { background-position: -864px 0px; } 65% { background-position: -936px 0px; } 70% { background-position: -1008px 0px; } 75% { background-position: -1080px 0px; } 80% { background-position: -1152px 0px; } 85% { background-position: -1224px 0px; } 90% { background-position: -1296px 0px; } 95% { background-position: -1368px 0px; } } .pplive-player-red .p-video .w-video-loading .BX__AEComposition { width: 72px; margin-left: -36px; } .pplive-player-red .p-video .w-video-loading .BX__AEComposition .BX__Class1 { width: 72px; } .pplive-player-red .p-video .w-video-loading .BX__AEComposition .BX__Class1 .BX__Sprite1 { background-image: url(http://www.zhenguigu.com/rz/images/loading_red.png); width: 72px; animation: BX__SprAniKey2 1.4s steps(1) 0s infinite normal none; } .con-floor-2-right table { table-layout: auto } .s-news-list li em { position: absolute; width: 14px; height: 16px; margin: 18px 0 0 5px; background: url(http://www.zhenguigu.com/rz/css/images/a-1002.png); background-size: cover; } .ppyunplay_expired_choice .ppyunplay_btn_option:after { content: ""; position: absolute; top: 50%; left: 50%; margin-left: -30px; margin-top: -30px; width: 64px; height: 64px; background-size: contain; } .g-header .topArea a.back-index:hover { color: #f70; text-decoration: underline; } .g-header .topArea a.head-register:hover { color: #f70; text-decoration: underline; }