/* Start:/bitrix/templates/vebas/css/styles-reset.css?1755796393830*/ @charset "UTF-8"; /* Reset */ /* -------------------------------------------------------------------- */ html { color: #000; background: #fff; } body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, select, textarea, p, blockquote, th, td { margin: 0; padding: 0; } table { border-collapse: collapse; border-spacing: 0; } fieldset, img { border: 0; } ol, ul { list-style: none; list-style-position: inside;} caption, th { text-align: left; } h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; } input, textarea, select { font-family: inherit; font-size: inherit; font-weight: inherit; } legend { color: #000; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } * { box-sizing: border-box; vertical-align: top; } /* End */ /* Start:/bitrix/templates/vebas/js/prettyPhoto/prettyPhoto.css?175579639421806*/ div.pp_default .pp_top, div.pp_default .pp_top .pp_middle, div.pp_default .pp_top .pp_left, div.pp_default .pp_top .pp_right, div.pp_default .pp_bottom, div.pp_default .pp_bottom .pp_left, div.pp_default .pp_bottom .pp_middle, div.pp_default .pp_bottom .pp_right { height: 13px } div.pp_default .pp_top .pp_left { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/default/sprite.png) -78px -93px no-repeat } div.pp_default .pp_top .pp_middle { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/default/sprite_x.png) top left repeat-x } div.pp_default .pp_top .pp_right { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/default/sprite.png) -112px -93px no-repeat } div.pp_default .pp_content .ppt { color: #f8f8f8 } div.pp_default .pp_content_container .pp_left { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/default/sprite_y.png) -7px 0 repeat-y; padding-left: 13px } div.pp_default .pp_content_container .pp_right { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/default/sprite_y.png) top right repeat-y; padding-right: 13px } div.pp_default .pp_next:hover { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/default/sprite_next.png) center right no-repeat; cursor: pointer } div.pp_default .pp_previous:hover { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/default/sprite_prev.png) center left no-repeat; cursor: pointer } div.pp_default .pp_expand { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/default/sprite.png) 0 -29px no-repeat; cursor: pointer; width: 28px; height: 28px } div.pp_default .pp_expand:hover { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/default/sprite.png) 0 -56px no-repeat; cursor: pointer } div.pp_default .pp_contract { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/default/sprite.png) 0 -84px no-repeat; cursor: pointer; width: 28px; height: 28px } div.pp_default .pp_contract:hover { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/default/sprite.png) 0 -113px no-repeat; cursor: pointer } div.pp_default .pp_close { width: 30px; height: 30px; background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/default/sprite.png) 2px 1px no-repeat; cursor: pointer } div.pp_default .pp_gallery ul li a { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/default/default_thumb.png) center center #f8f8f8; border: 1px solid #aaa } div.pp_default .pp_social { margin-top: 7px } div.pp_default .pp_gallery a.pp_arrow_previous, div.pp_default .pp_gallery a.pp_arrow_next { position: static; left: auto } div.pp_default .pp_nav .pp_play, div.pp_default .pp_nav .pp_pause { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/default/sprite.png) -51px 1px no-repeat; height: 30px; width: 30px } div.pp_default .pp_nav .pp_pause { background-position: -51px -29px } div.pp_default a.pp_arrow_previous, div.pp_default a.pp_arrow_next { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/default/sprite.png) -31px -3px no-repeat; height: 20px; width: 20px; margin: 4px 0 0 } div.pp_default a.pp_arrow_next { left: 52px; background-position: -82px -3px } div.pp_default .pp_content_container .pp_details { margin-top: 5px } div.pp_default .pp_nav { clear: none; height: 30px; width: 110px; position: relative } div.pp_default .pp_nav .currentTextHolder { font-family: Georgia; font-style: italic; color: #999; font-size: 11px; left: 75px; line-height: 25px; position: absolute; top: 2px; margin: 0; padding: 0 0 0 10px } div.pp_default .pp_close:hover, div.pp_default .pp_nav .pp_play:hover, div.pp_default .pp_nav .pp_pause:hover, div.pp_default .pp_arrow_next:hover, div.pp_default .pp_arrow_previous:hover { opacity: 0.7 } div.pp_default .pp_description { font-size: 11px; font-weight: 700; line-height: 14px; margin: 5px 50px 5px 0 } div.pp_default .pp_bottom .pp_left { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/default/sprite.png) -78px -127px no-repeat } div.pp_default .pp_bottom .pp_middle { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/default/sprite_x.png) bottom left repeat-x } div.pp_default .pp_bottom .pp_right { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/default/sprite.png) -112px -127px no-repeat } div.pp_default .pp_loaderIcon { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/default/loader.gif) center center no-repeat } div.light_rounded .pp_top .pp_left { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_rounded/sprite.png) -88px -53px no-repeat } div.light_rounded .pp_top .pp_right { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_rounded/sprite.png) -110px -53px no-repeat } div.light_rounded .pp_next:hover { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_rounded/btnNext.png) center right no-repeat; cursor: pointer } div.light_rounded .pp_previous:hover { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_rounded/btnPrevious.png) center left no-repeat; cursor: pointer } div.light_rounded .pp_expand { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_rounded/sprite.png) -31px -26px no-repeat; cursor: pointer } div.light_rounded .pp_expand:hover { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_rounded/sprite.png) -31px -47px no-repeat; cursor: pointer } div.light_rounded .pp_contract { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_rounded/sprite.png) 0 -26px no-repeat; cursor: pointer } div.light_rounded .pp_contract:hover { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_rounded/sprite.png) 0 -47px no-repeat; cursor: pointer } div.light_rounded .pp_close { width: 75px; height: 22px; background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_rounded/sprite.png) -1px -1px no-repeat; cursor: pointer } div.light_rounded .pp_nav .pp_play { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_rounded/sprite.png) -1px -100px no-repeat; height: 15px; width: 14px } div.light_rounded .pp_nav .pp_pause { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_rounded/sprite.png) -24px -100px no-repeat; height: 15px; width: 14px } div.light_rounded .pp_arrow_previous { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_rounded/sprite.png) 0 -71px no-repeat } div.light_rounded .pp_arrow_next { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_rounded/sprite.png) -22px -71px no-repeat } div.light_rounded .pp_bottom .pp_left { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_rounded/sprite.png) -88px -80px no-repeat } div.light_rounded .pp_bottom .pp_right { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_rounded/sprite.png) -110px -80px no-repeat } div.dark_rounded .pp_top .pp_left { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_rounded/sprite.png) -88px -53px no-repeat } div.dark_rounded .pp_top .pp_right { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_rounded/sprite.png) -110px -53px no-repeat } div.dark_rounded .pp_content_container .pp_left { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_rounded/contentPattern.png) top left repeat-y } div.dark_rounded .pp_content_container .pp_right { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_rounded/contentPattern.png) top right repeat-y } div.dark_rounded .pp_next:hover { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_rounded/btnNext.png) center right no-repeat; cursor: pointer } div.dark_rounded .pp_previous:hover { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_rounded/btnPrevious.png) center left no-repeat; cursor: pointer } div.dark_rounded .pp_expand { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_rounded/sprite.png) -31px -26px no-repeat; cursor: pointer } div.dark_rounded .pp_expand:hover { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_rounded/sprite.png) -31px -47px no-repeat; cursor: pointer } div.dark_rounded .pp_contract { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_rounded/sprite.png) 0 -26px no-repeat; cursor: pointer } div.dark_rounded .pp_contract:hover { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_rounded/sprite.png) 0 -47px no-repeat; cursor: pointer } div.dark_rounded .pp_close { width: 75px; height: 22px; background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_rounded/sprite.png) -1px -1px no-repeat; cursor: pointer } div.dark_rounded .pp_description { margin-right: 85px; color: #fff } div.dark_rounded .pp_nav .pp_play { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_rounded/sprite.png) -1px -100px no-repeat; height: 15px; width: 14px } div.dark_rounded .pp_nav .pp_pause { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_rounded/sprite.png) -24px -100px no-repeat; height: 15px; width: 14px } div.dark_rounded .pp_arrow_previous { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_rounded/sprite.png) 0 -71px no-repeat } div.dark_rounded .pp_arrow_next { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_rounded/sprite.png) -22px -71px no-repeat } div.dark_rounded .pp_bottom .pp_left { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_rounded/sprite.png) -88px -80px no-repeat } div.dark_rounded .pp_bottom .pp_right { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_rounded/sprite.png) -110px -80px no-repeat } div.dark_rounded .pp_loaderIcon { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_rounded/loader.gif) center center no-repeat } div.dark_square .pp_left, div.dark_square .pp_middle, div.dark_square .pp_right, div.dark_square .pp_content { background: #000 } div.dark_square .pp_description { color: #fff; margin: 0 85px 0 0 } div.dark_square .pp_loaderIcon { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_square/loader.gif) center center no-repeat } div.dark_square .pp_expand { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_square/sprite.png) -31px -26px no-repeat; cursor: pointer } div.dark_square .pp_expand:hover { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_square/sprite.png) -31px -47px no-repeat; cursor: pointer } div.dark_square .pp_contract { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_square/sprite.png) 0 -26px no-repeat; cursor: pointer } div.dark_square .pp_contract:hover { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_square/sprite.png) 0 -47px no-repeat; cursor: pointer } div.dark_square .pp_close { width: 75px; height: 22px; background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_square/sprite.png) -1px -1px no-repeat; cursor: pointer } div.dark_square .pp_nav { clear: none } div.dark_square .pp_nav .pp_play { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_square/sprite.png) -1px -100px no-repeat; height: 15px; width: 14px } div.dark_square .pp_nav .pp_pause { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_square/sprite.png) -24px -100px no-repeat; height: 15px; width: 14px } div.dark_square .pp_arrow_previous { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_square/sprite.png) 0 -71px no-repeat } div.dark_square .pp_arrow_next { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_square/sprite.png) -22px -71px no-repeat } div.dark_square .pp_next:hover { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_square/btnNext.png) center right no-repeat; cursor: pointer } div.dark_square .pp_previous:hover { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_square/btnPrevious.png) center left no-repeat; cursor: pointer } div.light_square .pp_expand { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_square/sprite.png) -31px -26px no-repeat; cursor: pointer } div.light_square .pp_expand:hover { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_square/sprite.png) -31px -47px no-repeat; cursor: pointer } div.light_square .pp_contract { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_square/sprite.png) 0 -26px no-repeat; cursor: pointer } div.light_square .pp_contract:hover { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_square/sprite.png) 0 -47px no-repeat; cursor: pointer } div.light_square .pp_close { width: 75px; height: 22px; background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_square/sprite.png) -1px -1px no-repeat; cursor: pointer } div.light_square .pp_nav .pp_play { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_square/sprite.png) -1px -100px no-repeat; height: 15px; width: 14px } div.light_square .pp_nav .pp_pause { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_square/sprite.png) -24px -100px no-repeat; height: 15px; width: 14px } div.light_square .pp_arrow_previous { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_square/sprite.png) 0 -71px no-repeat } div.light_square .pp_arrow_next { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_square/sprite.png) -22px -71px no-repeat } div.light_square .pp_next:hover { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_square/btnNext.png) center right no-repeat; cursor: pointer } div.light_square .pp_previous:hover { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_square/btnPrevious.png) center left no-repeat; cursor: pointer } div.facebook .pp_top .pp_left { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/facebook/sprite.png) -88px -53px no-repeat } div.facebook .pp_top .pp_middle { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/facebook/contentPatternTop.png) top left repeat-x } div.facebook .pp_top .pp_right { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/facebook/sprite.png) -110px -53px no-repeat } div.facebook .pp_content_container .pp_left { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/facebook/contentPatternLeft.png) top left repeat-y } div.facebook .pp_content_container .pp_right { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/facebook/contentPatternRight.png) top right repeat-y } div.facebook .pp_expand { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/facebook/sprite.png) -31px -26px no-repeat; cursor: pointer } div.facebook .pp_expand:hover { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/facebook/sprite.png) -31px -47px no-repeat; cursor: pointer } div.facebook .pp_contract { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/facebook/sprite.png) 0 -26px no-repeat; cursor: pointer } div.facebook .pp_contract:hover { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/facebook/sprite.png) 0 -47px no-repeat; cursor: pointer } div.facebook .pp_close { width: 22px; height: 22px; background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/facebook/sprite.png) -1px -1px no-repeat; cursor: pointer } div.facebook .pp_description { margin: 0 37px 0 0 } div.facebook .pp_loaderIcon { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/facebook/loader.gif) center center no-repeat } div.facebook .pp_arrow_previous { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/facebook/sprite.png) 0 -71px no-repeat; height: 22px; margin-top: 0; width: 22px } div.facebook .pp_arrow_previous.disabled { background-position: 0 -96px; cursor: default } div.facebook .pp_arrow_next { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/facebook/sprite.png) -32px -71px no-repeat; height: 22px; margin-top: 0; width: 22px } div.facebook .pp_arrow_next.disabled { background-position: -32px -96px; cursor: default } div.facebook .pp_nav { margin-top: 0 } div.facebook .pp_nav p { font-size: 15px; padding: 0 3px 0 4px } div.facebook .pp_nav .pp_play { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/facebook/sprite.png) -1px -123px no-repeat; height: 22px; width: 22px } div.facebook .pp_nav .pp_pause { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/facebook/sprite.png) -32px -123px no-repeat; height: 22px; width: 22px } div.facebook .pp_next:hover { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/facebook/btnNext.png) center right no-repeat; cursor: pointer } div.facebook .pp_previous:hover { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/facebook/btnPrevious.png) center left no-repeat; cursor: pointer } div.facebook .pp_bottom .pp_left { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/facebook/sprite.png) -88px -80px no-repeat } div.facebook .pp_bottom .pp_middle { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/facebook/contentPatternBottom.png) top left repeat-x } div.facebook .pp_bottom .pp_right { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/facebook/sprite.png) -110px -80px no-repeat } div.pp_pic_holder a:focus { outline: none } div.pp_overlay { background: #000; display: none; left: 0; position: absolute; top: 0; width: 100%; z-index: 9500 } div.pp_pic_holder { display: none; position: absolute; width: 100px; z-index: 10000 } .pp_content { height: 40px; min-width: 40px } * html .pp_content { width: 40px } .pp_content_container { position: relative; text-align: left; width: 100% } .pp_content_container .pp_left { padding-left: 20px } .pp_content_container .pp_right { padding-right: 20px } .pp_content_container .pp_details { float: left; margin: 10px 0 2px } .pp_description { display: none; margin: 0 } .pp_social { float: left; margin: 0 } .pp_social .facebook { float: left; margin-left: 5px; width: 55px; overflow: hidden } .pp_social .twitter { float: left } .pp_nav { clear: right; float: left; margin: 3px 10px 0 0 } .pp_nav p { float: left; white-space: nowrap; margin: 2px 4px } .pp_nav .pp_play, .pp_nav .pp_pause { float: left; margin-right: 4px; text-indent: -10000px } a.pp_arrow_previous, a.pp_arrow_next { display: block; float: left; height: 15px; margin-top: 3px; overflow: hidden; text-indent: -10000px; width: 14px } .pp_hoverContainer { position: absolute; top: 0; width: 100%; z-index: 2000 } .pp_gallery { display: none; left: 50%; margin-top: -50px; position: absolute; z-index: 10000 } .pp_gallery div { float: left; overflow: hidden; position: relative } .pp_gallery ul { float: left; height: 35px; position: relative; white-space: nowrap; margin: 0 0 0 5px; padding: 0 } .pp_gallery ul a { border: 1px rgba(0, 0, 0, 0.5) solid; display: block; float: left; height: 33px; overflow: hidden } .pp_gallery ul a img { border: 0 } .pp_gallery li { display: block; float: left; margin: 0 5px 0 0; padding: 0 } .pp_gallery li.default a { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/facebook/default_thumbnail.gif) 0 0 no-repeat; display: block; height: 33px; width: 50px } .pp_gallery .pp_arrow_previous, .pp_gallery .pp_arrow_next { margin-top: 7px !important } a.pp_next { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_rounded/btnNext.png) 10000px 10000px no-repeat; display: block; float: right; height: 100%; text-indent: -10000px; width: 49% } a.pp_previous { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_rounded/btnNext.png) 10000px 10000px no-repeat; display: block; float: left; height: 100%; text-indent: -10000px; width: 49% } a.pp_expand, a.pp_contract { cursor: pointer; display: none; height: 20px; position: absolute; right: 30px; text-indent: -10000px; top: 10px; width: 20px; z-index: 20000 } a.pp_close { position: absolute; right: 0; top: 0; display: block; line-height: 22px; text-indent: -10000px } .pp_loaderIcon { display: block; height: 24px; left: 50%; position: absolute; top: 50%; width: 24px; margin: -12px 0 0 -12px } #pp_full_res { line-height: 1 !important } #pp_full_res .pp_inline { text-align: left } #pp_full_res .pp_inline p { margin: 0 0 15px } div.ppt { color: #fff; display: none; font-size: 17px; z-index: 9999; margin: 0 0 5px 15px } div.pp_default .pp_content, div.light_rounded .pp_content { background-color: #fff } div.pp_default #pp_full_res .pp_inline, div.light_rounded .pp_content .ppt, div.light_rounded #pp_full_res .pp_inline, div.light_square .pp_content .ppt, div.light_square #pp_full_res .pp_inline, div.facebook .pp_content .ppt, div.facebook #pp_full_res .pp_inline { color: #000 } div.pp_default .pp_gallery ul li a:hover, div.pp_default .pp_gallery ul li.selected a, .pp_gallery ul a:hover, .pp_gallery li.selected a { border-color: #fff } div.pp_default .pp_details, div.light_rounded .pp_details, div.dark_rounded .pp_details, div.dark_square .pp_details, div.light_square .pp_details, div.facebook .pp_details { position: relative } div.light_rounded .pp_top .pp_middle, div.light_rounded .pp_content_container .pp_left, div.light_rounded .pp_content_container .pp_right, div.light_rounded .pp_bottom .pp_middle, div.light_square .pp_left, div.light_square .pp_middle, div.light_square .pp_right, div.light_square .pp_content, div.facebook .pp_content { background: #fff } div.light_rounded .pp_description, div.light_square .pp_description { margin-right: 85px } div.light_rounded .pp_gallery a.pp_arrow_previous, div.light_rounded .pp_gallery a.pp_arrow_next, div.dark_rounded .pp_gallery a.pp_arrow_previous, div.dark_rounded .pp_gallery a.pp_arrow_next, div.dark_square .pp_gallery a.pp_arrow_previous, div.dark_square .pp_gallery a.pp_arrow_next, div.light_square .pp_gallery a.pp_arrow_previous, div.light_square .pp_gallery a.pp_arrow_next { margin-top: 12px !important } div.light_rounded .pp_arrow_previous.disabled, div.dark_rounded .pp_arrow_previous.disabled, div.dark_square .pp_arrow_previous.disabled, div.light_square .pp_arrow_previous.disabled { background-position: 0 -87px; cursor: default } div.light_rounded .pp_arrow_next.disabled, div.dark_rounded .pp_arrow_next.disabled, div.dark_square .pp_arrow_next.disabled, div.light_square .pp_arrow_next.disabled { background-position: -22px -87px; cursor: default } div.light_rounded .pp_loaderIcon, div.light_square .pp_loaderIcon { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/light_rounded/loader.gif) center center no-repeat } div.dark_rounded .pp_top .pp_middle, div.dark_rounded .pp_content, div.dark_rounded .pp_bottom .pp_middle { background: url(/bitrix/templates/vebas/js/prettyPhoto/images/prettyPhoto/dark_rounded/contentPattern.png) top left repeat } div.dark_rounded .currentTextHolder, div.dark_square .currentTextHolder { color: #c4c4c4 } div.dark_rounded #pp_full_res .pp_inline, div.dark_square #pp_full_res .pp_inline { color: #fff } .pp_top, .pp_bottom { height: 20px; position: relative } * html .pp_top, * html .pp_bottom { padding: 0 20px } .pp_top .pp_left, .pp_bottom .pp_left { height: 20px; left: 0; position: absolute; width: 20px } .pp_top .pp_middle, .pp_bottom .pp_middle { height: 20px; left: 20px; position: absolute; right: 20px } * html .pp_top .pp_middle, * html .pp_bottom .pp_middle { left: 0; position: static } .pp_top .pp_right, .pp_bottom .pp_right { height: 20px; left: auto; position: absolute; right: 0; top: 0; width: 20px } .pp_fade, .pp_gallery li.default a img { display: none } @media only screen and (max-device-width: 600px) { .pp_pic_holder.pp_default { width: 100% !important; left: 0 !important; overflow: hidden; } div.pp_default .pp_content_container .pp_left { padding-left: 0 !important; } div.pp_default .pp_content_container .pp_right { padding-right: 0 !important; } .pp_content { width: 100% !important; height: auto !important; } .pp_fade { width: 100% !important; height: 100% !important; } a.pp_expand, a.pp_contract, .pp_hoverContainer, .pp_gallery, .pp_top, .pp_bottom { display: none !important; } #pp_full_res img { width: 100% !important; height: auto !important; } .pp_details { width: 94% !important; padding-left: 3%; padding-right: 4%; padding-top: 10px; padding-bottom: 10px; background-color: #fff; margin-top: -2px !important; } a.pp_close { right: 10px !important; top: 10px !important; } } /* End */ /* Start:/bitrix/templates/vebas/js/magnific-popup/magnific-popup.css?17557963937043*/ /* 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; } .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; 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; background: white; padding: 4rem; width: auto; max-width: 500px; margin: 20px auto; 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; box-shadow: none; touch-action: manipulation; } 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; 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; } .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; margin: 0; top: 50%; margin-top: -55px; padding: 0; width: 90px; height: 110px; -webkit-tap-highlight-color: transparent; } .mfp-arrow:active { margin-top: -54px; } .mfp-arrow:hover, .mfp-arrow:focus { opacity: 1; } .mfp-arrow:before, .mfp-arrow:after { 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 { border-top-width: 13px; border-bottom-width: 13px; top: 8px; } .mfp-arrow:before { border-top-width: 21px; border-bottom-width: 21px; opacity: 0.7; } .mfp-arrow-left { left: 0; } .mfp-arrow-left:after { border-right: 17px solid #FFF; margin-left: 31px; } .mfp-arrow-left:before { margin-left: 25px; border-right: 27px solid #3F3F3F; } .mfp-arrow-right { right: 0; } .mfp-arrow-right:after { border-left: 17px solid #FFF; margin-left: 39px; } .mfp-arrow-right:before { 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; 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; 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; } } /* End */ /* Start:/bitrix/templates/vebas/js/swiper/swiper-bundle.css?175579639419297*/ /** * Swiper 8.3.2 * Most modern mobile touch slider and framework with hardware accelerated transitions * https://swiperjs.com * * Copyright 2014-2022 Vladimir Kharlampidi * * Released under the MIT License * * Released on: July 26, 2022 */ @font-face { font-family: 'swiper-icons'; src: url('data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA'); font-weight: 400; font-style: normal; } :root { --swiper-theme-color: #007aff; } .swiper { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; list-style: none; padding: 0; /* Fix of Webkit flickering */ z-index: 1; } .swiper-vertical > .swiper-wrapper { flex-direction: column; } .swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: flex; transition-property: transform; box-sizing: content-box; } .swiper-android .swiper-slide, .swiper-wrapper { transform: translate3d(0px, 0, 0); } .swiper-pointer-events { touch-action: pan-y; } .swiper-pointer-events.swiper-vertical { touch-action: pan-x; } .swiper-slide { flex-shrink: 0; width: 100%; height: 100%; position: relative; transition-property: transform; } .swiper-slide-invisible-blank { visibility: hidden; } /* Auto Height */ .swiper-autoheight, .swiper-autoheight .swiper-slide { height: auto; } .swiper-autoheight .swiper-wrapper { align-items: flex-start; transition-property: transform, height; } .swiper-backface-hidden .swiper-slide { transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; } /* 3D Effects */ .swiper-3d, .swiper-3d.swiper-css-mode .swiper-wrapper { perspective: 1200px; } .swiper-3d .swiper-wrapper, .swiper-3d .swiper-slide, .swiper-3d .swiper-slide-shadow, .swiper-3d .swiper-slide-shadow-left, .swiper-3d .swiper-slide-shadow-right, .swiper-3d .swiper-slide-shadow-top, .swiper-3d .swiper-slide-shadow-bottom, .swiper-3d .swiper-cube-shadow { transform-style: preserve-3d; } .swiper-3d .swiper-slide-shadow, .swiper-3d .swiper-slide-shadow-left, .swiper-3d .swiper-slide-shadow-right, .swiper-3d .swiper-slide-shadow-top, .swiper-3d .swiper-slide-shadow-bottom { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; z-index: 10; } .swiper-3d .swiper-slide-shadow { background: rgba(0, 0, 0, 0.15); } .swiper-3d .swiper-slide-shadow-left { background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); } .swiper-3d .swiper-slide-shadow-right { background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); } .swiper-3d .swiper-slide-shadow-top { background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); } .swiper-3d .swiper-slide-shadow-bottom { background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); } /* CSS Mode */ .swiper-css-mode > .swiper-wrapper { overflow: auto; scrollbar-width: none; /* For Firefox */ -ms-overflow-style: none; /* For Internet Explorer and Edge */ } .swiper-css-mode > .swiper-wrapper::-webkit-scrollbar { display: none; } .swiper-css-mode > .swiper-wrapper > .swiper-slide { scroll-snap-align: start start; } .swiper-horizontal.swiper-css-mode > .swiper-wrapper { scroll-snap-type: x mandatory; } .swiper-vertical.swiper-css-mode > .swiper-wrapper { scroll-snap-type: y mandatory; } .swiper-centered > .swiper-wrapper::before { content: ''; flex-shrink: 0; order: 9999; } .swiper-centered.swiper-horizontal > .swiper-wrapper > .swiper-slide:first-child { margin-inline-start: var(--swiper-centered-offset-before); } .swiper-centered.swiper-horizontal > .swiper-wrapper::before { height: 100%; min-height: 1px; width: var(--swiper-centered-offset-after); } .swiper-centered.swiper-vertical > .swiper-wrapper > .swiper-slide:first-child { margin-block-start: var(--swiper-centered-offset-before); } .swiper-centered.swiper-vertical > .swiper-wrapper::before { width: 100%; min-width: 1px; height: var(--swiper-centered-offset-after); } .swiper-centered > .swiper-wrapper > .swiper-slide { scroll-snap-align: center center; } .swiper-virtual .swiper-slide { -webkit-backface-visibility: hidden; transform: translateZ(0); } .swiper-virtual.swiper-css-mode .swiper-wrapper::after { content: ''; position: absolute; left: 0; top: 0; pointer-events: none; } .swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after { height: 1px; width: var(--swiper-virtual-size); } .swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after { width: 1px; height: var(--swiper-virtual-size); } :root { --swiper-navigation-size: 44px; /* --swiper-navigation-color: var(--swiper-theme-color); */ } .swiper-button-prev, .swiper-button-next { position: absolute; top: 50%; width: calc(var(--swiper-navigation-size) / 44 * 27); height: var(--swiper-navigation-size); margin-top: calc(0px - (var(--swiper-navigation-size) / 2)); z-index: 10; cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--swiper-navigation-color, var(--swiper-theme-color)); } .swiper-button-prev.swiper-button-disabled, .swiper-button-next.swiper-button-disabled { opacity: 0.35; cursor: auto; pointer-events: none; } .swiper-button-prev.swiper-button-hidden, .swiper-button-next.swiper-button-hidden { opacity: 0; cursor: auto; pointer-events: none; } .swiper-navigation-disabled .swiper-button-prev, .swiper-navigation-disabled .swiper-button-next { display: none !important; } .swiper-button-prev:after, .swiper-button-next:after { font-family: swiper-icons; font-size: var(--swiper-navigation-size); text-transform: none !important; letter-spacing: 0; font-variant: initial; line-height: 1; } .swiper-button-prev, .swiper-rtl .swiper-button-next { left: 10px; right: auto; } .swiper-button-prev:after, .swiper-rtl .swiper-button-next:after { content: 'prev'; } .swiper-button-next, .swiper-rtl .swiper-button-prev { right: 10px; left: auto; } .swiper-button-next:after, .swiper-rtl .swiper-button-prev:after { content: 'next'; } .swiper-button-lock { display: none; } :root { /* --swiper-pagination-color: var(--swiper-theme-color); --swiper-pagination-bullet-size: 8px; --swiper-pagination-bullet-width: 8px; --swiper-pagination-bullet-height: 8px; --swiper-pagination-bullet-inactive-color: #000; --swiper-pagination-bullet-inactive-opacity: 0.2; --swiper-pagination-bullet-opacity: 1; --swiper-pagination-bullet-horizontal-gap: 4px; --swiper-pagination-bullet-vertical-gap: 6px; */ } .swiper-pagination { position: absolute; text-align: center; transition: 300ms opacity; transform: translate3d(0, 0, 0); z-index: 10; } .swiper-pagination.swiper-pagination-hidden { opacity: 0; } .swiper-pagination-disabled > .swiper-pagination, .swiper-pagination.swiper-pagination-disabled { display: none !important; } /* Common Styles */ .swiper-pagination-fraction, .swiper-pagination-custom, .swiper-horizontal > .swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal { bottom: 10px; left: 0; width: 100%; } /* Bullets */ .swiper-pagination-bullets-dynamic { overflow: hidden; font-size: 0; } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet { transform: scale(0.33); position: relative; } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active { transform: scale(1); } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main { transform: scale(1); } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev { transform: scale(0.66); } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev { transform: scale(0.33); } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next { transform: scale(0.66); } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next { transform: scale(0.33); } .swiper-pagination-bullet { width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px)); height: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px)); display: inline-block; border-radius: 50%; background: var(--swiper-pagination-bullet-inactive-color, #000); opacity: var(--swiper-pagination-bullet-inactive-opacity, 0.2); } button.swiper-pagination-bullet { border: none; margin: 0; padding: 0; box-shadow: none; -webkit-appearance: none; appearance: none; } .swiper-pagination-clickable .swiper-pagination-bullet { cursor: pointer; } .swiper-pagination-bullet:only-child { display: none !important; } .swiper-pagination-bullet-active { opacity: var(--swiper-pagination-bullet-opacity, 1); background: var(--swiper-pagination-color, var(--swiper-theme-color)); } .swiper-vertical > .swiper-pagination-bullets, .swiper-pagination-vertical.swiper-pagination-bullets { right: 10px; top: 50%; transform: translate3d(0px, -50%, 0); } .swiper-vertical > .swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet { margin: var(--swiper-pagination-bullet-vertical-gap, 6px) 0; display: block; } .swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic, .swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic { top: 50%; transform: translateY(-50%); width: 8px; } .swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet, .swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { display: inline-block; transition: 200ms transform, 200ms top; } .swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 4px); } .swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic, .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic { left: 50%; transform: translateX(-50%); white-space: nowrap; } .swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { transition: 200ms transform, 200ms left; } .swiper-horizontal.swiper-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet { transition: 200ms transform, 200ms right; } /* Progress */ .swiper-pagination-progressbar { background: rgba(0, 0, 0, 0.25); position: absolute; } .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background: var(--swiper-pagination-color, var(--swiper-theme-color)); position: absolute; left: 0; top: 0; width: 100%; height: 100%; transform: scale(0); transform-origin: left top; } .swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { transform-origin: right top; } .swiper-horizontal > .swiper-pagination-progressbar, .swiper-pagination-progressbar.swiper-pagination-horizontal, .swiper-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite, .swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite { width: 100%; height: 4px; left: 0; top: 0; } .swiper-vertical > .swiper-pagination-progressbar, .swiper-pagination-progressbar.swiper-pagination-vertical, .swiper-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite, .swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite { width: 4px; height: 100%; left: 0; top: 0; } .swiper-pagination-lock { display: none; } /* Scrollbar */ .swiper-scrollbar { border-radius: 10px; position: relative; -ms-touch-action: none; background: rgba(0, 0, 0, 0.1); } .swiper-scrollbar-disabled > .swiper-scrollbar, .swiper-scrollbar.swiper-scrollbar-disabled { display: none !important; } .swiper-horizontal > .swiper-scrollbar, .swiper-scrollbar.swiper-scrollbar-horizontal { position: absolute; left: 1%; bottom: 3px; z-index: 50; height: 5px; width: 98%; } .swiper-vertical > .swiper-scrollbar, .swiper-scrollbar.swiper-scrollbar-vertical { position: absolute; right: 3px; top: 1%; z-index: 50; width: 5px; height: 98%; } .swiper-scrollbar-drag { height: 100%; width: 100%; position: relative; background: rgba(0, 0, 0, 0.5); border-radius: 10px; left: 0; top: 0; } .swiper-scrollbar-cursor-drag { cursor: move; } .swiper-scrollbar-lock { display: none; } .swiper-zoom-container { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; text-align: center; } .swiper-zoom-container > img, .swiper-zoom-container > svg, .swiper-zoom-container > canvas { max-width: 100%; max-height: 100%; object-fit: contain; } .swiper-slide-zoomed { cursor: move; } /* Preloader */ :root { /* --swiper-preloader-color: var(--swiper-theme-color); */ } .swiper-lazy-preloader { width: 42px; height: 42px; position: absolute; left: 50%; top: 50%; margin-left: -21px; margin-top: -21px; z-index: 10; transform-origin: 50%; box-sizing: border-box; border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color)); border-radius: 50%; border-top-color: transparent; } .swiper:not(.swiper-watch-progress) .swiper-lazy-preloader, .swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader { animation: swiper-preloader-spin 1s infinite linear; } .swiper-lazy-preloader-white { --swiper-preloader-color: #fff; } .swiper-lazy-preloader-black { --swiper-preloader-color: #000; } @keyframes swiper-preloader-spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } /* a11y */ .swiper .swiper-notification { position: absolute; left: 0; top: 0; pointer-events: none; opacity: 0; z-index: -1000; } .swiper-free-mode > .swiper-wrapper { transition-timing-function: ease-out; margin: 0 auto; } .swiper-grid > .swiper-wrapper { flex-wrap: wrap; } .swiper-grid-column > .swiper-wrapper { flex-wrap: wrap; flex-direction: column; } .swiper-fade.swiper-free-mode .swiper-slide { transition-timing-function: ease-out; } .swiper-fade .swiper-slide { pointer-events: none; transition-property: opacity; } .swiper-fade .swiper-slide .swiper-slide { pointer-events: none; } .swiper-fade .swiper-slide-active, .swiper-fade .swiper-slide-active .swiper-slide-active { pointer-events: auto; } .swiper-cube { overflow: visible; } .swiper-cube .swiper-slide { pointer-events: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 1; visibility: hidden; transform-origin: 0 0; width: 100%; height: 100%; } .swiper-cube .swiper-slide .swiper-slide { pointer-events: none; } .swiper-cube.swiper-rtl .swiper-slide { transform-origin: 100% 0; } .swiper-cube .swiper-slide-active, .swiper-cube .swiper-slide-active .swiper-slide-active { pointer-events: auto; } .swiper-cube .swiper-slide-active, .swiper-cube .swiper-slide-next, .swiper-cube .swiper-slide-prev, .swiper-cube .swiper-slide-next + .swiper-slide { pointer-events: auto; visibility: visible; } .swiper-cube .swiper-slide-shadow-top, .swiper-cube .swiper-slide-shadow-bottom, .swiper-cube .swiper-slide-shadow-left, .swiper-cube .swiper-slide-shadow-right { z-index: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .swiper-cube .swiper-cube-shadow { position: absolute; left: 0; bottom: 0px; width: 100%; height: 100%; opacity: 0.6; z-index: 0; } .swiper-cube .swiper-cube-shadow:before { content: ''; background: #000; position: absolute; left: 0; top: 0; bottom: 0; right: 0; filter: blur(50px); } .swiper-flip { overflow: visible; } .swiper-flip .swiper-slide { pointer-events: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 1; } .swiper-flip .swiper-slide .swiper-slide { pointer-events: none; } .swiper-flip .swiper-slide-active, .swiper-flip .swiper-slide-active .swiper-slide-active { pointer-events: auto; } .swiper-flip .swiper-slide-shadow-top, .swiper-flip .swiper-slide-shadow-bottom, .swiper-flip .swiper-slide-shadow-left, .swiper-flip .swiper-slide-shadow-right { z-index: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .swiper-creative .swiper-slide { -webkit-backface-visibility: hidden; backface-visibility: hidden; overflow: hidden; transition-property: transform, opacity, height; } .swiper-cards { overflow: visible; } .swiper-cards .swiper-slide { transform-origin: center bottom; -webkit-backface-visibility: hidden; backface-visibility: hidden; overflow: hidden; } /* End */ /* Start:/bitrix/templates/vebas/css/styles-theme.css?17630925531678*/ @charset "UTF-8"; :root { --color-blue: #125d84; --color-dark-blue: #15384f; --color-yellow: #c59822; --color-red: #d32222; --color-green: #2adfa0; --color-white: #ffffff; --color-black: #000000; --color-gray: #f8f8f8; --color-light-gray: #f4f4f4; --color-dark-gray: #333; --link-color: var(--color-blue); --text-color: #333; --background-color: white; --heading-color: black; --span: 2rem; --span-small: 1rem; --span-large: 4rem; --span-x-large: 8rem; --container-gap: var(--span-large); --block-padding: var(--span-x-large); --block-inner-padding: var(--span-x-large); --item-width: 35rem; --page-width: 1400px; --input-height: 6rem; --input-color: #f3f3f3; --input-border-color: var(--color-gray); --input-border: 2px solid var(--input-border-color); --input-active-border: 2px solid var(--color-blue); --input-padding: var(--span-small) var(--span); --button-height: 6rem; --button-color: var(--color-blue); --button-text-color: white; --button-icon-color: white; --button-hover-color: black; --button-hover-text-color: white; --button-hover-icon-color: white; --border-radius: 1rem; --border-radius-large: 3rem; --shadow: 0 0 8px 0 #0003; --font: "Roboto", sans-serif; --root-font-size: 10px; } @media screen and (max-width: 768px) { :root { --block-padding: 4rem; --container-gap: 2rem; } } @media screen and (max-width: 640px) { :root { } } @media screen and (min-width: 2000px) { :root { --page-width: 1800px; --root-font-size: 14px; } } @media screen and (min-width: 3000px) { :root { --page-width: 2400px; --root-font-size: 16px; } } /* End */ /* Start:/bitrix/templates/vebas/css/styles-icons.css?17767543075539*/ i[data-icon] { --image: linear-gradient(transparent, transparent); display: inline-block; width: 2rem; height: 2rem; mask: var(--image) center / contain no-repeat; -webkit-mask: var(--image) center / contain no-repeat; background: black; } i[data-bg] { --image: linear-gradient(transparent, transparent); display: inline-block; width: 2rem; height: 2rem; background: var(--image) center/contain no-repeat; } i.round { width: 2.5rem; height: 2.5rem; border-radius: 50%; flex-grow: 0; mask: none; -webkit-mask:none; background: var(--color-blue); position: relative; } i.round::after { content:''; display: inline-block; width: 60%; height: 60%; mask: var(--image) center / contain no-repeat; -webkit-mask: var(--image) center / contain no-repeat; background: white; left: 50%; top: 50%; transform: translate(-50%, -50%); position: absolute; } i[data-icon="header-whatsapp"] { --image: url(/bitrix/templates/vebas/css/../img/icons/header-whatsapp.png)} i[data-icon="company-info"] { --image: url(/bitrix/templates/vebas/css/../img/icons/company-info.png)} i[data-icon="company-bank-info"] { --image: url(/bitrix/templates/vebas/css/../img/icons/company-bank-info.png)} i[data-icon="arrow-right"] { --image: url(/bitrix/templates/vebas/css/../img/icons/arrow-right.png); } i[data-icon="arrow-left"] { --image: url(/bitrix/templates/vebas/css/../img/icons/arrow-left.png); } i[data-icon="arrow-up"] { --image: url(/bitrix/templates/vebas/css/../img/icons/arrow-up.png); } i[data-icon="arrow-down"] { --image: url(/bitrix/templates/vebas/css/../img/icons/arrow-down.png); } i[data-icon="arrow-down-narrow"] { --image: url(/bitrix/templates/vebas/css/../img/icons/arrow-down-narrow.svg); } i[data-icon="burger"] { --image: url(/bitrix/templates/vebas/css/../img/icons/burger.svg); } i[data-icon="submit"] { --image: url(/bitrix/templates/vebas/css/../img/icons/submit.png); } i[data-icon="close"] { --image: url(/bitrix/templates/vebas/css/../img/icons/close.svg); } i[data-icon="search"] { --image: url(/bitrix/templates/vebas/css/../img/icons/search.png); } i[data-icon="zoom"] { --image: url(/bitrix/templates/vebas/css/../img/icons/zoom.png); } i[data-icon="more"] { --image: url(/bitrix/templates/vebas/css/../img/icons/more.png); } i[data-icon="worktime"] { --image: url(/bitrix/templates/vebas/css/../img/icons/worktime.png); } i[data-icon="phone"] { --image: url(/bitrix/templates/vebas/css/../img/icons/phone.png)} i[data-icon="location"] { --image: url(/bitrix/templates/vebas/css/../img/icons/location.png);} i[data-icon="download"] { --image: url(/bitrix/templates/vebas/css/../img/icons/download.png);} i[data-icon="email"] { --image: url(/bitrix/templates/vebas/css/../img/icons/email.png); } i[data-icon="call"] { --image: url(/bitrix/templates/vebas/css/../img/icons/call.png); } i[data-icon="call-phone"] { --image: url(/bitrix/templates/vebas/css/../img/icons/call-phone.png); } i[data-icon="social-vk"] { --image: url(/bitrix/templates/vebas/css/../img/icons/social-vk.png); } i[data-icon="social-whatsapp"] { --image: url(/bitrix/templates/vebas/css/../img/icons/social-whatsapp.png); } i[data-icon="social-telegram"] { --image: url(/bitrix/templates/vebas/css/../img/icons/social-telegram.png); } i[data-icon="advantages-1"] { --image: url(/bitrix/templates/vebas/css/../img/icons/advantages-1.png); } i[data-icon="advantages-2"] { --image: url(/bitrix/templates/vebas/css/../img/icons/advantages-2.png); } i[data-icon="advantages-3"] { --image: url(/bitrix/templates/vebas/css/../img/icons/advantages-3.png); } i[data-icon="advantages-4"] { --image: url(/bitrix/templates/vebas/css/../img/icons/advantages-4.png); } i[data-icon="advantages-5"] { --image: url(/bitrix/templates/vebas/css/../img/icons/advantages-5.png); } i[data-icon="advantages-6"] { --image: url(/bitrix/templates/vebas/css/../img/icons/advantages-6.png); } i[data-icon="advantages-7"] { --image: url(/bitrix/templates/vebas/css/../img/icons/advantages-7.png); } i[data-icon="advantages-8"] { --image: url(/bitrix/templates/vebas/css/../img/icons/advantages-8.png); } i[data-icon="advantages-9"] { --image: url(/bitrix/templates/vebas/css/../img/icons/advantages-9.png); } i[data-icon="properties-technical"] { --image: url(/bitrix/templates/vebas/css/../img/icons/properties-technical.png); } i[data-icon="properties-delivery"] { --image: url(/bitrix/templates/vebas/css/../img/icons/properties-delivery.png); } i[data-icon="properties-features"] { --image: url(/bitrix/templates/vebas/css/../img/icons/properties-features.png); } i[data-icon="header-1"] { --image: url(/bitrix/templates/vebas/css/../img/icons/header-1.png); } i[data-icon="header-2"] { --image: url(/bitrix/templates/vebas/css/../img/icons/header-2.png); } i[data-icon="header-3"] { --image: url(/bitrix/templates/vebas/css/../img/icons/header-3.png); } i[data-icon="header-4"] { --image: url(/bitrix/templates/vebas/css/../img/icons/header-4.png); } i[data-icon="numbers-1"] { --image: url(/bitrix/templates/vebas/css/../img/icons/numbers-1.png); } i[data-icon="numbers-2"] { --image: url(/bitrix/templates/vebas/css/../img/icons/numbers-2.png); } i[data-icon="numbers-3"] { --image: url(/bitrix/templates/vebas/css/../img/icons/numbers-3.png); } i[data-icon="category-1"] { --image: url(/bitrix/templates/vebas/css/../img/icons/category-1.svg); } i[data-icon="category-2"] { --image: url(/bitrix/templates/vebas/css/../img/icons/category-2.svg); } i[data-icon="category-3"] { --image: url(/bitrix/templates/vebas/css/../img/icons/category-3.svg); } i[data-icon="category-4"] { --image: url(/bitrix/templates/vebas/css/../img/icons/category-4.svg); } i[data-icon="category-5"] { --image: url(/bitrix/templates/vebas/css/../img/icons/category-5.svg); } i[data-icon="category-19"] { --image: url(/bitrix/templates/vebas/css/../img/icons/category-19.svg); } i[data-icon="category-20"] { --image: url(/bitrix/templates/vebas/css/../img/icons/category-20.svg); } i[data-icon="category-21"] { --image: url(/bitrix/templates/vebas/css/../img/icons/category-21.svg); } i[data-icon="category-25"] { --image: url(/bitrix/templates/vebas/css/../img/icons/category-25.svg); } i[data-icon="category-26"] { --image: url(/bitrix/templates/vebas/css/../img/icons/category-26.svg); } i[data-icon="category-select"] { --image: url(/bitrix/templates/vebas/css/../img/icons/category-select.png); } i[data-icon="how-we-work-1"] { --image: url(/bitrix/templates/vebas/css/../img/icons/how-we-work-1.png); } i[data-icon="how-we-work-2"] { --image: url(/bitrix/templates/vebas/css/../img/icons/how-we-work-2.png); } i[data-icon="how-we-work-3"] { --image: url(/bitrix/templates/vebas/css/../img/icons/how-we-work-3.png); } i[data-icon="how-we-work-4"] { --image: url(/bitrix/templates/vebas/css/../img/icons/how-we-work-4.png); } i[data-icon="how-we-work-5"] { --image: url(/bitrix/templates/vebas/css/../img/icons/how-we-work-5.png); } i[data-icon="how-we-work-6"] { --image: url(/bitrix/templates/vebas/css/../img/icons/how-we-work-6.png); } i[data-icon="callback-round"] { --image: url(/bitrix/templates/vebas/css/../img/icons/callback-round.png); } i[data-icon="order-round"] { --image: url(/bitrix/templates/vebas/css/../img/icons/order-round.png); } i[data-icon="more-round"] { --image: url(/bitrix/templates/vebas/css/../img/icons/more-round.png); } /* End */ /* Start:/bitrix/templates/vebas/css/ui-forms.css?176309253010057*/ /* Обычные поля */ /* -------------------------------------------------------------------- */ input[type="text"], input[type="checkbox"], input[type="password"], input[type="email"], select, textarea { min-height: var(--input-height); padding: 0 2rem; font-size: inherit; outline: 0; border-radius: var(--border-radius); border: 1px solid transparent; display: flex; align-items: center; color: var(--color-black); overflow: hidden; background-color: var(--input-color); transition: all .3s; } input[type="text"]::placeholder, input[type="checkbox"]::placeholder, select, textarea::placeholder { color: #000a; font-weight: 400; } input:focus[type="text"], input:focus[type="checkbox"], input:focus[type="password"], input:focus[type="email"], select:focus, textarea:focus { border-color: var(--color-blue); box-shadow: var(--shadow); border:var(--input-active-border); } input[type="text"]:focus, input[type="checkbox"]:focus, select:focus, textarea:focus { background: white; box-shadow: var(--shadow); border: 1px solid #0005; } input[type="text"]::placeholder, textarea::placeholder { opacity: 0.3; } textarea { min-height: var(--input-height); padding: 1rem 2rem; } /* Checkbox */ /* -------------------------------------------------------------------- */ input[type="checkbox"] { cursor: pointer; width: 2rem; height: 2rem; appearance: none; -webkit-appearance: none; border: none; background: white; padding: 0; max-width: var(--span); position: relative; margin-right: 1rem; display: inline-block; box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3); border-radius: 0; min-height: 1rem; } input[type="checkbox"]:checked::after { display: inline-block; content: ''; position: absolute; top: 4px; left: 4px; right: 4px; bottom: 4px; background: var(--color-blue); } /* Select */ /* -------------------------------------------------------------------- */ select { appearance: none; -webkit-appearance: none; position: relative; background: url(/bitrix/templates/vebas/css/../img/icons/select-down.png) calc(100% - 1rem) center no-repeat; } select:focus { background: url(/bitrix/templates/vebas/css/../img/icons/select-up.png) calc(100% - 1rem) center no-repeat; } input:disabled, select:disabled, textarea:disabled { opacity: 0.7; } /* Формы */ /* -------------------------------------------------------------------- */ .form input:not([type="submit"]), .form textarea, .form select { width: 100%; } .form textarea { min-height: 10rem; } body.-safari .form.-horizontal > * { margin: 0.5rem; } .form > *:not(:last-child) { margin-bottom: var(--span); } .form-inputs { display: flex; gap: 1.5rem; flex-wrap: wrap; } .form-inputs.-double { display: grid; grid-template-rows: auto; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); justify-content: center; gap: var(--span); } @media screen and (max-width: 640px) { .form-inputs.-double { display: flex; flex-flow: column; } .form .container { flex-wrap: wrap; justify-content: center; } } .form-input.-required label::after { content: '*'; display: inline; color: var(--color-red); } .form-input.-error label { color: var(--color-red); } .form-input.-error input, .form-input.-error select, .form-input.-error textarea { --input-border: 2px solid var(--color-red); } .form .form-input.-small { flex-basis: 20rem; flex-grow: 1; } .form .form-input { flex-wrap: wrap; flex-basis: 100%; } .form .form-input label { font-weight: normal; margin-bottom: 0.5em; display: block; font-style: italic; } .form .form-heading { margin-bottom: var(--span); } .form .radio-group { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; flex-grow: 1; } .form .radio-item { display: inline-flex; align-items: center; gap: 1rem; } .form .radio-item input { width: auto; } .form-input-fake { min-height: var(--input-height); padding: 0 2rem; font-size: inherit; outline: 0; border-radius: var(--border-radius); border: 1px solid transparent; display: flex; align-items: center; color: var(--color-black); overflow: hidden; background-color: var(--input-color); transition: all .3s; padding-right: 0;} .form-input-fake label { flex-basis: 30rem; border-right: 1px solid #0002; margin-bottom: 0 !important; flex-grow: 1; } .form-input-fake input { min-height:none !important; background: transparent !important; flex-grow: 1; } .button { display: inline-flex; align-items: center; justify-content: center; flex-wrap: nowrap; cursor: pointer; text-decoration: none; white-space: nowrap; font-size: 1.8rem; margin: 0; padding: 1.5rem var(--span); border-radius: var(--border-radius); align-items: center; height: var(--button-height); background: var(--button-color) !important; color: var(--button-text-color) !important; outline: none; border: 0; position: relative; transition: 0.3s all; text-decoration: none !important; gap: 1rem; font-style: normal; } .button i[data-icon] { background: var(--button-icon-color) !important; width: 2.5rem; height: 3rem; } .button i { display: inline-block; margin:0 1rem; } .button:hover { --button-color: var(--button-hover-color); --button-text-color: var(--button-hover-text-color); --button-icon-color: var(--button-hover-icon-color); } .button[data-button~="mini"] { padding: 0.5rem 1rem; height: auto; font-size: 1.5rem;} .button[data-button~="narrow"] { height: 3.5rem; font-size: 1.5rem; padding-left: 0.5rem; padding-right: 0.5rem; } .button[data-button~="narrow"] i { width: 2rem; height: 2rem; flex-grow: 0; margin: 0; } .button[data-button~="blue"] { --button-color: var(--color-blue); --button-text-color: white; --button-icon-color: white; --button-hover-color: black; --button-hover-text-color: white; --button-hover-icon-color: white; } .button[data-button~="white"] { --button-color: white; --button-text-color: var(--color-black); --button-icon-color: var(--color-black); --button-hover-color: var(--color-light-gray); } .button[data-button~="gray"] { --button-color: var(--color-light-gray); --button-text-color: var(--color-black); --button-icon-color: var(--color-black); --button-hover-color: black; --button-hover-text-color: white; --button-hover-icon-color: white; } .round-button { --button-color: var(--color-green); --button-icon-color: white; --button-height: 6rem; display: inline-flex; align-items: center; justify-content: center; flex-wrap: nowrap; cursor: pointer; text-decoration: none; white-space: nowrap; font-size: 1.6rem; margin: 0; padding: 1.5rem 2rem; border-radius: 99rem; align-items: center; height: var(--button-height); background: var(--button-color); color: var(--button-text-color) !important; outline: none; border: 0; position: relative; transition: 0.3s all; text-decoration: none !important; gap: 1rem; font-style: normal; text-transform: uppercase; font-weight: 500; letter-spacing: 0.1em; } .round-button i { width: 4rem; height: 4rem; flex-shrink: 0; background: var(--button-icon-color); } .round-button:hover { --button-color: black; --button-text-color: white; --button-icon-color: white; } .round-button[data-button~="fade"] { background: linear-gradient(to right, var(--button-color) 50%, transparent ); } .round-button[data-button~="dark-blue"] { --button-color: var(--color-dark-blue); --button-icon-color: var(--color-green); } .round-button[data-button~="dark-blue"]:hover { --button-color: white !important; --button-text-color: var(--color-dark-blue); --button-icon-color: var(--color-dark-blue) !important; } .small-button { display: inline-flex; gap: 1rem; align-items: center; justify-content: center; border: 2px solid var(--color-blue); height: var(--input-height); padding: 0.5rem 1rem; text-decoration: none !important; } input.error { border: 1px solid red !important; } .icon-button { display: inline-flex; align-items: center; gap: 1rem; text-decoration: none; font-size: 1.6rem; color: var(--button-text-color); padding: 0; padding-right: 2rem; background: var(--button-color); height: var(--button-height); box-shadow: 0 0 25px 0 #188e4940; text-decoration: none !important; } .icon-button .icon { display: block; width: var(--button-height); height: 100%; background: var(--button-hover-color); display: flex; align-items: center; justify-content: center; } .icon-button i[data-icon] { width: 3rem; height: 3rem; background: var(--button-color); transition: .3s; } .icon-button:hover { text-decoration: none; background: var(--button-hover-color); color: var(--button-color); } /* Капча */ /* -------------------------------------------------------------------- */ .vcap-input { display:flex; align-items:start; align-content:center; margin-bottom:1rem; flex-wrap: wrap; gap: 1rem; font-size: 1.6rem; } .vcap-input label { margin-bottom:0 !important; font-weight: normal; flex-basis: 100px; flex-grow: 1; } .vcap-input a { color: var(--link-color); text-decoration: underline; } .vcap-input .vcap { appearance: none; width: 2rem; height: 2rem; border: 2px solid #aaa; padding: 0; outline: none; } .vcap-input .vcap::before { border:none; left: 4px; top: 4px; right: 4px; bottom: 4px; background: transparent; width: auto; height: auto; content: ''; display: block; position: absolute;} .vcap-input .vcap::after { display: none !important; } .vcap-input .vcap:checked::before { background: var(--color-blue); } .vcap-input.-error .vcap { border-color: red; } .vcap-input .vcap_question { display: none; } .vcap_question { flex-basis: 100%; border: 1px solid #e0e0e0; padding: 1rem; } .vcap_question .title { font-size: 16px; font-weight: bold; margin-bottom: 15px; } .vcap_question .confirm-button { margin-top: 1rem; } .vcap_question .variants { display: flex; gap: 1rem; align-items: center; justify-content: start; flex-wrap: wrap; } .vcap_question .variants .variant { display: inline-block; padding: 0.5rem 1rem; font-size: 16px; border-radius: 0; background: #f0f0f0; cursor: pointer; transition: .3s; } .vcap_question .variants .variant:hover { background: #e0e0e0; } .vcap_question .variants .variant.-active { background: #3c60b3; color: white; } .vcap_value.error + input { border: 1px solid red !important; } /* End */ /* Start:/bitrix/templates/vebas/css/ui-slider.css?17573104451840*/ .swiper { overflow: hidden; } .swiper-slider { position: relative; } .slider-container { position: relative; } :root { --slider-color-button: var(--color-light-gray); --slider-color-button-hover: var(--color-black); --slider-color-arrow: black; --slider-color-arrow-hover: white; --swiper-pagination-bullet-size: 10px; --swiper-pagination-color: var(--color-blue); --swiper-pagination-bullet-inactive-color: black; --swiper-pagination-bullet-inactive-opacity: 1; } .swiper-slide { padding: 1rem; } .swiper-outer { position: relative; } .swiper-button-prev, .swiper-button-next { width: 3rem; height: 3rem; color: white; margin-top:0; background: var(--slider-color-button); border-radius: 50%; position: absolute; top: 50%; transform: translate(0, -50%); } .swiper-button-next { right:-4rem; } .swiper-button-prev { left:-4rem; } .swiper-button-prev::after { --image: url(/bitrix/templates/vebas/css/../img/icons/arrow-left.png); } .swiper-button-next::after { --image: url(/bitrix/templates/vebas/css/../img/icons/arrow-right.png); } .swiper-button-prev::after, .swiper-button-next::after { width: 2rem; height: 1.7rem; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ''; background: var(--slider-color-arrow); mask: var(--image) center/contain no-repeat;; -webkit-mask: var(--image) center/contain no-repeat;; } .swiper-button-prev:hover, .swiper-button-next:hover { background: var(--slider-color-button-hover); } .swiper-button-prev:hover::after, .swiper-button-next:hover::after { background: var(--slider-color-arrow-hover); } .swiper-pagination { position: relative; margin-top: 4rem; } .adaptive-slider { position: relative; } @media screen and (max-width: 768px) { .swiper.adaptive-slider .swiper-slide { padding: 0; } .swiper-button-next { right: 1rem; left: auto; } .swiper-button-prev { left: 1rem; right: auto; } } /* End */ /* Start:/bitrix/templates/vebas/css/styles.css?179212041653328*/ /* HTML */ /* -------------------------------------------------------------------- */ html { height: 100%; font-size: var(--root-font-size); } body { width: 100%; min-height: 100%; vertical-align: top; background: var(--background-color); color: var(--text-color); font-size: 1.8rem; font-family: var(--font); font-weight: normal; line-height: 1.5; } body > .container { overflow: hidden; opacity: 0; } .swiper-wrapper { height: auto; } @media screen and (min-width: 2000px) { html { font-size: 13px; } } @media screen and (min-width: 3000px) { html { font-size: 20px; } } /* Main elements */ /* ============================================================== */ img { display: inline-block; max-width: 100%; height: auto; } p:not(:last-child) { margin-bottom: 1em; } b { font-weight: bold; } a { text-decoration: none; color: inherit; } a:hover { text-decoration: underline; } strong { font-weight: bold;} i { width: auto; height: auto; } em { font-style: italic; } hr { display: block; margin: 4rem 0; background: 0; border-top: 2px solid #eee; } /* ============================================================== */ h1, h2, h3, h4 { margin-bottom: 0.5em; line-height: 1.2; color: var(--heading-color); font-weight: 500; } h1 { font-size: 4rem; margin-bottom: 0.6em; } h2 { font-size: 2.4rem; margin-bottom: 1em; border-left: 5px solid var(--color-green); padding-left: 0.5em; text-transform: uppercase; } h2.-center { text-align: center; } h3 { font-size: 2rem; } h3.-inner { padding: 1rem; display: inline-block; background: #f4f4f4; border-left: 2px solid var(--color-blue); } @media screen and (max-width: 960px) { h1 { font-size: 3.6rem; } h2 { font-size: 3rem; } h3 { font-size: 2.8rem; } } /* Lists */ /* ============================================================== */ ul, ol { list-style-type: none; } ol > li::marker { display: inline; } ol > li::before, ul > li::before { display: inline-block; } ol > li > p { display: inline; } ul > li > p { display: inline; } ul.-list { list-style-type: disc; margin: 2rem 0; } ol.-list { list-style-type: decimal; margin: 2rem 0; } .hidden { display: none !important; } .clearfix { clear: both; } /* ============================================================== */ img.-full { width: 100%; height: auto; float: none; max-width: none; margin-left: 0; margin-right: 0; } img.-full:not(:first-child) { margin-top: 2rem; } img.-full:not(:last-child) { margin-bottom: 2rem; } img.-left { float: left; margin-right: var(--span-large); margin-bottom: var(--span-large); max-width: 50rem; height: auto; position: relative; } img.-right { float: right; margin-left: var(--span-large); margin-bottom: var(--span-large); max-width: 50rem; height: auto; position: relative; } img.-small { max-width: 30rem; } @media screen and (max-width: 768px) { img.-left, img.-right { float: none; max-width: none; margin:0; margin-bottom: 2rem; width: 100%; } } /* ============================================================== */ table { width: 100%; margin-bottom: 4rem; background: white; text-align: center; overflow: hidden; } table caption { background: var(--color-gray); padding: 2rem; font-size: 2rem; font-weight: bold; color: #333; text-align: center; text-transform: uppercase; } table td, table th { border: 1px solid #d0d0d0; padding: 2rem 2rem; text-align: left; vertical-align: middle; } table th { background: #f5f5f5 ; font-size: 1.8rem; font-weight: bold; border-bottom: 4px solid #82cf2e; } table td { } table td.value, table th.value { text-align: center; } table td.first { font-weight: bold; } table tr.secondary > td:first-child { padding-left: 3rem; } table h2 { font-size: 1.8rem; } @media screen and (max-width: 960px) { table { overflow: auto; max-width: 100%; } table td, table th { padding: 0.5rem 1rem; } } /* Всплывающие окна */ /* ============================================================== */ .mfp-content { --text-color: black; --heading-color: var(--color-red); color: black; padding: 4rem; overflow:hidden; background: white; display: inline-block; width: auto !important; max-width: 50rem; z-index: 52; width: 100% !important; border-radius: var(--border-radius); } .mfp-content.-policy { max-width: 80%} .mfp-bg { z-index: 150;} .mfp-wrap { z-index: 151; } .mfp-content form { width: 100%; margin:0 auto; max-width: 50rem; text-align: center; } .mfp-content a { color: var(--color-blue); } .mfp-content .form-buttons { display: flex; align-items: center; justify-content: center; margin-bottom: 0; } .mfp-content .form-input { margin-bottom: 1rem; } .mfp-content .form-description { font-size: 1.6rem; } .mfp-content h2 { display: inline-block; border-left: 5px solid var(--color-green); text-align: center; font-size: 2.5rem; text-transform: uppercase; color: black; } .mfp-close { border-radius: 50%; width: 3.5rem; height: 3.5rem; right: 1rem; top: 1rem; line-height: 0; } .mfp-close:hover, .mfp-close:focus { color: white; } .mfp-content { --input-height: 5rem; } /* Контейнеры для различных элементов и карточек */ /* ============================================================== */ .grid-container { display: grid; grid-template-rows: auto; grid-template-columns: repeat(auto-fill, minmax(var(--item-width), 1fr)); gap: var(--container-gap); justify-content: center; } [data-container~="count-6"] { --item-width: 15rem; } [data-container~="count-5"] { --item-width: 20rem; } [data-container~="count-4"] { --item-width: 26rem; } [data-container~="count-3"] { --item-width: 35rem; } [data-container~="count-2"] { --item-width: 50rem; } @media screen and (max-width: 960px) { .grid-container { display: flex; flex-wrap: wrap; flex-wrap: wrap; justify-content: left; } .grid-container > * { flex-basis: var(--item-width); } } @media screen and (max-width: 768px) { } @media screen and (max-width: 640px) { .grid-container { --item-width: 100% !important; } } .flex-container { display: flex; gap: var(--container-gap); flex-wrap: wrap; align-items: center; justify-content: center; } .flex-container > * { flex-grow: 1; flex-basis: var(--item-width); } @media screen and (max-width: 960px) { .flex-container > * { max-width: none; } .grid-container > * { flex-grow: 1; } } .split-container { display: flex; gap: 3rem; flex-wrap: wrap; } .split-container > * { flex-grow: 1; flex-basis: 45rem; } .split-container[data-split-container~="center"] { align-items: center; } .split-container > .image.-large { flex-grow: 2; flex-basis: 45; } .articles-container { display: flex; gap: 4rem; flex-wrap: wrap; } .articles-container > * { flex-basis: 100% !important; } .buttons-container { display: flex; gap: 1rem; flex-wrap: wrap; justify-content: center; align-items: center; } .teasers-container { display: grid; grid-template-columns: repeat(auto-fit, minmax(40rem,1fr)); position: relative; gap: 2rem; justify-content: center; padding: 0.5rem 0; margin: 2rem 0;} /* Обычный тизер с картинкой сверху */ /* =========================================== */ .image-teaser { display: flex; flex-direction: column; gap: 4rem 2rem; text-align: center; align-items: center; } .image-teaser .image { width: 15rem; height: 15rem; position: relative; } .image-teaser .image img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: contain; } .image-teaser .title { font-weight: 500; max-width: 20rem; } /* ============================================================== */ .side-image-container { display: flex; gap: 4rem; justify-content: center; align-items: center; flex-wrap: wrap; margin: 4rem 0; } .side-image-container.-gray { background: #f3f3f3; } .side-image-container > * { flex-basis: 40rem; flex-grow: 1; } .side-image-container > .content { flex-grow: 2; } .side-image-container > .image { position: relative; display: flex; align-items: center; justify-content: center; max-width: 20rem; } .side-image-container > .image img { max-height: 35rem; width: 100%; height: auto; object-fit: cover; } @media screen and (max-width: 768px) { .side-image-container > .image { max-width: none; } } /* ============================================================== */ .side-container { display: flex; align-items: center; flex-wrap: wrap; gap: 4rem;} .side-container > .content { flex-basis: 30rem; flex-grow: 2; } .side-container > .side { flex-basis: 20%; flex-grow: 1; min-width: 20rem; align-self: center;} /* ============================================================== */ .button-up { --color: var(--color-dark-gray); transition: opacity .3s ease; opacity: 0.8; background-color: var(--color-light-gray); height: 5.5rem; width: 5.5rem; bottom: 3rem; right: 3rem; cursor: pointer; display: none; position: fixed; z-index: 999; align-items: flex-end;justify-content: center; border-radius: 50%; user-select: none; box-shadow: 0 0 5px 0 #0003; } .button-up:before { content: "";position: absolute;top: 40%;width: 40%;height: 40%;border-left: 3px solid var(--color);border-top: 3px solid var(--color);transform: rotate(45deg); left: 27%;} .button-up:hover {opacity: 1;} /* ============================================================== */ .page-block { padding: var(--block-padding); position: relative; color: var(--text-color); background: var(--background-color); --text-color: inherit; --background-color: transparent;} .page-block > .block-container { max-width: var(--page-width); margin: 0 auto; position: relative; } .page-block[data-page-block~="narrow"] { padding-top: var(--span); padding-bottom: var(--span); } .page-block[data-page-block~="narrower"] { padding-top: calc(var(--span) * 2); padding-bottom: calc(var(--span) * 2); } .page-block[data-page-block~="no-padding"] { padding-top: 0; padding-bottom: 0; } .page-block[data-page-block~="multiple"] { } .page-block[data-page-block~="blue"] { --heading-color: white; --text-color: white; --background-color: #11587e; --link-color: white; } .page-block[data-page-block~="black"] { --heading-color: white; --text-color: white; --background-color: #323944; --link-color: white; --slider-color-arrow: white; --swiper-pagination-bullet-inactive-color: white; } .page-block[data-page-block~="gray"] { --background-color: #f8f8f8;} .page-block > .bg { position: absolute; right: 100%; bottom: 100%; height: 30rem; width: 30rem; z-index: 1; } @media screen and (max-width: 768px) { .page-block { padding-left: 2rem; padding-right: 2rem; } } /* ============================================================== */ .page-section { margin: 4rem 0; } .page-section:first-child { margin-top: 0; } .page-section:last-child { margin-bottom: 0; } /* ============================================================== */ .block-heading { margin: 0; font-size: 3.6rem; margin-bottom: var(--span-large); text-transform: uppercase; text-align: center; border: none; padding: 0; } .block-heading-text { margin: auto; margin-top: calc(var(--block-padding) * -0.3); margin-bottom: var(--span-large); max-width: calc(var(--page-width) * 0.6); text-align: center; } .block-heading.-left { text-align: left; } .block-heading-container { display: flex; align-items: center; justify-content: center; gap: 2rem; margin-bottom: 4rem; } .block-heading-container h2 { margin-bottom: 0; } .block-heading-container .simple-button { border-left: 1px solid #eee; } @media screen and (max-width: 960px) { .block-heading { font-size: 3.2rem; margin-bottom: 3rem; } .block-heading.-left { text-align: center; } } @media screen and (max-width: 768px) { .block-heading-text { margin-top: 0; text-align: left; font-size: 1.7rem; margin-bottom: var(--span-large); } .block-heading { border-left: 5px solid var(--color-green); text-align: left; padding-left: 0.5em; } } /* Всплывающие сообщения */ /* ============================================================== */ .message-queue { position: fixed; top: 50%; padding: 3rem; left: 50%; right: 0; background: rgba(0, 0, 0, 0.7); transform: translate(-50%, -50%); max-width: 800px; border-radius: 1rem; z-index: 400; } .message-queue .message { margin: 0 auto; max-width: 700px; display: block; background: white; padding: 1rem; margin-bottom: 0.5rem; border-radius: 3px; box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.3); } .message-queue .message: last-child { margin-bottom: 0; } .message-queue .message.error { border-left: 5px solid #a6051b; } .message-queue .message strong { font-weight: bold; } .message-queue .message .large { font-size: 2.5rem;} .message-queue .message .large strong { color: #a6051b; } .message-queue .message.critical { border-left: 5px solid transparent; color: white; background: #a6051b; } .message-queue .message.warning { border-left: 5px solid #ffd376; } @media screen and (max-width: 640px) { .message-queue { padding: 1rem; bottom: 0; width: 100%; border-radius: 0; top: auto; transform: none; left:0; right:0; } .message-queue .message { padding: 0.5rem; } } /* Блоки сносок в тексте */ /* ============================================================== */ .message-box { --text-color: var(--color-black); color: var(--text-color); --image: url("/bitrix/templates/vebas/css/../img/icons/mb-info.png"); clear: both; position: relative; display: flex; justify-content: flex-start; align-items: flex-start; padding: 4rem; padding-left: 12rem; text-align: left; margin: 3rem 0; flex-flow: column; min-height: 10rem; border-radius: var(--border-radius); min-height: 100px; border: 2px solid #e0e0e0; background: linear-gradient(45deg, #00000020, white 5rem); } .message-box::after { content:''; display: block; width: 4px; position: absolute; top:-2px; left:-2px; bottom:-2px; background: var(--color-blue); } .message-box h2 { text-align: left; font-size: 2.4rem; margin-bottom: 1rem; margin-top: 0; } .message-box a { color: var(--text-color); text-decoration: underline; } .message-box > * { margin-bottom: 0.5rem;} .message-box > *:last-child { margin-bottom: 0; } .message-box::before { content: ''; display: block; position: absolute; top: 50%; bottom: 0; left: 2rem; width: 8rem; height:8rem; transform: translateY(-50%); background: var(--color-blue);mask: var(--image) center / contain no-repeat; -webkit-mask: var(--image) center / contain no-repeat; } .message-box.-home { --image:url(/bitrix/templates/vebas/css/../img/icons/icon-mb-home.png); } .message-box.-alert { --image:url(/bitrix/templates/vebas/css/../img/icons/icon-mb-alert.png); } .message-box.-alert::before { background: var(--color-red); } .message-box.-alert::after { background: var(--color-red); } .message-box.-center { text-align: center; align-items: center; } .message-box.-center::before { display:none; } .message-box.-with-image { padding-left: 25rem; } .message-box.-with-image .image { position: absolute; left:0; top:0; height: 100%; width: 20rem; mask: linear-gradient(to left, transparent, white 2rem); } .message-box.-with-image .image img { position: absolute; left:0; top:0; width: 100%; height: 100%; object-fit: cover; } @media screen and (max-width: 768px) { .message-box.-with-image .image { display: none; } .message-box.-with-image::before { display: none; } } @media screen and (max-width: 768px) { .message-box { padding: 2rem !important; } .message-box::before { display: none; } } /* Страничная навигация */ /* ============================================================== */ .pagination { display: flex; margin: 4rem 0; text-align: center; align-items: center; justify-content: center; flex-wrap: wrap; } .pagination .title { margin-right: 2rem; } .pagination ul { margin-bottom: 0 !important; margin-left: 0; display: flex; flex-wrap: wrap; gap: 0.4rem; grid-gap: 0.4rem; } .pagination li a, .pagination li span { display: flex; margin: 0.5rem 0.5rem; align-items: center; justify-content: center; min-width: 3rem; } .pagination li.active a, .pagination li.active span { background: var(--color-blue); color: #ffffff; } .pagination li { display: inline-flex; list-style-type: none; margin-bottom: 0; margin-left: 0; align-items: center; } .pagination li:not(.control) a, .pagination li:not(.control) span { border-radius: 50%; min-width: 30px; flex-shrink: 0; height: 30px; align-items: center; justify-content: center; text-decoration: none; } .pagination li.-real:hover a { background: #dddddd; } /* Табы */ /* ============================================================== */ .tabs { position: relative; } .tabs .tabs-navigation { display: flex; flex-wrap: wrap; margin-bottom: 4rem; gap: 0.5rem; } .tabs .tabs-navigation a { padding: 1rem 2rem; text-decoration: none; display: inline-block; transition: .3s; font-size: 1.8rem; display: inline-flex; background: var(--color-light-gray); cursor: pointer; border: 2px solid transparent; font-weight: 500; border-radius: 1rem; gap: 1rem; } .tabs .tabs-navigation a:hover { border-color: var(--color-blue); } .tabs .tabs-navigation a i { background: black; } .tabs .tabs-navigation a.-active { background: var(--color-blue); color: white; } .tabs .tabs-navigation a.-active i { background: white; } .tabs .tabs-content { background: white; } .tabs .tab { display: none; } .tabs .tab.-active { display: block; } @media screen and (max-width: 768px) { .tabs .tabs-navigation a { padding: 0.5rem 1rem; font-size: 1.6rem; } } /* Иконки соцсетей */ /* ============================================================== */ .social-icons { white-space: nowrap; display: flex; align-items: center; gap: 1rem; justify-content: center; } .social-icons a { --color: var(--color-blue); width: 4rem; height: 4rem; border-radius: 50%; background: var(--color); display: inline-flex; justify-content: center; align-items: center; flex-shrink:0; transition: .3s; top: 0; gap: 0.5rem; position: relative; cursor: pointer; } .social-icons a i { width: 60%; height: 50%; background: white; } .social-icons a.telegram { --color: #3f95d6; } .social-icons a.whatsapp { --color: #58bb16; } .social-icons a:hover { background: white; } .social-icons a:hover i { background: black !important; } /* Оформление элементов в статьях */ /* ============================================================== */ .article ul { list-style-type: disc; margin-bottom: 1em; } .article ul > li { margin-bottom: 0em; } .article ul > li::marker { color: var(--color-blue); } .article > table { margin: 4rem 0; } .article ol { list-style-type: decimal; margin-bottom: 1em; } .article li { margin-bottom: 0.5em; } .article h2:not(.block-heading) { font-size: 2.8rem; margin-bottom: 0.7em;} .article a:hover { text-decoration: none; } .article img { display: block; } .article > h2:not(:first-child) { margin-top: 1em; } .article a { color: var(--color-blue); text-decoration: underline; } /* Хлебные крошки */ /* ============================================================== */ .breadcrumbs { margin-bottom: 2rem; font-size: 1.7rem; flex-wrap: wrap; line-height: 1.2; } .breadcrumbs ul::before { content: ''; margin-right: 1rem; display: inline-block; width: 2rem; height: 2rem; --icon: url(/bitrix/templates/vebas/css/../img/icons/home.png); mask: var(--icon) center/contain no-repeat; -webkit-mask: var(--icon) center/contain no-repeat; background: var(--color-green); } .breadcrumbs ul { display: flex; color: #333; gap: 1rem; flex-wrap: wrap; align-items: center; } .breadcrumbs ul li { display: inline-flex; margin-right: 0.5rem; align-items: center; } .breadcrumbs ul li:not(:last-child)::after { content: '/'; display: inline-block; margin-left: 2rem; height: 2rem; } .breadcrumbs a { text-decoration: underline; color: #888; } .breadcrumbs span { font-weight: 500; color: var(--color-dark-blue); } .breadcrumbs a > span { font-weight: normal; color: #888; } .breadcrumbs a:hover > span { color: var(--color-dark-blue); } .breadcrumbs a:hover { text-decoration: underline; } @media screen and (max-width: 768px) { .breadcrumbs { font-size: 1.4rem; } } .how-we-work-card { display: flex; align-items: center; gap: 2rem; } .how-we-work-card .image { width: 12rem; height: 12rem; background: linear-gradient(#2adfa0, #2adfa0 50%, #2adfa060); border-radius: var(--border-radius); flex-shrink: 0; display: flex; align-items: center; justify-content: center; } .how-we-work-card .image i { width: 60%; height: 60%; background: white; } .how-we-work-card .content { font-size: 1.4rem; } .how-we-work-card .title { font-size: 2rem; font-weight: 500; } .how-we-work-card:hover .image { background: black; } .how-we-work-card:hover .image i { background: var(--color-green); } @media screen and (max-width: 768px) { .how-we-work-card { line-height: 1.3; } .how-we-work-card .image { width: 8rem; height: 8rem; } .how-we-work-card .title { font-size: 1.8rem; } } /* ============================================================== */ .advantage-card { display: flex; align-items: center; gap: 2rem; line-height: 1.3; } .advantage-card .image { } .advantage-card .image i { width: 8rem; height: 8rem; background: var(--color-green); } .advantage-card .content { font-size: 1.5rem; } .advantage-card .title { font-size: 2rem; font-weight: 500; margin-bottom: 0.5rem; } @media screen and (max-width: 768px) { .advantage-card { line-height: 1.3; } .advantage-card .image { width: 8rem; height: 8rem; } .advantage-card .title { font-size: 1.8rem; } } /* ============================================================== */ .category-small-card { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 1rem; flex-basis: 18rem; flex-grow: 0; } .category-small-card .image { display: block; background: var(--color-gray); border-radius: var(--border-radius); border-bottom: 4px solid var(--color-blue); padding-top: 100%; position: relative; width: 18rem;} .category-small-card .image img { position: absolute; left: 50%; top: 50%; width: 80%; height: 80%; transform: translate(-50%, -50%); object-fit: contain; } .category-small-card .content { text-align: center; } .category-small-card .title { font-size: 1.8rem; text-transform: uppercase; font-weight: 500; } .category-small-card:hover .image { background: var(--color-green); border-color: var(--color-green); } @media screen and (max-width: 768px) { .category-small-card .image { width: 100%; } .category-small-card { flex-grow: 1; flex-basis: 14rem; } } /* ============================================================== */ .category-large-card { flex-basis: 45%; background: var(--color-gray); border-radius: var(--border-radius); display: flex; align-items: center; min-height: 10rem; overflow: hidden; flex-grow: 1; border: 2px solid transparent; align-self: stretch; } .category-large-card .image { flex-basis: 30%; flex-shrink: 0; background: linear-gradient(to left, #125c8350, transparent 5rem); position: relative; align-self: stretch; padding: 2rem; display: flex; align-items: center; justify-content: center; flex-shrink: 0; } .category-large-card .image img { width: 80%; height: auto; object-fit: contain; max-height: 17rem; } .category-large-card .content { padding: 4rem; display: flex; align-items: center; justify-content: center; } .category-large-card .content .title { font-size: 2.1rem; font-weight: bold; text-transform: uppercase; } .category-large-card .content ul { margin-top: 1rem; font-size: 1.7rem; line-height: 1.2; } .category-large-card .content ul li { margin-bottom: 0.5rem; } .category-large-card .content ul a { text-decoration: underline; } .category-large-card:hover { border: 2px solid var(--color-green); } .category-large-card:hover .image { background: var(--color-green); } @media screen and (max-width: 768px) { .category-large-card { flex-basis: 100%; flex-direction: column; } .category-large-card .image { flex-basis: auto; background: none; } .category-large-card img { max-height: 20rem; } .category-large-card .content { padding: 2rem; justify-content: start; padding-top: 0; } .category-large-card .content ul { line-height: 1.2; } } /* Всплывашки */ /* ============================================================== */ .tippy-content { font-size: 1.5rem; padding: 2rem; } .tippy-box { background: #ffffffe0; color: black; border-radius: 1rem; } .tippy-arrow { color: #ffffffe0;} .ui-card { position: relative; border-radius: var(--border-radius-large); border: 1px solid #ccc; overflow:hidden; transition: .3s; z-index: 1; background: white;} .ui-card:hover { border: 1px solid var(--color-green); z-index: 10; filter: drop-shadow(0 0 15px #2adfa070); } /* Карточка статьи */ /* ============================================================== */ .article-card { border-radius: var(--border-radius); overflow: hidden; background: #666;} /* ============================================================== */ .gallery-card { display: block; transition: .3s; background: #333; position: relative; border-radius: var(--border-radius-large); border: 1px solid #ccc; overflow:hidden; transition: .3s; z-index: 1; background: white; } .gallery-card .image-wrapper { width: 100%; } .gallery-card .image { width: 100%; height: 100; display: block; position: relative; padding-top: 75%; } .gallery-card .image img { position: absolute; left:0; top:0; width: 100%; height: 100%; object-fit: cover;} .gallery-card:hover { border-color: var(--color-blue); } .gallery-card .content { position: absolute; bottom: 0; left: 0; right: 0; padding: 1rem; text-align: center; font-size: 1.6rem; background: #fffa; font-weight: bold; color: #17552f; min-height: 20%; display: flex; align-items: center; justify-content: center; } .gallery-card:hover { border: 1px solid var(--color-green); z-index: 10; filter: drop-shadow(0 0 15px #2adfa070); } /* ============================================================== */ .product-card { position: relative; border-radius: var(--border-radius-large); border: 1px solid #ccc; overflow:hidden; transition: .3s; z-index: 1; background: white; } .product-card .image { width: 100%; padding-top: 70%; position: relative; } .product-card .image img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; } .product-card .content { padding: 1.5em; } .product-card .title { font-size: 1.8rem; text-transform: uppercase; font-weight: 500; } .product-card .properties { font-size: 1.6rem; line-height: 1.2; margin-top: 1rem; } .product-card .properties p:not(:last-child) { margin-bottom: 0.2em; } .product-card .round-button { height: 5rem; font-size: 1.4rem; } .product-card .round-button i { width: 3rem; height: 3rem; } .product-card .price { background: var(--color-gray); border-radius: 99rem; padding: 1rem; font-size: 1.8rem; height: 5rem; display: flex; align-items: center; gap: 1rem; white-space: nowrap; justify-content: center; } .product-card .price strong { font-size: 2.2rem; } .product-card .bottom { display: flex; align-items: center; gap: 1rem; justify-content: center; margin-top: 2rem; flex-wrap: wrap; } .product-card .bottom > * { flex-basis: 12rem; flex-grow: 1; } .product-card:hover { border: 1px solid var(--color-green); z-index: 10; filter: drop-shadow(0 0 15px #2adfa070); } @media screen and (max-width: 768px) { } /* Адаптивное меню */ /* ============================================================== */ .mobile-menu { background: var(--color-blue); color: white; display:none; position: fixed; top:0; left:0; width: 100vw; height: auto; z-index: 10000; max-height: 100%; box-shadow: 0 3px 5px 0 #0003; overflow: auto; } .mobile-menu .close-menu-button { height: 4rem; display: flex; cursor: pointer; align-items: center; justify-content: center; background: black; gap: 1rem; color: white; } .mobile-menu .close-menu-button i { background: white; width: 1.5rem; height: 1.5rem; } .mobile-menu .menu { padding: 0; z-index: 100; text-align: left; line-height: 1.1; height: auto; max-height: calc(100vh); width: 100%; z-index:20; box-shadow: 0 5px 5px 0 #0003; padding-bottom: 2rem; } .mobile-menu .menu a { text-decoration: none; } .mobile-menu .menu li { display: block; } .mobile-menu .menu > li { border-bottom: 1px solid #fff2; } .mobile-menu .menu > li > a { font-weight: normal; } .mobile-menu .menu li ul { position: relative; background: transparent; padding: 0 2rem;} .mobile-menu .menu li ul li { border: none !important; } .mobile-menu .menu li a { display: flex; padding: 0.7rem 2rem; gap: 1rem; align-items: center; min-height: 3rem; } .mobile-menu .menu li.-active > a { font-weight: bold; } .mobile-menu .menu li a > .text { flex-grow: 1; } .mobile-menu .menu li a:hover { background: black; color: white; } .mobile-menu .menu li > ul { display: none; font-size: 1.5rem; margin-left: 2rem; padding-left: 0; } .mobile-menu .menu .opener { display: inline-block; width: 3rem; height: 2.5rem; flex-shrink: 0; background: #333; --mask: url(/bitrix/templates/vebas/css/../img/icons/arrow-down.png) center/1.5rem no-repeat; mask: var(--mask); -webkit-mask: var(--mask); background: white; } .mobile-menu .menu li.-open > a > .opener { --mask: url(/bitrix/templates/vebas/css/../img/icons/arrow-up.png) center/1.5rem no-repeat;} .mobile-menu .menu li.-open > ul { display: block; } .mobile-menu .menu li.-open { border-bottom: 1px solid #fff5; margin-bottom: 1rem; padding-bottom: 1rem; background: #0002; } .mobile-menu .menu li.-open > a { margin-bottom: 0.5rem; background: linear-gradient(to top, #0003, transparent 1rem); padding: 1rem 2rem; font-weight: bold; } .mobile-menu .menu li.-open > ul { display: block; } .mobile-menu.-open { display: block; } .mobile-menu.-open .open-button::after { --image: url(/bitrix/templates/vebas/css/../img/icons/close.svg) center/contain no-repeat; } .mobile-menu.-open .mobile-menu { display: block; } /* ============================================================== */ .mobile-menu-button { display: none; align-items: center; gap: 1rem; justify-content: center; font-size: 1.5rem; min-height: 4rem; transition: .3s; cursor: pointer; border: 1px solid white; padding: 0.5rem 1rem; border-radius: 99rem; } .mobile-menu-button i { background: white !important; } .mobile-menu-button:hover { background: white; } @media screen and (max-width: 640px) { .mobile-menu-button { display: flex; } } .certificate-card { border-bottom: 4px solid var(--color-blue); display: block; background: var(--color-gray); padding: 1rem; border-radius: 1rem; position: relative; overflow: hidden; transition: .3s; } .certificate-card .image { width: 100%; padding-top: 140%; position: relative; } .certificate-card .image img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 1rem; } .certificate-card .title { position: absolute; left: 0; bottom: 0; width: 100%; padding: 1rem 2rem; background: linear-gradient(to top, #c8d4da, #fff8 3rem); display: flex; align-items: center; gap: 1rem; justify-content: center; transition: .3s; } .certificate-card .title i { bacgkround: var(--color-blue); transition: .3s; } .certificate-card:hover { box-shadow: var(--shadow); } .certificate-card:hover .title { background: var(--color-blue); color: white; } .certificate-card:hover .title i { background: white; } /* ============================================================== */ #header { z-index: 100; background: linear-gradient(#112b3e, transparent 20rem), linear-gradient(to top, #115b8250, transparent 10rem), url(/bitrix/templates/vebas/css/../img/bg-header.webp) center/cover no-repeat, var(--color-blue); overflow: visible; line-height: 1.2; } #header .block-container { position: relative; z-index: 20; } #header .top-part { display: flex; align-items: center; gap: 1rem 2rem; justify-content: center; flex-wrap: wrap; } #header .navigation-part { display: flex; align-items: center; justify-content: center; gap: 2rem; flex-wrap: wrap; } #header .contacts { display: flex; align-items: center; justify-content: end; gap: 1rem 2rem; flex-wrap: wrap; flex-grow: 1; flex-basis: 40rem; font-weight: 500; font-size: 1.8rem; } #header .contacts .item { display: flex; align-items: center; gap: 1rem; letter-spacing: 0.1em; } #header .contacts .address, #header .contacts .phone { font-size: 2.2rem; } #header .bg-image .round-button { display: none; } #header .contacts i { background: var(--color-green); width: 1.5rem; height: 1.5rem; } #header .block-content { max-width: 90rem; padding-top: 10rem; } #header .block-content h1 { font-size: 6rem; font-weight: bold; margin-bottom: 3rem; } #header .block-content .subheading { font-size: 3rem; margin-bottom: 3rem; } #header .navigation-part .span { flex-basis: 3rem; flex-grow: 1; display: none; } #header .navigation-part .round-button { height: 5rem; font-size: 1.5rem; min-width: 26rem; --button-color: #0f283b;} #header .navigation-part .round-button i { width: 1.5rem; height: 1.5rem; } #header .main-menu { display: inline-flex; align-items: center; justify-content: center; gap: 1rem 2rem; font-size: 2rem; flex-wrap: wrap; } #header .main-menu > li > a { display: block; border-radius: 99rem; padding: 1rem 2rem; text-decoration: none; } #header .main-menu li { display: flex; align-items: center; gap: 1rem; position: relative; } #header .main-menu .drop-down { display: none; } #header .main-menu li:not(.-has-dropdown) ul li { padding: 1rem; } #header .main-menu > li > ul { display: none; padding: 2rem; background: white; position: absolute; left:0; top: 100%; border-radius: 0 0 2rem 2rem; color: black; min-width: 100%; box-shadow: 0 0 10px #0002; border-top: 6px sold var(--color-green); } #header .main-menu > li:hover > a { background: var(--color-green) !important; } #header .main-menu li:hover > ul { display: block; } #header .main-menu li.-has-dropdown:hover > .drop-down { display: block; } #header .main-menu > li.-has-children:hover > a { border-radius: 1rem 1rem 0 0; } #header .main-menu > li.-has-children > a::after { content:''; display: inline-block; width: 1.5rem; height: 1.5rem; background: white; --mask: url(/bitrix/templates/vebas/css/../img/icons/arrow-down.png) center/contain no-repeat; mask: var(--mask); --webkit-mask: var(--mask); margin-left: 0.5rem; } #header .main-menu > li.-active > a { background: linear-gradient(to top, #2adfa0a0, transparent 50%); } .drop-down { display: block; padding: 0; border-radius: 0 0 2rem 2rem; background: white; position: absolute; left: 0; top: 100%; z-index: 12000; color: #444; font-size: 1.6rem; width: 105rem; padding: 4rem 2rem; box-shadow: 0 0 10px #0002; border-top: 8px solid var(--color-green); font-size: 1.7rem; } .drop-down .container { flex-wrap: wrap; column-count: 3; column-gap: 4rem; column-rule: 1px solid #0002; } .drop-down .group { flex-basis: 30rem; display: inline-block; overflow: hidden; margin: 1rem 2rem; } .drop-down .group > .title { font-size: 2rem; display: flex; gap: 1rem; align-items: center; font-weight: 500; margin-bottom: 1rem; } .drop-down .group > .title i { width: 3rem !important; height: 4rem !important; background: var(--color-green); } .drop-down .group ul { margin-left: 4rem; } .drop-down .group ul li:not(:last-child) { margin-bottom: 0.4em; } #header .teasers { margin-bottom: 6rem; } #header .teaser { display: flex; gap: 1rem; align-items: center; text-align: left; } #header .teaser .title { font-weight: 500; f} #header .teaser .image { flex-shrink: 0; flex-basis: 5rem; } #header .teaser .image i { width: 5rem; height: 5rem; background: var(--color-green); } @media screen and (max-width: 768px) { #header .site-logo { justify-content: center; flex-basis: 20rem; } #header .site-logo .image { width: 6rem; height: 6rem; } #header .site-logo .top { font-size: 2.2rem; } #header .site-logo .slogan { display: none; } #header .contacts .address { font-size: 1.7rem; max-width: 20rem; } #header .contacts { justify-content: center; margin-top: 1rem; } #header .contacts .worktime, #header .contacts .email { display: none; } #header .contacts .phone { font-size: 2.4rem; } #header .contacts .item { text-align: center; } #header .contacts .item i { display: none; } #header .buttons-container { margin: 1rem; } #header .teasers { margin-bottom: 4rem; } #header .main-menu { display: none; } #header .navigation-part .span { display: none; } #header .block-content { max-width: none; text-align: center; padding-top: 2rem; } #header .block-content h1 { font-size: 3rem; margin-bottom: 1rem; } #header .block-content .subheading { font-size: 2rem; } } @media screen and (max-width: 640px) { #header .site-logo .top { font-size: 1.8rem; } } /* ============================================================== */ #about { } #about .image { position: relative; } #about .image img { display: block; width: 100%; height: 80rem; width:80rem; position: absolute; left: 0; top: 50%; transform: translate(0%, -50%); object-fit: contain; max-width: none; } @media screen and (max-width: 768px) { #about .image { display: none; } } /* ============================================================== */ #order { overflow: visible; z-index: 3; background: linear-gradient(to right, #7e5f0d, var(--color-yellow) 50%); } /* ============================================================== */ #partners { } #partners .swiper-slide { display: flex; align-items: center; justify-content: center; } #partners .swiper-wrapper { align-items: center; } .partner-card { position: relative; display: flex; align-items: center; justify-content: center; padding: 1rem; } .partner-card .image { } .partner-card .image img { width: auto; height: 100%; object-fit: contain; max-height: 10rem; } /* ============================================================== */ #category-top-group { background: url(/bitrix/templates/vebas/css/../img/bg-category-top.webp) center/cover, #f2f2f2; } #article.cargo-article { background: url(/bitrix/templates/vebas/css/../img/bg-category-top.webp) center/cover, #f2f2f2; } /* ============================================================== */ #category-top { } #category-top > .block-container { display: flex; gap: 4rem; align-items: center; flex-wrap: wrap; } #category-top .image { flex-basis: 30rem; flex-grow: 1; display: flex; align-items: center; justify-content: center; } #category-top .image img { max-height: 50rem; } #category-top .info { flex-basis: 50rem; flex-grow: 1; } #category-top .bottom-part { margin-top: 4rem; display: flex; gap: 2rem; align-items: center; flex-wrap: wrap; } #category-top .price { background: white; border-radius: 99rem; height: 6rem; padding: 1rem 2rem; font-size: 2.6rem; display: flex; align-items: center; gap: 1rem; } #category-top .price strong { font-weight: 500; font-size: 3.4rem; } @media screen and (max-width: 768px) { #category-top .bottom-part { justify-content: center; } #category-top .bottom-part > * { flex-basis: 22rem; } #category-top .price strong { font-size: 2.8rem; } #category-top .image { margin-bottom: 2rem; } #category-top .image img { max-width: 30rem; } #category-top .info { display: contents; } #category-top > .block-container { gap: 0; } #category-top .breadcrumbs { order: -2; } #category-top h1 { order: -1; } } /* ============================================================== */ #category-children { background: linear-gradient(white, transparent 30rem); } #category-children .subcategories-container { justify-content: start; } #category-children .category-small-card .image { background: white; } @media screen and (max-width: 768px) { #category-children .subcategories-container { display: grid; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); } } /* ============================================================== */ #product-top > .block-container { display: flex; align-items: start; gap: 4rem; flex-wrap: wrap; } #product-top .images { flex-basis: 40rem; flex-grow: 0; position: relative; } #product-top h1 { margin-bottom: 2rem; } #product-top .full-image .image { display: block; border-radius: 1rem; overflow: hidden; position: relative; } #product-top .full-image img { display: block; width: 100%; height: auto; } #product-top .info { flex-basis: 60rem; flex-grow: 1; } #product-top .product-properties { display: flex; gap: 4rem; flex-wrap: wrap; font-size: 1.6rem; margin-top: 2rem; } #product-top .product-properties .list-values a { text-decoration: underline; } #product-top .product-properties .property { flex-basis: 20rem; flex-grow: 1; } #product-top .product-properties .property.-other { flex-basis: 100%; } #product-top .product-properties .list-values a:not(:last-child)::after { content: ', '; display: inline; text-decoration: none; } #product-top .product-properties h2 { font-size: 2rem; } #product-top .product-properties .values p:not(:last-child) { margin-bottom: 0.2em; } #product-top .gallery .preview img { overflow: hidden; border-radius: 1rem; } #product-top .gallery { max-width: 40rem; } #product-top .slider { overflow: hidden; } #product-top .gallery-container { position: relative; } #product-top .bottom-part { margin-top: 4rem; display: flex; gap: 2rem; align-items: center; flex-wrap: wrap; } #product-top .price { background: var(--color-gray); border-radius: 99rem; height: 6rem; padding: 1rem 2rem; font-size: 2.6rem; display: flex; align-items: center; gap: 1rem; } #product-top .price strong { font-weight: 500; font-size: 3.4rem; } @media screen and (max-width: 768px) { #product-top .product-properties { gap: 2rem; } } /* ============================================================== */ #map { position: relative; } #map #map-container { position: absolute; left: 0; top: 0; width: 100%; height: 100%; } #map .content { background: #131b28; padding: 6rem; color: white; --icon-color: var(--color-green); position: relative; z-index: 10; font-size: 2.8rem; font-weight: bold; max-width: 60rem; line-height: 1.3; } #map .item:not(:last-child) { margin-bottom: 2rem; } #map .item .title { font-size: 1.6rem; color: var(--color-green); text-transform: uppercase; } @media screen and (max-width: 768px) { #map .content { padding: 4rem; font-size: 1.8rem; } } /* ============================================================== */ #footer { font-size: 1.6rem; } #footer .block-container { display: flex; align-items: center; gap: 2rem; justify-content: center; flex-wrap: wrap; } #footer .copyrights { text-align: center; flex-grow: 1; } #footer .copyrights .top { font-weight: 500; font-size: 1.8rem;} #footer .developer { font-size: 1.4rem; text-decoration: none; } #footer .developer .image { width: 23rem; height: 6rem; background: url(/bitrix/templates/vebas/css/../img/logo-vebas.png) center/contain no-repeat; } #footer .site-logo .image { background-image: url(/bitrix/templates/vebas/css/../img/logo-site.svg); } #footer .site-logo .top { max-width: 20rem; line-height: 1.2; font-size: 2.3rem; } @media screen and (max-width: 768px) { #footer .site-logo .image { width: 6rem; height: 6rem; } #footer .developer { display: inline-flex; flex-direction: column; align-items: center; } #footer .developer .image { width: 12rem; } } /* ============================================================== */ .site-logo { display: flex; align-items: center; gap: 1rem; } .site-logo .top { font-size: 2.8rem; font-weight: bold; text-transform: uppercase; font-style: normal; } .site-logo .text { font-size: 1.6rem; line-height: 1.2; font-style: italic; } .site-logo .image { background: url(/bitrix/templates/vebas/css/../img/logo-site-white.svg) center/contain no-repeat; width: 8rem; height: 8rem; flex-shrink: 0; } .page-template-index #header { background: linear-gradient(#112b3e, transparent 20rem), linear-gradient(to top, #115b82, transparent 50rem), url(/bitrix/templates/vebas/css/../img/bg-header.webp) center/cover no-repeat, var(--color-blue); padding-bottom: 6rem; } .property-card { position: relative; border-radius: var(--border-radius); background: var(--color-gray); border-left: 5px solid var(--color-green); align-self: stretch; } .property-card .heading { padding: 2rem 4rem; display: flex; align-items: center; gap: 1rem; font-size: 2rem; font-weight: bold; } .property-card .heading i { width: 5rem; height: 5rem; background: var(--color-green); } .property-card .content { padding: 4rem; line-height: 1.3; padding-top: 0; } .property-card .content p:not(:last-child) { margin-bottom: 0.2em;} .news-card { border:1px solid #444; padding: 4rem; border-radius:var(--border-radius-large); } .news-card .title { font-weight: 500; font-size: 2.2rem; } .news-card .link-button { margin-top: 2rem; } .news-card .description { margin-top: 2rem; } .news-small-card { border:1px solid #ccc; border-radius:var(--border-radius-large); display: flex; align-items: center; overflow: hidden; z-index: 1; position: relative; background: white; } .news-small-card .image { flex-basis: 20rem; flex-shrink: 0; position: relative; align-self: stretch; } .news-small-card .image img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; } .news-small-card .title { font-weight: 500; font-size: 1.8rem; text-transform: uppercase; } .news-small-card .content { padding: 2rem; font-size: 1.7rem; } .news-small-card .link-button { margin-top: 1rem; } .news-small-card .description { margin-top: 1rem; } .news-small-card:hover { border: 1px solid var(--color-green); z-index: 10; filter: drop-shadow(0 0 15px #2adfa070); } @media screen and (max-width: 768px) { .news-small-card { flex-direction: column; } } .feedback-card { padding: 4rem; border-radius:var(--border-radius-large); display: flex; gap: 2rem; align-items: center; position: relative; margin-bottom: 2rem; } .feedback-card .title { font-weight: 500; font-size: 2.2rem; } .feedback-card .link-button { margin-top: 2rem; } .feedback-card .description { margin-top: 2rem; } .link-button { font-size: 1.8rem; display: flex; gap: 1rem; align-items: center; display: flex; gap: 1rem; align-items: center; --button-icon-color: var(--color-green); cursor: pointer; text-decoration: none; } .link-button i { width: 3rem; height: 3rem; background: var(--button-icon-color); transition: .3s; } .link-button:hover { --button-icon-color: black; } .portfolio-card { border:1px solid #ccc; border-radius:var(--border-radius-large); padding-top: 100%; max-width: 40rem; overflow: hidden; position: relative; transition: .3; } .portfolio-card .image { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url(/bitrix/templates/vebas/css/../img/no-image.jpg) center/cover no-repeat; } .portfolio-card .image img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; } .portfolio-card .content { position: absolute; bottom: 0; left: 0; width: 100%; padding: 2.4rem; background: linear-gradient(to top, #000a 50%, transparent); color: white; } .portfolio-card .title { font-size: 2rem; font-weight: 500; } .portfolio-card .link-button { margin-top: 2rem; } .portfolio-card:hover { border: 1px solid var(--color-green); z-index: 10; filter: drop-shadow(0 0 15px #2adfa070); } #info .articles-container { gap: 2rem; } #info .block-container { display: flex; gap: 4rem; flex-wrap: wrap; } #info .block-container > * { flex-basis: 30rem; flex-grow: 1; } #info .form-text { font-style: italic; font-size: 1.7rem; } #info .form { margin-top: 2rem; } /* ============================================================== */ .cargo-group-card { font-size: 1.7rem; } .cargo-group-card .image { margin-bottom: 2rem; border-radius: var(--border-radius); overflow: hidden; position: relative; padding-top: 40%; } .cargo-group-card .image img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; } .cargo-group-card .title { font-size: 2.4rem; font-weight: 500; } .cargo-group-card .description { font-style: italic; } .cargo-group-card .icon { background: var(--color-gray); width: 2rem; height: 2rem; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; position: absolute; right: 0; top: 50%; transform: translate(0, -50%); } .cargo-group-card .icon i { bacckground: black; width: 1rem; height: 1rem; } .cargo-group-card ul { margin-top: 1rem; } .cargo-group-card ul li { position: relative; padding-left: 2rem; } .cargo-group-card ul li:not(:last-child) { margin-bottom: 0.5em; } .cargo-group-card ul li a { display: inline-block; align-items: center; flex-wrap: wrap; gap: 1rem; line-height: 1.2; padding-right: 3rem; } .cargo-group-card ul li::before { display: inline-block; width: 3px; height: 3px; background: #aaa; border-radius: 50%; content: ''; position: absolute; left: 0; top: 0.5em; } .cargo-group-card ul li:hover .icon { background: var(--color-green);} .cargo-group-card ul li:hover .icon i { background: white; } @media screen and (max-width: 768px) { .cargo-group-card .image { padding-top: 60%; } } #catalog-categories .flex-container { justify-content: space-between; } .cargo-subcategories { margin-top: 4rem; } .cargo-subcategories .grid-container { gap: 2rem; } .cargo-card { background: white; border-left: 5px solid var(--color-green); padding: 1rem 2rem; display: flex; align-items: center; font-size: 1.8rem; font-weight: 500; border-radius: var(--border-radius); line-height: 1.2; transition: .3s; } .cargo-card:hover { background: var(--color-green); color: white; text-decoration: none; } #category-properties { background: linear-gradient(to top, #0000000a, transparent 4rem); } #category-properties .block-content { margin-top: -2rem; margin-bottom: 4rem; } .more-text { margin-bottom: 2rem; } .more-text .more-button { height: 4rem !important; } .more-text .details { max-height: 0; overflow: hidden; padding: 0 4rem; transition:.5s; border: 3px solid transparent; margin-top: -3px; } .more-text.-open .details { max-height: 3000px; padding: 4rem; border-color: var(--input-border-color); } .more-text.-open .more-button { border-color: var(--color-red) !important; } .openable-text { background: #f7f7f7; margin-bottom: 2rem; } .openable-text .intro { padding: 2rem 4rem; display: flex; align-items: center; border-left: 8px solid var(--color-blue); cursor: pointer; padding-right: 7rem; position: relative; } .openable-text .intro h3 { margin: 0; } .openable-text .intro::after { content: ''; display: block; width: 2rem; height: 2rem; position: absolute; right: 2rem; top: 50%; transform: translate(0, -50%); background: black; --mask: url(/bitrix/templates/vebas/css/../img/icons/arrow-down.png) center / contain no-repeat; mask: var(--mask); -webkit-mask: var(--mask); transition: .3s; transform-origin: center; } .openable-text .intro .title { font-size: 1.8rem; font-weight: bold; } .openable-text .details { max-height: 0; overflow: hidden; padding: 0 4rem; transition:.3s; } .openable-text.-open .details { max-height: 1000px; padding: 4rem; border-left: 2px solid var(--color-blue); } .openable-text.-open .intro { background: linear-gradient(to top, #125d8430, transparent 4rem), #f7f7f7; } .openable-text.-open .intro::after { transform: translate(0, -50%) rotate(180deg); } .links-wrapper { border: 1px solid #e0e0e0; padding: 2rem; margin: 4rem 0; } .links-wrapper h2 { margin-bottom: 1rem; font-size: 2.4rem; border:none; padding: none; } .links-group { display: flex; gap: 1rem; flex-wrap: wrap; } .links-group a { color: black; display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.5rem 1rem; background: #f0f0f0; font-size: 1.6rem;text-decoration: none; transition: .3s all; position: relative; border-left: 2px solid var(--color-green); } .links-group a::before { content: ''; width: 0.5rem; height: 0.5rem; background: var(--color-blue); display: inline-block; } .links-group a:hover { color: white; background: black; } .formula-box { background: #f5f5f6; padding: 2rem; text-align: center; display: block; margin: 2rem auto; border: 2px solid var(--color-green); font-size: 1.6rem; width: max-content; max-width: 80rem; } .formula-box p { margin: 0; } .formula-box img { margin-bottom: 1rem; display: inline-block; } /* ============================================================== */ #cookie-popup { display: none; position: fixed; bottom: 2rem; left: 50%; width: 100%; max-width: 75rem; box-shadow: 0 0 10px 0 #0002; border-radius: 0rem; padding: 3rem 4rem; background: #fff8; backdrop-filter: blur(1rem); transform: translate(-50%, 0); z-index:10000; flex-wrap: wrap; justify-content: center; gap: 1rem; align-items: center; color: black; font-size: 1.5rem; } #cookie-popup .text { flex-basis: 20rem; flex-grow: 1; } #cookie-popup .link { color: var(--color-blue); text-decoration: underline; } #cookie-popup.-active { display: flex; } /* ============================================================== */ .number-card { display: flex; align-items: center; flex-direction: column; justify-content: center; text-align: center; gap: 1rem; } .number-card .image { border-radius: 50%; width: 15rem; height: 15rem; -border: 3px solid var(--color-blue); background: linear-gradient(to top, rgba(from var(--color-blue) r g b / 0.2), transparent 20%), #2adfa0; display: flex; align-items: center; justify-content: center; flex-shrink: 0; } .number-card .image i { width: 50%; height: 50%; background: white; } .number-card .title { font-size: 1.8rem; } .number-card .number { font-size: 2.5rem; display: flex; align-items: center; gap: 0.5rem; justify-content: center; } .number-card .number span { font-size: 140%; font-weight: 500; } @media screen and (max-width: 640px) { .number-card { flex-direction: row; text-align: left; } .number-card .number { justify-content: left; } .number-card .image { width: 10rem; height: 10rem; } .number-card .content { flex-grow: 1; } } /* End */ /* /bitrix/templates/vebas/css/styles-reset.css?1755796393830 */ /* /bitrix/templates/vebas/js/prettyPhoto/prettyPhoto.css?175579639421806 */ /* /bitrix/templates/vebas/js/magnific-popup/magnific-popup.css?17557963937043 */ /* /bitrix/templates/vebas/js/swiper/swiper-bundle.css?175579639419297 */ /* /bitrix/templates/vebas/css/styles-theme.css?17630925531678 */ /* /bitrix/templates/vebas/css/styles-icons.css?17767543075539 */ /* /bitrix/templates/vebas/css/ui-forms.css?176309253010057 */ /* /bitrix/templates/vebas/css/ui-slider.css?17573104451840 */ /* /bitrix/templates/vebas/css/styles.css?179212041653328 */