/* Start:/local/templates/forvarddom/css/jquery-ui.css?17931942567141*/ /*! jQuery UI - v1.12.1 - 2018-05-02 * http://jqueryui.com * Includes: core.css, slider.css, theme.css * Copyright jQuery Foundation and other contributors; Licensed MIT */ /* Layout helpers ----------------------------------*/ .ui-helper-hidden { display: none; } .ui-helper-hidden-accessible { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; } .ui-helper-clearfix:before, .ui-helper-clearfix:after { content: ""; display: table; border-collapse: collapse; } .ui-helper-clearfix:after { clear: both; } .ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter:Alpha(Opacity=0); /* support: IE8 */ } .ui-front { z-index: 100; } /* Interaction Cues ----------------------------------*/ .ui-state-disabled { cursor: default !important; pointer-events: none; } /* Icons ----------------------------------*/ .ui-icon { display: inline-block; vertical-align: middle; margin-top: -.25em; position: relative; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; } .ui-widget-icon-block { left: 50%; margin-left: -8px; display: block; } /* Misc visuals ----------------------------------*/ /* Overlays */ .ui-widget-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; } .ui-slider { position: relative; text-align: left; } .ui-slider .ui-slider-handle { position: absolute; z-index: 2; width: 1.2em; height: 1.2em; cursor: default; -ms-touch-action: none; touch-action: none; } .ui-slider .ui-slider-range { position: absolute; z-index: 1; font-size: .7em; display: block; border: 0; background-position: 0 0; } /* support: IE8 - See #6727 */ .ui-slider.ui-state-disabled .ui-slider-handle, .ui-slider.ui-state-disabled .ui-slider-range { filter: inherit; } .ui-slider-horizontal { height: .8em; } .ui-slider-horizontal .ui-slider-handle { top: -.3em; margin-left: -.6em; } .ui-slider-horizontal .ui-slider-range { top: 0; height: 100%; } .ui-slider-horizontal .ui-slider-range-min { left: 0; } .ui-slider-horizontal .ui-slider-range-max { right: 0; } .ui-slider-vertical { width: .8em; height: 100px; } .ui-slider-vertical .ui-slider-handle { left: -.3em; margin-left: 0; margin-bottom: -.6em; } .ui-slider-vertical .ui-slider-range { left: 0; width: 100%; } .ui-slider-vertical .ui-slider-range-min { bottom: 0; } .ui-slider-vertical .ui-slider-range-max { top: 0; } /* Component containers ----------------------------------*/ .ui-widget { font-family: Arial,Helvetica,sans-serif; font-size: 1em; } .ui-widget .ui-widget { font-size: 1em; } .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: Arial,Helvetica,sans-serif; font-size: 1em; } .ui-widget.ui-widget-content { border: 1px solid #c5c5c5; } .ui-widget-content { border: 1px solid #dddddd; background: #ffffff; color: #333333; } .ui-widget-content a { color: #333333; } .ui-widget-header { border: 1px solid #dddddd; background: #e9e9e9; color: #333333; font-weight: bold; } .ui-widget-header a { color: #333333; } /* Interaction states ----------------------------------*/ .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, /* We use html here because we need a greater specificity to make sure disabled works properly when clicked or hovered */ html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active { border: 1px solid #c5c5c5; background: #f6f6f6; font-weight: normal; color: #454545; } .ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited, a.ui-button, a:link.ui-button, a:visited.ui-button, .ui-button { color: #454545; text-decoration: none; } .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus, .ui-button:hover, .ui-button:focus { border: 1px solid #cccccc; background: #ededed; font-weight: normal; color: #2b2b2b; } .ui-state-hover a, .ui-state-hover a:hover, .ui-state-hover a:link, .ui-state-hover a:visited, .ui-state-focus a, .ui-state-focus a:hover, .ui-state-focus a:link, .ui-state-focus a:visited, a.ui-button:hover, a.ui-button:focus { color: #2b2b2b; text-decoration: none; } .ui-visual-focus { box-shadow: 0 0 3px 1px rgb(94, 158, 214); } .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover { border: 1px solid #003eff; background: #007fff; font-weight: normal; color: #ffffff; } .ui-icon-background, .ui-state-active .ui-icon-background { border: #003eff; background-color: #ffffff; } .ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #ffffff; text-decoration: none; } /* Interaction Cues ----------------------------------*/ .ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight { border: 1px solid #dad55e; background: #fffa90; color: #777620; } .ui-state-checked { border: 1px solid #dad55e; background: #fffa90; } .ui-state-highlight a, .ui-widget-content .ui-state-highlight a, .ui-widget-header .ui-state-highlight a { color: #777620; } .ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error { border: 1px solid #f1a899; background: #fddfdf; color: #5f3f3f; } .ui-state-error a, .ui-widget-content .ui-state-error a, .ui-widget-header .ui-state-error a { color: #5f3f3f; } .ui-state-error-text, .ui-widget-content .ui-state-error-text, .ui-widget-header .ui-state-error-text { color: #5f3f3f; } .ui-priority-primary, .ui-widget-content .ui-priority-primary, .ui-widget-header .ui-priority-primary { font-weight: bold; } .ui-priority-secondary, .ui-widget-content .ui-priority-secondary, .ui-widget-header .ui-priority-secondary { opacity: .7; filter:Alpha(Opacity=70); /* support: IE8 */ font-weight: normal; } .ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled { opacity: .35; filter:Alpha(Opacity=35); /* support: IE8 */ background-image: none; } .ui-state-disabled .ui-icon { filter:Alpha(Opacity=35); /* support: IE8 - See #6059 */ } /* Corner radius */ .ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl { border-top-left-radius: 3px; } .ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr { border-top-right-radius: 3px; } .ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl { border-bottom-left-radius: 3px; } .ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br { border-bottom-right-radius: 3px; } /* Overlays */ .ui-widget-overlay { background: #aaaaaa; opacity: .3; filter: Alpha(Opacity=30); /* support: IE8 */ } .ui-widget-shadow { -webkit-box-shadow: 0px 0px 5px #666666; box-shadow: 0px 0px 5px #666666; } /* End */ /* Start:/local/templates/forvarddom/css/jquery.mCustomScrollbar.css?179319425652498*/ /* == malihu jquery custom scrollbar plugin == Plugin URI: http://manos.malihu.gr/jquery-custom-content-scroller */ /* CONTENTS: 1. BASIC STYLE - Plugin's basic/essential CSS properties (normally, should not be edited). 2. VERTICAL SCROLLBAR - Positioning and dimensions of vertical scrollbar. 3. HORIZONTAL SCROLLBAR - Positioning and dimensions of horizontal scrollbar. 4. VERTICAL AND HORIZONTAL SCROLLBARS - Positioning and dimensions of 2-axis scrollbars. 5. TRANSITIONS - CSS3 transitions for hover events, auto-expanded and auto-hidden scrollbars. 6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS 6.1 THEMES - Scrollbar colors, opacity, dimensions, backgrounds etc. via ready-to-use themes. */ /* ------------------------------------------------------------------------------------------------------------------------ 1. BASIC STYLE ------------------------------------------------------------------------------------------------------------------------ */ .mCustomScrollbar{ -ms-touch-action: pinch-zoom; touch-action: pinch-zoom; /* direct pointer events to js */ } .mCustomScrollbar.mCS_no_scrollbar, .mCustomScrollbar.mCS_touch_action{ -ms-touch-action: auto; touch-action: auto; } .mCustomScrollBox{ /* contains plugin's markup */ position: relative; overflow: hidden; height: 100%; max-width: 100%; outline: none; direction: ltr; } .mCSB_container{ /* contains the original content */ overflow: hidden; width: auto; height: auto; } /* ------------------------------------------------------------------------------------------------------------------------ 2. VERTICAL SCROLLBAR y-axis ------------------------------------------------------------------------------------------------------------------------ */ .mCSB_inside > .mCSB_container{ margin-right: 30px; } .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden{ margin-right: 0; } /* non-visible scrollbar */ .mCS-dir-rtl > .mCSB_inside > .mCSB_container{ /* RTL direction/left-side scrollbar */ margin-right: 0; margin-left: 30px; } .mCS-dir-rtl > .mCSB_inside > .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden{ margin-left: 0; } /* RTL direction/left-side scrollbar */ .mCSB_scrollTools{ /* contains scrollbar markup (draggable element, dragger rail, buttons etc.) */ position: absolute; width: 16px; height: auto; left: auto; top: 0; right: 0; bottom: 0; } .mCSB_outside + .mCSB_scrollTools{ right: -26px; } /* scrollbar position: outside */ .mCS-dir-rtl > .mCSB_inside > .mCSB_scrollTools, .mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools{ /* RTL direction/left-side scrollbar */ right: auto; left: 0; } .mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools{ left: -26px; } /* RTL direction/left-side scrollbar (scrollbar position: outside) */ .mCSB_scrollTools .mCSB_draggerContainer{ /* contains the draggable element and dragger rail markup */ position: absolute; top: 0; left: 0; bottom: 0; right: 0; height: auto; } .mCSB_scrollTools a + .mCSB_draggerContainer{ margin: 20px 0; } .mCSB_scrollTools .mCSB_draggerRail{ width: 2px; height: 100%; margin: 0 auto; -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; } .mCSB_scrollTools .mCSB_dragger{ /* the draggable element */ cursor: pointer; width: 100%; height: 30px; /* minimum dragger height */ z-index: 1; } .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ /* the dragger element */ position: relative; width: 4px; height: 100%; margin: 0 auto; -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; text-align: center; } .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{ width: 12px; /* auto-expanded scrollbar */ } .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{ width: 8px; /* auto-expanded scrollbar */ } .mCSB_scrollTools .mCSB_buttonUp, .mCSB_scrollTools .mCSB_buttonDown{ display: block; position: absolute; height: 20px; width: 100%; overflow: hidden; margin: 0 auto; cursor: pointer; } .mCSB_scrollTools .mCSB_buttonDown{ bottom: 0; } /* ------------------------------------------------------------------------------------------------------------------------ 3. HORIZONTAL SCROLLBAR x-axis ------------------------------------------------------------------------------------------------------------------------ */ .mCSB_horizontal.mCSB_inside > .mCSB_container{ margin-right: 0; margin-bottom: 30px; } .mCSB_horizontal.mCSB_outside > .mCSB_container{ min-height: 100%; } .mCSB_horizontal > .mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden{ margin-bottom: 0; } /* non-visible scrollbar */ .mCSB_scrollTools.mCSB_scrollTools_horizontal{ width: auto; height: 16px; top: auto; right: 0; bottom: 0; left: 0; } .mCustomScrollBox + .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal{ bottom: -26px; } /* scrollbar position: outside */ .mCSB_scrollTools.mCSB_scrollTools_horizontal a + .mCSB_draggerContainer{ margin: 0 20px; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail{ width: 100%; height: 2px; margin: 7px 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger{ width: 30px; /* minimum dragger width */ height: 100%; left: 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ width: 100%; height: 4px; margin: 6px auto; } .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{ height: 12px; /* auto-expanded scrollbar */ margin: 2px auto; } .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{ height: 8px; /* auto-expanded scrollbar */ margin: 4px 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft, .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight{ display: block; position: absolute; width: 20px; height: 100%; overflow: hidden; margin: 0 auto; cursor: pointer; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft{ left: 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight{ right: 0; } /* ------------------------------------------------------------------------------------------------------------------------ 4. VERTICAL AND HORIZONTAL SCROLLBARS yx-axis ------------------------------------------------------------------------------------------------------------------------ */ .mCSB_container_wrapper{ position: absolute; height: auto; width: auto; overflow: hidden; top: 0; left: 0; right: 0; bottom: 0; margin-right: 30px; margin-bottom: 30px; } .mCSB_container_wrapper > .mCSB_container{ padding-right: 30px; padding-bottom: 30px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_vertical{ bottom: 20px; } .mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_horizontal{ right: 20px; } /* non-visible horizontal scrollbar */ .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden + .mCSB_scrollTools.mCSB_scrollTools_vertical{ bottom: 0; } /* non-visible vertical scrollbar/RTL direction/left-side scrollbar */ .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal{ right: 0; } /* RTL direction/left-side scrollbar */ .mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal{ left: 20px; } /* non-visible scrollbar/RTL direction/left-side scrollbar */ .mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal{ left: 0; } .mCS-dir-rtl > .mCSB_inside > .mCSB_container_wrapper{ /* RTL direction/left-side scrollbar */ margin-right: 0; margin-left: 30px; } .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden > .mCSB_container{ padding-right: 0; } .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden > .mCSB_container{ padding-bottom: 0; } .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden{ margin-right: 0; /* non-visible scrollbar */ margin-left: 0; } /* non-visible horizontal scrollbar */ .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden{ margin-bottom: 0; } /* ------------------------------------------------------------------------------------------------------------------------ 5. TRANSITIONS ------------------------------------------------------------------------------------------------------------------------ */ .mCSB_scrollTools, .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCSB_scrollTools .mCSB_buttonUp, .mCSB_scrollTools .mCSB_buttonDown, .mCSB_scrollTools .mCSB_buttonLeft, .mCSB_scrollTools .mCSB_buttonRight{ -webkit-transition: opacity .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; } .mCS-autoHide > .mCustomScrollBox > .mCSB_scrollTools, .mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools{ 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; } .mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.4); } .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.75); } .mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.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); } .mCSB_scrollTools .mCSB_buttonUp, .mCSB_scrollTools .mCSB_buttonDown, .mCSB_scrollTools .mCSB_buttonLeft, .mCSB_scrollTools .mCSB_buttonRight{ background-image: url(/local/templates/forvarddom/css/mCSB_buttons.png); /* css sprites */ background-repeat: no-repeat; opacity: 0.4; } .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; } .mCSB_scrollTools .mCSB_buttonUp:active, .mCSB_scrollTools .mCSB_buttonDown:active, .mCSB_scrollTools .mCSB_buttonLeft:active, .mCSB_scrollTools .mCSB_buttonRight:active{ opacity: 0.9; } /* theme: "dark" */ .mCS-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.15); } .mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); } .mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: rgba(0,0,0,0.85); } .mCS-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: rgba(0,0,0,0.9); } .mCS-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -80px 0; } .mCS-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -80px -20px; } .mCS-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -80px -40px; } .mCS-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -80px -56px; } /* ---------------------------------------- */ /* theme: "light-2", "dark-2" */ .mCS-light-2.mCSB_scrollTools .mCSB_draggerRail, .mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail{ width: 4px; background-color: #fff; background-color: rgba(255,255,255,0.1); -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; } .mCS-light-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 4px; background-color: #fff; background-color: rgba(255,255,255,0.75); -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; } .mCS-light-2.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-light-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ width: 100%; height: 4px; margin: 6px auto; } .mCS-light-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.85); } .mCS-light-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-light-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.9); } .mCS-light-2.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px 0; } .mCS-light-2.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -20px; } .mCS-light-2.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -40px; } .mCS-light-2.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -56px; } /* theme: "dark-2" */ .mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.1); -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; } .mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; } .mCS-dark-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); } .mCS-dark-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-dark-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); } .mCS-dark-2.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px 0; } .mCS-dark-2.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -20px; } .mCS-dark-2.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -40px; } .mCS-dark-2.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -56px; } /* ---------------------------------------- */ /* theme: "light-thick", "dark-thick" */ .mCS-light-thick.mCSB_scrollTools .mCSB_draggerRail, .mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail{ width: 4px; background-color: #fff; background-color: rgba(255,255,255,0.1); -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .mCS-light-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 6px; background-color: #fff; background-color: rgba(255,255,255,0.75); -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail{ width: 100%; height: 4px; margin: 6px 0; } .mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ width: 100%; height: 6px; margin: 5px auto; } .mCS-light-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.85); } .mCS-light-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-light-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.9); } .mCS-light-thick.mCSB_scrollTools .mCSB_buttonUp{ background-position: -16px 0; } .mCS-light-thick.mCSB_scrollTools .mCSB_buttonDown{ background-position: -16px -20px; } .mCS-light-thick.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -20px -40px; } .mCS-light-thick.mCSB_scrollTools .mCSB_buttonRight{ background-position: -20px -56px; } /* theme: "dark-thick" */ .mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.1); -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); } .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); } .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonUp{ background-position: -96px 0; } .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonDown{ background-position: -96px -20px; } .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -100px -40px; } .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonRight{ background-position: -100px -56px; } /* ---------------------------------------- */ /* theme: "light-thin", "dark-thin" */ .mCS-light-thin.mCSB_scrollTools .mCSB_draggerRail{ background-color: #fff; background-color: rgba(255,255,255,0.1); } .mCS-light-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 2px; } .mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail{ width: 100%; } .mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ width: 100%; height: 2px; margin: 7px auto; } /* theme "dark-thin" */ .mCS-dark-thin.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.15); } .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); } .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); } .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); } .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonUp{ background-position: -80px 0; } .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonDown{ background-position: -80px -20px; } .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -80px -40px; } .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonRight{ background-position: -80px -56px; } /* ---------------------------------------- */ /* theme "rounded", "rounded-dark", "rounded-dots", "rounded-dots-dark" */ .mCS-rounded.mCSB_scrollTools .mCSB_draggerRail{ background-color: #fff; background-color: rgba(255,255,255,0.15); } .mCS-rounded.mCSB_scrollTools .mCSB_dragger, .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger, .mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger{ height: 14px; } .mCS-rounded.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 14px; margin: 0 1px; } .mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger{ width: 14px; } .mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ height: 14px; margin: 1px 0; } .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{ width: 16px; /* auto-expanded scrollbar */ height: 16px; margin: -1px 0; } .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{ width: 4px; /* auto-expanded scrollbar */ } .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{ height: 16px; /* auto-expanded scrollbar */ width: 16px; margin: 0 -1px; } .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{ height: 4px; /* auto-expanded scrollbar */ margin: 6px 0; } .mCS-rounded.mCSB_scrollTools .mCSB_buttonUp{ background-position: 0 -72px; } .mCS-rounded.mCSB_scrollTools .mCSB_buttonDown{ background-position: 0 -92px; } .mCS-rounded.mCSB_scrollTools .mCSB_buttonLeft{ background-position: 0 -112px; } .mCS-rounded.mCSB_scrollTools .mCSB_buttonRight{ background-position: 0 -128px; } /* theme "rounded-dark", "rounded-dots-dark" */ .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); } .mCS-rounded-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.15); } .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); } .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); } .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -80px -72px; } .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -80px -92px; } .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -80px -112px; } .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -80px -128px; } /* theme "rounded-dots", "rounded-dots-dark" */ .mCS-rounded-dots.mCSB_scrollTools_vertical .mCSB_draggerRail, .mCS-rounded-dots-dark.mCSB_scrollTools_vertical .mCSB_draggerRail{ width: 4px; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{ background-color: transparent; background-position: center; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail{ background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAANElEQVQYV2NkIAAYiVbw//9/Y6DiM1ANJoyMjGdBbLgJQAX/kU0DKgDLkaQAvxW4HEvQFwCRcxIJK1XznAAAAABJRU5ErkJggg=="); background-repeat: repeat-y; opacity: 0.3; } .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{ height: 4px; margin: 6px 0; background-repeat: repeat-x; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonUp{ background-position: -16px -72px; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonDown{ background-position: -16px -92px; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -20px -112px; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonRight{ background-position: -20px -128px; } /* theme "rounded-dots-dark" */ .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail{ background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYV2NkIAAYSVFgDFR8BqrBBEifBbGRTfiPZhpYjiQFBK3A6l6CvgAAE9kGCd1mvgEAAAAASUVORK5CYII="); } .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -96px -72px; } .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -96px -92px; } .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -100px -112px; } .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -100px -128px; } /* ---------------------------------------- */ /* theme "3d", "3d-dark", "3d-thick", "3d-thick-dark" */ .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-repeat: repeat-y; background-image: -moz-linear-gradient(left, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0) 100%); background-image: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0.5)), color-stop(100%,rgba(255,255,255,0))); background-image: -webkit-linear-gradient(left, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%); background-image: -o-linear-gradient(left, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%); background-image: -ms-linear-gradient(left, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%); background-image: linear-gradient(to right, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%); } .mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ background-repeat: repeat-x; background-image: -moz-linear-gradient(top, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0) 100%); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.5)), color-stop(100%,rgba(255,255,255,0))); background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%); background-image: -o-linear-gradient(top, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%); background-image: -ms-linear-gradient(top, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%); background-image: linear-gradient(to bottom, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%); } /* theme "3d", "3d-dark" */ .mCS-3d.mCSB_scrollTools_vertical .mCSB_dragger, .mCS-3d-dark.mCSB_scrollTools_vertical .mCSB_dragger{ height: 70px; } .mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger{ width: 70px; } .mCS-3d.mCSB_scrollTools, .mCS-3d-dark.mCSB_scrollTools{ opacity: 1; } .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; } .mCS-3d-thick.mCSB_scrollTools, .mCS-3d-thick-dark.mCSB_scrollTools, .mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer{ -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; } .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .mCSB_inside + .mCS-3d-thick.mCSB_scrollTools_vertical, .mCSB_inside + .mCS-3d-thick-dark.mCSB_scrollTools_vertical{ right: 1px; } .mCS-3d-thick.mCSB_scrollTools_vertical, .mCS-3d-thick-dark.mCSB_scrollTools_vertical{ box-shadow: inset 1px 0 1px rgba(0,0,0,0.1), inset 0 0 14px rgba(0,0,0,0.5); } .mCS-3d-thick.mCSB_scrollTools_horizontal, .mCS-3d-thick-dark.mCSB_scrollTools_horizontal{ bottom: 1px; box-shadow: inset 0 1px 1px rgba(0,0,0,0.1), inset 0 0 14px rgba(0,0,0,0.5); } .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ box-shadow: inset 1px 0 0 rgba(255,255,255,0.4); width: 12px; margin: 2px; position: absolute; height: auto; top: 0; bottom: 0; left: 0; right: 0; } .mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ box-shadow: inset 0 1px 0 rgba(255,255,255,0.4); } .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #555; } .mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ height: 12px; width: auto; } .mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer{ background-color: #000; background-color: rgba(0,0,0,0.05); box-shadow: inset 1px 1px 16px rgba(0,0,0,0.1); } .mCS-3d-thick.mCSB_scrollTools .mCSB_draggerRail{ background-color: transparent; } .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px -72px; } .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -92px; } .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -112px; } .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -128px; } /* theme: "3d-thick-dark" */ .mCS-3d-thick-dark.mCSB_scrollTools{ box-shadow: inset 0 0 14px rgba(0,0,0,0.2); } .mCS-3d-thick-dark.mCSB_scrollTools_horizontal{ box-shadow: inset 0 1px 1px rgba(0,0,0,0.1), inset 0 0 14px rgba(0,0,0,0.2); } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ box-shadow: inset 1px 0 0 rgba(255,255,255,0.4), inset -1px 0 0 rgba(0,0,0,0.2); } .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ box-shadow: inset 0 1px 0 rgba(255,255,255,0.4), inset 0 -1px 0 rgba(0,0,0,0.2); } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #777; } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer{ background-color: #fff; background-color: rgba(0,0,0,0.05); box-shadow: inset 1px 1px 16px rgba(0,0,0,0.1); } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: transparent; } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px -72px; } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -92px; } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -112px; } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -128px; } /* ---------------------------------------- */ /* theme: "minimal", "minimal-dark" */ .mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical, .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical{ right: 0; margin: 12px 0; } .mCustomScrollBox.mCS-minimal + .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox.mCS-minimal + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal{ bottom: 0; margin: 0 12px; } /* RTL direction/left-side scrollbar */ .mCS-dir-rtl > .mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical, .mCS-dir-rtl > .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical{ left: 0; right: auto; } .mCS-minimal.mCSB_scrollTools .mCSB_draggerRail, .mCS-minimal-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: transparent; } .mCS-minimal.mCSB_scrollTools_vertical .mCSB_dragger, .mCS-minimal-dark.mCSB_scrollTools_vertical .mCSB_dragger{ height: 50px; } .mCS-minimal.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-minimal-dark.mCSB_scrollTools_horizontal .mCSB_dragger{ width: 50px; } .mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.2); } .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); } /* theme: "minimal-dark" */ .mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.2); } .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); } /* ---------------------------------------- */ /* 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); } /* ---------------------------------------- */ /* End */ /* Start:/local/templates/forvarddom/css/slick.css?17931942561758*/ /* Slider */ .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; } .slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; top: 0; left: 0; display: block; margin-left: auto; margin-right: auto; } .slick-track:before, .slick-track:after { display: table; content: ''; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { display: none; float: left; height: 100%; min-height: 1px; } [dir='rtl'] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } /* End */ /* Start:/local/templates/forvarddom/css/nice-select.css?17931942564007*/ .nice-select { -webkit-tap-highlight-color: transparent; background-color: #fff; border-radius: 5px; border: solid 1px #e8e8e8; box-sizing: border-box; clear: both; cursor: pointer; display: block; float: left; font-family: inherit; font-size: 14px; font-weight: normal; height: 42px; line-height: 40px; outline: none; padding-left: 18px; padding-right: 30px; position: relative; text-align: left !important; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; white-space: nowrap; width: auto; } .nice-select:hover { border-color: #dbdbdb; } .nice-select:active, .nice-select.open, .nice-select:focus { border-color: #999; } .nice-select:after { border-bottom: 2px solid #999; border-right: 2px solid #999; content: ''; display: block; height: 5px; margin-top: -4px; pointer-events: none; position: absolute; right: 12px; top: 50%; -webkit-transform-origin: 66% 66%; -ms-transform-origin: 66% 66%; transform-origin: 66% 66%; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition: all 0.15s ease-in-out; transition: all 0.15s ease-in-out; width: 5px; } .nice-select.open:after { -webkit-transform: rotate(-135deg); -ms-transform: rotate(-135deg); transform: rotate(-135deg); } .nice-select.open .list { opacity: 1; pointer-events: auto; -webkit-transform: scale(1) translateY(0); -ms-transform: scale(1) translateY(0); transform: scale(1) translateY(0); } .nice-select.disabled { border-color: #ededed; color: #999; pointer-events: none; } .nice-select.disabled:after { border-color: #cccccc; } .nice-select.wide { width: 100%; } .nice-select.wide .list { left: 0 !important; right: 0 !important; } .nice-select.right { float: right; } .nice-select.right .list { left: auto; right: 0; } .nice-select.small { font-size: 12px; height: 36px; line-height: 34px; } .nice-select.small:after { height: 4px; width: 4px; } .nice-select.small .option { line-height: 34px; min-height: 34px; } .nice-select .list { background-color: #fff; border-radius: 5px; box-shadow: 0 0 0 1px rgba(68, 68, 68, 0.11); box-sizing: border-box; margin-top: 4px; opacity: 0; overflow: hidden; padding: 0; pointer-events: none; position: absolute; top: 100%; left: 0; -webkit-transform-origin: 50% 0; -ms-transform-origin: 50% 0; transform-origin: 50% 0; -webkit-transform: scale(0.75) translateY(-21px); -ms-transform: scale(0.75) translateY(-21px); transform: scale(0.75) translateY(-21px); -webkit-transition: all 0.2s cubic-bezier(0.5, 0, 0, 1.25), opacity 0.15s ease-out; transition: all 0.2s cubic-bezier(0.5, 0, 0, 1.25), opacity 0.15s ease-out; z-index: 9; } .nice-select .list:hover .option:not(:hover) { background-color: transparent !important; } .nice-select .option { cursor: pointer; font-weight: 400; line-height: 40px; list-style: none; min-height: 40px; outline: none; padding-left: 18px; padding-right: 29px; text-align: left; -webkit-transition: all 0.2s; transition: all 0.2s; } .nice-select .option:hover, .nice-select .option.focus, .nice-select .option.selected.focus { background-color: #f6f6f6; } .nice-select .option.selected { font-weight: bold; } .nice-select .option.disabled { background-color: transparent; color: #999; cursor: default; } .no-csspointerevents .nice-select .list { display: none; } .no-csspointerevents .nice-select.open .list { display: block; } /* End */ /* Start:/local/templates/forvarddom/css/plyr.css?179319425632499*/ @charset "UTF-8";@keyframes plyr-progress{to{background-position:25px 0;background-position:var(--plyr-progress-loading-size,25px) 0}}@keyframes plyr-popup{0%{opacity:.5;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes plyr-fade-in{0%{opacity:0}to{opacity:1}}.plyr{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;align-items:center;direction:ltr;display:flex;flex-direction:column;font-family:inherit;font-family:var(--plyr-font-family,inherit);font-variant-numeric:tabular-nums;font-weight:400;font-weight:var(--plyr-font-weight-regular,400);line-height:1.7;line-height:var(--plyr-line-height,1.7);max-width:100%;min-width:200px;position:relative;text-shadow:none;transition:box-shadow .3s ease;z-index:0}.plyr audio,.plyr iframe,.plyr video{display:block;height:100%;width:100%}.plyr button{font:inherit;line-height:inherit;width:auto}.plyr:focus{outline:0}.plyr--full-ui{box-sizing:border-box}.plyr--full-ui *,.plyr--full-ui :after,.plyr--full-ui :before{box-sizing:inherit}.plyr--full-ui a,.plyr--full-ui button,.plyr--full-ui input,.plyr--full-ui label{touch-action:manipulation}.plyr__badge{background:#4a5464;background:var(--plyr-badge-background,#4a5464);border-radius:2px;border-radius:var(--plyr-badge-border-radius,2px);color:#fff;color:var(--plyr-badge-text-color,#fff);font-size:9px;font-size:var(--plyr-font-size-badge,9px);line-height:1;padding:3px 4px}.plyr--full-ui ::-webkit-media-text-track-container{display:none}.plyr__captions{animation:plyr-fade-in .3s ease;bottom:0;display:none;font-size:13px;font-size:var(--plyr-font-size-small,13px);left:0;padding:10px;padding:var(--plyr-control-spacing,10px);position:absolute;text-align:center;transition:transform .4s ease-in-out;width:100%}.plyr__captions span:empty{display:none}@media(min-width:480px){.plyr__captions{font-size:15px;font-size:var(--plyr-font-size-base,15px);padding:20px;padding:calc(var(--plyr-control-spacing,10px)*2)}}@media(min-width:768px){.plyr__captions{font-size:18px;font-size:var(--plyr-font-size-large,18px)}}.plyr--captions-active .plyr__captions{display:block}.plyr:not(.plyr--hide-controls) .plyr__controls:not(:empty)~.plyr__captions{transform:translateY(-40px);transform:translateY(calc(var(--plyr-control-spacing,10px)*-4))}.plyr__caption{background:#000c;background:var(--plyr-captions-background,#000c);border-radius:2px;-webkit-box-decoration-break:clone;box-decoration-break:clone;color:#fff;color:var(--plyr-captions-text-color,#fff);line-height:185%;padding:.2em .5em;white-space:pre-wrap}.plyr__caption div{display:inline}.plyr__control{background:#0000;border:0;border-radius:4px;border-radius:var(--plyr-control-radius,4px);color:inherit;cursor:pointer;flex-shrink:0;overflow:visible;padding:7px;padding:calc(var(--plyr-control-spacing,10px)*.7);position:relative;transition:all .3s ease}.plyr__control svg{fill:currentColor;display:block;height:18px;height:var(--plyr-control-icon-size,18px);pointer-events:none;width:18px;width:var(--plyr-control-icon-size,18px)}.plyr__control:focus{outline:0}.plyr__control:focus-visible{outline:2px dashed #00b2ff;outline:2px dashed var(--plyr-focus-visible-color,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));outline-offset:2px}a.plyr__control{text-decoration:none}.plyr__control.plyr__control--pressed .icon--not-pressed,.plyr__control.plyr__control--pressed .label--not-pressed,.plyr__control:not(.plyr__control--pressed) .icon--pressed,.plyr__control:not(.plyr__control--pressed) .label--pressed,a.plyr__control:after,a.plyr__control:before{display:none}.plyr--full-ui ::-webkit-media-controls{display:none}.plyr__controls{align-items:center;display:flex;justify-content:flex-end;text-align:center}.plyr__controls .plyr__progress__container{flex:1;min-width:0}.plyr__controls .plyr__controls__item{margin-left:2.5px;margin-left:calc(var(--plyr-control-spacing,10px)/4)}.plyr__controls .plyr__controls__item:first-child{margin-left:0;margin-right:auto}.plyr__controls .plyr__controls__item.plyr__progress__container{padding-left:2.5px;padding-left:calc(var(--plyr-control-spacing,10px)/4)}.plyr__controls .plyr__controls__item.plyr__time{padding:0 5px;padding:0 calc(var(--plyr-control-spacing,10px)/2)}.plyr__controls .plyr__controls__item.plyr__progress__container:first-child,.plyr__controls .plyr__controls__item.plyr__time+.plyr__time,.plyr__controls .plyr__controls__item.plyr__time:first-child{padding-left:0}.plyr [data-plyr=airplay],.plyr [data-plyr=captions],.plyr [data-plyr=fullscreen],.plyr [data-plyr=pip],.plyr__controls:empty{display:none}.plyr--airplay-supported [data-plyr=airplay],.plyr--captions-enabled [data-plyr=captions],.plyr--fullscreen-enabled [data-plyr=fullscreen],.plyr--pip-supported [data-plyr=pip]{display:inline-block}.plyr__menu{display:flex;position:relative}.plyr__menu .plyr__control svg{transition:transform .3s ease}.plyr__menu .plyr__control[aria-expanded=true] svg{transform:rotate(90deg)}.plyr__menu .plyr__control[aria-expanded=true] .plyr__tooltip{display:none}.plyr__menu__container{animation:plyr-popup .2s ease;background:#ffffffe6;background:var(--plyr-menu-background,#ffffffe6);border-radius:8px;border-radius:var(--plyr-menu-radius,8px);bottom:100%;box-shadow:0 1px 2px #00000026;box-shadow:var(--plyr-menu-shadow,0 1px 2px #00000026);color:#4a5464;color:var(--plyr-menu-color,#4a5464);font-size:15px;font-size:var(--plyr-font-size-base,15px);margin-bottom:10px;position:absolute;right:-3px;text-align:left;white-space:nowrap;z-index:3}.plyr__menu__container>div{overflow:hidden;transition:height .35s cubic-bezier(.4,0,.2,1),width .35s cubic-bezier(.4,0,.2,1)}.plyr__menu__container:after{border:4px solid #0000;border-top-color:#ffffffe6;border:var(--plyr-menu-arrow-size,4px) solid #0000;border-top-color:var(--plyr-menu-background,#ffffffe6);content:"";height:0;position:absolute;right:14px;right:calc(var(--plyr-control-icon-size,18px)/2 + var(--plyr-control-spacing,10px)*.7 - var(--plyr-menu-arrow-size,4px)/2);top:100%;width:0}.plyr__menu__container [role=menu]{padding:7px;padding:calc(var(--plyr-control-spacing,10px)*.7)}.plyr__menu__container [role=menuitem],.plyr__menu__container [role=menuitemradio]{margin-top:2px}.plyr__menu__container [role=menuitem]:first-child,.plyr__menu__container [role=menuitemradio]:first-child{margin-top:0}.plyr__menu__container .plyr__control{align-items:center;color:#4a5464;color:var(--plyr-menu-color,#4a5464);display:flex;font-size:13px;font-size:var(--plyr-font-size-menu,var(--plyr-font-size-small,13px));padding:4.66667px 10.5px;padding:calc(var(--plyr-control-spacing,10px)*.7/1.5) calc(var(--plyr-control-spacing,10px)*.7*1.5);-webkit-user-select:none;user-select:none;width:100%}.plyr__menu__container .plyr__control>span{align-items:inherit;display:flex;width:100%}.plyr__menu__container .plyr__control:after{border:4px solid #0000;border:var(--plyr-menu-item-arrow-size,4px) solid #0000;content:"";position:absolute;top:50%;transform:translateY(-50%)}.plyr__menu__container .plyr__control--forward{padding-right:28px;padding-right:calc(var(--plyr-control-spacing,10px)*.7*4)}.plyr__menu__container .plyr__control--forward:after{border-left-color:#728197;border-left-color:var(--plyr-menu-arrow-color,#728197);right:6.5px;right:calc(var(--plyr-control-spacing,10px)*.7*1.5 - var(--plyr-menu-item-arrow-size,4px))}.plyr__menu__container .plyr__control--forward:focus-visible:after,.plyr__menu__container .plyr__control--forward:hover:after{border-left-color:initial}.plyr__menu__container .plyr__control--back{font-weight:400;font-weight:var(--plyr-font-weight-regular,400);margin:7px;margin:calc(var(--plyr-control-spacing,10px)*.7);margin-bottom:3.5px;margin-bottom:calc(var(--plyr-control-spacing,10px)*.7/2);padding-left:28px;padding-left:calc(var(--plyr-control-spacing,10px)*.7*4);position:relative;width:calc(100% - 14px);width:calc(100% - var(--plyr-control-spacing,10px)*.7*2)}.plyr__menu__container .plyr__control--back:after{border-right-color:#728197;border-right-color:var(--plyr-menu-arrow-color,#728197);left:6.5px;left:calc(var(--plyr-control-spacing,10px)*.7*1.5 - var(--plyr-menu-item-arrow-size,4px))}.plyr__menu__container .plyr__control--back:before{background:#dcdfe5;background:var(--plyr-menu-back-border-color,#dcdfe5);box-shadow:0 1px 0 #fff;box-shadow:0 1px 0 var(--plyr-menu-back-border-shadow-color,#fff);content:"";height:1px;left:0;margin-top:3.5px;margin-top:calc(var(--plyr-control-spacing,10px)*.7/2);overflow:hidden;position:absolute;right:0;top:100%}.plyr__menu__container .plyr__control--back:focus-visible:after,.plyr__menu__container .plyr__control--back:hover:after{border-right-color:initial}.plyr__menu__container .plyr__control[role=menuitemradio]{padding-left:7px;padding-left:calc(var(--plyr-control-spacing,10px)*.7)}.plyr__menu__container .plyr__control[role=menuitemradio]:after,.plyr__menu__container .plyr__control[role=menuitemradio]:before{border-radius:100%}.plyr__menu__container .plyr__control[role=menuitemradio]:before{background:#0000001a;content:"";display:block;flex-shrink:0;height:16px;margin-right:10px;margin-right:var(--plyr-control-spacing,10px);transition:all .3s ease;width:16px}.plyr__menu__container .plyr__control[role=menuitemradio]:after{background:#fff;border:0;height:6px;left:12px;opacity:0;top:50%;transform:translateY(-50%) scale(0);transition:transform .3s ease,opacity .3s ease;width:6px}.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]:before{background:#00b2ff;background:var(--plyr-control-toggle-checked-background,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)))}.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]:after{opacity:1;transform:translateY(-50%) scale(1)}.plyr__menu__container .plyr__control[role=menuitemradio]:focus-visible:before,.plyr__menu__container .plyr__control[role=menuitemradio]:hover:before{background:#23282f1a}.plyr__menu__container .plyr__menu__value{align-items:center;display:flex;margin-left:auto;margin-right:-5px;margin-right:calc(var(--plyr-control-spacing,10px)*.7*-1 - -2px);overflow:hidden;padding-left:24.5px;padding-left:calc(var(--plyr-control-spacing,10px)*.7*3.5);pointer-events:none}.plyr--full-ui input[type=range]{-webkit-appearance:none;appearance:none;background:#0000;border:0;border-radius:26px;border-radius:calc(var(--plyr-range-thumb-height,13px)*2);color:#00b2ff;color:var(--plyr-range-fill-background,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));display:block;height:19px;height:calc(var(--plyr-range-thumb-active-shadow-width,3px)*2 + var(--plyr-range-thumb-height,13px));margin:0;min-width:0;padding:0;transition:box-shadow .3s ease;width:100%}.plyr--full-ui input[type=range]::-webkit-slider-runnable-track{background:#0000;background-image:linear-gradient(90deg,currentColor 0,#0000 0);background-image:linear-gradient(to right,currentColor var(--value,0),#0000 var(--value,0));border:0;border-radius:2.5px;border-radius:calc(var(--plyr-range-track-height,5px)/2);height:5px;height:var(--plyr-range-track-height,5px);-webkit-transition:box-shadow .3s ease;transition:box-shadow .3s ease;-webkit-user-select:none;user-select:none}.plyr--full-ui input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:#fff;background:var(--plyr-range-thumb-background,#fff);border:0;border-radius:100%;box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33);height:13px;height:var(--plyr-range-thumb-height,13px);margin-top:-4px;margin-top:calc((var(--plyr-range-thumb-height,13px) - var(--plyr-range-track-height,5px))/2*-1);position:relative;-webkit-transition:all .2s ease;transition:all .2s ease;width:13px;width:var(--plyr-range-thumb-height,13px)}.plyr--full-ui input[type=range]::-moz-range-track{background:#0000;border:0;border-radius:2.5px;border-radius:calc(var(--plyr-range-track-height,5px)/2);height:5px;height:var(--plyr-range-track-height,5px);-moz-transition:box-shadow .3s ease;transition:box-shadow .3s ease;user-select:none}.plyr--full-ui input[type=range]::-moz-range-thumb{background:#fff;background:var(--plyr-range-thumb-background,#fff);border:0;border-radius:100%;box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33);height:13px;height:var(--plyr-range-thumb-height,13px);position:relative;-moz-transition:all .2s ease;transition:all .2s ease;width:13px;width:var(--plyr-range-thumb-height,13px)}.plyr--full-ui input[type=range]::-moz-range-progress{background:currentColor;border-radius:2.5px;border-radius:calc(var(--plyr-range-track-height,5px)/2);height:5px;height:var(--plyr-range-track-height,5px)}.plyr--full-ui input[type=range]::-ms-track{color:#0000}.plyr--full-ui input[type=range]::-ms-fill-upper,.plyr--full-ui input[type=range]::-ms-track{background:#0000;border:0;border-radius:2.5px;border-radius:calc(var(--plyr-range-track-height,5px)/2);height:5px;height:var(--plyr-range-track-height,5px);-ms-transition:box-shadow .3s ease;transition:box-shadow .3s ease;user-select:none}.plyr--full-ui input[type=range]::-ms-fill-lower{background:#0000;background:currentColor;border:0;border-radius:2.5px;border-radius:calc(var(--plyr-range-track-height,5px)/2);height:5px;height:var(--plyr-range-track-height,5px);-ms-transition:box-shadow .3s ease;transition:box-shadow .3s ease;user-select:none}.plyr--full-ui input[type=range]::-ms-thumb{background:#fff;background:var(--plyr-range-thumb-background,#fff);border:0;border-radius:100%;box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33);height:13px;height:var(--plyr-range-thumb-height,13px);margin-top:0;position:relative;-ms-transition:all .2s ease;transition:all .2s ease;width:13px;width:var(--plyr-range-thumb-height,13px)}.plyr--full-ui input[type=range]::-ms-tooltip{display:none}.plyr--full-ui input[type=range]::-moz-focus-outer{border:0}.plyr--full-ui input[type=range]:focus{outline:0}.plyr--full-ui input[type=range]:focus-visible::-webkit-slider-runnable-track{outline:2px dashed #00b2ff;outline:2px dashed var(--plyr-focus-visible-color,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));outline-offset:2px}.plyr--full-ui input[type=range]:focus-visible::-moz-range-track{outline:2px dashed #00b2ff;outline:2px dashed var(--plyr-focus-visible-color,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));outline-offset:2px}.plyr--full-ui input[type=range]:focus-visible::-ms-track{outline:2px dashed #00b2ff;outline:2px dashed var(--plyr-focus-visible-color,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));outline-offset:2px}.plyr__poster{background-color:#000;background-color:var(--plyr-video-background,var(--plyr-video-background,#000));background-position:50% 50%;background-repeat:no-repeat;background-size:contain;height:100%;left:0;opacity:0;position:absolute;top:0;transition:opacity .2s ease;width:100%;z-index:1}.plyr--stopped.plyr__poster-enabled .plyr__poster{opacity:1}.plyr--youtube.plyr--paused.plyr__poster-enabled:not(.plyr--stopped) .plyr__poster{display:none}.plyr__time{font-size:13px;font-size:var(--plyr-font-size-time,var(--plyr-font-size-small,13px))}.plyr__time+.plyr__time:before{content:"⁄";margin-right:10px;margin-right:var(--plyr-control-spacing,10px)}@media(max-width:767px){.plyr__time+.plyr__time{display:none}}.plyr__tooltip{background:#fff;background:var(--plyr-tooltip-background,#fff);border-radius:5px;border-radius:var(--plyr-tooltip-radius,5px);bottom:100%;box-shadow:0 1px 2px #00000026;box-shadow:var(--plyr-tooltip-shadow,0 1px 2px #00000026);color:#4a5464;color:var(--plyr-tooltip-color,#4a5464);font-size:13px;font-size:var(--plyr-font-size-small,13px);font-weight:400;font-weight:var(--plyr-font-weight-regular,400);left:50%;line-height:1.3;margin-bottom:10px;margin-bottom:calc(var(--plyr-control-spacing,10px)/2*2);opacity:0;padding:5px 7.5px;padding:calc(var(--plyr-control-spacing,10px)/2) calc(var(--plyr-control-spacing,10px)/2*1.5);pointer-events:none;position:absolute;transform:translate(-50%,10px) scale(.8);transform-origin:50% 100%;transition:transform .2s ease .1s,opacity .2s ease .1s;white-space:nowrap;z-index:2}.plyr__tooltip:before{border-left:4px solid #0000;border-left:var(--plyr-tooltip-arrow-size,4px) solid #0000;border-right:4px solid #0000;border-right:var(--plyr-tooltip-arrow-size,4px) solid #0000;border-top:4px solid #fff;border-top:var(--plyr-tooltip-arrow-size,4px) solid var(--plyr-tooltip-background,#fff);bottom:-4px;bottom:calc(var(--plyr-tooltip-arrow-size,4px)*-1);content:"";height:0;left:50%;position:absolute;transform:translateX(-50%);width:0;z-index:2}.plyr .plyr__control:focus-visible .plyr__tooltip,.plyr .plyr__control:hover .plyr__tooltip,.plyr__tooltip--visible{opacity:1;transform:translate(-50%) scale(1)}.plyr .plyr__control:hover .plyr__tooltip{z-index:3}.plyr__controls>.plyr__control:first-child .plyr__tooltip,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip{left:0;transform:translateY(10px) scale(.8);transform-origin:0 100%}.plyr__controls>.plyr__control:first-child .plyr__tooltip:before,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip:before{left:16px;left:calc(var(--plyr-control-icon-size,18px)/2 + var(--plyr-control-spacing,10px)*.7)}.plyr__controls>.plyr__control:last-child .plyr__tooltip{left:auto;right:0;transform:translateY(10px) scale(.8);transform-origin:100% 100%}.plyr__controls>.plyr__control:last-child .plyr__tooltip:before{left:auto;right:16px;right:calc(var(--plyr-control-icon-size,18px)/2 + var(--plyr-control-spacing,10px)*.7);transform:translateX(50%)}.plyr__controls>.plyr__control:first-child .plyr__tooltip--visible,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip--visible,.plyr__controls>.plyr__control:first-child+.plyr__control:focus-visible .plyr__tooltip,.plyr__controls>.plyr__control:first-child+.plyr__control:hover .plyr__tooltip,.plyr__controls>.plyr__control:first-child:focus-visible .plyr__tooltip,.plyr__controls>.plyr__control:first-child:hover .plyr__tooltip,.plyr__controls>.plyr__control:last-child .plyr__tooltip--visible,.plyr__controls>.plyr__control:last-child:focus-visible .plyr__tooltip,.plyr__controls>.plyr__control:last-child:hover .plyr__tooltip{transform:translate(0) scale(1)}.plyr__progress{left:6.5px;left:calc(var(--plyr-range-thumb-height,13px)*.5);margin-right:13px;margin-right:var(--plyr-range-thumb-height,13px);position:relative}.plyr__progress input[type=range],.plyr__progress__buffer{margin-left:-6.5px;margin-left:calc(var(--plyr-range-thumb-height,13px)*-.5);margin-right:-6.5px;margin-right:calc(var(--plyr-range-thumb-height,13px)*-.5);width:calc(100% + 13px);width:calc(100% + var(--plyr-range-thumb-height,13px))}.plyr__progress input[type=range]{position:relative;z-index:2}.plyr__progress .plyr__tooltip{left:0;max-width:120px;overflow-wrap:break-word}.plyr__progress__buffer{-webkit-appearance:none;background:#0000;border:0;border-radius:100px;height:5px;height:var(--plyr-range-track-height,5px);left:0;margin-top:-2.5px;margin-top:calc((var(--plyr-range-track-height,5px)/2)*-1);padding:0;position:absolute;top:50%}.plyr__progress__buffer::-webkit-progress-bar{background:#0000}.plyr__progress__buffer::-webkit-progress-value{background:currentColor;border-radius:100px;min-width:5px;min-width:var(--plyr-range-track-height,5px);-webkit-transition:width .2s ease;transition:width .2s ease}.plyr__progress__buffer::-moz-progress-bar{background:currentColor;border-radius:100px;min-width:5px;min-width:var(--plyr-range-track-height,5px);-moz-transition:width .2s ease;transition:width .2s ease}.plyr__progress__buffer::-ms-fill{border-radius:100px;-ms-transition:width .2s ease;transition:width .2s ease}.plyr--loading .plyr__progress__buffer{animation:plyr-progress 1s linear infinite;background-image:linear-gradient(-45deg,#23282f99 25%,#0000 0,#0000 50%,#23282f99 0,#23282f99 75%,#0000 0,#0000);background-image:linear-gradient(-45deg,var(--plyr-progress-loading-background,#23282f99) 25%,#0000 25%,#0000 50%,var(--plyr-progress-loading-background,#23282f99) 50%,var(--plyr-progress-loading-background,#23282f99) 75%,#0000 75%,#0000);background-repeat:repeat-x;background-size:25px 25px;background-size:var(--plyr-progress-loading-size,25px) var(--plyr-progress-loading-size,25px);color:#0000}.plyr--video.plyr--loading .plyr__progress__buffer{background-color:#ffffff40;background-color:var(--plyr-video-progress-buffered-background,#ffffff40)}.plyr--audio.plyr--loading .plyr__progress__buffer{background-color:#c1c8d199;background-color:var(--plyr-audio-progress-buffered-background,#c1c8d199)}.plyr__progress__marker{background-color:#fff;background-color:var(--plyr-progress-marker-background,#fff);border-radius:1px;height:5px;height:var(--plyr-range-track-height,5px);position:absolute;top:50%;transform:translate(-50%,-50%);width:3px;width:var(--plyr-progress-marker-width,3px);z-index:3}.plyr__volume{align-items:center;display:flex;position:relative}.plyr__volume input[type=range]{margin-left:5px;margin-left:calc(var(--plyr-control-spacing,10px)/2);margin-right:5px;margin-right:calc(var(--plyr-control-spacing,10px)/2);max-width:90px;min-width:60px;position:relative;z-index:2}.plyr--audio{display:block}.plyr--audio .plyr__controls{background:#fff;background:var(--plyr-audio-controls-background,#fff);border-radius:inherit;color:#4a5464;color:var(--plyr-audio-control-color,#4a5464);padding:10px;padding:var(--plyr-control-spacing,10px)}.plyr--audio .plyr__control:focus-visible,.plyr--audio .plyr__control:hover,.plyr--audio .plyr__control[aria-expanded=true]{background:#00b2ff;background:var(--plyr-audio-control-background-hover,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));color:#fff;color:var(--plyr-audio-control-color-hover,#fff)}.plyr--full-ui.plyr--audio input[type=range]::-webkit-slider-runnable-track{background-color:#c1c8d199;background-color:var(--plyr-audio-range-track-background,var(--plyr-audio-progress-buffered-background,#c1c8d199))}.plyr--full-ui.plyr--audio input[type=range]::-moz-range-track{background-color:#c1c8d199;background-color:var(--plyr-audio-range-track-background,var(--plyr-audio-progress-buffered-background,#c1c8d199))}.plyr--full-ui.plyr--audio input[type=range]::-ms-track{background-color:#c1c8d199;background-color:var(--plyr-audio-range-track-background,var(--plyr-audio-progress-buffered-background,#c1c8d199))}.plyr--full-ui.plyr--audio input[type=range]:active::-webkit-slider-thumb{box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33,0 0 0 3px #23282f1a;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,#23282f1a)}.plyr--full-ui.plyr--audio input[type=range]:active::-moz-range-thumb{box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33,0 0 0 3px #23282f1a;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,#23282f1a)}.plyr--full-ui.plyr--audio input[type=range]:active::-ms-thumb{box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33,0 0 0 3px #23282f1a;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,#23282f1a)}.plyr--audio .plyr__progress__buffer{color:#c1c8d199;color:var(--plyr-audio-progress-buffered-background,#c1c8d199)}.plyr--video{overflow:hidden}.plyr--video.plyr--menu-open{overflow:visible}.plyr__video-wrapper{background:#000;background:var(--plyr-video-background,var(--plyr-video-background,#000));border-radius:inherit;height:100%;margin:auto;overflow:hidden;position:relative;width:100%}.plyr__video-embed,.plyr__video-wrapper--fixed-ratio{aspect-ratio:16/9}@supports not (aspect-ratio:16/9){.plyr__video-embed,.plyr__video-wrapper--fixed-ratio{height:0;padding-bottom:56.25%;position:relative}}.plyr__video-embed iframe,.plyr__video-wrapper--fixed-ratio video{border:0;height:100%;left:0;position:absolute;top:0;width:100%}.plyr--full-ui .plyr__video-embed>.plyr__video-embed__container{padding-bottom:240%;position:relative;transform:translateY(-38.28125%)}.plyr--video .plyr__controls{background:linear-gradient(#0000,#000000bf);background:var(--plyr-video-controls-background,linear-gradient(#0000,#000000bf));border-bottom-left-radius:inherit;border-bottom-right-radius:inherit;bottom:0;color:#fff;color:var(--plyr-video-control-color,#fff);left:0;padding:5px;padding:calc(var(--plyr-control-spacing,10px)/2);padding-top:20px;padding-top:calc(var(--plyr-control-spacing,10px)*2);position:absolute;right:0;transition:opacity .4s ease-in-out,transform .4s ease-in-out;z-index:3}@media(min-width:480px){.plyr--video .plyr__controls{padding:10px;padding:var(--plyr-control-spacing,10px);padding-top:35px;padding-top:calc(var(--plyr-control-spacing,10px)*3.5)}}.plyr--video.plyr--hide-controls .plyr__controls{opacity:0;pointer-events:none;transform:translateY(100%)}.plyr--video .plyr__control:focus-visible,.plyr--video .plyr__control:hover,.plyr--video .plyr__control[aria-expanded=true]{background:#00b2ff;background:var(--plyr-video-control-background-hover,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));color:#fff;color:var(--plyr-video-control-color-hover,#fff)}.plyr__control--overlaid{background:#00b2ff;background:var(--plyr-video-control-background-hover,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));border:0;border-radius:100%;color:#fff;color:var(--plyr-video-control-color,#fff);display:none;left:50%;opacity:.7;padding:15px;padding:calc(var(--plyr-control-spacing,10px)*1.5);position:absolute;top:50%;transform:translate(-50%,-50%);transition:.3s;z-index:2}.plyr__control--overlaid svg{left:2px;position:relative}.plyr__control--overlaid:focus,.plyr__control--overlaid:hover{opacity:1}.plyr--playing .plyr__control--overlaid{opacity:0;visibility:hidden}.plyr--full-ui.plyr--video .plyr__control--overlaid{display:block}.plyr--full-ui.plyr--video input[type=range]::-webkit-slider-runnable-track{background-color:#ffffff40;background-color:var(--plyr-video-range-track-background,var(--plyr-video-progress-buffered-background,#ffffff40))}.plyr--full-ui.plyr--video input[type=range]::-moz-range-track{background-color:#ffffff40;background-color:var(--plyr-video-range-track-background,var(--plyr-video-progress-buffered-background,#ffffff40))}.plyr--full-ui.plyr--video input[type=range]::-ms-track{background-color:#ffffff40;background-color:var(--plyr-video-range-track-background,var(--plyr-video-progress-buffered-background,#ffffff40))}.plyr--full-ui.plyr--video input[type=range]:active::-webkit-slider-thumb{box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33,0 0 0 3px #ffffff80;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,#ffffff80)}.plyr--full-ui.plyr--video input[type=range]:active::-moz-range-thumb{box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33,0 0 0 3px #ffffff80;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,#ffffff80)}.plyr--full-ui.plyr--video input[type=range]:active::-ms-thumb{box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33,0 0 0 3px #ffffff80;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,#ffffff80)}.plyr--video .plyr__progress__buffer{color:#ffffff40;color:var(--plyr-video-progress-buffered-background,#ffffff40)}.plyr:fullscreen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:fullscreen video{height:100%}.plyr:fullscreen .plyr__control .icon--exit-fullscreen{display:block}.plyr:fullscreen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:fullscreen.plyr--hide-controls{cursor:none}@media(min-width:1024px){.plyr:fullscreen .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}}.plyr--fullscreen-fallback{background:#000;border-radius:0!important;bottom:0;height:100%;left:0;margin:0;position:fixed;right:0;top:0;width:100%;z-index:10000000}.plyr--fullscreen-fallback video{height:100%}.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen{display:block}.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr--fullscreen-fallback.plyr--hide-controls{cursor:none}@media(min-width:1024px){.plyr--fullscreen-fallback .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}}.plyr__ads{border-radius:inherit;bottom:0;cursor:pointer;left:0;overflow:hidden;position:absolute;right:0;top:0;z-index:-1}.plyr__ads>div,.plyr__ads>div iframe{height:100%;position:absolute;width:100%}.plyr__ads:after{background:#23282f;border-radius:2px;bottom:10px;bottom:var(--plyr-control-spacing,10px);color:#fff;content:attr(data-badge-text);font-size:11px;padding:2px 6px;pointer-events:none;position:absolute;right:10px;right:var(--plyr-control-spacing,10px);z-index:3}.plyr__ads:empty:after{display:none}.plyr__cues{background:currentColor;display:block;height:5px;height:var(--plyr-range-track-height,5px);left:0;opacity:.8;position:absolute;top:50%;transform:translateY(-50%);width:3px;z-index:3}.plyr__preview-thumb{background-color:#fff;background-color:var(--plyr-tooltip-background,#fff);border-radius:8px;border-radius:var(--plyr-menu-radius,8px);bottom:100%;box-shadow:0 1px 2px #00000026;box-shadow:var(--plyr-tooltip-shadow,0 1px 2px #00000026);margin-bottom:10px;margin-bottom:calc(var(--plyr-control-spacing,10px)/2*2);opacity:0;padding:3px;pointer-events:none;position:absolute;transform:translateY(10px) scale(.8);transform-origin:50% 100%;transition:transform .2s ease .1s,opacity .2s ease .1s;z-index:2}.plyr__preview-thumb--is-shown{opacity:1;transform:translate(0) scale(1)}.plyr__preview-thumb:before{border-left:4px solid #0000;border-left:var(--plyr-tooltip-arrow-size,4px) solid #0000;border-right:4px solid #0000;border-right:var(--plyr-tooltip-arrow-size,4px) solid #0000;border-top:4px solid #fff;border-top:var(--plyr-tooltip-arrow-size,4px) solid var(--plyr-tooltip-background,#fff);bottom:-4px;bottom:calc(var(--plyr-tooltip-arrow-size,4px)*-1);content:"";height:0;left:calc(50% + var(--preview-arrow-offset));position:absolute;transform:translateX(-50%);width:0;z-index:2}.plyr__preview-thumb__image-container{background:#c1c8d1;border-radius:7px;border-radius:calc(var(--plyr-menu-radius,8px) - 1px);overflow:hidden;position:relative;z-index:0}.plyr__preview-thumb__image-container img,.plyr__preview-thumb__image-container:after{height:100%;left:0;position:absolute;top:0;width:100%}.plyr__preview-thumb__image-container:after{border-radius:inherit;box-shadow:inset 0 0 0 1px #00000026;content:"";pointer-events:none}.plyr__preview-thumb__image-container img{max-height:none;max-width:none}.plyr__preview-thumb__time-container{background:linear-gradient(#0000,#000000bf);background:var(--plyr-video-controls-background,linear-gradient(#0000,#000000bf));border-bottom-left-radius:7px;border-bottom-left-radius:calc(var(--plyr-menu-radius,8px) - 1px);border-bottom-right-radius:7px;border-bottom-right-radius:calc(var(--plyr-menu-radius,8px) - 1px);bottom:0;left:0;line-height:1.1;padding:20px 6px 6px;position:absolute;right:0;z-index:3}.plyr__preview-thumb__time-container span{color:#fff;font-size:13px;font-size:var(--plyr-font-size-time,var(--plyr-font-size-small,13px))}.plyr__preview-scrubbing{bottom:0;filter:blur(1px);height:100%;left:0;margin:auto;opacity:0;overflow:hidden;pointer-events:none;position:absolute;right:0;top:0;transition:opacity .3s ease;width:100%;z-index:1}.plyr__preview-scrubbing--is-shown{opacity:1}.plyr__preview-scrubbing img{height:100%;left:0;max-height:none;max-width:none;object-fit:contain;position:absolute;top:0;width:100%}.plyr--no-transition{transition:none!important}.plyr__sr-only{clip:rect(1px,1px,1px,1px);border:0!important;height:1px!important;overflow:hidden;padding:0!important;position:absolute!important;width:1px!important}.plyr [hidden]{display:none!important} /* End */ /* Start:/local/templates/forvarddom/css/magnific-popup.css?17931942567789*/ /* Magnific Popup CSS */ .mfp-bg { top: 0; left: 0; width: 100%; height: 100%; z-index: 1042; overflow: hidden; position: fixed; background: #0b0b0b; opacity: 0.8; filter: alpha(opacity=80); } .mfp-wrap { top: 0; left: 0; width: 100%; height: 100%; z-index: 1043; position: fixed; outline: none !important; -webkit-backface-visibility: hidden; } .mfp-container { text-align: center; position: absolute; width: 100%; height: 100%; left: 0; top: 0; padding: 0 8px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .mfp-container:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; } .mfp-align-top .mfp-container:before { display: none; } .mfp-content { position: relative; display: inline-block; vertical-align: middle; margin: 0 auto; text-align: left; z-index: 1045; } .mfp-inline-holder .mfp-content, .mfp-ajax-holder .mfp-content { width: 100%; cursor: auto; } .mfp-ajax-cur { cursor: progress; } .mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close { cursor: -moz-zoom-out; cursor: -webkit-zoom-out; cursor: zoom-out; } .mfp-zoom { cursor: pointer; cursor: -webkit-zoom-in; cursor: -moz-zoom-in; cursor: zoom-in; } .mfp-auto-cursor .mfp-content { cursor: auto; } .mfp-close, .mfp-arrow, .mfp-preloader, .mfp-counter { -webkit-user-select: none; -moz-user-select: none; user-select: none; } .mfp-loading.mfp-figure { display: none; } .mfp-hide { display: none !important; } .mfp-preloader { color: #CCC; position: absolute; top: 50%; width: auto; text-align: center; margin-top: -0.8em; left: 8px; right: 8px; z-index: 1044; } .mfp-preloader a { color: #CCC; } .mfp-preloader a:hover { color: #FFF; } .mfp-s-ready .mfp-preloader { display: none; } .mfp-s-error .mfp-content { display: none; } button.mfp-close, button.mfp-arrow { overflow: visible; cursor: pointer; background: transparent; border: 0; -webkit-appearance: none; display: block; outline: none; padding: 0; z-index: 1046; -webkit-box-shadow: none; box-shadow: none; } button::-moz-focus-inner { padding: 0; border: 0; } .mfp-close { width: 44px; height: 44px; line-height: 44px; position: absolute; right: 0; top: 0; text-decoration: none; text-align: center; opacity: 0.65; filter: alpha(opacity=65); padding: 0 0 18px 10px; color: #FFF; font-style: normal; font-size: 28px; font-family: Arial, Baskerville, monospace; } .mfp-close:hover, .mfp-close:focus { opacity: 1; filter: alpha(opacity=100); } .mfp-close:active { top: 1px; } .mfp-close-btn-in .mfp-close { color: #333; } .mfp-image-holder .mfp-close, .mfp-iframe-holder .mfp-close { color: #FFF; right: -6px; text-align: right; padding-right: 6px; width: 100%; } .mfp-counter { position: absolute; top: 0; right: 0; color: #CCC; font-size: 12px; line-height: 18px; white-space: nowrap; } .mfp-arrow { position: absolute; opacity: 0.65; filter: alpha(opacity=65); margin: 0; top: 50%; margin-top: -55px; padding: 0; width: 90px; height: 110px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .mfp-arrow:active { margin-top: -54px; } .mfp-arrow:hover, .mfp-arrow:focus { opacity: 1; filter: alpha(opacity=100); } .mfp-arrow:before, .mfp-arrow:after, .mfp-arrow .mfp-b, .mfp-arrow .mfp-a { content: ''; display: block; width: 0; height: 0; position: absolute; left: 0; top: 0; margin-top: 35px; margin-left: 35px; border: medium inset transparent; } .mfp-arrow:after, .mfp-arrow .mfp-a { border-top-width: 13px; border-bottom-width: 13px; top: 8px; } .mfp-arrow:before, .mfp-arrow .mfp-b { border-top-width: 21px; border-bottom-width: 21px; opacity: 0.7; } .mfp-arrow-left { left: 0; } .mfp-arrow-left:after, .mfp-arrow-left .mfp-a { border-right: 17px solid #FFF; margin-left: 31px; } .mfp-arrow-left:before, .mfp-arrow-left .mfp-b { margin-left: 25px; border-right: 27px solid #3F3F3F; } .mfp-arrow-right { right: 0; } .mfp-arrow-right:after, .mfp-arrow-right .mfp-a { border-left: 17px solid #FFF; margin-left: 39px; } .mfp-arrow-right:before, .mfp-arrow-right .mfp-b { border-left: 27px solid #3F3F3F; } .mfp-iframe-holder { padding-top: 40px; padding-bottom: 40px; } .mfp-iframe-holder .mfp-content { line-height: 0; width: 100%; max-width: 900px; } .mfp-iframe-holder .mfp-close { top: -40px; } .mfp-iframe-scaler { width: 100%; height: 0; overflow: hidden; padding-top: 56.25%; } .mfp-iframe-scaler iframe { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: #000; } /* Main image in popup */ img.mfp-img { width: auto; max-width: 100%; height: auto; display: block; line-height: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 40px 0 40px; margin: 0 auto; } /* The shadow behind the image */ .mfp-figure { line-height: 0; } .mfp-figure:after { content: ''; position: absolute; left: 0; top: 40px; bottom: 40px; display: block; right: 0; width: auto; height: auto; z-index: -1; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: #444; } .mfp-figure small { color: #BDBDBD; display: block; font-size: 12px; line-height: 14px; } .mfp-figure figure { margin: 0; } .mfp-bottom-bar { margin-top: -36px; position: absolute; top: 100%; left: 0; width: 100%; cursor: auto; } .mfp-title { text-align: left; line-height: 18px; color: #F3F3F3; word-wrap: break-word; padding-right: 36px; } .mfp-image-holder .mfp-content { max-width: 100%; } .mfp-gallery .mfp-image-holder .mfp-figure { cursor: pointer; } @media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) { /** * Remove all paddings around the image on small screen */ .mfp-img-mobile .mfp-image-holder { padding-left: 0; padding-right: 0; } .mfp-img-mobile img.mfp-img { padding: 0; } .mfp-img-mobile .mfp-figure:after { top: 0; bottom: 0; } .mfp-img-mobile .mfp-figure small { display: inline; margin-left: 5px; } .mfp-img-mobile .mfp-bottom-bar { background: rgba(0, 0, 0, 0.6); bottom: 0; margin: 0; top: auto; padding: 3px 5px; position: fixed; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .mfp-img-mobile .mfp-bottom-bar:empty { padding: 0; } .mfp-img-mobile .mfp-counter { right: 5px; top: 3px; } .mfp-img-mobile .mfp-close { top: 0; right: 0; width: 35px; height: 35px; line-height: 35px; background: rgba(0, 0, 0, 0.6); position: fixed; text-align: center; padding: 0; } } @media all and (max-width: 900px) { .mfp-arrow { -webkit-transform: scale(0.75); transform: scale(0.75); } .mfp-arrow-left { -webkit-transform-origin: 0; transform-origin: 0; } .mfp-arrow-right { -webkit-transform-origin: 100%; transform-origin: 100%; } .mfp-container { padding-left: 6px; padding-right: 6px; } } .mfp-ie7 .mfp-img { padding: 0; } .mfp-ie7 .mfp-bottom-bar { width: 600px; left: 50%; margin-left: -300px; margin-top: 5px; padding-bottom: 5px; } .mfp-ie7 .mfp-container { padding: 0; } .mfp-ie7 .mfp-content { padding-top: 44px; } .mfp-ie7 .mfp-close { top: 0; right: 0; padding-top: 0; } /* End */ /* Start:/local/templates/forvarddom/css/style.css?1793194256166502*/ .bgc_gray { background: var(--lght-grey-lght-grey-400, #E2E4E8); } .ttu { text-transform: uppercase !important; } .ttn { text-transform: none !important; } * { box-sizing: inherit; } html { box-sizing: border-box; } body { margin: 0; font-size: 16px; line-height: 1.25; font-family: Montserrat; color: #000; } :focus { outline: none; } ul, ol { padding: 0; margin: 0; list-style-type: none; } table { border-collapse: collapse; border-spacing: 0; } img { max-width: 100%; border: none; } a { background-color: transparent; color: inherit; transition: 0.3s; } a:hover { color: #FAA11D; } section { position: relative; z-index: 1; } button, [type=button], [type=reset], [type=submit] { cursor: pointer; -webkit-appearance: none; -moz-appearance: none; appearance: none; } h1, h2, h3, h4, h5, h6 { font-weight: inherit; margin: 0; } h1, .h1 { font-weight: 300; font-size: 55px; margin-bottom: 20px; } h2, .h2 { font-weight: 700; font-size: 40px; text-align: center; text-transform: uppercase; margin: 80px 0 40px; } h2.first_title, .h2.first_title { margin-top: 0; } h3, .h3 { font-weight: 700; font-size: 25px; text-transform: uppercase; margin: 50px 0 30px; } h3.first_title, .h3.first_title { margin-top: 0; } h4, .h4 { font-size: 24px; margin: 20px 0; } h4.first_title, .h4.first_title { margin-top: 0; } h5, .h5 { font-size: 22px; margin: 20px 0; } h5.first_title, .h5.first_title { margin-top: 0; } .m0 { margin: 0 !important; } .mt0 { margin-top: 0 !important; } .mb0 { margin-bottom: 0 !important; } .pt0 { padding-top: 0 !important; } .pb0 { padding-bottom: 0 !important; } .rad10 { border-radius: 10px; overflow: hidden; } .main_input { width: 100%; background-color: inherit; padding: 10px 18px; border-radius: 75px; border: 1px solid #7D7D7D; font-size: inherit; line-height: 18px; } .main_input:focus { border-color: #FAA11D; } .main_input:placeholder { color: var(--drk-grey-drk-grey-200, #A3A3A3); } .main_input.big_input { padding: 18px 25px; } .main_checkbox { position: relative; line-height: 1; margin: 10px 0; } .main_checkbox input { position: absolute; opacity: 0; margin: 0; } .main_checkbox input:checked+label:before { background-image: url("/local/templates/forvarddom/css/../img/ico/tick.svg"); } .main_checkbox label { position: relative; cursor: pointer; font-size: 12px; line-height: 1; transition: 0.3s; display: inline-block; padding-left: 32px; line-height: 130%; } .main_checkbox label:before { content: ""; width: 24px; height: 24px; box-sizing: border-box; display: inline-block; border: 1px solid #9E9E9E; border-radius: 3px; transition: 0.2s; background: white url("/local/templates/forvarddom/css/../img/ico/tick_empty.svg") no-repeat center center; position: absolute; left: 0; top: 50%; transform: translateY(-50%); } .main_radio { position: relative; line-height: 1; margin: 10px 0; } .main_radio input { position: absolute; opacity: 0; height: 0; margin: 0; } .main_radio input:checked + label:after { background: #E18709; } .main_radio label { position: relative; cursor: pointer; color: #000; font-size: 14px; line-height: 24px; transition: 0.3s; display: inline-flex; align-items: center; gap: 10px; padding-left: 32px; } .main_radio label:before, .main_radio label:after { position: absolute; left: 0; top: 50%; transform: translateY(-50%); content: ""; width: 24px; height: 24px; box-sizing: border-box; display: inline-block; border-radius: 100%; transition: 0.3s; vertical-align: middle; } .main_radio label:before { border: 1px solid #7D7D7D; } .main_radio label:after { width: 16px; height: 16px; background: transparent; left: 4px; } input::-ms-clear { display: none; } input, textarea, button, select { font-family: inherit; } textarea { min-height: 100px; resize: none; overflow-y: auto; overflow-x: hidden; width: 100%; background-color: inherit; padding: 16px 24px; border: 1px solid #FAA11D; font-size: 1rem; border-radius: 8px; border: 1px solid var(--drk-grey-drk-grey-100, #B8B8B8); background: var(--brown-brown-100, #FFFDFA); } textarea:focus { border-color: #FAA11D; } textarea:placeholder { color: var(--drk-grey-drk-grey-200, #A3A3A3); } button { border: 0; cursor: pointer; outline: none; } .clearfix:after { content: ""; display: block; clear: both; } .hidden { display: none; } .bold { font-weight: bold; } .wrapper { max-width: 1560px; margin: 0 auto; padding: 0 112px; } .main_btn { background: var(--orange-orange-600, #E18709); color: white; font-weight: 700; font-size: 24px; line-height: 130%; text-transform: uppercase; cursor: pointer; transition: 0.3s; border-radius: 100px; border: none; outline: none; display: table; width: 100%; padding: 15px 30px; text-decoration: none; text-align: center; } .main_btn.ico_btn { border-radius: 30px; background: var(--orange-orange-600, #E18709); padding: 8px 32px; font-size: 12px; font-weight: 600; text-transform: none; display: flex; align-items: center; gap: 16px; min-height: 48px; color: white; } .main_btn.orange_btn { background: #FAA11D; } .main_btn.estimate_btn { padding: 8px 45px; font-size: 21px; font-weight: 700; text-transform: none; display: flex; justify-content: center; align-items: center; gap: 16px; min-height: 56px; border-radius: 85px; background: var(--Orange-Orange-500, #FAA11D); box-shadow: 0px 5.333px 16px -2.667px rgba(112, 33, 2, 0.2); } .main_btn.estimate_btn.gray_ver { background: var(--drk-blue-drk-blue-100, #747C90); } .main_btn.change_btn { display: flex; align-items: center; gap: 16px; min-height: 89px; border-radius: 85px; background: var(--Orange-Orange-500, #FAA11D); font-size: 16px; line-height: 120%; /* 19.87px */ box-shadow: 0px 5.333px 16px -2.667px rgba(112, 33, 2, 0.2); padding: 16px 65px; } .main_btn.brd_btn { border-radius: 25px; border: 2px solid #FF900E; background: rgba(41, 41, 41, 0.75); -webkit-backdrop-filter: blur(3.5265607834px); backdrop-filter: blur(3.5265607834px); padding: 9px 28px; font-size: 14px; text-align: center; color: #FAFAFB; } .main_btn.big_btn { background: #FAA11D; box-shadow: 0px 12px 20px 0px rgba(244, 117, 0, 0.24); } .main_btn.gray_btn { background: var(--drk-blue-drk-blue-100, #747C90); box-shadow: 0px 8px 18px -4px rgba(15, 29, 64, 0.22); font-size: 18px; font-weight: 600; padding: 11px 10px; text-transform: none; line-height: 18px; } .main_btn.light_btn { background: #E2E4E8; color: black; font-size: 16px; line-height: 1.25; padding: 18px 26px; width: auto; text-transform: none; } .main_btn.blue_btn { background: var(--drk-blue-drk-blue-700, #2C3857); font-size: 18px; font-weight: 600; padding: 11px 10px; text-transform: none; line-height: 18px; text-align: center; } .main_btn.dark_blue_btn { border-radius: 64.152px; background: var(--DrkBlue-DrkBlue-800, #192648); box-shadow: 0px 8px 18px -4px rgba(20, 20, 20, 0.22); font-size: 16px; padding: 18px; } .main_btn.dark_blue_btn.big { font-size: 24px; padding: 24px; } .main_btn.more_btn { font-size: 16px; font-weight: 600; padding: 8px 24px; border-radius: 8px; text-transform: none; display: flex; justify-content: center; align-items: center; gap: 20px; width: 200px; } .main_btn.consult_btn { font-size: 17px; padding: 10px 30px; background: #FAA11D; box-shadow: 0 15px 20px 0px rgba(244, 117, 0, 0.2392156863); } .main_btn.read_btn { font-size: 22px; background: #FAA11D; box-shadow: 0px 5px 20px 0px rgba(244, 117, 0, 0.24); text-align: center; padding: 17px 30px; } .main_btn.mini_btn { font-size: 16px; background: #E18709; border: 2px solid var(--Orange, #E18709); text-align: center; padding: 16px 32px; text-transform: none; font-weight: 600; } .main_btn.trans_btn { background: transparent; color: var(--Orange, #E18709); border: 2px solid var(--Orange, #E18709); } .main_btn.print_btn { margin: 24px auto 0 0; width: auto; display: inline-flex; padding: 8px 45px !important; } .main_btn.w100 { width: 100%; } .unbroken { white-space: nowrap; } .nice_select_wrap { display: flex; width: 230px; } .nice_select_wrap.full { width: 100%; } .nice_select_wrap+.nice_select_wrap { margin-top: 10px; } .nice_select { width: 100%; border-radius: 3px; border: 1px solid var(--drk-grey-drk-grey-100, #B8B8B8); color: var(--drk-grey-drk-grey-800, #292929); font-size: 16px; font-weight: 600; line-height: 140%; height: 40px; line-height: 38px; background: transparent; } .nice_select .list { width: 100%; } .nice_select:after { border-color: #525C76; width: 9px; height: 9px; border-radius: 2px; border-width: 3px; margin-top: -8px; } .nice_select:hover { border-color: var(--drk-grey-drk-grey-100, #B8B8B8); } .nice_select .option { margin: 0; } .nice_select .option + .option { border-top: 1px solid #b8b8b8; } .nice_select .option:hover, .nice_select .option.focus, .nice_select .option.selected.focus { background-color: #F0F0F0; } .nice_select.orange_arr:after { border-color: #E18709; } .nice_select.round { border-radius: 16px; height: 48px; line-height: 46px; padding-right: 40px; } .nice_select.round:after { border-color: #192648; right: 21px; } .nice_select.white { background: white; } .nice_select.white:after { border-color: #FAA11D; width: 6px; height: 6px; margin-top: -6px; right: 18px; } .range_line { position: relative; } .range_line:before { content: ""; position: absolute; width: calc(100% + 54px); height: 8px; left: -27px; top: 0; border-radius: 20px; background: var(--lght-grey-lght-grey-300, #EEEFF2); } .range_line.one_range_line:after { content: ""; position: absolute; width: 35px; height: 8px; left: -27px; top: 0; border-radius: 20px; background: var(--lght-grey-lght-grey-500, #CACDD5); } .ui-widget.ui-widget-content { border: 0; height: 8px; margin: 0 27px; } .ui-slider .ui-slider-range { background: var(--lght-grey-lght-grey-500, #CACDD5); } .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active { border: 0; width: 54px; height: 16px; top: -4px; cursor: pointer; border-radius: 20px; background: var(--orange-orange-500, #FAA11D); box-shadow: 0px 2px 8px -1px #FAA11D; transform: translateX(-17px); } .range_block .price_range { display: flex; gap: 5px; } .range_block .price_range .input_wrap { position: relative; } .range_block .price_range .input_wrap .text { position: absolute; left: 15px; top: 50%; transform: translateY(-50%); color: #FAA11D; } .range_block .price_range .input_wrap input { padding: 10px 10px 10px 43px; -webkit-appearance: textfield; -moz-appearance: textfield; appearance: textfield; } .range_block .price_range .input_wrap input::-webkit-outer-spin-button, .range_block .price_range .input_wrap input::-webkit-inner-spin-button { display: none; } .slick-arrow { position: absolute; z-index: 10; top: 480px; right: 112px; font-size: 0; width: 56px; height: 80px; background: url("/local/templates/forvarddom/css/../img/ico/slide_arr.svg") no-repeat center; transition: .3s; } .slider_arr_orange .slick-arrow { background-image: url("/local/templates/forvarddom/css/../img/ico/slide_arr_orange.svg"); right: 15px; } .slider_arr_orange .slick-arrow.slick-prev { transform: rotate(180deg); right: 86px; } .slider_arr_top_new .slick-arrow { top: -95px; } .slider_arr_top .slick-arrow { background-image: url("/local/templates/forvarddom/css/../img/ico/slide_arr_top.svg"); transform: rotate(180deg); width: 40px; height: 40px; top: -90px; right: 0; } .other_project.slider_arr_top .slick-arrow { top: -63px; } .slick-arrow.slick-prev { transform: rotate(0); right: calc(50% + 430px); } .slider_arr_top .slick-arrow.slick-prev { right: 56px; left: auto; } .slider_arr_plans .slick-arrow { right: 10px; left: auto; top: 50%; } .slider_arr_plans .slick-arrow.slick-prev { right: auto; left: 10px; } .slick-dots { display: flex; justify-content: center; gap: 10px; position: relative; z-index: 1; margin-top: -40px; } .slick-dots li { margin: 0; } .slick-dots li button { font-size: 0; border: 2px solid transparent; width: 10px; height: 10px; border-radius: 100%; padding: 0; background-color: rgba(217, 217, 217, 0.5019607843); } .slick-dots li.slick-active button { width: 20px; height: 20px; border-color: white; background-color: #FAA11D; } .main_sec { padding: 72px 0; position: relative; } .title_text { font-weight: 500; line-height: 140%; max-width: 616px; margin: 16px auto 0; text-align: center; } .sec_subtitle { text-align: center; font-size: 28px; font-weight: 600; line-height: 150%; margin-top: 16px; } .sec_pretitle { text-align: center; font-size: 28px; font-weight: 600; line-height: 150%; max-width: 632px; margin: 0 auto 8px; } .sec_title { text-align: center; margin-bottom: 40px; color: var(--drk-grey-drk-grey-800, #292929); font-size: 42px; font-weight: 700; line-height: 130%; } .sec_title.big { font-size: 56px; } .sec_title.middle { font-size: 36px; } .sec_title.mini { font-size: 28px; line-height: 1.25; margin-bottom: 24px; } .sec_title .little_margin { margin-bottom: 24px; } .page { display: flex; flex-direction: column; min-height: 100vh; margin: auto; background-color: #fff; max-width: 1920px; position: relative; } .page main { flex: 1; position: relative; z-index: 1; } .header a { text-decoration: none; } .header .header_wrap { display: flex; justify-content: space-between; align-items: center; padding: 55px 0 50px; gap: 30px; } .header .logo { display: block; } .logo_block { display: flex; } .logo_block .logo { display: flex; align-items: flex-end; gap: 20px; text-decoration: none; } .logo_block .logo .logo_mini { display: none; } .logo_block .slogan { font-size: 28px; font-weight: 700; line-height: 1; } .nav_screen { position: fixed; top: 0; left: 0; z-index: 11; padding: 48px 48px 96px; background: rgba(42, 52, 77, 0.6); background: #2A344D; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); display: flex; flex-direction: column; color: white; } .nav_screen .close { display: none; } .nav_screen .nav_menu { display: flex; flex-direction: column; align-items: baseline; gap: 8px; margin-top: 50px; } .nav_screen .nav_menu .item { font-size: 14px; font-weight: 500; line-height: 1; letter-spacing: 2.1px; text-transform: uppercase; border-radius: 32px; border: 1px solid transparent; position: relative; } .nav_screen .nav_menu .item a{ padding: 16px 32px; display: block; cursor: pointer; } .nav_screen .nav_menu .item a .arr{ width: 6px; height: 10px; margin-left: 10px; } .nav_screen .nav_menu .item a .arr path{ transition: .3s; } .nav_screen .nav_menu .item.active { border-color: var(--lght-grey-lght-grey-900, #8C93A3); font-weight: 800; } .nav_screen .nav_menu .item .submenu_wrap { display: none; padding-left: 311px; position: absolute; left: 0; top: -10px; } .nav_screen .nav_menu .item .submenu { z-index: 12; display: flex; flex-direction: column; gap: 24px; background: #E18709E5; padding: 13px 36px 21px 44px; border-radius: 0 24px 24px 0; } .nav_screen .nav_menu .item .submenu .item { color: white; border: none; padding: 0; font-weight: 600; text-transform: none; white-space: nowrap; letter-spacing: normal; } .nav_screen .nav_menu .item .submenu .item a{ padding: 5px 0; } .nav_screen .btn_block { display: grid; gap: 32px; margin-top: 70px; } .nav_screen .search_block { margin-top: 50px; position: relative; } .nav_screen .search_block .main_input { padding-left: 56px; background-color: #fff; border-radius: 8px; } .nav_screen .search_block .ico { position: absolute; left: 16px; top: 8px; } .nav_screen .contact_block { text-align: center; line-height: 130%; margin-top: 40px; } .nav_screen .contact_block .phone { font-size: 24px; font-weight: 700; text-decoration: none; } .nav_screen .contact_block .schedule { margin-top: 10px; font-weight: 600; } .nav_screen .social_block { border-top: 1px solid var(--lght-grey-lght-grey-900, #8C93A3); padding-top: 32px; margin-top: 48px; display: flex; display: none; justify-content: center; align-items: center; gap: 24px; } .banner_sec { position: relative; } .banner_sec .hamb { position: absolute; z-index: 10; top: 16px; right: 16px; } .banner_sec .main_banner_nav { position: absolute; z-index: 1; bottom: 30px; right: 112px; max-width: 1330px; width: 100%; border-radius: 12px; background: rgba(42, 52, 77, 0.7); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); } .banner_sec .main_banner_nav .item { position: relative; color: #FFF; text-align: center; font-size: 18px; font-weight: 500; margin: 8px; cursor: pointer; transition: 0.4s; border-radius: 12px; background: transparent; } .banner_sec .main_banner_nav .item:before, .banner_sec .main_banner_nav .item:after { content: ""; position: absolute; left: 50%; transform: translateX(-50%) scale(0.5); opacity: 0; transition: 0.5s; } .banner_sec .main_banner_nav .item:before { bottom: 88px; background: url("/local/templates/forvarddom/css/../img/ico/slick_romb.svg") no-repeat center top; width: 228px; height: 100px; } .banner_sec .main_banner_nav .item:after { bottom: 80px; background: url("/local/templates/forvarddom/css/../img/ico/slick_arr.svg") no-repeat center top; width: 98px; height: 67px; } .banner_sec .main_banner_nav .item.slick-current { background: var(--orange-orange-500, #FAA11D); font-size: 21px; font-weight: 700; } .banner_sec .main_banner_nav .item.slick-current:before, .banner_sec .main_banner_nav .item.slick-current:after { opacity: 1; transform: translateX(-50%) scale(1); } .banner_sec .main_banner_nav .item.slick-current .ico_material { width: 140px; top: -160px; filter: grayscale(0); } .banner_sec .main_banner_nav .item .name { padding: 10px; height: 80px; width: 100%; display: flex; justify-content: center; align-items: center; text-align: center; position: relative; z-index: 1; } .banner_sec .main_banner_nav .item .ico_material { width: 110px; position: absolute; top: -100px; left: 50%; transform: translateX(-50%); filter: grayscale(1); transition: 0.5s; } .banner_sec .banner_text { position: absolute; width: 100%; top: 0; right: 0; color: white; padding-top: 72px; } .banner_sec .banner_text .wrapper { position: relative; } .banner_sec .banner_text:before { content: ""; position: absolute; top: 0; right: 0; display: block; border-right: 680px solid rgba(42, 52, 77, 0.6); border-bottom: 340px solid transparent; } .banner_sec .banner_text .banner_text_wrap { display: flex; align-items: flex-start; justify-content: space-between; gap: 25px; } .banner_sec .banner_text .banner_text_wrap .title_block { font-size: 42px; font-weight: 700; line-height: 120%; width: 100%; } .banner_sec .banner_text .banner_text_wrap .title_block .logo_block { margin-bottom: 80px; } .banner_sec .banner_text .banner_text_wrap .title_block .title { max-width: 470px; } .banner_sec .banner_text .banner_text_wrap .title_block .subtitle { margin-top: 20px; font-size: 24px; line-height: 130%; max-width: 470px; } .banner_sec .banner_text .banner_text_wrap .title_block .title, .banner_sec .banner_text .banner_text_wrap .title_block .subtitle { text-shadow: 1px 1px 20px rgb(0 0 0 / 50%); } .banner_sec .banner_text .banner_text_wrap .title_block .main_btn { width: 210px; margin-top: 20px; } .banner_sec .banner_text .banner_text_wrap .title_block .main_btn img { width: 7px; height: auto; margin: 0; } .banner_sec .banner_text .banner_text_wrap .btn_block { display: flex; gap: 16px; } .banner_sec .banner_text .banner_text_wrap .contact_block { text-align: right; color: #F2F2F2; display: flex; flex-direction: column; align-items: flex-end; } .banner_sec .banner_text .banner_text_wrap .contact_block .phone { font-size: 36px; font-weight: 700; line-height: 130%; text-decoration: none; white-space: nowrap; } .banner_sec .banner_text .banner_text_wrap .contact_block .schedule { font-size: 18px; margin-top: 8px; font-weight: 500; line-height: 140%; } .banner_sec .banner_text .banner_text_wrap .contact_block .main_btn { margin-top: 16px; margin-left: auto; width: auto; } .banner_sec .banner_fade { position: absolute; bottom: 0; right: 0; width: 100%; height: 150px; background: linear-gradient(transparent 20%, #FFF 110%); } .banner_sec .banner_scroll { position: absolute; bottom: 100px; right: calc(50% - 280px); display: flex; align-items: center; gap: 10px; color: var(--brown-brown-500, #BDB3A6); font-size: 12px; font-weight: 700; line-height: 160%; display: none; } .main_banner { position: relative; } .main_banner .item { height: 1024px; position: relative; } .main_banner .item .num { display: none; position: absolute; top: 490px; right: calc(50% + 250px); color: #FFF; text-shadow: 0px 0px 64px #000; font-size: 42px; line-height: 130%; } .main_banner .item .num .current { font-size: 64px; font-weight: 700; } .main_banner .item .num .all { opacity: 0.6; } .main_banner .item img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .main_banner .item img.mob_img { display: none; } .main_banner .slick-arrow.slick-prev { transform: rotate(180deg); } .why_block { display: grid; gap: 15px; } .why_block .item { display: grid; gap: 10px; } .calc_sec .calc_girl, .calc_sec .calc_house { display: none; } .calc_sec p { line-height: 160%; } .calc_block { border-radius: 16px; background: var(--lght-grey-lght-grey-100, #FAFAFB); box-shadow: 0px 20px 36px -10px rgba(15, 29, 64, 0.24); padding: 24px 16px 32px; display: grid; gap: 24px; } .inputs_wrap { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 44px; } .aster { color: var(--orange-orange-600, #E18709); font-weight: bold; } .meter_cell .input_wrap { position: relative; } .meter_cell .input_wrap .main_input { padding-right: 50px; } .meter_cell .input_wrap .symb { position: absolute; right: 16px; top: 4px; color: var(--drk-grey-drk-grey-200, #A3A3A3); line-height: 160%; } .meter_cell .input_wrap .symb sup { font-size: 8px; } .label { font-size: 16px; font-weight: 600; line-height: 140%; margin-bottom: 10px; } .label.some_label { display: flex; justify-content: space-between; text-align: center; } .label .text { font-size: 14px; font-weight: 400; padding: 0 10px; } .radio_block { display: flex; align-items: center; border-radius: 8px; background: var(--solid-colours-brand-gray-gray-300, #EEEFF2); padding: 2px; } .radio_btn { position: relative; width: 100%; background: var(--solid-colours-brand-gray-gray-300, #EEEFF2); } .radio_btn input { display: none; } .radio_btn input:checked+label { background: var(--lght-grey-lght-grey-900, #8C93A3); font-size: 700px; font-size: 16px; color: white; } .radio_btn label { text-align: center; cursor: pointer; display: block; padding: 8px 16px; border-radius: 6px; color: var(--drk-blue-drk-blue-200, #656E85); font-size: 14px; font-weight: 600; line-height: 130%; } .upload_block { position: relative; } .upload_block input[type=file] { position: absolute; z-index: -1; opacity: 0; display: block; width: 0; height: 0; } .upload_block .upload_btn { display: block; text-align: center; padding: 8px 16px; border-radius: 99px; background: var(--lght-grey-lght-grey-900, #8C93A3); color: #FFF; font-size: 14px; font-weight: 600; line-height: 23px; cursor: pointer; height: 40px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .upload_block .upload_btn .text { display: flex; justify-content: center; align-items: center; gap: 6; margin: auto; } .required_text { padding: 12px 27px; color: var(--brown-brown-800, #615C55); font-family: Montserrat; font-size: 14px; font-style: normal; font-weight: 600; line-height: 160%; border-radius: 12px; border: 1px solid var(--orange-orange-400, #F5BB56); background: #FFF6EB; display: flex; align-items: center; gap: 15px; } .required_text .aster { font-size: 24px; transform: translateY(4px); } .orange { color: var(--orange-orange-600, #E18709); } .last_project_sec .last_project_line { display: none; } .house_select { display: grid; grid-template-columns: 208px 152px 248px 320px 1fr; gap: 24px; margin-top: 64px; } .house_select>div { flex: 1; } .house_select .label { text-align: center; } .house_select .main_btn { align-self: flex-end; margin-left: auto; margin-bottom: 8px; max-width: 272px; } .house_select .house_select_nav { display: none; } .input_simple { border: 0; color: var(--drk-grey-drk-grey-800, #292929); text-align: center; font-size: 16px; font-weight: 700; padding: 0; margin: 0; background-color: transparent; width: 30px; } .input_simple::-moz-placeholder { color: var(--drk-grey-drk-grey-800, #292929); } .input_simple::placeholder { color: var(--drk-grey-drk-grey-800, #292929); } .range_wrap { display: flex; justify-content: center; align-items: center; gap: 5px; font-size: 14px; font-weight: 700; line-height: 14px; padding: 12px 16px; border-radius: 3px; border: 1px solid var(--drk-grey-drk-grey-100, #B8B8B8); } .range_wrap.price_wrap { justify-content: space-between; } .range_wrap .range_text { font-size: 12px; font-weight: 500; } .range_wrap sup { font-size: 10px; } .range_wrap .range_value { margin-top: -4px; } .range_wrap.white { background: white; } .input_num { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-weight: 700; line-height: 14px; padding: 9px 10px; border-radius: 3px; border: 1px solid var(--drk-grey-drk-grey-100, #B8B8B8); } .input_num button { border: 0; background: none; padding: 0; font-size: 0; } .input_num button:last-child { transform: rotate(180deg); } .input_num input[type=number] { -moz-appearance: textfield; -webkit-appearance: textfield; appearance: textfield; } .input_num input[type=number]::-webkit-outer-spin-button, .input_num input[type=number]::-webkit-inner-spin-button { display: none; } .mCSB_scrollTools.mCSB_scrollTools_horizontal { height: 30px; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail { height: 8px; border-radius: 70px; background: var(--lght-grey-lght-grey-100, #FAFAFB); box-shadow: 0px 2px 10px -2px rgba(0, 0, 0, 0.05) inset; margin: 10px 0; } .bgc_gray .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail { background: var(--lght-grey-lght-grey-500, #CACDD5); } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { height: 16px; border-radius: 20px; background: var(--lght-grey-lght-grey-500, #CACDD5); box-shadow: 0px 2px 8px -1px rgba(20, 20, 20, 0.18); } .bgc_gray .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { background: var(--lght-grey-lght-grey-600, #B2B7C2); } .project_list { margin-top: 48px; display: flex; gap: 16px; padding-bottom: 35px; } .project_one { flex: 1; display: flex !important; flex-direction: column; gap: 16px; text-decoration: none; border-radius: 16px; background: var(--lght-grey-lght-grey-200, #F5F6F7); box-shadow: 0px 10px 20px 0px rgba(15, 29, 64, 0.24); padding: 16px 16px 24px; position: relative; } .project_one .shevron { position: absolute; top: 16px; left: 16px; width: 160px; height: 160px; padding: 15px 18px; background: rgba(254, 142, 30, 0.8); border-top-left-radius: 8px; -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 0%, 0% 100%); clip-path: polygon(0% 0%, 100% 0%, 100% 0%, 0% 100%); } .project_one .shevron img { width: 32px; margin-bottom: 10px; display: block; } .project_one .shevron .text { color: var(--LghtGrey-LghtGrey-100, #FAFAFB); font-size: 12px; font-weight: 500; line-height: 120%; /* 14.4px */ } .project_one .img { -o-object-fit: cover; object-fit: cover; width: 100%; height: 264px; border-radius: 8px; } .project_one .name { color: var(--drk-grey-drk-grey-900, #141414); font-size: 20px; font-weight: 600; line-height: 140%; } .project_one .line { display: flex; justify-content: space-between; align-items: center; gap: 10px; } .project_one .line .count_rooms{ display: flex; gap: 12px; } .project_one .line .count_rooms > div{ display: flex; justify-content: end; align-items: center; gap: 8px; } .project_one .line .count_rooms .num{ font-weight: bold; color: #3A4662; font-size: 16px; line-height: 16px; } .project_one .descr { color: var(--drk-grey-drk-grey-900, #141414); font-size: 12px; line-height: 160%; } .project_one .params { display: flex; justify-content: space-between; align-items: flex-end; margin-top: auto; } .project_one .params .cell .size { display: flex; gap: 16px; color: var(--brown-brown-800, #615C55); font-weight: 500; line-height: 140%; align-items: center; } .project_one .params .cell .scale { display: flex; gap: 12px; padding: 8px; border-radius: 8px; border: 1px solid var(--brown-brown-500, #BDB3A6); color: var(--drk-blue-drk-blue-600, #3A4662); font-size: 28px; font-weight: 700; line-height: 130%; margin-top: 8px; } .project_one .params .cell .price { color: var(--drk-blue-drk-blue-600, #3A4662); font-size: 28px; font-weight: 500; line-height: 150%; text-align: right; } .project_one .params .cell .cost { margin-top: 8px; color: var(--brown-brown-700, #807970); text-align: right; font-size: 18px; font-weight: 500; line-height: 160%; } .promo_block { margin: 48px -16px 0; } .promo_block .promo_head { padding: 0 24px; } .promo_block .promo_head .title { color: var(--orange-orange-600, #E18709); font-size: 32px; font-weight: 700; line-height: 1; text-align: center; } .promo_block .promo_head .text { font-size: 10px; margin-top: 16px; } .promo_block .promo_head .quote_cell { display: flex; align-items: center; gap: 16px; } .promo_grid { display: grid; grid-template-columns: 1fr; gap: 0; color: white; } .promo_grid .item { position: relative; } .promo_grid .item img { position: absolute; bottom: 0; left: 0; z-index: -1; } .promo_grid .item .desc { display: none; } .promo_grid .item .mob { display: block; max-width: none; } .promo_grid .item:nth-child(1) { min-height: 174px; padding-top: 15px; padding-left: 15px; } .promo_grid .item:nth-child(1) .title { font-size: 20px; text-align: right; font-weight: bold; line-height: normal; text-transform: uppercase; } .promo_grid .item:nth-child(1) .text { font-size: 12px; font-weight: 400; line-height: normal; } .promo_grid .item:nth-child(2) { min-height: 169px; padding-top: 16px; padding-right: 25px; text-align: right; } .promo_grid .item:nth-child(2) .pretitle { color: var(--orange-orange-900, #7C4301); font-size: 22px; font-weight: 600; line-height: 150%; } .promo_grid .item:nth-child(2) .title { font-size: 34px; font-weight: 700; line-height: 130%; } .promo_grid .item:nth-child(2) .text { font-size: 17px; font-weight: 600; line-height: 150%; } .promo_grid .item:nth-child(3) { min-height: 168px; padding-top: 32px; padding-left: 120px; order: unset; } .promo_grid .item:nth-child(3) .pretitle { font-size: 13px; font-weight: 400; line-height: normal; } .promo_grid .item:nth-child(3) .title { font-size: 24px; font-weight: 700; line-height: 38px; } .promo_grid .item:nth-child(3) .text { font-size: 13px; font-weight: 400; line-height: 38px; margin-top: 5px; } .promo_grid .item:nth-child(4) { min-height: 152px; padding-top: 37px; padding-left: 15px; text-align: center; } .promo_grid .item:nth-child(4) .title { color: var(--orange-orange-600, #E18709); font-size: 25px; font-weight: 800; line-height: normal; text-transform: uppercase; } .promo_grid .item:nth-child(4) .text { font-size: 16px; font-weight: 600; line-height: 160%; margin-top: 40px; margin-left: -10px; } .quotes { padding: 0 40px; background: url("/local/templates/forvarddom/css/../img/ico/quote_rotate.svg") no-repeat 0 5px, url("/local/templates/forvarddom/css/../img/ico/quote.svg") no-repeat 100% 100%; font-size: 20px; font-weight: 600; line-height: 130%; } .comfort_list { display: flex; margin-top: 16px; } .comfort_list .item { margin: 0 -3px; text-decoration: none; position: relative; min-width: 356px; max-width: 356px; height: 508px; display: flex; flex-direction: column; justify-content: flex-end; padding: 10px 43px 56px 43px; color: white; text-align: center; color: var(--drk-grey-drk-grey-700, #3D3D3D); font-weight: 500; line-height: 140%; } .comfort_list .item.blue_btn { color: var(--brown-brown-800, #615C55); } .comfort_list .item.white_text { color: var(--brown-brown-100, #FFFDFA); } .comfort_list .item .back { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .comfort_list .item .ico { position: absolute; top: 30px; right: 42px; } .comfort_list .item .title { margin-bottom: 24px; position: relative; min-height: 96px; display: flex; align-items: center; } .comfort_list .item .main_btn { position: relative; } .review_list { display: flex; gap: 8px; padding-top: 56px; padding-bottom: 42px; } .review_list .item { min-width: 256px; border-radius: 16px; background: var(--lght-grey-lght-grey-100, #FAFAFB); box-shadow: 0px 20px 36px -10px rgba(112, 33, 2, 0.24); padding: 8px 16px 16px; position: relative; } .review_list .item .client { margin-top: -64px; margin-left: 32px; display: flex; align-items: center; gap: 24px; } .review_list .item .client img { width: 56px; border-radius: 100%; } .review_list .item .client .info .name { color: var(--orange-orange-600, #E18709); font-size: 18px; font-weight: 600; line-height: 1.2; } .review_list .item .client .info .date { color: var(--brown-brown-800, #615C55); font-size: 10px; font-weight: 500; line-height: 160%; } .review_list .item .img { margin-top: 8px; border-radius: 7px; background: var(--brown-brown-100, #FFFDFA); box-shadow: 0px 2.98438px 8.95313px -1.49219px rgba(112, 33, 2, 0.2); padding: 8px; height: 136px; } .review_list .item .img img { border-radius: 7px; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .review_list .item .params { margin-top: 16px; padding: 8px 16px; border-radius: 8px; border: 1px solid var(--brown-brown-500, #BDB3A6); } .review_list .item .params .point { display: flex; gap: 16px; color: var(--brown-brown-800, #615C55); font-size: 12px; font-weight: 600; line-height: 160%; } .review_list .item .params .point img { width: 16px; } .review_list .item .params .point:last-child { margin-top: 5px; font-size: 12px; font-weight: 500; } .review_list .item .text { color: #656565; font-size: 12px; line-height: 130%; margin-top: 16px; margin-bottom: 10px; /* max-height: 129px; */ /* overflow: hidden; */ /* text-overflow: ellipsis; */ } .review_list .item .text.active { max-height: none; } .review_list .item .read_more { margin-top: auto; display: flex; justify-content: center; align-items: center; gap: 20px; color: var(--orange-orange-600, #E18709); font-size: 14px; line-height: 24px; cursor: pointer; } .review_list .item .read_more img { width: 14px; } .review_list .item .read_more.active .full_text { display: none; } .review_list .item .read_more.active:before { content: attr(data-switch); } .review_list .item .read_more.active img { transform: rotate(180deg); } .footer { background: var(--drk-grey-drk-grey-800, #292929); padding: 40px 0 30px; } .footer .footer_wrap { display: grid; gap: 40px; } .footer .footer_wrap .info { display: grid; gap: 32px; } .footer .footer_wrap .info .point { display: flex; align-items: flex-start; gap: 16px; color: var(--lght-grey-lght-grey-100, #FAFAFB); font-size: 16px; line-height: 160%; } .footer .footer_wrap .info .point .phone { font-size: 20px; font-weight: 700; display: block; text-decoration: none; } .footer .footer_wrap .info .point .mail { margin-top: 3px; } .footer .footer_wrap .info .point img { width: 32px; } .comfort_sec .scroll_list { margin: 0 -16px; } .comfort_sec .mCSB_scrollTools.mCSB_scrollTools_horizontal { margin: 0 16px; } .review_sec .scroll_list, .review_wrap .scroll_list { margin: 0 -32px; } .promo_project_sec .mCSB_scrollTools.mCSB_scrollTools_horizontal, .review_wrap .mCSB_scrollTools.mCSB_scrollTools_horizontal, .review_sec .mCSB_scrollTools.mCSB_scrollTools_horizontal { margin: 0 32px; } .review_list { padding-left: 32px; } .review_list::after { content: ""; min-width: 16px; display: block; } .review_sec .review_list::after, .review_wrap .review_list::after { min-width: 1px; } .nav_line { z-index: 11; position: fixed; left: 0; top: 0; width: 100%; background: rgba(42, 52, 77, 0.8509803922); transition: 0.5s; } .page_main .nav_line { /* top: -56px; */ } .nav_line.active { top: 0; } .nav_line .nav_line_wrap { display: flex; align-items: center; gap: 8px; color: white; padding: 16px 0; } .nav_line .nav_line_wrap .logo_link{ display: flex; align-items: end; gap: 8px; text-decoration: none; } .nav_line .nav_line_wrap .logo { width: 26px; } .nav_line .nav_line_wrap .text { font-size: 12px; font-weight: 700; line-height: 1; color: white; } .nav_line .nav_line_wrap .phone { margin-left: auto; margin-right: 8px; font-size: 12px; line-height: 20px; font-weight: 700; text-decoration: none; } #player { width: 100%; } .plyr--full-ui.plyr--video .plyr__control--overlaid { background: url("/local/templates/forvarddom/css/../img/ico/play.svg") no-repeat center/contain; width: 176px; height: 168px; } .plyr--full-ui.plyr--video .plyr__control--overlaid svg { display: none; } .plyr__poster { background-size: cover; } .video_nav { display: flex; justify-content: center; max-width: 1223px; margin: auto; margin-top: -120px; } .video_nav .item { color: #FFF; text-align: center; font-size: 14px; line-height: 140%; position: relative; flex: 1; cursor: pointer; } .video_nav .item.active:after { opacity: 1; } .video_nav .item.active .round { background: var(--orange-orange-500, #FAA11D); box-shadow: 0px 2px 8px #FAA11D; border: 0; } .video_nav .item.active .round:before { opacity: 0.25; border-color: var(--brown-brown-100, #FFFDFA); width: 40px; height: 40px; } .video_nav .item.current .round { top: -58px; width: 38px; height: 38px; } .video_nav .item.current .round:before { width: 58px; height: 58px; } .video_nav .item:before { content: ""; position: absolute; top: -47px; left: 0; width: 100%; height: 16px; background: var(--brown-brown-500, #BDB3A6); opacity: 0.2; transform: translateX(-50%); transition: 0.5s; pointer-events: none; } .video_nav .item:after { content: ""; position: absolute; top: -43px; left: 0; width: 100%; height: 8px; opacity: 0; background: var(--orange-orange-500, #FAA11D); transform: translateX(-50%); transition: 0.5s; pointer-events: none; } .video_nav .item .round { content: ""; position: absolute; top: -51px; left: 50%; width: 24px; height: 24px; background: var(--brown-brown-800, #615C55); border-radius: 100%; transform: translateX(-50%); z-index: 1; transition: 0.5s; } .video_nav .item .round:before { content: ""; position: absolute; top: 50%; left: 50%; border: 3px solid var(--brown-brown-600, #9E968B); border-radius: 100%; width: 30px; height: 30px; transform: translate(-50%, -50%); transition: 0.5s; box-sizing: border-box; } .video_nav .item:first-child:before, .video_nav .item:first-child:after { display: none; } .video_sec { padding-top: 0 !important; } .float_label { position: relative; } .float_label input:not(:-moz-placeholder-shown)~label { top: -8px; font-size: 12px; } .float_label input:focus~label, .float_label input:not(:placeholder-shown)~label { top: -8px; font-size: 12px; } .float_label label { position: absolute; top: 10px; left: 20px; transition: 0.3s; font-size: 16px; color: var(--drk-grey-drk-grey-200, #A3A3A3); background: var(--lght-grey-lght-grey-100, #FAFAFB); border-radius: 15px; padding: 1px 10px; cursor: text; white-space: nowrap; } .float_arrow { animation: float_arrow 5s ease-in-out infinite; } @keyframes float_arrow { 0% { transform: translateY(-5px); } 50% { transform: translateY(5px); } 100% { transform: translateY(-5px); } } .agree_block { margin-bottom: 20px; } .promo_grid .item:nth-child(2) .hover_img, .promo_grid .item:nth-child(3) .hover_img, .promo_grid .item:nth-child(3) .fire_wrap { opacity: 0; transition: 0.5s; } .bread_sec { padding: 24px 0 0; overflow: hidden; } .bread_sec.with_bg .bg_img { position: absolute; right: 0; bottom: 0; -o-object-fit: cover; object-fit: cover; z-index: -1; width: 100%; height: 100%; } .bread_sec.with_bg:after { content: ""; z-index: 12; position: absolute; right: 0; bottom: 0; width: 100%; height: 80px; background: linear-gradient(rgba(41, 41, 41, 0) 0%, #FFF 100%); } .bread_sec.with_bg .bread_search_wrap { background: rgba(226, 228, 232, 0.4); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); } .bread_sec.with_bg .breadcrumbs { background: rgba(149, 156, 171, 0.4); mix-blend-mode: overlay; } .bread_sec .title { color: #FFF; text-align: center; font-size: 56px; font-weight: 700; line-height: 120%; /* 67.2px */ margin: 48px auto 80px; display: flex; justify-content: center; align-items: center; gap: 50px; text-transform: uppercase; } .bread_sec .title.with_img { margin: 17px 0; } .bread_sec .title.with_img .material { width: 180px; height: 180px; background: url(/local/templates/forvarddom/css/../img/ico/material_frame.svg) no-repeat center/contain; display: flex; justify-content: center; align-items: center; } .bread_sec .title.with_img .material img { width: 120px; } .bread_search_wrap { display: flex; gap: 15px; justify-content: space-between; border-radius: 32px; background: #E2E4E8; } .breadcrumbs { background: #959CAB; display: flex; align-items: center; gap: 24px; border-radius: 32px; padding-left: 32px; padding-right: 32px; overflow: hidden; position: relative; } .breadcrumbs .roll { display: none; position: absolute; z-index: 12; bottom: 11px; right: 16px; font-size: 12px; font-weight: 600; line-height: 1.5; color: white; } .breadcrumbs .roll span { display: none; margin-right: 12px; } .breadcrumbs .roll img { min-width: auto; } .breadcrumbs .item { color: #FFF; font-size: 12px; font-weight: 600; line-height: 160%; white-space: nowrap; } .breadcrumbs a.item { background: url("/local/templates/forvarddom/css/../img/ico/arr_bread.svg") no-repeat right center; padding-right: 30px; text-decoration: none; } .breadcrumbs a.item.home_link { background-image: url("/local/templates/forvarddom/css/../img/ico/line_bread.svg"); padding-right: 24px; } .breadcrumbs img { vertical-align: middle; min-width: 24px; } .search_wrap { border-radius: 8px 24px 24px 8px; margin: 8px; min-width: 320px; padding-left: 40px; background: white url("/local/templates/forvarddom/css/../img/ico/search.svg") no-repeat 18px center; } .search_wrap .main_input { border: 0; } input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus { -webkit-box-shadow: 0 0 0px 40rem #ffff inset; } .simple_sec { padding: 48px 0 72px; } .listing_preview { display: grid; grid-template-columns: 1fr 320px; gap: 24px; color: #000; font-size: 14px; font-weight: 500; line-height: 160%; /* 22.4px */ } .listing_info { border-radius: 16px; background: var(--LghtGrey-LghtGrey-200, #F5F6F7); box-shadow: 0px 20px 36px -10px rgba(15, 29, 64, 0.24); padding: 32px 56px; display: flex; gap: 80px; margin-top: 56px; } .listing_info .info_block { display: flex; gap: 85px; } .listing_info .info_block .cell .title { margin-bottom: 16px; font-size: 14px; font-weight: 600; line-height: 130%; /* 18.2px */ } .listing_info .info_block .cell .list { display: flex; gap: 60px; } .listing_info .info_block .cell .list .col { display: flex; flex-direction: column; gap: 16px; } .listing_info .info_block .cell .list .point { padding-left: 24px; font-size: 12px; font-weight: 500; line-height: 160%; /* 19.2px */ background: url("/local/templates/forvarddom/css/../img/ico/arr_list.svg") no-repeat left center; } .listing_info .listing_filter { flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 40px; } .listing_info .listing_filter .label { text-align: center; } .sort_type { margin-top: 64px; position: relative; font-size: 16px; font-weight: 600; line-height: 140%; /* 22.4px */ display: inline-flex; align-items: center; gap: 56px; cursor: pointer; } .sort_type:hover .sort_list { display: flex; } .sort_type .sort_list { position: absolute; top: 30px; left: 73px; border-radius: 8px; background: var(--LghtGrey-LghtGrey-200, #F5F6F7); box-shadow: 0px 20px 36px -10px rgba(15, 29, 64, 0.24); padding: 10px 15px; z-index: 12; display: none; flex-direction: column; gap: 5px; } .sort_type .sort_list a{ margin: 5px 0; } .load_more { font-size: 16px; font-weight: 600; line-height: 140%; /* 22.4px */ border-radius: 3px; border: 1px solid var(--LghtGrey-LghtGrey-600, #B2B7C2); padding: 8px 17px; display: flex; justify-content: center; align-items: center; gap: 17px; margin: 48px auto 0; width: 210px; background-color: #fff; cursor: pointer } .calc_mortgage_wrap { display: grid; grid-template-columns: 1fr 400px; gap: 40px; margin-top: 32px; } .calc_project { padding: 16px; border-radius: 16px; background: var(--LghtGrey-LghtGrey-200, #F5F6F7); box-shadow: 0px 20px 36px -10px rgba(15, 29, 64, 0.24); } .calc_project .title_block { border-radius: 8px 8px 8px 54px; background: linear-gradient(180deg, #FE8E1E 0%, #FAA11D 100%); display: flex; gap: 114px; align-items: center; min-height: 247px; } .calc_project .title_block .name { color: white; font-size: 40px; font-weight: 700; line-height: 120%; /* 48px */ text-transform: uppercase; } .calc_project .title_block img { margin-top: auto; width: 30%; } .calc_project .info { padding: 16px; } .calc_project .info .name { font-size: 28px; font-weight: 500; line-height: 150%; /* 42px */ margin-bottom: 16px; } .calc_project .info .text { font-size: 14px; line-height: 140%; /* 19.6px */ margin: 16px 0; } .calc_project .info .size { color: var(--Brown-Brown-800, #615C55); font-size: 16px; font-weight: 500; line-height: 140%; /* 22.4px */ display: flex; align-items: center; gap: 12px; } .calc_project .info .line { display: flex; justify-content: space-between; align-items: flex-end; gap: 15px; } .calc_project .info .area { display: flex; align-items: center; gap: 12px; color: var(--DrkBlue-DrkBlue-600, #3A4662); font-size: 20px; font-weight: 700; line-height: 140%; /* 28px */ padding: 8px; border-radius: 8px; border: 1px solid var(--Brown-Brown-500, #BDB3A6); flex-basis: 264px; } .calc_project .info .price { color: #E18709; text-align: center; font-size: 28px; font-weight: 700; line-height: 110%; /* 30.8px */ border-radius: 8px; border: 1px solid #E18709; padding: 15px 25px; flex-basis: 410px; transition: .3s; cursor: pointer; } .mortgage_banner { padding: 32px; border-radius: 12px; border: 3px solid var(--Orange-Orange-500, #FAA11D); background: #FFF; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 24px; text-align: center; } .mortgage_banner .name { color: #3A4662; font-size: 36px; font-weight: 700; line-height: 110%; /* 39.6px */ text-transform: uppercase; } .mortgage_banner .text { font-size: 26px; font-weight: 600; line-height: 130%; /* 33.367px */ text-transform: uppercase; } .mortgage_banner .text .num { color: var(--orange-orange-600, #E18709); font-size: 31px; font-weight: 800; } .calc_price { position: absolute; z-index: 15; right: 0; top: 50%; } .calc_price .title { display: flex; flex-direction: column; align-items: center; gap: 16px; padding: 32px 16px; cursor: pointer; background: url("/local/templates/forvarddom/css/../img/ico/calc_subtract.svg") no-repeat left top/cover; } .calc_price .title .calc_img { width: 32px; } .calc_price .title .close, .calc_price .title .arr { display: none; } .calc_price .title .text { color: #FFF; text-align: center; font-size: 16px; font-weight: 700; line-height: 130%; /* 20.8px */ display: flex; flex-direction: column; gap: 8px; } .calc_price .title .text .name { text-transform: uppercase; } .calc_price .title .text .subname { display: none; font-weight: 600; line-height: 140%; font-size: 16px; } .calc_price .title.active { flex-direction: row; justify-content: center; gap: 47px; padding: 32px 16px 24px; background: url("/local/templates/forvarddom/css/../img/ico/calc_subtract_full.svg") no-repeat left top/cover; -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); -webkit-clip-path: inset(0 0 0 0 round 48px 0 0 0); clip-path: inset(0 0 0 0 round 48px 0 0 0); } .calc_price .title.active .calc_img { width: 56px; } .calc_price .title.active .close { display: block; width: 20px; position: absolute; top: 20px; right: 20px; } .calc_price .title.active .text { text-align: left; font-size: 32px; } .calc_price .title.active .text br { display: none; } .calc_price .title.active .text .subname { display: block; } .calc_price .content { display: none; padding: 32px 40px; border-radius: 12px 0px 0px 32px; background: #FFF; box-shadow: 0px 6px 12px 0px rgba(0, 0, 0, 0.25); } .calc_price .content .calc_widget_form_wrap { display: flex; flex-direction: column; gap: 24px; padding-bottom: 20px; padding-right: 1px; } .calc_price .content .calc_widget_form_wrap .line { display: flex; align-items: flex-end; gap: 60px; } .calc_price .content .calc_widget_form_wrap .line .point { flex-basis: 180px; font-size: 24px; font-weight: 700; line-height: 140%; /* 33.6px */ text-transform: uppercase; } .calc_price .content .calc_widget_form_wrap .line .value { flex: 1; } .calc_price .content .calc_widget_form_wrap .line .value .cell_label { color: #8E8E8E; font-size: 14px; line-height: 140%; /* 19.6px */ margin-bottom: 16px; margin-left: 24px; } .calc_price .content .calc_widget_form_wrap .line .value .cell_input_area { /* max-width: 370px; */ } .calc_price .content .calc_widget_form_wrap .line .value .cell_input_area .range_wrap { justify-content: space-between; font-size: 20px; } .calc_price .content .calc_widget_form_wrap .line .value .main_btn { margin-top: 8px; } .widget_material { position: absolute; z-index: 14; top: 200px; right: 0; display: flex; align-items: start; } .widget_material .ico { padding: 15px 14px 14px 21px; border-radius: 85px 0 0 85px; background: #FAA11D; cursor: pointer; transition: .3s; } .widget_material .ico img { display: block; } .widget_material .wrap { display: none; border-left: 10px solid #FAA11D; border-bottom-left-radius: 12px; background: rgba(226, 228, 232, 0.8); padding-bottom: 20px; } .widget_material .wrap .list { display: flex; flex-direction: column; } .widget_material .wrap .list .item { transition: none; text-decoration: none; cursor: pointer; display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 12px 16px; color: #4A5267; text-align: center; font-size: 12px; font-weight: 500; line-height: 1.5; } .widget_material .wrap .list .item:hover { background-color: #B2B7C2; } .widget_material .wrap .list .item.active { background: #FAA11D; color: white; } .widget_material .wrap .list .item img { width: 51px; } .card_top_info { display: grid; grid-template-columns: 1fr 432px; gap: 40px; } .card_top_info .main_ing_wrap { position: relative; } .card_top_info .main_ing_wrap:before { content: ""; z-index: 1; background: url("/local/templates/forvarddom/css/../img/ico/frame.svg") no-repeat 0 0/cover; width: 100px; height: 100px; position: absolute; top: -1px; left: -1px; } .card_top_info .main_ing_wrap .card_main_photo img{ width: 100%; height: 100%; object-fit: cover; border-radius: 18px; } .card_top_info .main_ing_wrap .card_main_img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; border-radius: 18px; } .card_top_info .cell_wrap { display: flex; flex-direction: column; } .card_top_info .cell_wrap .line { display: flex; flex-wrap: wrap; gap: 10px 15px; margin-bottom: 24px; } .card_top_info .cell_wrap .line .name { font-size: 24px; font-weight: 700; line-height: 130%; /* 31.2px */ max-width: 144px; } .card_top_info .cell_wrap .line .price { flex: 1; border-radius: 12px; border: 1px solid var(--LghtGrey-LghtGrey-500, #CACDD5); padding: 8px 16px; display: flex; align-items: center; justify-content: space-between; gap: 5px; } .card_top_info .cell_wrap .line .price .point { color: var(--DrkBlue-DrkBlue-400, #525C76); font-size: 16px; font-weight: 600; line-height: 140%; /* 22.4px */ } .card_top_info .cell_wrap .line .price .value { font-size: 20px; font-weight: 700; line-height: 140%; /* 28px */ } .card_top_info .cell_wrap .fasad_label { color: var(--DrkBlue-DrkBlue-400, #525C76); text-align: center; font-size: 18px; font-weight: 600; line-height: 160%; margin-top: auto; /* 28.8px */ } .card_top_info .cell_wrap .fasad_photo { margin-top: 16px; display: grid; grid-template-columns: 1fr 1fr; gap: 20px; } .card_top_info .cell_wrap .fasad_photo .item { /* background: url("/local/templates/forvarddom/css/../img/ico/fasad_1.svg") no-repeat center/contain; */ /* width: 213px; */ /* height: 142px; */ width: 200px; height: 130px; display: flex; justify-content: center; align-items: center; border: 2px solid #A4A9B6; border-radius: 16px; overflow: hidden; } /*.card_top_info .cell_wrap .fasad_photo .item:nth-child(2) {background-image: url("/local/templates/forvarddom/css/../img/ico/fasad_2.svg");}.card_top_info .cell_wrap .fasad_photo .item:nth-child(3) {background-image: url("/local/templates/forvarddom/css/../img/ico/fasad_3.svg");}.card_top_info .cell_wrap .fasad_photo .item:nth-child(4) {background-image: url("/local/templates/forvarddom/css/../img/ico/fasad_4.svg");}*/ .card_top_info .cell_wrap .fasad_photo .item img { /* max-width: 200px; */ /* mix-blend-mode: multiply; */ } .review_wrap { margin-top: 96px; } .card_params_wrap { margin: 48px 0; } .card_params_wrap .params_title { text-align: center; margin-bottom: 32px; color: var(--DrkBlue-DrkBlue-400, #525C76); font-size: 28px; font-weight: 600; line-height: 150%; /* 42px */ } .card_params_wrap .params_block { display: grid; grid-template-columns: repeat(6, 1fr); gap: 24px; } .card_params_wrap .params_block .item { padding: 16px; border-radius: 8px; border: 1px solid var(--LghtGrey-LghtGrey-600, #B2B7C2); display: flex; flex-direction: column; align-items: flex-start; gap: 12px; } .card_params_wrap .params_block .item img { height: 40px; } .card_params_wrap .params_block .item .name { font-size: 12px; line-height: 140%; /* 16.8px */ } .card_params_wrap .params_block .item .value { font-size: 16px; font-weight: 700; line-height: 160%; /* 25.6px */ } .plan_estimate_grid { display: grid; grid-template-columns: 1fr 480px; gap: 32px; } .card_plans { border-radius: 32px; border: 2px solid var(--LghtGrey-LghtGrey-700, #A4A9B6); padding: 16px; display: flex; align-items: center; position: relative; } .card_plans .mob_title { color: #615C55; font-size: 16px; font-weight: 600; line-height: 1.3; align-self: start; display: none; } .card_plans .roll { color: #49536E; font-size: 12px; font-weight: 500; line-height: 1.5; position: absolute; top: 10px; right: 16px; display: none; } .card_plans .roll span { margin-right: 8px; } .card_plans .roll img { vertical-align: middle; } .card_plans .one { text-decoration: none; color: black; } .card_plans .one .title { text-align: center; font-size: 22px; font-weight: 600; line-height: 130%; /* 28.618px */ margin-bottom: 30px; } .card_estimate { border-radius: 32px; border: 4px solid var(--Orange-Orange-400, #F5BB56); } .card_estimate .info { padding: 30px 50px 55px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 40px; } .card_estimate .info .text { font-size: 16px; font-weight: 600; line-height: 140%; /* 22.4px */ } .card_complect { margin: 80px 0; } .card_complect .card_complect_title { text-align: center; font-size: 32px; font-weight: 700; line-height: 120%; /* 38.4px */ text-transform: uppercase; margin-bottom: 32px; } .card_complect_table tr { display: grid; grid-template-columns: 256px 1fr 1fr; } .card_complect_table tr:nth-child(odd) { background: var(--LghtGrey-LghtGrey-200, #F5F6F7); } .card_complect_table tr.tr_head { background: none; } .card_complect_table tr.tr_head td { border: 1px solid #747C90; color: var(--DrkBlue-DrkBlue-300, #5C657D); font-size: 18px; padding: 20px 24px; background: var(--LghtGrey-LghtGrey-500, #CACDD5); } .card_complect_table tr.tr_head td:first-child { border-top-left-radius: 12px; align-self: end; } .card_complect_table tr.tr_head td:nth-child(2) { border-top-left-radius: 12px; } .card_complect_table tr.tr_head td:last-child { border-top-right-radius: 12px; } .card_complect_table tr.tr_head td.compl_cell { display: flex; align-items: center; gap: 20px; border: 2px solid var(--DrkBlue-DrkBlue-100, #747C90); background: var(--LghtGrey-LghtGrey-800, #959CAB); padding: 16px; } .card_complect_table tr.tr_head td.compl_cell .text { color: white; font-weight: 700; text-align: center; } .card_complect_table tr.tr_head td.compl_cell .text .price { font-size: 42px; line-height: 120%; /* 50.4px */ white-space: nowrap; } .card_complect_table tr.tr_head td.compl_cell .text .type { font-size: 18px; line-height: 130%; /* 23.4px */ text-transform: uppercase; margin-top: 8px; } .card_complect_table tr.tr_head td.compl_cell.finish_cell { border-color: #E18709; background: var(--Orange-Orange-600, #E18709); } .card_complect_table tr:last-child td:first-child { border-bottom-left-radius: 12px; } .card_complect_table tr:last-child td:last-child { border-bottom-right-radius: 12px; border-bottom: 4px solid #E18709; } .card_complect_table td { font-size: 12px; line-height: 130%; /* 15.6px */ border-bottom: 1px solid #A4A9B6; border-right: 1px solid #A4A9B6; padding: 30px 24px; display: flex; align-items: center; } .card_complect_table td:first-child { font-weight: 700; text-transform: uppercase; border-left: 1px solid #A4A9B6; } .card_complect_table td:nth-child(2) { border-right: none; } .card_complect_table td:last-child { border-left: 4px solid #E18709; border-right: 4px solid #E18709; } .card_complect_table td .ico { margin: auto; display: block; } .three_btn_block { display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); gap: 20px 50px; } .similar_project_wrap { margin: 100px 0; } .similar_project .slick-track { padding-bottom: 13px; } .similar_project .project_one { box-shadow: 0px 5px 10px 0px rgba(15, 29, 64, 0.24); margin: 0 8px; min-width: auto; } .consult_mortgage_wrap { display: grid; grid-template-columns: 1fr 300px; gap: 64px; margin: 120px 0; } .tac { text-align: center; } .consult_form_wrap { display: flex; max-width: 922px; padding: 60px 50px 60px 290px; position: relative; margin: 32px auto 0; border-radius: 32px; background: var(--LghtGrey-LghtGrey-200, #F5F6F7); box-shadow: 0px 20px 36px -10px rgba(15, 29, 64, 0.24); } .consult_form_wrap .img_worker { position: absolute; left: -30px; bottom: 0; } .consult_form_wrap .form_content { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 24px 16px; } .consult_form_wrap .form_content .main_input { background: white; } .consult_form_wrap .form_content .float_label label { background-color: #fff; } .consult_form_wrap .form_content .agree_block { margin: 0; } .consult_form_wrap .form_content img { display: block; } .card_complect_table_wrap { overflow: auto; } .portfolio_cat_list { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; } .portfolio_cat_one { flex: 1; display: flex; flex-direction: column; gap: 16px; text-decoration: none; border-radius: 16px; background: var(--lght-grey-lght-grey-200, #F5F6F7); box-shadow: 0px 10px 20px 0px rgba(15, 29, 64, 0.24); padding: 16px; position: relative; } .portfolio_cat_one .shevron { position: absolute; top: 16px; left: 16px; width: 160px; height: 160px; padding: 15px 18px; background: rgba(254, 142, 30, 0.8); border-top-left-radius: 8px; -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 0%, 0% 100%); clip-path: polygon(0% 0%, 100% 0%, 100% 0%, 0% 100%); color: white; } .portfolio_cat_one .shevron .num { font-size: 18px; line-height: 1; font-weight: 600; padding: 5px 12px; border: 2px solid white; display: inline-block; border-radius: 4px; } .portfolio_cat_one .shevron .text { font-size: 12px; font-weight: 500; margin-top: 8px; } .portfolio_cat_one .img { -o-object-fit: cover; object-fit: cover; width: 100%; height: 264px; border-radius: 8px; } .portfolio_cat_one .material { position: absolute; top: 106px; right: 43px; width: 146px; height: 146px; background: url("/local/templates/forvarddom/css/../img/ico/material_frame.svg") no-repeat center/contain; } .portfolio_cat_one .material img { width: 96px; top: 50%; left: 50%; transform: translate(-50%, -50%); position: absolute; } .portfolio_cat_one .info { display: flex; align-items: center; gap: 16px; padding-left: 16px; } .portfolio_cat_one .info .name { color: #2C3857; font-size: 22px; font-weight: 700; line-height: 1.4; text-transform: uppercase; width: 200px; } .portfolio_cat_one .info .descr { color: #666666; font-size: 12px; line-height: 16px; flex: 1; } .portfolio_cat_one .info .arr { border: 2px solid #5C657D; position: relative; width: 48px; height: 120px; border-radius: 8px; } .portfolio_cat_one .info .arr img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 6px; } .three_pillars_sec { margin-top: 64px; } .three_pillars_sec .title { font-size: 36px; line-height: 120%; color: #292929; text-align: center; margin-bottom: 12px; font-weight: bold; } .three_pillars_sec .main_pillar { margin: auto; display: block; } .three_pillars { display: flex; } .three_pillars .one { flex: 1; position: relative; text-align: center; display: flex; flex-direction: column; gap: 16px; padding-top: 16px; } .three_pillars .one img { display: none; } .three_pillars .one .text { font-size: 24px; line-height: 1.2; font-weight: 600; } .sort_area { margin: 50px auto 40px; display: flex; justify-content: center; align-items: center; gap: 8px; } .sort_area .text { font-size: 16px; line-height: 140%; margin-right: 16px; font-weight: 600; } .sort_area .arr { border: 1px solid #B2B7C2; border-radius: 3px; width: 40px; height: 40px; position: relative; cursor: pointer; } .sort_area .arr.area_desc { transform: rotate(180deg); } .sort_area .arr.active { border-color: #E18709; } .sort_area .arr:not(.active) img { filter: invert(1) grayscale(1); } .sort_area .arr img { position: absolute; top: 50%; left: 50%; top: 50%; left: 50%; transform: translate(-50%, -50%); } .portfolio_list { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 32px 16px; } .portfolio_list_one { flex: 1; display: flex; flex-direction: column; text-decoration: none; border-radius: 16px; background: var(--lght-grey-lght-grey-200, #F5F6F7); box-shadow: 0px 10px 20px 0px rgba(15, 29, 64, 0.24); padding: 16px; position: relative; } .portfolio_list_one .img { -o-object-fit: cover; object-fit: cover; width: 100%; height: 280px; border-radius: 8px 8px 0 0; } .portfolio_list_one .info { display: flex; flex-direction: column; gap: 16px; padding: 16px; } .other_project .portfolio_list_one .info { padding: 16px 0 8px; } .other_project .portfolio_list_one .info .params { gap: 8px; } .other_project .portfolio_list_one .info .params .item { flex: 1; justify-content: space-between; } .other_project .portfolio_list_one .info .params .item img { width: 32px; } .other_project .portfolio_list_one .info .params .item .value { padding-left: 0; white-space: nowrap; } .portfolio_list_one .info .name { color: #141414; font-size: 18px; font-weight: 500; line-height: 1.4; } .portfolio_list_one .info .params { display: flex; gap: 16px; } .portfolio_list_one .info .params .item { border: 1px solid #B2B7C2; border-radius: 8px; padding: 8px; display: flex; flex-direction: column; gap: 8px; color: #141414; } .portfolio_list_one .info .params .item .point { display: flex; align-items: center; gap: 8px; font-size: 12px; line-height: 140%; } .portfolio_list_one .info .params .item .point img { width: 16px; } .portfolio_list_one .info .params .item .value { font-size: 16px; line-height: 160%; font-weight: bold; padding-left: 24px; } .portfolio_list_one .info .link { text-align: center; font-size: 17px; line-height: 130%; font-weight: bold; color: #49536E; padding: 12px 15px; border-radius: 32px; border: 1px solid #E18709; background-color: #fff; box-shadow: 0px 5px 10px 0px rgba(15, 29, 64, 0.15); text-decoration: none; } .single_consult { margin-top: 72px; } .single_consult .sec_title { text-align: center; } .portfolio_slider_wrap { position: relative; display: flex; flex-direction: row-reverse; gap: 64px; } .portfolio_slider_wrap .portfolio_nav { margin: auto; position: static; } .portfolio_slider_wrap .portfolio_nav .item { margin: 8px 0; height: 72px; border: 0; cursor: pointer; } .portfolio_slider_wrap .portfolio_nav .item img { border-radius: 6px; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .portfolio_slider_wrap .portfolio_nav .slick-arrow { position: absolute; top: auto; bottom: 0; left: 0; background: url("/local/templates/forvarddom/css/../img/ico/arr_nav.svg") no-repeat center; border: 2px solid #FAA11D; border-radius: 8px; width: 112px; height: 32px; } .portfolio_slider_wrap .portfolio_nav .slick-arrow.slick-prev { transform: rotate(180deg); top: 0; } .portfolio_slider_wrap .portfolio_main { width: calc(100% - 176px); } .portfolio_slider_wrap .portfolio_main .item { height: 504px; } .portfolio_slider_wrap .portfolio_main .item img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; border-radius: 12px; } .portfolio_info { display: grid; grid-template-columns: auto 53%; gap: 40px; margin: 56px 0; } .portfolio_info .portfolio_params_block .title { font-size: 28px; line-height: 1.2; font-weight: bold; margin-bottom: 16px; text-align: right; } .portfolio_descr { border: 1px solid #807970; border-radius: 32px; background-color: #F5F6F7; text-align: center; padding: 32px; display: flex; flex-direction: column; justify-content: center; } .portfolio_descr .title { font-size: 28px; line-height: 1.2; font-weight: bold; } .portfolio_descr .text { font-size: 14px; line-height: 20px; max-width: 330px; margin: 10px auto 0; } .portfolio_table td { width: 43%; padding: 8px 24px; font-size: 12px; line-height: 16px; border: 1px solid #CACDD5; } .portfolio_table td:last-child { width: 57%; font-weight: bold; text-align: right; } .example_calc_wrap { display: grid; grid-template-columns: 1fr 263px; align-items: end; gap: 32px; margin: 56px 0; } .example_calc_wrap .example_wrap .title { font-size: 28px; line-height: 1.2; font-weight: bold; text-align: center; margin-bottom: 16px; } .example_project { border: 2px solid #F5BB56; border-radius: 32px; padding: 16px; display: grid; grid-template-columns: 400px 400px; gap: 30px; min-height: 400px; } .example_project .img_block .main_img { height: 264px; position: relative; } .example_project .img_block .main_img>img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; border-radius: 8px; } .example_project .img_block .main_img .shevron { position: absolute; top: 0; left: 0; width: 160px; height: 160px; padding: 15px 18px; background: rgba(254, 142, 30, 0.8); border-top-left-radius: 8px; -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 0%, 0% 100%); clip-path: polygon(0% 0%, 100% 0%, 100% 0%, 0% 100%); } .example_project .img_block .main_img .shevron img { width: 32px; margin-bottom: 10px; display: block; } .example_project .img_block .main_img .shevron .text { color: var(--LghtGrey-LghtGrey-100, #FAFAFB); font-size: 12px; font-weight: 500; line-height: 120%; /* 14.4px */ } .example_project .img_block .fasad_photo { margin-top: 24px; display: flex; gap: 17px; } .example_project .img_block .fasad_photo .item { background: url("/local/templates/forvarddom/css/../img/ico/fasad_1.svg") no-repeat center/contain; width: 88px; height: 64px; display: flex; justify-content: center; align-items: center; } .example_project .img_block .fasad_photo .item:nth-child(2) { background-image: url("/local/templates/forvarddom/css/../img/ico/fasad_2.svg"); } .example_project .img_block .fasad_photo .item:nth-child(3) { background-image: url("/local/templates/forvarddom/css/../img/ico/fasad_3.svg"); } .example_project .img_block .fasad_photo .item:nth-child(4) { background-image: url("/local/templates/forvarddom/css/../img/ico/fasad_4.svg"); } .example_project .img_block .fasad_photo .item img { max-width: 80px; mix-blend-mode: multiply; } .example_project .info { display: flex; flex-direction: column; gap: 16px; padding-top: 24px; } .example_project .info .name { font-size: 32px; line-height: 1.2; font-weight: bold; } .example_project .info .type { font-size: 18px; line-height: 1.2; font-weight: 500; } .example_project .info .text { font-size: 12px; line-height: 1.3; } .example_project .info .params { display: flex; justify-content: space-between; align-items: flex-end; } .example_project .info .params .cell .size { display: flex; gap: 16px; color: var(--brown-brown-800, #615C55); font-weight: 500; line-height: 140%; align-items: center; } .example_project .info .params .cell .scale { display: flex; gap: 12px; padding: 8px; border-radius: 8px; border: 1px solid var(--brown-brown-500, #BDB3A6); color: var(--drk-blue-drk-blue-600, #3A4662); font-size: 28px; font-weight: 700; line-height: 130%; margin-top: 8px; } .example_project .info .params .cell .price { color: var(--drk-blue-drk-blue-600, #3A4662); font-size: 28px; font-weight: 500; line-height: 150%; text-align: right; } .example_project .info .params .cell .cost { margin-top: 8px; color: var(--brown-brown-700, #807970); text-align: right; font-size: 18px; font-weight: 500; line-height: 160%; } .example_project .info .main_btn { margin-top: auto; } .calc_frame { width: 266px; height: 400px; position: relative; padding: 20px; text-align: center; color: white; } .calc_frame img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; position: absolute; top: 0; left: 0; z-index: -1; } .calc_frame .title { font-size: 24px; line-height: 32px; font-weight: bold; text-transform: uppercase; } .calc_frame .text { font-size: 12px; line-height: 1.3; margin-top: 65px; } .other_project_wrap { margin: 96px 0; } .other_project { padding: 0 0 16px; } .other_project .slick-track { padding-bottom: 13px; } .other_project .portfolio_list_one { margin: 0 8px; box-shadow: 0px 5px 10px 0px rgba(15, 29, 64, 0.24); } .hexagon_sec { background: url("/local/templates/forvarddom/css/../img/hexagon_bg.png") no-repeat 100% -230px; } .hexagon_material { background: url("/local/templates/forvarddom/css/../img/hexagon_material.jpg") no-repeat center/contain; width: 735px; height: 768px; margin: auto; text-align: center; padding: 360px 190px 0; } .hexagon_material img { display: none; } .benefits_sec { background: url("/local/templates/forvarddom/css/../img/benefit_bg.svg") no-repeat 100% 77px; } .benefits_sec .title { font-size: 42px; line-height: 1.25; font-weight: bold; } .benefits_wrap { max-width: 1100px; margin: auto; } .benefits { display: flex; flex-direction: column; gap: 20px; } .benefits .item { display: flex; flex-direction: column; justify-content: space-between; gap: 20px; } .benefits .item:nth-child(1) .info .num { color: #FA971D; } .benefits .item .info .num { color: #6D7997; font-size: 60px; line-height: 1.2; font-weight: bold; } .benefits .item .info .name { font-size: 20px; line-height: 1.3; font-weight: 600; } .benefits .item .info .text { font-size: 14px; line-height: 1.4; margin-top: 8px; } .benefits .item .info .img_mob { display: none; } .fw500 { font-weight: 500; } .mission_principles { max-width: 900px; margin: auto; font-size: 20px; line-height: 1.4; text-align: center; } .mission_principles p+p { margin-top: 40px; } .mission_grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 40px; margin-top: 40px; } .mission_grid .item { display: flex; align-items: start; gap: 40px; padding: 24px; } .mission_grid .item img { width: 64px; } .mission_grid .item .text { flex: 1; font-size: 14px; line-height: 20px; } .reliable_dev .sec_title { max-width: 960px; margin: auto; } .reliable_dev .subtitle { font-size: 20px; line-height: 1.4; max-width: 960px; margin: 48px auto; } .reliable_dev .subtitle_1 { max-width: 960px; margin: auto; text-align: center; font-size: 20px; line-height: 1.4; } .reliable_dev .subtitle_2 { font-size: 28px; line-height: 1.5; font-weight: 600; margin: 72px auto 16px; max-width: 880px; text-align: center; } .numbers_block { position: relative; border: 2px solid #9E968B; border-radius: 32px; padding: 24px 32px 48px; display: grid; grid-template-columns: 1fr 1fr; gap: 20px 40px; max-width: 1140px; margin: 64px auto; } .numbers_block .title { position: absolute; top: 0; left: 50%; transform: translate(-50%, -50%); font-size: 28px; line-height: 1.5; font-weight: 600; padding: 0 20px; background-color: #fff; color: #3D3D3D; white-space: nowrap; } .numbers_block .item { display: flex; align-items: center; gap: 24px; padding: 16px 24px; } .numbers_block .item .num { font-size: 72px; line-height: 1.2; font-weight: bold; color: #FA971D; width: 168px; text-align: center; } .numbers_block .item .num.n84 { font-size: 84px; } .numbers_block .item .num.n64 { font-size: 64px; } .numbers_block .item .num.n120 { font-size: 120px; } .numbers_block .item .text { flex: 1; } .talk_girl { display: flex; align-items: center; gap: 20px 64px; max-width: 1080px; margin: auto; } .talk_girl .text { flex: 1; } .talk_girl .text .first { font-size: 28px; line-height: 1.5; } .talk_girl .text .second { font-size: 20px; line-height: 1.4; margin-top: 24px; } .float_filter { display: none; position: sticky; z-index: 12; top: 56px; width: 100%; background-color: #F5F6F7; padding: 8px; } .float_filter .listing_filter { margin-top: 24px; } .float_filter .info { display: flex; border: 1px solid #A3A3A3; padding: 8px 15px; border-radius: 3px; font-size: 16px; font-weight: 600; line-height: 1.4; gap: 15px; } .float_filter .info .text { color: #615C55; } .float_filter .info .num { color: #C37002; } .float_filter .info .change { font-size: 12px; font-weight: 500; line-height: 1.5; color: #49536E; display: flex; align-items: center; margin-left: auto; gap: 10px; } .float_filter .listing_info { display: none; margin: -8px; } .float_filter .roll { border: 1px solid #A3A3A3; padding: 8px 15px; border-radius: 3px; color: #615C55; font-weight: 600; display: flex; justify-content: center; align-items: center; gap: 10px; width: 208px; margin: 30px auto 15px; } .float_filter .roll img { transform: rotate(180deg); } .call_me_float { position: fixed; z-index: 100; transition: .8s; transition-timing-function: ease-in-out; top: 260px; right: -600px; border-radius: 12px 0 0 48px; box-shadow: 0px 6px 12px 0px #00000040; overflow: hidden; min-width: 560px; } .call_me_float.active { right: 0; } .call_me_float .title_line { background: #E59422; display: flex; padding: 16px 32px; } .call_me_float .title_line .close { background: #E59422; display: flex; align-items: center; width: 40px; border-right: 1px solid #FFFFFF80; cursor: pointer; } .call_me_float .title_line .text_block { text-align: center; color: white; flex: 1; padding: 16px 0; } .call_me_float .title_line .text_block .title { font-size: 32px; font-weight: 700; line-height: 1.3; text-transform: uppercase; } .call_me_float .title_line .text_block .text { font-size: 16px; font-weight: 600; line-height: 1.4; } .call_me_float .form_block { background-color: #fff; padding: 40px 50px; } .call_me_float .form_block .form_wrap { display: flex; flex-direction: column; gap: 24px; } .call_me_float .form_block .form_wrap .line { display: flex; align-items: center; gap: 10px 27px; } .call_me_float .form_block .form_wrap .line .line_label { flex-basis: 120px; color: black; font-size: 20px; font-weight: 700; line-height: 1.4; text-align: right; text-transform: uppercase; } .call_me_float .form_block .form_wrap .line .line_input { flex: 1; } .call_me_float .form_block .form_wrap .line .main_input { padding: 14px 22px; border-radius: 16px; line-height: 18px; border-color: #B8B8B8; } .call_me_float .form_block .form_wrap .btn_line { margin-top: 16px; } .nav_menu .item a:hover { color: inherit; } .form_search_wrap { display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); gap: 16px; } .form_search_wrap .main_input { border-radius: 85px; padding: 18px; } .form_search_wrap .nice_select { border-radius: 85px; height: 56px; line-height: 56px; padding-right: 40px; font-size: 16px; border: 1px solid #7D7D7D; } .test_btn_block { max-width: 300px; margin: auto; display: grid; grid-template-columns: 1fr; gap: 16px; } .simple_table { overflow: auto; } .simple_table table { font-size: 16px; width: 100%; border-top-left-radius: 24px; border-top-right-radius: 24px; overflow: hidden; } .simple_table th { color: white; } .simple_table th, .simple_table td { padding: 24px; border: 1px solid #dedede; } .simple_table tr:nth-child(odd) { background: #F7F7F7; } .simple_table tr:first-child { background: #FF9900; } .simple_sec ul { list-style: disc; padding-left: 20px; margin: 16px 0; } .simple_sec ul li+li { margin-top: 7px; } .simple_sec .calc_price { margin: 50px 0; } .sec_title.intext_title { margin: 40px 0 20px; } .text_description { margin: 50px 0; } .card_description { margin: 50px 0; } .service_main_sec .comfort_list{ flex-wrap: wrap; justify-content: center; max-width: 700px; margin: 16px auto 0; } .portfolio_table { width: 100%; } .nav_menu .item a { text-decoration: none; position: relative; z-index: 1; } .nav_menu .submenu .item a:hover { color: unset; } .listing_info .info_block .cell .list .point.active a{ color: #E18709; pointer-events: none; text-decoration: none; } .calc_price.calc_price_popup{ position: fixed; top: 72px; right: -800px; transition: .8s; transition-timing-function: ease-in-out; } .calc_price.calc_price_popup.active { right: 0; } .simple_p{ font-size: 18px; line-height: 1.4; margin: 24px 0; } .brd_left{ border-left: 4px solid #E18709; padding-left: 24px; margin: 40px 0; font-size: 20px; font-weight: 500; line-height: 1.4; } .new_grid_3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 48px; } .new_grid_2 { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; } .advantage_one { border-radius: 8px; border: 2px solid #E2E4E8; } .advantage_one .point{ font-size: 22px; font-weight: 700; line-height: 1.4; padding: 24px 10px; text-align: center; border-bottom: 2px solid #E2E4E8; } .advantage_one .point.ico{ padding: 40px 10px; } .advantage_one .point.ico img{ margin: 0 auto 32px; display: block; } .advantage_one .value{ font-size: 16px; line-height: 1.4; padding: 24px; } .advantage_one_simple { border-radius: 8px; border: 2px solid #E2E4E8; font-size: 22px; font-weight: 700; line-height: 1.4; padding: 40px; text-align: center; display: flex; flex-direction: column; } .advantage_one_simple img{ margin: 0 auto 32px; display: block; } .advantage_one_simple .point{ display: flex; align-items: center; justify-content: center; flex: 1; } main .ul_modern, main .ol_modern{ list-style: none; display: flex; flex-direction: column; gap: 24px; font-size: 16px; line-height: 1.4; margin: 24px 0 40px; padding: 0 !important; } main .ol_modern{ counter-reset: modern; } main .ul_modern li, main .ol_modern li{ padding: 10px 24px; padding-left: 88px; border: 2px solid #E2E4E8; position: relative; border-radius: 8px; min-height: 64px; display: flex; align-items: center; margin: 0 !important; } main .ul_modern li:before, main .ol_modern li:before{ font-weight: 700; font-size: 22px; text-align: center; background: #E2E4E8; position: absolute; top: 0; left: 0; width: 64px; height: 100%; display: flex; justify-content: center; align-items: center; } main .ul_modern li:before{ content: '•'; } main .ol_modern li:before{ counter-increment: modern; content: counter(modern); } .double_wrap{ display: flex; gap: 24px 48px; margin: 40px 0; } .double_wrap > div{ flex: 1; margin: 0; } .i_block{ background: #E187090A; border: 2px solid #E18709; padding: 24px; display: flex; align-items: center; gap: 24px; font-size: 18px; line-height: 1.4; border-radius: 8px; margin: 40px 0; } .num_point{ display: flex; align-items: center; gap: 24px; } .num_point .num{ font-size: 64px; font-weight: 700; line-height: 1; text-align: center; color: #E18709; padding: 40px 10px; width: 180px; border: 2px solid #E2E4E8; border-radius: 8px; } .num_point .point{ flex: 1; font-size: 16px; line-height: 1.4; } .map{ height: 640px; } .contact_block_wrap + .map{ margin-top: 80px; } .contact_block_wrap{ display: grid; grid-template-columns: 1fr 500px; align-items: center; gap: 80px } .contact_info_wrap{ background: #FBF7F2; padding: 48px 40px; border-radius: 16px; } .contact_info { display: grid; gap: 32px; } .contact_info .point { display: flex; align-items: start; gap: 16px; font-size: 24px; line-height: 140%; } .contact_info .point .schedule { font-size: 16px; } .contact_info .point .phone { font-weight: 700; display: block; text-decoration: none; } .contact_info .point img { width: 32px; } .contact_title{ font-size: 24px; font-weight: 700; line-height: 2; margin-bottom: 24px; text-transform: uppercase; } .contact_form .form_wrap{ display: flex; flex-direction: column; gap: 16px; } .contact_form .form_wrap .btn_wrap{ align-self: start; } .num_404{ color: #FAA11D; text-align: center; margin: 30px auto; font-size: 150px; font-weight: bold; } .text_404{ text-align: center; margin: 50px auto; } .sec_404 .main_btn{ max-width: 360px; margin: auto; } .slider_arr_side .slick-arrow{ top: 50%; right: 16px; transform: translateY(-50%); } .slider_arr_side .slick-arrow.slick-prev{ left: 16px; transform: translateY(-50%) rotate(180deg); } .listing_info .listing_filter.listing_filter_dev { grid-template-columns: 1fr 1fr; gap: 16px; } .listing_info .listing_filter.listing_filter_dev .cell_wrap_6 { grid-column: 2 span; } .multi_points{ position: relative; } .multi_points_value{ width: 100%; border-radius: 3px; border: 1px solid var(--drk-grey-drk-grey-100, #B8B8B8); color: var(--drk-grey-drk-grey-800, #292929); font-size: 16px; font-weight: 600; line-height: 140%; height: 40px; line-height: 38px; background: white; position: relative; transition: .3s; padding: 0 18px; cursor: pointer; } .multi_points_value:before{ content: ""; position: absolute; border-radius: 2px; border-color: #FAA11D; border: 3px solid #FAA11D; border-top: none; border-left: none; width: 6px; height: 6px; margin-top: -6px; top: 50%; right: 18px; transition: all 0.15s ease-in-out; transform-origin: 66% 66%; transform: rotate(45deg); } .multi_points_value.active:before{ transform: rotate(-135deg); } .multi_points_wrap{ position: absolute; display: none; width: 100%; background: white; border-radius: 3px; border: 1px solid var(--drk-grey-drk-grey-100, #B8B8B8); transform: translateY(2px); z-index: 10; } .multi_points .main_checkbox { margin: 0; } .multi_points .main_checkbox + .main_checkbox { border-top: 1px solid #b8b8b8; } .multi_points .main_checkbox label { font-size: 16px; line-height: 24px; font-weight: 500; color: #666; padding: 8px 16px 8px 48px; width: 100%; transition: .3s; } .multi_points .main_checkbox label:before { left: 16px; } .multi_points .main_checkbox input:checked + label { background: #F0F0F0; color: #292929; font-weight: 600; } .multi_points .main_checkbox label:hover { background: #F0F0F0; } .filter_popup{ position: fixed; top: 0; right: 0; height: 100vh; z-index: 100; display: none; } .filter_popup:before{ content: ""; position: fixed; top: 0; right: 0; width: 100vw; height: 100vh; background: #00000080; } .filter_popup_wrap{ padding: 24px; background-color: #fff; display: flex; flex-direction: column; gap: 24px; position: relative; width: 400px; height: 100%; } .filter_popup_wrap .title_block{ display: flex; justify-content: space-between; align-items: center; } .filter_popup_wrap .title_block .title{ font-size: 24px; font-weight: 700; line-height: 33.6px; } .filter_popup_wrap .title_block .close{ cursor: pointer; display: flex; } .filter_popup_wrap .cell_wrap + .cell_wrap { margin-top: 32px; } .filter_popup_wrap .label { font-size: 16px; } .filter_popup_wrap .result{ width: 100%; position: absolute; left: 0; bottom: 0; background-color: #fff; box-shadow: 0px -1px 12px 0px #00000029; display: flex; justify-content: space-between; align-items: center; padding: 8px 24px; } .filter_popup_wrap .result .info{ font-weight: 700; font-size: 16px; line-height: 1.4; } .filter_popup_wrap .result .info .sum{ color: #FAA11D; } .filter_popup .listing_filter{ height: calc(100vh - 170px); } .over_h{ overflow: hidden !important; } .filter_popup .main_checkbox label { font-size: 14px; line-height: 24px; } .filter_popup .mCSB_scrollTools .mCSB_draggerRail { width: 4px; } .filter_popup .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #989898; } .filter_popup .mCSB_scrollTools .mCSB_draggerRail { background-color: #E0E0E0; } .listing_filter .nice_select .list{ max-height: 450px; overflow: auto; } .main_banner .item{ opacity: 0; } .mfp-fade.mfp-bg { opacity: 0; transition: all 0.5s ease-out; } .mfp-fade.mfp-bg.mfp-ready { opacity: 0.8; } .mfp-fade.mfp-bg.mfp-removing { opacity: 0; } .mfp-fade.mfp-wrap .mfp-content { opacity: 0; transition: all 0.5s ease-out; } .mfp-fade.mfp-wrap.mfp-ready .mfp-content { opacity: 1; } .mfp-fade.mfp-wrap.mfp-removing .mfp-content { opacity: 0; } .banner_nav_link{ position: absolute; top: -150px; opacity: 0; pointer-events: none; transition: .5s; justify-content: center; } .banner_nav_link .ico{ width: 7px; } .slick-current .banner_nav_link{ top: -250px; opacity: 1; pointer-events: auto; } .calc_price.fixed { margin-bottom: 0; } .calc_price.calc_price_popup .content{ max-height: calc(100vh - 300px); overflow: auto; } .bgc_blue{ background: #27334F; color: white; } .new_sec_title { margin-top: 0; margin-bottom: 32px; font-size: 40px; font-weight: 700; line-height: 125%; text-align: left; text-transform: uppercase; } .ico_point{ display: flex; align-items: center; gap: 24px; line-height: 1.4; } .line_sec{ border-top: 1px solid #D9DADD; } .new_ol{ font-size: 14px; line-height: 1.4; counter-reset: unset; } .new_ol li{ counter-increment: new_list; position: relative; padding-left: 32px; } .new_ol li:before{ content: counter(new_list)"."; position: absolute; left: 0; top: -5px; color: var(--Orange, #E18709); font-size: 18px; font-weight: bold; line-height: 1.5; text-align: right; width: 20px; } .new_ol li + li{ margin-top: 22px; } .block_list{ display: grid; grid-template-columns: 400px 1fr; border-radius: 8px; overflow: hidden; margin: 32px 0; } .block_list:first-child{ margin-top: 0; } .block_list:last-child{ margin-bottom: 0; } .block_list .img_wrap{ position: relative; } .block_list .img_wrap .img{ width: 100%; height: 100%; object-fit: cover; /* position: absolute; */ } .list_wrap{ background: #FCF8F2; padding: 24px; color: var(--Black, #212121); } .new_ul{ font-size: 14px; line-height: 1.4; } .new_ul li{ padding-left: 36px; background: url("/images/ico/li.svg") no-repeat left 0; min-height: 24px; padding-top: 3px; } .new_ul li + li{ margin-top: 16px; } .new_ul.like_ul li{ background-image: url("/images/ico/like.svg"); } .new_ul.dislike_ul li{ background-image: url("/images/ico/dislike.svg"); } .block_list_2{ grid-template-columns: 720px 1fr; } .ico_block{ display: flex; gap: 24px; padding: 24px; border: 1px solid #D9DADD; border-radius: 8px; font-size: 18px; font-weight: 700; line-height: 1.6; margin: 32px 0; } .ico_block:last-child{ margin-bottom: 0; } .ico_block .ico{ max-width: 64px; } .new_4_points{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; margin: 32px 0; } .new_ico_point{ display: flex; flex-direction: column; gap: 24px; padding: 24px; border-radius: 8px; border: 1px solid #D9DADD; } .new_ico_point .ico{ width: 64px; } .new_2_points{ display: grid; grid-template-columns: 1fr 1fr; gap: 32px; } .new_3_points{ display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 32px; } .new_point{ display: grid; grid-template-columns: 64px 1fr; align-items: center; gap: 24px; padding: 24px; font-size: 16px; line-height: 1.4; } .new_point .num{ color: #2C3857; font-size: 32px; font-weight: 600; white-space: nowrap; } .new_ico_point_value{ display: grid; grid-template-columns: 64px 1fr; grid-template-rows: auto 1fr; gap: 8px 24px; padding: 24px; font-size: 14px; line-height: 1.4; } .new_ico_point_value .point{ font-weight: bold; } .new_ico_point_value .ico{ grid-row: 2 span; } .new_sec p:first-child{ margin-top: 0; } .new_sec p:last-child{ margin-bottom: 0; } .accent_block{ align-items: center; gap: 30px 80px; padding: 60px; border-radius: 24px; background: #EEF0F4; margin: 80px 0; display: grid; grid-template-columns: auto 510px; } .accent_block:first-child{ margin-top: 0; } .accent_block:last-child{ margin-bottom: 0; } .accent_block .title{ font-size: 32px; font-weight: 700; line-height: 1.2; margin-bottom: 16px; } .accent_block .text_wrap p{ margin: 16px 0; } .new_btn_block{ display: flex; flex-wrap: wrap; gap: 8px; margin: 32px 0; } .new_btn_block > *{ width: auto; } .new_btn_block:last-child{ margin-bottom: 0; } .new_steps { display: grid; grid-template-columns: 1fr; gap: 16px; } .new_step{ display: flex; flex-direction: column; gap: 8px; padding: 16px; border-radius: 8px; background: #EEF0F4; line-height: 1.4; position: relative; font-size: 14px; } .new_step .num{ font-size: 40px; font-weight: 700; line-height: 1; color: #E18709; } .new_step .name{ font-weight: 600; font-size: 16px; } .new_review{ padding: 32px; border-radius: 8px; background: #EEF0F4; font-size: 18px; line-height: 1.6; } .new_reviews_wrap{ margin: 0 -15px; } .new_reviews_wrap .slick-track{ display: flex; } .new_reviews_wrap .new_review{ margin: 0 15px; height: auto; } .slick-slider ul{ list-style: none !important; } .slick-slider ul li+li { margin-top: 0 !important; } .faq{ border-top: 1px solid #D9DADD; margin: 40px 0; } .faq_one{ padding: 24px 0; border-bottom: 1px solid #D9DADD; position: relative; font-size: 18px; line-height: 1.5; cursor: pointer; } .faq_one .title{ font-weight: bold; font-size: 20px; padding-right: 40px; } .faq_one .point{ margin-top: 16px; display: none; } .faq_one .arr{ position: absolute; top: 24px; right: 0; transition: .5s; } .faq_one.active .arr{ transform: rotate(180deg); } .table_wrap{ overflow: auto; } .table{ width: 100%; border-radius: 8px; overflow: hidden; } .table td{ line-height: 1.6; padding: 24px; border-right: 1px solid #D9DADD; background: white; color: #212121; } .table tr:first-child td{ font-size: 24px; } .table tr:nth-child(even) td{ background: #EEF0F4; } .table tr td:first-child, .table tr:first-child td{ font-weight: 700; } .contact_block_wrap .social_list{ display: flex; flex-wrap: wrap; justify-content: center; gap: 15px 48px; } .social_list .item{ font-size: 24px; display: flex; flex-wrap: wrap; align-items: center; gap: 12px; text-decoration: none; } .social_list .item .text{ text-decoration: underline; } .get_place_map{ display: grid; grid-template-columns: 1fr; gap: 24px 40px; margin: 32px 0 0; } .how_to_get img{ border-radius: 16px; overflow: hidden; max-height: 280px; width: 100%; margin: 10px 0; object-fit: cover; } .how_to_get .title{ font-size: 16px; line-height: 1.4; font-weight: 500; } .how_to_get .text{ color: var(--GREY, #6C757E); font-weight: 500; font-size: 14px; line-height: 1.4; } .workers{ display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; } .workers .item{ border: 1px solid #D9DADD; border-radius: 8px; overflow: hidden; display: flex; flex-direction: column; } .workers .item .photo{ height: 288px; width: 100%; object-fit: cover; } .workers .item .text{ padding: 24px 16px; line-height: 1.4; display: flex; flex-direction: column; flex: 1; } .workers .item .text .name{ font-size: 18px; font-weight: 700; } .workers .item .text .position{ font-size: 14px; font-weight: 500; margin: 12px 0 24px; margin: 12px 0 0; color: var(--GREY, #6C757E); } .workers .item .text .cont{ margin-top: auto; display: flex; flex-direction: column; gap: 12px; font-size: 16px; font-weight: 700; } .workers .item .text .phone{ text-decoration: none; } .workers .item .text .phone .add_phone{ color: var(--GREY, #6C757E); padding-left: 12px; } .workers .item .text .mail{ color: var(--Orange, #E18709); } .text_title{ font-size: 24px; font-weight: 700; margin: 40px 0 24px; text-transform: uppercase; } .footer_bottom{ display: flex; justify-content: space-between; flex-wrap: wrap; gap: 24px; color: white; margin-top: 40px; font-size: 14px; } .nowrap{ white-space: nowrap !important; } .contact_sec .map { border-radius: 16px; overflow: hidden; height: 100%; } /*0*/ @media screen and (min-width: 1360px) { .project_one:hover { box-shadow: 0px 5px 12px 1px rgba(15, 29, 64, 0.4); } .project_one:not(.slick-slide):hover, .portfolio_cat_one:hover, .portfolio_list_one:hover { box-shadow: 0px 10px 20px 10px rgba(15, 29, 64, 0.24); } .sort_area .arr:not(.active):hover img{ filter: none; } .promo_grid .item:nth-child(3):hover .hover_img, .promo_grid .item:nth-child(3):hover .fire_wrap { opacity: 1; } .promo_grid .item:nth-child(2):hover .hover_img { opacity: 1; } .promo_grid .item:nth-child(2):hover .brick_1 { transform: translateY(-80px); } .promo_grid .item:nth-child(2):hover .brick_2 { transform: translateY(-50px); } .promo_grid .item:nth-child(2):hover .brick_3 { transform: translateY(-24px); } .promo_grid .item:nth-child(2):hover .brick_4 { transform: translateY(-9px); } .promo_grid .item:nth-child(2) .brick { transition: 0.5s; } .main_btn:hover { color: white; background: var(--orange-orange-700, #C37002); } .main_btn.ico_btn:hover { background: var(--orange-orange-700, #C37002); } .main_btn.brd_btn:hover { background: var(--orange-orange-700, #C37002); } .main_btn.big_btn:hover { background: var(--orange-orange-700, #C37002); } .main_btn.gray_btn:hover, .main_btn.estimate_btn.gray_ver:hover { background: var(--drk-blue-drk-blue-200, #656E85); } .main_btn.light_btn:hover { background: #CACDD5; color: black; } .main_btn.blue_btn:hover { background: var(--drk-blue-drk-blue-800, #192648); } .radio_btn label:hover { background: var(--lght-grey-lght-grey-400, #E2E4E8); } .upload_block .upload_btn:hover { background: var(--lght-grey-lght-grey-700, #A4A9B6); } .review_list .item .read_more:hover { color: var(--orange-orange-700, #C37002); } .banner_sec .main_banner_nav .slick-track { transform: translate3d(0px, 0px, 0px) !important; } .banner_sec .main_banner_nav .slick-list { overflow: unset; } .hamb { display: none; } .why_block { max-width: 1140px; margin: auto; grid-template-columns: repeat(6, auto); grid-template-rows: 300px 320px 382px; gap: 0; } .why_block .item:nth-child(1) { order: 4; grid-column: 2 span; width: 411px; } .why_block .item:nth-child(1) .img .img_bg { left: 10px; bottom: 40px; } .why_block .item:nth-child(1) .img .img_solo { bottom: 10px; } .why_block .item:nth-child(1) .text { position: relative; top: -25px; } .why_block .item:nth-child(2) { order: 1; grid-column: 6 span; display: flex; align-items: center; gap: 20px; margin: 0 auto; margin-bottom: 40px; } .why_block .item:nth-child(2) .img .img_bg { bottom: 25px; } .why_block .item:nth-child(2) .img .img_solo { left: 92px; bottom: 5px; } .why_block .item:nth-child(2) .text { max-width: 383px; margin-top: 30px; } .why_block .item:nth-child(3) { order: 2; grid-column: 2 span; width: 385px; position: relative; top: -44px; } .why_block .item:nth-child(3) .img .img_bg { bottom: 10px; } .why_block .item:nth-child(3) .img .img_solo { left: 20px; } .why_block .item:nth-child(3) .text { max-width: 296px; } .why_block .item:nth-child(4) { order: 6; grid-column: 3 span; width: 393px; position: relative; top: -20px; } .why_block .item:nth-child(4) .img .img_bg { bottom: 30px; } .why_block .item:nth-child(4) .img .img_solo { left: 58px; bottom: 29px; } .why_block .item:nth-child(4) .text { padding-left: 80px; } .why_block .item:nth-child(5) { order: 5; grid-column: 3 span; width: 393px; margin-left: auto; position: relative; top: -59px; } .why_block .item:nth-child(5) .img .img_bg { bottom: 20px; } .why_block .item:nth-child(5) .img .img_solo { left: 20px; bottom: 5px; } .why_block .item:nth-child(6) { order: 3; grid-column: 2 span; margin: 0 73px 0 31px; } .why_block .item:nth-child(6) .img .img_full { opacity: 1; } .why_block .item .img { position: relative; } .why_block .item .img .img_full { opacity: 0; } .why_block .item .img .img_bg { position: absolute; left: 0; bottom: 0; } .why_block .item .img .img_solo { position: absolute; left: 0; bottom: 0; } .why_block .item .text { color: var(--drk-grey-drk-grey-700, #3D3D3D); font-weight: 600; line-height: 140%; } .calc_sec .sec_title { max-width: 1100px; margin: 0 auto 40px; } .calc_sec p { text-align: center; max-width: 992px; margin: auto; } .calc_block { padding: 48px 40px 56px; max-width: 1100px; margin: 24px auto; grid-template-columns: repeat(6, 1fr); gap: 48px 44px; } .calc_block .input_cell { grid-column: span 2; margin-bottom: -16px; } .calc_block .meter_cell { grid-column: span 3; display: grid; align-items: flex-end; grid-template-columns: 230px 160px; gap: 30px; } .calc_block .meter_cell .label { margin-bottom: -5px; } .calc_block .floor_cell { grid-column: span 3; } .calc_block .floor_cell .label { text-align: center; font-size: 18px; } .calc_block .material_cell { grid-column: span 6; } .calc_block .material_cell .label { text-align: center; font-size: 18px; } .calc_block .style_cell { display: grid; grid-template-columns: 165px 200px; justify-content: space-between; grid-column: span 3; max-width: 440px; } .calc_block .style_cell .label { font-size: 12px; line-height: 160%; } .calc_block .upload_cell { display: grid; grid-template-columns: 165px 200px; justify-content: space-between; grid-column: span 3; order: 9; max-width: 440px; margin-top: -36px; } .calc_block .upload_cell .label { font-size: 12px; line-height: 160%; } .calc_block .textarea_cell { grid-column: span 3; grid-row: span 2; } .calc_block .textarea_cell textarea { height: 100%; } .calc_block .text_cell { grid-column: span 3; order: 11; max-width: 360px; margin-top: auto; margin-bottom: auto; } .calc_block .submit_cell { grid-column: span 3; order: 10; max-width: 440px; } .radio_btn label { white-space: nowrap; } .last_project_sec { overflow: hidden; } .last_project_sec .last_project_line { display: block; position: absolute; top: -30px; } .last_project_sec .sec_title { max-width: 852px; margin: 50px auto 40px; } .last_project_sec p { max-width: 1190px; margin: auto; text-align: center; color: #000; text-align: center; font-size: 20px; } .dream_text { color: #000; max-width: 1104px; text-align: center; font-size: 18px; font-weight: 500; line-height: 140%; margin: 72px auto 0; } .desc_hide { display: none; } .promo_project_sec { background: url("/local/templates/forvarddom/css/../img/ico/promo_line_1.svg") no-repeat calc(50% - 580px) calc(100% + 40px), url("/local/templates/forvarddom/css/../img/ico/promo_line_2.svg") no-repeat calc(50% + 640px) calc(100% + 40px); } .promo_block { margin: 72px auto 0; max-width: 1104px; } .promo_block .promo_head { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; padding: 0; } .promo_block .promo_head .title { color: var(--orange-orange-600, #E18709); font-size: 96px; font-weight: 700; line-height: 1; text-align: left; } .promo_block .promo_head .text { max-width: 350px; line-height: 22px; margin-top: 24px; font-size: 16px; } .promo_block .promo_head .quote_cell { display: flex; align-items: center; gap: 24px; } .promo_block .promo_head .quote_cell .quotes { max-width: 500px; } .promo_grid { display: grid; grid-template-columns: 501px 568px; grid-template-rows: 291px 216px 216px; gap: 35px 40px; color: white; margin-top: -20px; } .promo_grid .item { position: relative; } .promo_grid .item img { position: absolute; bottom: 0; left: 0; z-index: -1; } .promo_grid .item .desc { display: block; } .promo_grid .item .mob { display: none; } .promo_grid .item:nth-child(1) { padding-top: 65px; padding-left: 150px; grid-column: 2 span; gap: 53px; display: flex; align-items: center; } .promo_grid .item:nth-child(1) .title { font-size: 40px; text-align: right; font-weight: bold; line-height: normal; text-transform: uppercase; } .promo_grid .item:nth-child(1) .text { font-size: 24px; font-weight: 400; line-height: normal; } .promo_grid .item:nth-child(2) { grid-row: 2 span; padding-top: 32px; padding-right: 48px; text-align: right; } .promo_grid .item:nth-child(2) .pretitle { color: var(--orange-orange-900, #7C4301); font-size: 36px; font-weight: 600; line-height: 120%; } .promo_grid .item:nth-child(2) .title { font-size: 56px; font-weight: 700; line-height: 1; } .promo_grid .item:nth-child(2) .text { font-size: 28px; font-weight: 600; line-height: 150%; margin-top: 5px; } .promo_grid .item:nth-child(2) .brick { position: absolute; z-index: 100; left: auto; } .promo_grid .item:nth-child(2) .brick.brick_1 { right: 78px; bottom: 61px; } .promo_grid .item:nth-child(2) .brick.brick_2 { right: 115px; bottom: 72px; } .promo_grid .item:nth-child(2) .brick.brick_3 { right: 153px; bottom: 88px; } .promo_grid .item:nth-child(2) .brick.brick_4 { right: 193px; bottom: 103px; } .promo_grid .item:nth-child(3) { padding-top: 40px; padding-left: 245px; order: 1; } .promo_grid .item:nth-child(3) .pretitle { font-size: 20px; font-weight: 400; line-height: normal; } .promo_grid .item:nth-child(3) .title { font-size: 36px; font-weight: 700; line-height: 38px; } .promo_grid .item:nth-child(3) .text { font-size: 20px; font-weight: 400; line-height: 38px; margin-top: 5px; } .promo_grid .item:nth-child(3) .fire_wrap { position: absolute; border-radius: 7px; width: 83px; height: 55px; top: 67px; left: 71px; overflow: hidden; } .promo_grid .item:nth-child(3) .fire_wrap img { width: 460px; max-width: none; left: -170px; bottom: -10px; } .promo_grid .item:nth-child(4) { padding-top: 56px; padding-left: 67px; text-align: left; } .promo_grid .item:nth-child(4) .title { color: var(--orange-orange-600, #E18709); font-size: 40px; font-weight: 800; line-height: normal; text-transform: uppercase; } .promo_grid .item:nth-child(4) .text { font-size: 18px; font-weight: 600; line-height: 160%; margin-top: 64px; margin-left: 37px; } .comfort_sec { overflow: hidden; } .comfort_sec .line { position: absolute; top: 0; left: calc(50% - 230px); } .review_list { gap: 32px; } .review_list .item { min-width: 496px; padding: 16px 24px; position: relative; justify-content: space-between; gap: 0 40px; } .review_list .item .top_wrap { display: flex; justify-content: space-between; } .review_list .item .client { margin: 0; margin-top: -64px; /* padding-left: 24px; */ display: flex; flex-direction: column; align-items: center; gap: 16px; text-align: center; } .review_list .item .client img { width: 112px; } .review_list .item .client .info .date { font-size: 16px; } .review_list .item .img { margin-top: -56px; height: 176px; } .review_list .item .params { grid-column: 2 span; margin-top: 24px; padding: 10px 28px; display: flex; justify-content: space-around; } .review_list .item .params .point { display: flex; font-size: 14px; } .review_list .item .params .point img { width: 24px; } .review_list .item .params .point:last-child { font-size: 16px; margin-top: 0; } .review_list .item .text { grid-column: 2 span; font-size: 16px; line-height: 22px; margin-top: 24px; max-height: 174px; } .review_list .item .read_more { grid-column: 2 span; } .footer .footer_wrap { display: flex; align-items: flex-start; justify-content: space-between; } .footer .footer_wrap .info { gap: 48px; margin-top: 50px; } .footer .footer_wrap .info .point { gap: 32px; font-size: 24px; line-height: normal; align-items: center; } .footer .footer_wrap .info .point .phone { font-size: 38px; } .footer .footer_wrap .info .point .mail { margin-top: 0; } .footer .footer_wrap .info .point img { width: 48px; } .plyr--video .plyr__controls { display: none; } .project_list { display: grid; padding-bottom: 0; grid-template-columns: repeat(3, 1fr); } .nav_screen .nav_menu>.item:hover .submenu_wrap { display: block; } .nav_screen .nav_menu .submenu .item:hover { color: #3a4662; } .nav_screen .nav_menu .item .submenu_wrap { padding-left: 0; padding-top: 55px; position: absolute; left: 0; top: 0; } .benefits { gap: 0; } .benefits .item { flex-direction: row; } .benefits .item:nth-child(1) { margin-top: -51px; } .benefits .item:nth-child(1) .info { padding-top: 123px; width: 544px; } .benefits .item:nth-child(2) { flex-direction: row-reverse; margin-top: 42px; } .benefits .item:nth-child(2) .info { padding-top: 38px; } .benefits .item:nth-child(3) { margin-top: -25px; } .benefits .item:nth-child(3) .info { padding-top: 51px; padding-left: 112px; width: 568px; } .benefits .item .info { width: 456px; } .benefits .item .info .num { font-size: 150px; line-height: 120px; } .benefits .item .info .name { font-size: 32px; } .nav_line { display: none; } .mortgage_banner.small { gap: 40px; } .mortgage_banner.small .mortgage_ico { width: 114px; } .mortgage_banner.small .name { font-size: 32px; } .mortgage_banner.small .text { font-size: 19px; } .mortgage_banner.small .text .num { font-size: 23px; } .mortgage_banner.small .main_btn { display: none; } .calc_project .info .price:hover{ border-color: #FAA11D; color: #FAA11D; } .card_main_photo{ max-width: 758px; } .video_nav .item:hover .round:before { border-color: var(--brown-brown-100, #FFFDFA); } .load_more:hover{ border-color: #e18709; } .listing_info .listing_filter.listing_filter_dev { grid-template-columns: repeat(12, 1fr); gap: 32px 24px; } .listing_info .listing_filter.listing_filter_dev .cell_wrap{ grid-column: 2 span; } .listing_info .listing_filter.listing_filter_dev .cell_wrap_3{ grid-column: 3 span; } .listing_info .listing_filter.listing_filter_dev .cell_wrap_6{ grid-column: 6 span; } .listing_info .listing_filter.listing_filter_dev .cell_wrap_submit{ display: flex; } .listing_info .listing_filter.listing_filter_dev .cell_wrap_submit .main_btn{ margin-left: auto; } .listing_info .listing_filter.listing_filter_dev .main_btn{ display: inline-flex; width: auto; } .widget_material_trig:hover{ background: #C37002; } .slick-arrow:hover{ opacity: .8; } .calc_price .title:not(.active):hover{ opacity: .9; } .breadcrumbs a.item:hover{ color: #e2e4e8; } .banner_sec .banner_text .banner_text_wrap .title_block .main_btn { margin-left: auto; } .calc_price.fixed { position: fixed; } .over_h{ padding-right: 17px !important; } .new_sec p{ margin: 32px 0; font-size: 18px; line-height: 1.5; } .new_ul.big{ font-size: 16px; } .new_ul.big li + li{ margin-top: 20px; } .new_steps{ grid-template-columns: 1fr 1fr; gap: 48px 30px; } .new_steps .new_step:after{ content: ""; background: url("/images/ico/step_arr.svg") no-repeat center center; position: absolute; width: 30px; height: 12px; right: -30px; top: calc(50% + 6px); } .new_steps .new_step:nth-child(even):after{ background: url("/images/ico/step_arr_long.svg") no-repeat center center; width: 623px; height: 48px; right: 100%; top: auto; bottom: -48px; transform: translateX(50%); } .new_steps .new_step:last-child:after{ display: none; } .new_step { gap: 16px; padding: 24px; } .new_step .num{ font-size: 64px; margin-bottom: 8px; } .new_step .name{ font-size: 20px; } .new_point_num{ grid-template-columns: 124px 1fr; } .new_point .num { font-size: 50px; } .accent_block.reverse { grid-template-columns: auto 510px; } .accent_block.reverse .text_wrap{ position: relative; order: -1; } .block_list.reverse{ grid-template-columns: 1fr 400px; } .block_list.reverse .img_wrap{ order: 2; } .contact_block_wrap .social_list{ order: 2; grid-column: span 2; } .get_place_map{ grid-template-columns: 480px 1fr; margin: 80px 0 0; } .get_place_map .how_to_get{ order: -1; } .how_to_get .title{ font-size: 20px; } .how_to_get .text{ padding: 0 16px; } .workers{ grid-template-columns: repeat(3, 1fr); gap: 30px; } .workers .item .photo{ height: 380px; } .workers .item .text{ padding: 32px; } .workers .item .text .name{ font-size: 20px; } .workers .item .text .position{ margin: 12px 0 32px; margin: 12px 0 0; } } /*-*/ @media screen and (min-width: 1830px) { .banner_sec .banner_text .banner_text_wrap .title_block .logo_block, .banner_sec .banner_text .banner_text_wrap .btn_block, .nav_screen .brd_btn { display: none; } .nav_screen { width: 360px; /* height: 1024px; */ min-height: 100vh; } .nav_screen:before { content: ""; width: 100%; height: 264px; background: linear-gradient(12deg, #28334D 19.22%, rgba(60, 66, 80, 0) 80.09%); position: absolute; left: 0; bottom: 0; z-index: -1; } .banner_sec .banner_text .wrapper { margin: 0 0 0 auto; } .main_sec:before { content: ""; z-index: 1; background: rgba(59, 65, 79, 0.75); width: 360px; height: 100%; position: absolute; top: 0; left: 0; } .main_sec .wrapper { max-width: 1560px; margin-right: 0; } .bread_sec .wrapper, .simple_sec .wrapper { max-width: 1510px; margin-right: 65px; } .why_sec { background: url("/local/templates/forvarddom/css/../img/ico/why_linear.svg") no-repeat 100% -440px; } .calc_sec .calc_girl { display: block; position: absolute; right: 0; bottom: 0; } .calc_sec .calc_house { display: block; position: absolute; right: 278px; bottom: 204px; z-index: 2; } .calc_sec .wrapper { transform: translateX(-100px); } .last_project_sec .last_project_line { top: 0; } .last_project_sec .sec_title { margin-top: 80px; } .promo_project_sec { padding-bottom: 135px; background-position: 0 100%, 100% calc(100% - 10px); } .comfort_sec .line { left: auto; right: 0; } .footer { padding: 70px 0 32px; } .footer_bottom{ margin-top: 70px; } .video_sec .video_wrap { max-width: calc(100% - 360px); margin-left: auto; } .nav_screen .nav_menu>.item:hover { color: white; border-color: #FAA11D; } .nav_screen .nav_menu>.item:hover:before { content: ""; z-index: -1; position: absolute; left: -19px; top: 50%; transform: translateY(-50%); width: 330px; height: 66px; background: #FAA11D; border-radius: 39px 0px 0px 39px; } .nav_screen .nav_menu .item .submenu_wrap { padding-left: 311px; padding-top: 0; position: absolute; left: 0; top: -10px; } .bread_sec.with_bg .bg_img, .bread_sec.with_bg:after { left: 360px; } .widget_material .ico { display: none; } .widget_material .wrap { display: block; border-left: none; border-bottom-left-radius: 0; background: none; padding-bottom: 0; } .widget_material .wrap .list { align-items: end; } .widget_material .wrap .list .item { flex-direction: row; gap: 33px; padding-left: 53px; padding-right: 33px; text-transform: uppercase; font-size: 21px; font-weight: 700; border-radius: 85px 0 0 85px; background: none; color: white; } .widget_material .wrap .list .item .text { display: none; } .widget_material .wrap .list .item:not(.active):hover { box-shadow: 0px 5px 16px -3px rgba(112, 33, 2, 0.2); background: rgba(147, 154, 170, 0.8); padding-left: 33px; padding-right: 53px; -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); } .widget_material .wrap .list .item:not(.active):hover .text { display: block; } .widget_material .wrap .list .item.active { margin: 5px 0; background: var(--Orange-Orange-500, #FAA11D); box-shadow: 0px 5px 16px -3px rgba(112, 33, 2, 0.2); } .widget_material .wrap .list .item.active .text { display: none; } .widget_material .wrap .list .item img { width: 81px; } .card_main_photo{ max-width: 814px; } .main_banner{ max-width: 1560px; margin-left: auto; } } @media screen and (min-width: 1921px) { .nav_screen { left: calc(50% - 960px); } } @media screen and (max-width: 1829px) and (min-width: 1360px) { .bread_sec { padding-top: 96px; } .nav_screen { padding: 16px 24px 16px 32px; flex-direction: row; justify-content: space-between; align-items: center; background: rgba(42, 52, 77, 0.85); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); width: 100%; top: 0; transition: 0.7s; } .page_main .nav_screen { /* top: -100px; */ } .nav_screen.active { top: 0; } .logo_block .logo .logo_full, .nav_screen .search_block, .nav_screen .social_block, .nav_screen .contact_block .schedule { display: none; } .nav_screen .logo_block .logo .logo_mini { display: block; width: 40px; } .nav_screen .logo_block .slogan { display: none; } .nav_screen .nav_menu { flex-direction: row; margin: 0; } .nav_screen .nav_menu .item.active { font-weight: 700; } .nav_screen .nav_menu .item { font-weight: 400; letter-spacing: normal; } .nav_screen .nav_menu .item a{ padding: 12px 15px; } .nav_screen .nav_menu > .item > a:hover{ color: #faa11d; } .nav_screen .nav_menu > .item > a:hover svg path{ stroke: #faa11d; } .nav_screen .brd_btn { max-width: 184px; } .nav_screen .btn_block { display: flex; gap: 16px; margin: 0; } .nav_screen .contact_block { margin-top: 0; } .nav_screen .contact_block .phone { font-size: 20px; } .nav_screen .btn_block .ico_btn { padding: 5px 16px; min-height: 40px; } .nav_screen .btn_block .ico_btn .text { display: none; } .banner_sec .banner_text .banner_text_wrap .contact_block .phone { font-size: 28px; margin-top: 8px; } .banner_sec .banner_text .banner_text_wrap .contact_block .schedule { font-size: 16px; } .banner_sec .banner_text .banner_text_wrap .contact_block .main_btn { margin-top: 8px; } .banner_sec .banner_text:before { border-right-width: 600px; border-bottom-width: 300px; } .banner_sec .banner_text { padding-top: 32px; padding-top: 90px; } .banner_sec .banner_text .banner_text_wrap .btn_block, .banner_sec .banner_text .banner_text_wrap .contact_block, .banner_sec .banner_text:before{ display: none; } .banner_sec .banner_text .banner_text_wrap .title_block .logo_block { margin-bottom: 30px; } .banner_sec .banner_text .banner_text_wrap .title_block .subtitle{ margin-top: 15px !important; } .banner_sec .banner_text .banner_text_wrap .btn_block .ico_btn { white-space: nowrap; } .wide_sec .wrapper { padding: 0 32px; } .card_complect_table tr.tr_head td.compl_cell .text .price { font-size: 36px; } } @media screen and (max-width: 1829px) { .wrapper { max-width: 1360px; padding: 0 65px; } .banner_sec .banner_text .banner_text_wrap .title_block { font-size: 36px; } .banner_sec .banner_text .banner_text_wrap .title_block .subtitle { margin-top: 24px; font-size: 18px; } .banner_sec .main_banner_nav { right: 50%; transform: translate(50%); max-width: 1230px; border-radius: 10px; } .banner_sec .main_banner_nav .item { font-size: 16px; } .banner_sec .main_banner_nav .item:before { background-size: 200px; width: 200px; bottom: 78px; } .banner_sec .main_banner_nav .item:after { background-size: 86px; width: 86px; bottom: 70px; } .banner_sec .main_banner_nav .item.slick-current { border-radius: 12px; font-size: 19px; } .banner_sec .main_banner_nav .item.slick-current .ico_material { width: 123px; top: -160px; } .banner_sec .main_banner_nav .item .name { height: 70px; } .banner_sec .main_banner_nav .item .ico_material { width: 96px; top: -100px; } .banner_sec .banner_fade { height: 100px; } .banner_sec .banner_scroll { bottom: 50px; right: 50%; transform: translateX(50%); font-size: 10px; } .slick-arrow { top: 430px; right: calc(50% - 615px); width: 47px; height: 72px; background-size: contain; } .slick-arrow.slick-prev { right: calc(50% - 550px); } .main_banner .item .num { top: 346px; right: calc(50% - 510px); font-size: 37px; } .main_banner .item .num .current { font-size: 56px; } .main_banner .item { height: 800px; } .nav_screen .nav_menu .item .submenu { border-radius: 0 0 24px 24px; } .banner_nav_link { top: -50px; } .slick-current .banner_nav_link { top: -220px; } .main_btn.brd_btn { padding: 10px 20px; font-size: 12px; } } @media screen and (max-width: 1359px) { .wrapper { padding: 0 16px; max-width: 960px; } .main_btn { font-size: 18px; padding: 15px; } .main_btn.ico_btn { border-radius: 20px; padding: 5px 32px; font-size: 12px; gap: 12px; min-height: 40px; justify-content: center; } .main_btn.ico_btn img { width: 16px; } .main_btn.brd_btn { border-radius: 18px; border: 1px solid #FF900E; background: rgba(22, 25, 28, 0.75); padding: 10px 26px; font-size: 12px; } .main_btn.blue_btn { font-size: 14px; padding: 7px 10px; } .main_btn.estimate_btn { font-size: 14px; padding: 7px 10px; } .main_btn.read_btn { font-size: 16px; padding: 10px; } .main_btn.dark_blue_btn { padding: 15px; } .main_btn.dark_blue_btn.big { padding: 15px; font-size: 16px; } .main_btn.consult_btn { font-size: 14px; } .main_btn.more_btn { font-size: 14px; width: 136px; padding: 10px; } .main_btn.more_btn img { width: 9px; } .main_btn.change_btn { font-size: 14px; padding: 7px 25px; min-height: 50px; justify-content: center; gap: 10px; } .main_btn.change_btn img { width: 30px; } .nav_screen { padding: 32px 24px; background: rgba(42, 52, 77, 0.9); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); width: 100vw; height: 100vh; display: flex; flex-direction: column; left: -100vw; transition: 0.8s; } .nav_screen.active { left: 0; } .nav_screen .close { display: block; position: absolute; top: 20px; right: 20px; width: 16px; } .nav_screen>div { max-width: 500px; margin: 0 auto; width: 100%; } .nav_screen .logo_block { display: none; } .nav_screen .nav_menu { order: -3; margin-top: 0; } .nav_screen .nav_menu .item { font-size: 14px; font-weight: 400; letter-spacing: normal; /* padding: 8px 32px; */ min-width: 176px; } .nav_screen .nav_menu .item.active { font-weight: 700; } .nav_screen .btn_block { order: -1; margin-top: 24px; gap: 24px; } .nav_screen .search_block { order: -2; margin-top: 20px; } .nav_screen .contact_block { font-size: 20px; margin-top: 32px; } .nav_screen .contact_block .schedule { margin-top: 5px; font-weight: 500; font-size: 11px; } .nav_screen .brd_btn { margin-top: 16px; } .nav_screen .social_block { padding-top: 16px; margin-top: 24px; } .banner_sec .banner_text { /* padding-top: 50px; */ /* background: linear-gradient(180deg, #222A39 32.69%, rgba(55, 64, 87, 0) 100%); */ /* height: 300px; */ padding: 70px 0 20px; background: #222A39; position: relative; } .banner_sec .banner_text .banner_text_wrap .title_block { font-size: 24px; } .banner_sec .banner_text .banner_text_wrap .title_block .subtitle { margin-top: 15px; font-size: 12px; line-height: 160%; } .banner_sec .banner_text .banner_text_wrap .btn_block, .banner_sec .banner_text .banner_text_wrap .contact_block .schedule, .banner_sec .banner_text .banner_text_wrap .contact_block .main_btn, .banner_sec .banner_text:before { display: none; } .banner_sec .banner_text .banner_text_wrap .contact_block { position: absolute; top: 0; left: 85px; } .banner_sec .banner_text .banner_text_wrap .contact_block .phone { font-size: 16px; font-weight: 600; } .banner_sec .banner_text .banner_text_wrap .title_block .logo_block { margin-bottom: 30px; } .banner_sec .banner_text .banner_text_wrap { position: relative; } .logo_block { gap: 15px; } .logo_block img { width: 70px; } .logo_block .slogan { font-size: 20px; } .banner_sec .main_banner_nav { bottom: 0; right: 0; transform: none; max-width: none; border-radius: 0; background: none; -webkit-backdrop-filter: none; backdrop-filter: none; } .banner_sec .main_banner_nav .item { margin: 100px 0 0; padding: 16px 0; font-size: 15px; background: rgba(42, 52, 77, 0.7); background: rgba(42, 52, 77, 1); backdrop-filter: blur(4px); border-radius: 0; } .banner_sec .main_banner_nav .item:before { background-size: 142px; width: 142px; bottom: 30px; } .banner_sec .main_banner_nav .item:after { background-size: 60px; width: 60px; bottom: 30px; } .banner_sec .main_banner_nav .item.slick-current { border-radius: 0; font-size: 15px; background: none; background: rgba(42, 52, 77, 0.7); background: rgba(42, 52, 77, 1); backdrop-filter: blur(4px); } .banner_sec .main_banner_nav .item.slick-current .ico_material { width: 88px; top: -90px; } .banner_sec .main_banner_nav .item .name { border-radius: 7px; background: var(--orange-orange-500, #FAA11D); font-weight: 700; height: 48px; display: inline-flex; width: auto; min-width: 158px; padding: 10px 40px; } .banner_sec .main_banner_nav .item .ico_material { width: 88px; top: -90px; } .banner_sec .banner_fade { display: none; } .banner_sec .banner_scroll { display: none; } .slick-arrow { top: auto; bottom: 16px; right: 16px; width: 32px; height: 48px; } .slick-arrow.slick-prev { left: 16px; } .other_project.slider_arr_top .slick-arrow { top: auto; } .main_banner .item .num { display: none; } .main_banner .item { height: auto; } .main_banner .item img { /* object-position: 36% center; */ object-fit: contain; margin-bottom: 80px; } .main_banner .item img.desc_img { display: none; } .main_banner .item img.mob_img { display: block; } .main_sec { padding: 32px 0; } .sec_title { margin-bottom: 20px; font-size: 24px; } .sec_title.big { font-size: 24px; } .sec_title.middle { font-size: 22px; } .sec_title.mini { font-size: 20px; } .new_sec_title { margin-bottom: 20px; font-size: 24px; } .title_text { font-size: 10px; line-height: 160%; } .sec_subtitle { font-size: 16px; } .sec_pretitle { font-size: 16px; } p { font-size: 14px; line-height: 160%; } .why_block { max-width: 400px; margin: auto; } .why_block .item:nth-child(even) { text-align: right; margin-left: auto; } .why_block .item:nth-child(even) img { margin-left: auto; } .why_block .item:nth-child(6) { display: none; } .why_block .item img { width: 215px; } .why_block .item .text { font-size: 12px; font-weight: 600; line-height: 160%; max-width: 300px; } textarea { font-size: 10px; padding: 8px; min-height: 64px; } .label { font-size: 10px; } .required_text { font-size: 10px; text-align: center; padding: 11px 15px; } .calc_block .input_cell+.input_cell { margin-top: -8px; } .calc_block .material_cell .radio_block { display: grid; grid-template-columns: 1fr; gap: 8px 0; background: none; } .calc_block .material_cell .radio_block .radio_btn { border-radius: 8px; } [data-mob] .full_text { display: none; } [data-mob]:after { content: attr(data-mob); } .upload_block .upload_btn { max-width: calc(100vw - 80px); } .house_select { grid-template-columns: 1fr; margin: 32px -8px 0; border-radius: 10px; background: var(--lght-grey-lght-grey-200, #F5F6F7); padding: 16px; } .house_select .label { font-size: 16px; } .house_select .house_select_nav { display: flex; justify-content: space-between; align-items: center; } .house_select .house_select_nav .text { color: var(--orange-orange-500, #FAA11D); font-size: 18px; font-weight: 700; line-height: 160%; } .house_select .house_select_nav .switch { color: var(--drk-blue-drk-blue-300, #5C657D); font-size: 14px; font-weight: 600; line-height: 130%; border-bottom: 2px dashed var(--drk-blue-drk-blue-300, #5C657D); } .house_select .house_select_nav .switch.active .full_text { display: none; } .house_select .house_select_nav .switch.active:after { content: attr(data-switch); } .house_select .cell_wrap { display: none; } .house_select .cell_wrap:first-of-type { margin-top: 8px; } .house_select .cell_wrap:last-of-type { margin-bottom: 20px; } .house_select+.main_btn { margin-top: 24px; } .mob_hide { display: none; } .mob_bgc_wrap { margin: 0 -16px; background-color: #CACDD5; padding-bottom: 24px; } .project_list { margin-top: 24px; gap: 8px; } .project_list.mob_grig { display: grid; padding: 8px; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); gap: 24px; margin: 0; } .project_list.mob_grig:after { display: none; } .project_one { min-width: 290px; gap: 8px; border-radius: 16px; padding: 8px; } .project_one .shevron { top: 16px; left: 16px; border-radius: 8px 0 0 0; width: 128px; height: 128px; padding: 12px 14px; } .project_one .shevron img { width: 25px; margin-bottom: 8px; } .project_one .shevron .text { font-size: 10px; } .project_one .img { height: 200px; border-radius: 8px; margin: 8px; width: auto; } .project_one .line { margin: 0 8px; } .project_one .name { font-size: 16px; } .project_one .descr { font-size: 10px; line-height: 1.3; margin: 0 8px; } .project_one .params { margin-top: 8px; } .project_one .params .cell img { width: 24px; } .project_one .params .cell .size { gap: 8px; font-size: 12px; } .project_one .params .cell .scale { gap: 8px; padding: 6px 18px 6px 8px; border-radius: 8px; font-size: 20px; } .project_one .params .cell .price { font-size: 22px; } .project_one .params .cell .cost { font-size: 14px; margin-bottom: 7px; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { height: 8px; margin: 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail { margin: 0; } .quotes { padding: 35px 0 20px; font-size: 10px; font-weight: 500; } .promo_grid .item:nth-child(1) { padding-top: 55px; padding-left: 15px; padding-right: 150px; text-align: right; } .promo_grid .item:nth-child(1) .text { margin-top: 5px; } .promo_grid .item:nth-child(2) .pretitle, .promo_grid .item:nth-child(2) .title { line-height: 110%; } .promo_grid .item:nth-child(3) .title { line-height: 1; margin: 5px 0; } .promo_grid .item:nth-child(3) .text { line-height: 110%; } .promo_grid { margin: 0 auto; max-width: 320px; } .promo_block .promo_head .quote_cell { margin: 20px 0 20px -46px; } .promo_block .promo_head .quote_cell img { width: 88px; } .comfort_sec .line { display: none; } .comfort_list { display: flex; margin-top: 16px; } .comfort_list .item { min-width: 262px; max-width: 262px; height: 388px; padding: 10px 30px 40px 30px; } .comfort_list .item .ico { top: 26px; right: 28px; width: 60px; } .comfort_list .item .title { font-size: 13px; line-height: 140%; min-height: 72px; } .footer { overflow: hidden; } .footer .footer_wrap .map { margin: 0 -85px; } .project_scroll_list, .review_wrap .scroll_list, .review_sec .scroll_list { margin: 0 -16px; } .project_scroll_list .mCSB_scrollTools.mCSB_scrollTools_horizontal, .review_wrap .mCSB_scrollTools.mCSB_scrollTools_horizontal, .review_sec .mCSB_scrollTools.mCSB_scrollTools_horizontal { margin: 0 16px; } .project_list, .review_list { padding-left: 16px; } .project_list::after, .review_list::after { content: ""; min-width: 8px; display: block; } .review_sec .project_list::after, .review_wrap .project_list::after, .review_sec .review_list::after, .review_wrap .review_list::after { min-width: 8px; } .banner_sec .main_banner_nav .item:before, .banner_sec .main_banner_nav .item:after { transform: translateX(-50%) scale(1); opacity: 1; transition: 0.5s; } .plyr--full-ui.plyr--video .plyr__control--overlaid { width: 64px; height: 64px; } .video_nav_wrap { background: var(--brown-brown-900, #423F3A); } .video_nav_wrap .mCSB_scrollTools.mCSB_scrollTools_horizontal { margin: 0 20px; } .video_nav { margin: 0 auto; padding-top: 80px; max-width: 920px; justify-content: flex-start; } .video_nav .item { flex: none; min-width: 120px; padding: 0 15px; font-size: 12px; } .video_nav .item .text { position: relative; top: -15px; } .video_nav .item:before { height: 8px; } .video_nav .item:after { height: 4px; top: -45px; } .video_nav .item .round { width: 16px; height: 16px; } .video_nav .item .round:before { width: 20px; height: 20px; } .video_nav .item.active .round:before { width: 28px; height: 28px; } .video_nav .item.current .round { width: 24px; height: 24px; top: -55px; } .video_nav .item.current .round:before { width: 36px; height: 36px; } .why_block .item .img .img_solo, .why_block .item .img .img_bg { display: none; } .bread_sec.with_bg .bread_search_wrap { -webkit-backdrop-filter: none; backdrop-filter: none; background: none; } .bread_sec.with_bg .breadcrumbs { mix-blend-mode: unset; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); background: rgba(226, 228, 232, 0.4); } .bread_search_wrap { gap: 8px; border-radius: 32px; flex-direction: column; padding: 0; background: none; } .bread_search_wrap .search_wrap { display: none; } .search_wrap { border-radius: 8px; margin: 0; min-width: auto; } .breadcrumbs { gap: 12px; border-radius: 20px; padding: 8px 16px; overflow: auto; } .breadcrumbs.with_roll:after { content: ""; position: absolute; top: 0; right: 0; width: 88px; height: 100%; background: linear-gradient(270deg, #959CAB 47.73%, rgba(149, 156, 171, 0) 91.48%); } .breadcrumbs.with_roll .roll { display: block; } .breadcrumbs.rolled { flex-wrap: wrap; padding-bottom: 50px; } .breadcrumbs.rolled:after { display: none; } .breadcrumbs.rolled .item:nth-child(n+3) { padding-left: 45px; padding-right: 0; background: url(/local/templates/forvarddom/css/../img/ico/arr_bread.svg) no-repeat 10px 3px; white-space: normal; } .breadcrumbs.rolled .roll span { display: inline-block; } .breadcrumbs.rolled .roll img { transform: rotate(180deg); } .breadcrumbs a.item { padding-right: 20px; transition: none; } .breadcrumbs a.item.home_link { padding-right: 8px; background-size: 2px; } .bread_sec .title.with_img { margin: 15px 0; } .bread_sec .title { font-size: 24px; line-height: 1.3; margin: 20px 0; gap: 20px; flex-direction: column-reverse; } .bread_sec .title img { width: 100px; } .bread_sec .title.with_img .material { width: 100px; height: 100px; } .bread_sec .title.with_img .material img { width: 60px; } .bread_sec { padding: 64px 0 0; } .bread_sec.with_bg:after { height: 30px; } .listing_preview { display: flex; flex-direction: column; gap: 16px; } .listing_info { border-radius: 0; flex-direction: column; padding: 20px; gap: 20px; box-shadow: none; margin: 24px -16px 0; } .listing_info .info_block { flex-direction: column; gap: 24px; padding: 0 20px; } .listing_info .info_block .cell .title { margin-bottom: 8px; } .listing_info .info_block .cell .list { display: flex; gap: 20px; } .listing_info .info_block .cell .list .col { display: flex; flex-direction: column; gap: 16px; } .listing_info .info_block .cell .list .point { padding-left: 16px; background-size: 12px; } .listing_info .listing_filter { grid-template-columns: 1fr; gap: 24px; } .listing_info .listing_filter .label { font-size: 14px; margin-bottom: 5px; } .sort_type { margin: 0; padding: 12px; gap: 20px; white-space: nowrap; justify-content: center; width: 100%; } .sort_type .sort_list { left: 67px; top: 56px; } .calc_mortgage_wrap { display: flex; flex-direction: column; gap: 32px; background: #CACDD5; padding: 24px 8px; margin: 0 -16px; } .calc_project .title_block { gap: 30px; align-items: center; min-height: auto; overflow: hidden; height: 88px; } .calc_project .title_block .name { font-size: 16px; color: #FFF8E5; } .calc_project .title_block img { margin-left: -5px; margin-top: 10px; width: 100px; } .calc_project .info { padding: 8px; text-align: center; } .calc_project .info .name { font-size: 20px; margin-bottom: 8px; } .calc_project .info .text { margin: 8px 0; font-size: 10px; } .calc_project .info .size { font-size: 16px; gap: 15px; justify-content: center; } .calc_project .info .size img { width: 32px; } .calc_project .info .line { flex-direction: column; gap: 8px; margin-top: 8px; align-items: flex-start; } .calc_project .info .area { display: flex; align-items: center; gap: 16px; font-size: 16px; flex-basis: auto; padding: 7px 10px; width: 100%; } .calc_project .info .area img { width: 24px; } .calc_project .info .area .area_text { flex: 1; margin-right: 40px; } .calc_project .info .price { font-size: 16px; padding: 10px; flex-basis: auto; width: 100%; } .mortgage_banner { padding: 16px; border-radius: 12px; border: 3px solid var(--Orange-Orange-500, #FAA11D); gap: 16px; display: grid; grid-template-columns: 82px 136px; justify-content: center; } .mortgage_banner .mortgage_ico { width: 39px; } .mortgage_banner .name { font-size: 24px; text-align: left; margin-left: -24px; } .mortgage_banner .text { font-size: 14px; } .mortgage_banner .text .num { font-size: 17px; } .widget_material { display: none; } .load_more { margin-top: 24px; border-radius: 6px; } .simple_sec { padding: 32px 0; } .review_wrap { margin-top: 48px; } .card_top_info { display: flex; flex-direction: column; gap: 20px; } .plan_estimate_grid { display: flex; flex-direction: column; gap: 16px; } .consult_mortgage_wrap { grid-template-columns: 1fr; gap: 32px; background: #CACDD5; padding: 24px 8px; margin: 0 -16px; } .consult_form_wrap { flex-direction: column; align-items: center; gap: 20px; padding: 16px 16px 24px; margin-top: 24px; border-radius: 24px; } .consult_form_wrap .img_worker { display: none; } .consult_form_wrap .form_content { grid-template-columns: 1fr; gap: 16px; } .consult_form_wrap .form_content .input_wrap_btn { order: 5; } .card_top_info .cell_wrap .line { flex-direction: column; } .card_top_info .cell_wrap .line .name { font-size: 20px; max-width: none; } .card_top_info .cell_wrap .line .price .value { font-size: 18px; } .card_top_info .cell_wrap .fasad_photo { margin-top: 10px; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; } .card_top_info .cell_wrap .fasad_photo .item { width: 130px; height: 89px; background-size: contain; } .card_top_info .cell_wrap .fasad_photo .item img { max-width: 110px; } .card_params_wrap .params_title { margin-bottom: 16px; font-size: 16px; } .card_top_info .cell_wrap .fasad_label { font-size: 16px; } .card_params_wrap .params_block { gap: 16px; grid-template-columns: repeat(auto-fit, minmax(80px, 1fr)); } .card_params_wrap .params_block .item { border: none; padding: 0; gap: 0; } .card_params_wrap .params_block .item .value { margin-top: 7px; } .card_params_wrap { margin: 24px 0; } .card_plans { padding: 9px 16px; flex-direction: column; gap: 15px; border: 1px solid #A3A3A3; background-color: #F5F6F7; border-radius: 3px; } .card_plans.rolled { padding-bottom: 64px; } .card_plans.rolled .roll { top: auto; bottom: 10px; left: 50%; transform: translateX(-50%); width: 100px; } .card_plans.rolled .roll:before { content: attr(data-text); margin-right: 8px; } .card_plans.rolled .roll span { display: none; } .card_plans.rolled .roll img { transform: rotate(180deg); } .card_plans.rolled .one { display: block; } .card_plans .mob_title { display: block; } .card_plans .roll { display: block; } .card_plans .one { /* display: none; */ } .card_plans .one .title { font-size: 14px; color: black; margin-bottom: 10px; } .card_plans .one img { mix-blend-mode: multiply; } .card_estimate { border-radius: 16px; border-width: 2px; } .card_estimate .info { padding: 20px; gap: 20px; } .card_complect .card_complect_title { font-size: 24px; margin-bottom: 24px; } .card_complect_table tbody { display: flex; } .card_complect_table tr { display: grid; grid-template-columns: 1fr; grid-template-rows: 64px 1fr 1fr; } .card_complect_table tr.tr_head td { font-size: 14px; text-align: center; width: 200px; min-width: auto; } .card_complect_table tr.tr_head td:first-child { align-self: auto; } .card_complect_table tr.tr_head td.compl_cell { gap: 8px; padding: 8px; } .card_complect_table tr.tr_head td.compl_cell:nth-child(2) { border-top-left-radius: 0; border-top-width: 1px; border-right: 0; border-bottom: 2px solid #CD6200; } .card_complect_table tr.tr_head td.compl_cell.finish_cell { border-top-right-radius: 0; border: 2px solid #CD6200; border-right: none; border-top: none; } .card_complect_table tr.tr_head td.compl_cell img { width: 55px; } .card_complect_table tr.tr_head td.compl_cell .text { display: flex; flex-direction: column-reverse; text-align: left; } .card_complect_table tr.tr_head td.compl_cell .text .price { font-size: 16px; font-weight: 600; } .card_complect_table tr.tr_head td.compl_cell .text .cell { font-size: 12px; font-weight: 500; } .card_complect_table td { padding: 16px; height: auto; width: auto; min-width: 400px; border-left: 1px solid #A4A9B6; } .card_complect_table td:last-child { border-left: 1px solid #A4A9B6; border-right: none; } .card_complect_table tr:last-child td:first-child { border-bottom-left-radius: 0; border-right: 1px solid #A4A9B6; } .card_complect_table tr td:first-child { border-top: 1px solid #A4A9B6; border-right: 0; } .card_complect_table tr:last-child td:nth-child(2) { border-right: 1px solid #A4A9B6; } .card_complect_table tr:last-child td:last-child { border-right: 1px solid #A4A9B6; border-bottom: 1px solid #A4A9B6; border-bottom-right-radius: 0; } .card_complect { margin: 40px 0; } .similar_project_wrap { margin: 40px 0; } .slider_arr_top { padding-bottom: 30px; } .slider_arr_top .slick-arrow { top: auto; bottom: 0; width: 30px; height: 30px; right: calc(50% - 35px); } .slider_arr_top .slick-arrow.slick-prev { right: calc(50% + 5px); left: auto; } .slider_arr_top_new { padding-bottom: 55px; } .slider_arr_top_new .slick-arrow { top: auto; bottom: 0; width: 30px; height: 45px; right: calc(50% - 35px); } .slider_arr_top_new .slick-arrow.slick-prev { right: calc(50% + 5px); left: auto; } .slider_arr_plans .slick-arrow { bottom: 10px; } .slider_arr_plans { padding-bottom: 50px; } .portfolio_cat_list { grid-template-columns: 1fr; gap: 24px; } .portfolio_cat_one { border-radius: 8px; padding: 8px; gap: 0; } .portfolio_cat_one .img { height: 184px; } .portfolio_cat_one .shevron { top: 8px; left: 8px; width: 160px; height: 160px; padding: 16px; } .portfolio_cat_one .shevron .num { font-size: 18px; padding: 5px; width: 56px; text-align: center; } .portfolio_cat_one .shevron .text { font-size: 12px; margin-top: 5px; } .portfolio_cat_one .material { top: 100px; right: 30px; width: 70px; height: 70px; } .portfolio_cat_one .material img { width: 45px; } .portfolio_cat_one .info { display: grid; grid-template-columns: auto 24px; padding: 8px; gap: 8px 16px; } .portfolio_cat_one .info .name { font-size: 16px; line-height: 1.3; width: auto; } .portfolio_cat_one .info .descr { font-size: 10px; line-height: 1.3; order: 3; } .portfolio_cat_one .info .arr { border-radius: 4px 4px 10px 4px; border-width: 1px; width: 24px; height: 100%; grid-row: 2 span; } .three_pillars_sec { margin-top: 32px; } .three_pillars_sec .title { font-size: 20px; } .three_pillars_sec .main_pillar { display: none; } .three_pillars { flex-direction: column; gap: 24px; align-items: center; } .three_pillars .one { padding: 0; } .three_pillars .one img { display: block; } .three_pillars .one .text { font-size: 14px; line-height: 1.3; } .single_consult { background: #CACDD5; padding: 24px 8px; margin: 24px -16px 0; margin: 24px 0 0; } .portfolio_list { grid-template-columns: 1fr; gap: 24px; } .portfolio_list_one { text-decoration: none; border-radius: 8px; padding: 8px; } .portfolio_list_one .img { height: 184px; border-radius: 8px; } .portfolio_list_one .info { padding: 8px; gap: 8px; } .portfolio_list_one .info .name { font-size: 14px; padding: 8px; } .portfolio_list_one .info .params { gap: 8px; } .portfolio_list_one .info .params .item { gap: 3px; } .portfolio_list_one .info .params .item .point { font-size: 10px; } .portfolio_list_one .info .link { font-size: 17px; padding: 8px; border-width: 2px; } .sort_area { margin: 30px auto; } .portfolio_slider_wrap { display: block; margin: 0 -16px; } .portfolio_slider_wrap .portfolio_nav { display: none; margin: 16px auto 0; padding: 0 40px; width: 300px; position: relative; } .portfolio_slider_wrap .portfolio_nav .item { margin: 0 4px; height: 66px; } .portfolio_slider_wrap .portfolio_nav .slick-arrow { top: auto; bottom: 0; left: auto; right: 0; border: 1px solid #FAA11D; width: 32px; height: 66px; background: url("/local/templates/forvarddom/css/../img/ico/arr_list.svg") no-repeat center; } .portfolio_slider_wrap .portfolio_nav .slick-arrow.slick-prev { top: 0; left: 0; } .portfolio_slider_wrap .portfolio_main { width: auto; } .portfolio_slider_wrap .portfolio_main .item { height: auto; } .portfolio_slider_wrap .portfolio_main .item img { width: auto; height: auto; border-radius: 0; } .portfolio_info { grid-template-columns: 1fr; gap: 20px; margin: 32px 0; } .portfolio_info .portfolio_params_block .title { font-size: 20px; margin-bottom: 10px; text-align: center; } .portfolio_descr { border: 0; background: none; padding: 0; } .portfolio_descr .title { font-size: 18px; } .portfolio_descr .portfolio_descr .text { font-size: 12px; line-height: 1.3; margin: 16px auto 0; } .portfolio_table td { padding: 8px; } .portfolio_table td:last-child { text-align: right; } .example_calc_wrap { grid-template-columns: 1fr; gap: 16px; margin: 32px 0; } .example_calc_wrap .example_wrap .title { font-size: 22px; } .example_project { grid-template-columns: 1fr; gap: 15px; min-height: auto; border-radius: 20px; } .example_project .img_block .main_img { height: 192px; } .example_project .img_block .main_img .shevron { width: 160px; height: 160px; } .example_project .img_block .main_img .shevron img { width: 32px; margin-bottom: 5px; } .example_project .img_block .main_img .shevron .text { font-size: 12px; } .example_project .img_block .fasad_photo { margin-top: 8px; flex-wrap: wrap; gap: 8px; } .example_project .img_block .fasad_photo .item { width: 64px; height: 48px; } .example_project .img_block .fasad_photo .item img { max-width: 55px; } .example_project .info { gap: 8px; padding-top: 0; } .example_project .info .name { font-size: 20px; } .example_project .info .type { font-size: 14px; } .example_project .info .params { margin: 8px 0; align-items: start; } .example_project .info .params .cell img { width: 24px; } .example_project .info .params .cell .size { gap: 8px; font-size: 12px; } .example_project .info .params .cell .scale { gap: 12px; padding: 7px 8px; border-radius: 8px; font-size: 18px; width: 112px; } .example_project .info .params .cell .price { font-size: 20px; } .example_project .info .params .cell .cost { font-size: 14px; } .calc_frame { margin: auto; display: none; } .other_project_wrap { margin: 48px 0; } .hexagon_sec { background: none; } .hexagon_material { background: none; width: auto; height: auto; margin: auto; padding: 0; font-size: 12px; line-height: 1.3; } .hexagon_material img { display: block; margin: auto auto 20px; max-width: 200px; } .benefits_sec { background: none; } .benefits_sec .title { font-size: 20px; line-height: 1.4; margin-bottom: 20px; } .mission_grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 32px; margin-top: 20px; } .mission_grid .item { gap: 16px; padding: 0; } .mission_grid .item img { width: 32px; } .mission_grid .item .text { font-size: 12px; line-height: 1.3; } .mission_principles p+p { margin-top: 15px; } .numbers_block { border: 0; padding: 0; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 32px; margin: 40px auto; } .numbers_block .title { font-size: 20px; position: relative; top: 0; left: 0; transform: none; font-weight: 700; padding: 0; color: #292929; text-align: center; } .numbers_block .item { gap: 16px; padding: 0; } .numbers_block .item .text { font-size: 12px; } .numbers_block .item .num { font-size: 32px; width: 80px; } .numbers_block .item .num.n84 { font-size: 40px; } .numbers_block .item .num.n64 { font-size: 32px; } .numbers_block .item .num.n120 { font-size: 52px; } .reliable_dev .subtitle { font-size: 16px; margin: 24px auto; } .reliable_dev .subtitle_1 { font-size: 14px; } .reliable_dev .subtitle_2 { font-size: 18px; margin: 24px 0; } .talk_girl { flex-direction: column; } .talk_girl img { width: 280px; } .talk_girl .text { flex: 1; text-align: center; } .talk_girl .text .first { font-size: 16px; } .talk_girl .text .second { font-size: 12px; margin-top: 16px; } .calc_price { position: relative; top: 0; margin: 32px 0; padding: 0 16px; } .calc_price .title { flex-direction: row; justify-content: center; gap: 24px; padding: 19px 32px; cursor: pointer; background: url("/local/templates/forvarddom/css/../img/ico/calc_subtract_mob.svg") no-repeat left top/contain; width: 288px; margin: auto; } .calc_price .title .text { flex: 1; } .calc_price .title .arr { display: block; } .calc_price .title.active { gap: 24px; padding: 19px 32px; background: url("/local/templates/forvarddom/css/../img/ico/calc_subtract_mob.svg") no-repeat left top/cover; -webkit-backdrop-filter: none; backdrop-filter: none; -webkit-clip-path: none; clip-path: none; } .calc_price .title.active .calc_img { width: 32px; } .calc_price .title.active .close { display: none; } .calc_price .title.active .arr { transform: rotate(180deg); } .calc_price .title.active .text { text-align: center; font-size: 16px; } .calc_price .title.active .text .subname { display: none; } .calc_price .content { padding: 0; border-radius: 0; background: none; box-shadow: none; margin-top: 16px; } .calc_price .content .calc_widget_form_wrap { gap: 16px; } .calc_price .content .calc_widget_form_wrap .line { flex-direction: column; align-items: normal; gap: 8px; } .calc_price .content .calc_widget_form_wrap .line .point { display: none; } .calc_price .content .calc_widget_form_wrap .line .point.area_point { display: block; color: #8E8E8E; font-size: 14px; font-weight: 400; text-transform: none; line-height: 140%; flex-basis: auto; } .calc_price .content .calc_widget_form_wrap .line .value { flex: 1; } .calc_price .content .calc_widget_form_wrap .line .value .cell_label { margin-bottom: 8px; margin-left: 0; } .calc_price .content .calc_widget_form_wrap .line .value .cell_input_area { max-width: none; } .calc_price .content .calc_widget_form_wrap .line .value .main_btn { margin-top: 0; } .nice_select { font-size: 12px; font-weight: 500; height: auto; line-height: 1.5; white-space: normal; padding: 10px; } .nice_select .option { line-height: 1.3; padding: 10px 15px; } .nice_select.round { border-radius: 8px; height: auto; min-height: 40px; line-height: 1.5; padding-right: 40px; padding-left: 16px; } .review_list .item { width: 256px; } .need_consult .sec_title { font-size: 20px; margin-bottom: 10px; } .need_consult .subtitle { font-size: 12px; } .float_label label { font-size: 12px; } .float_filter { display: block; } .other_project .portfolio_list_one .info .params .item .value { font-size: 12px; } .benefits .item .info { display: grid; grid-template-columns: 80px 1fr; align-items: center; gap: 16px; } .benefits .item .info .num { font-size: 60px; line-height: 1.2; text-align: center; } .benefits .item .info .name { font-size: 20px; line-height: 1.3; font-weight: 600; } .benefits .item .info .text { font-size: 14px; line-height: 1.4; margin-top: 0; grid-column: 2 span; } .benefits .item .info .img_mob { max-width: 190px; display: block; grid-column: 2 span; } .call_me_float { min-width: auto; max-width: 100vw; border-radius: 12px 0 0 12px; top: 120px; } .call_me_float .title_line { padding: 8px 16px; gap: 15px; } .call_me_float .title_line .close { width: 20px; } .call_me_float .title_line .close img { width: 8px; } .call_me_float .title_line .text_block { padding: 0; } .call_me_float .title_line .text_block .title { font-size: 20px; } .call_me_float .title_line .text_block .text { font-size: 14px; } .call_me_float .form_block { padding: 20px; } .call_me_float .form_block .form_wrap { gap: 16px; } .call_me_float .form_block .form_wrap .line { flex-direction: column; align-items: start; } .call_me_float .form_block .form_wrap .line .line_label { font-size: 14px; text-align: left; flex-basis: auto; } .call_me_float .form_block .form_wrap .line .line_input { width: 100%; } .call_me_float .form_block .form_wrap .line .main_input { padding: 10px 15px; } .call_me_float .form_block .form_wrap .btn_line { margin-top: 8px; } .form_search_wrap .nice_select { line-height: 36px; } .simple_sec ul { font-size: 14px; line-height: 160%; } .banner_sec .banner_text .banner_text_wrap .title_block .main_btn { width: 180px; } .card_top_info .main_ing_wrap:before { width: 60px; height: 60px; } h2, .h2 { font-size: 22px; margin: 30px 0 20px; } .calc_price.calc_price_popup{ background: white; padding: 24px 16px; top: 50px; margin: 0; overflow: auto; max-height: 100vh; max-width: 100vw; } .calc_price.calc_price_popup .title.active .close { display: block; top: 0; right: 0; position: relative; min-width: 18px; } .calc_price.calc_price_popup .title.active .arr { display: none; } .banner_sec .banner_text .banner_text_wrap .title_block .logo_block, .banner_sec .banner_text .banner_text_wrap .contact_block .phone, .banner_sec .hamb{ display: none; } .new_grid_2, .new_grid_3 { grid-template-columns: 1fr; gap: 16px; } .double_wrap { flex-direction: column; } .simple_p { font-size: 16px; margin: 16px 0; } .brd_left { font-size: 18px; margin: 24px 0; } .advantage_one .point { font-size: 18px; padding: 15px 10px; } .advantage_one .value { padding: 15px; } .advantage_one .point.ico { padding: 15px 10px; } .advantage_one .point.ico img{ margin-bottom: 16px; } main .ul_modern li:before, main .ol_modern li:before{ font-size: 18px; width: 32px; } main .ul_modern li, main .ol_modern li { padding: 10px 15px; padding-left: 45px; } main .ul_modern, main .ol_modern { gap: 16px; margin: 16px 0 24px; } .i_block { gap: 16px; font-size: 16px; flex-direction: column; align-items: center; margin: 24px 0; } .advantage_one_simple { font-size: 18px; padding: 20px; } .advantage_one_simple img { margin-bottom: 16px; } .num_point { flex-direction: column; gap: 16px; } .num_point .num { font-size: 48px; padding: 24px 10px; width: 100%; } .map{ height: 350px; } .contact_block_wrap + .map{ margin-top: 50px; } .contact_block_wrap{ grid-template-columns: 1fr; gap: 20px; } .contact_info { gap: 16px; } .contact_info .point { font-size: 16px; } .contact_info .point .phone { font-size: 20px; } .num_404{ font-size: 80px; } .text_404 { margin: 30px auto; } .card_top_info .main_ing_wrap{ width: 100%; } .multi_points_value { font-size: 12px; padding: 0 10px; } .multi_points .main_checkbox label { font-size: 14px; } .filter_popup_wrap{ width: 100vw; gap: 16px; padding-right: 0; } .banner_sec > .banner_text{ display: none; } .slick-current .banner_nav_link { top: -100px; left: 70px; width: calc(100% - 140px); height: 170px; z-index: 100; opacity: 0; } .new_2_points, .new_3_points{ grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 24px; margin: 24px 0; } .new_4_points{ grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 24px; margin: 24px 0; } .new_point, .new_ico_point_value{ padding: 0; font-size: 14px; grid-template-columns: 64px 1fr; align-items: start; } .block_list { grid-template-columns: 1fr; margin: 16px 0; } .block_list .img_wrap .img { position: relative; } .ico_block { flex-direction: column; align-items: center; gap: 16px; padding: 16px; font-size: 16px; line-height: 1.5; margin: 16px 0; } .new_ico_point { gap: 16px; padding: 16px; } .accent_block{ padding: 20px 25px; border-radius: 16px; margin: 40px 0; grid-template-columns: 1fr; } .accent_block .title{ font-size: 20px; } .new_review{ padding: 16px; font-size: 16px; } .simple_table table { font-size: 14px; } .simple_table th, .simple_table td { padding: 10px; } .listing_info .listing_filter.listing_filter_dev .cell_wrap_6.cell_wrap_submit, .listing_info .listing_filter.listing_filter_dev .cell_wrap_6.cell_wrap_clear{ grid-column: 1 span; } .listing_info .main_btn.estimate_btn { min-height: 40px; } .review_list { overflow: auto; } .faq{ margin: 24px 0; } .faq_one{ padding: 16px 0; font-size: 16px; } .faq_one .title{ font-size: 18px; } .faq_one .point{ margin-top: 8px; } .faq_one .arr{ top: 16px; } .table td{ padding: 10px; font-size: 14px; line-height: 1.4; } .table tr:first-child td{ font-size: 16px; } .nav_screen .nav_menu .item_service{ display: none; } .contact_info_wrap { padding: 24px 20px; border-radius: 8px; } .contact_block_wrap .social_list{ margin: 24px 0; } .social_list .item{ font-size: 16px; } .text_title { font-size: 18px; margin: 30px 0 16px; } } @media screen and (max-width: 600px) { .how_to_get img { max-height: auto; height: 260px; } } /* End */ /* Start:/local/templates/forvarddom/css/custom.css?17931942564711*/ .no-results_text { text-align: center; font-size: 28px; font-weight: 600; line-height: 150%; } .project_list .no-results_text { grid-column-start: 2; } .b-table-komplekt { border: 1px solid #B2B7C2; width: 100%; font-size: 16px; background: #fff; line-height: 1.25; } .b-table-komplekt b { font-weight: 600; } .b-table-komplekt th { border: 1px solid #B2B7C2; padding: 12px 15px; text-align: center; font-weight: 600; } .b-table-komplekt td { border-left: 1px solid #B2B7C2; border-bottom: 1px solid #B2B7C2; padding: 12px 16px; } .b-table-komplekt tr td:first-child { width: 230px; } .b-table-komplekt_price { font-size: 22px; white-space: nowrap; } .b-table_circle { background: #faa11d; border-radius: 10px; display: inline-block; height: 8px; width: 8px; } .b-table__point { width: 155px; text-align: center; } .b-table_empty { text-align: center; line-height: 2px; } .b-table_empty i { width: 16px; height: 2px; background-color: #C4C4C4; display: inline-block; } .b-table-komplekt__fix-header.affix-top, .b-table-komplekt__fix-header.affix-bottom { position: absolute; opacity: 0; display: none; } .b-table-komplekt__fix-header.affix { position: fixed; z-index: 1; top: auto; opacity: 1; display: block; bottom: 0; outline: 1px solid #B2B7C2; } .b-table-price { width: 1407px; background: #FFF4EC; opacity: .9; } .b-table-price__1 { } .b-table-price__2 { width: 155px; } .b-table-price__3 { width: 155px; } .b-table-price__4 { width: 154px; } .b-table-komplekt__yell { background: #F5F6F7; } .d-none { display: none !important; } .b-table-final-line{ display: flex; justify-content: space-between; align-items: center; } @media (min-width: 768px){ .d-md-table { display: table !important; } .d-md-none { display: none !important; display: none !important; } } @media (min-width: 992px){ .d-lg-block { display: block !important; } } @media (min-width: 1200px){ .d-xl-block { display: block !important; } } @media (max-width: 1496px) { .b-table-price { width: 1147px; } } @media (max-width: 1199px) { .b-table-komplekt tr td:first-child { width: 180px; } .b-table-komplekt th { padding: 8px; } .b-table__point { width: 130px; } .b-table-price { width: 928px; } .b-table-komplekt_price { font-size: 20px; } .b-table-price__2 { width: 130px; } .b-table-price__3 { width: 130px; } .b-table-price__4 { width: 130px; } .b-table-komplekt td { border-left: 1px solid #B2B7C2; border-bottom: 1px solid #B2B7C2; padding: 10px 15px; } .b-card_komplekt{ margin: 0 -16px; } .b-table-komplekt tr:nth-child(2){ position: sticky; top: 56px; /* display: none; */ } .b-table-komplekt tr:last-child{ position: sticky; bottom: 0; } } @media (max-width: 991px) { .b-table-komplekt { font-size: 15px; } .b-table-komplekt tr td:first-child{ vertical-align: top; } .b-table-komplekt td { padding: 8px 12px; } .b-table-komplekt tr td:first-child { width: 130px; } .b-table__point { width: 102px; } .b-table-komplekt__fix-header.affix { left: 0; right: 0; outline: none; } .b-table-price { width: 693px; margin: 0 auto; } .b-table-price__2 { width: 102px; } .b-table-price__3 { width: 102px; } .b-table-price__4 { width: 102px; } .b-table-komplekt_price { font-size: 16px; } } @media (max-width: 767px) { .b-table-price { width: 509px; } .b-table-komplekt th { width: 33%; } .b-table-komplekt td { padding: 5px 7px; font-size: 13px; background: #F8F8F8; } .b-table-komplekt th { background: #fff; padding: 10px; font-size: 14px; } .b-table-komplekt tr td:first-child { width: auto; } .b-table-komplekt tr td:first-child{ vertical-align: middle; } .b-table-komplekt { font-size: 16px; } .b-table-komplekt__fix-header th { padding-bottom: 15px; } } @media (max-width: 575px) { .b-table-price { width: 100%; } .b-table-komplekt_price { font-size: 16px; } .affix .b-table-komplekt_price { font-size: 16px; } .affix .b-table-komplekt_price span { font-size: 14px; } } /* End */ /* /local/templates/forvarddom/css/jquery-ui.css?17931942567141 */ /* /local/templates/forvarddom/css/jquery.mCustomScrollbar.css?179319425652498 */ /* /local/templates/forvarddom/css/slick.css?17931942561758 */ /* /local/templates/forvarddom/css/nice-select.css?17931942564007 */ /* /local/templates/forvarddom/css/plyr.css?179319425632499 */ /* /local/templates/forvarddom/css/magnific-popup.css?17931942567789 */ /* /local/templates/forvarddom/css/style.css?1793194256166502 */ /* /local/templates/forvarddom/css/custom.css?17931942564711 */