/* Start:/bitrix/templates/main/css/jquery.css?17645975631775*/ /* Slider */ .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; top: 0; left: 0; display: block; margin-left: auto; margin-right: auto; } .slick-track:before, .slick-track:after { display: table; content: ''; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { display: none; float: left; height: 100%; min-height: 1px; } [dir='rtl'] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } /* End */ /* Start:/bitrix/templates/main/css/lightbox.min.css?176459756313749*/ .glightbox-container{width:100%;height:100%;position:fixed;top:0;left:0;z-index:999999!important;overflow:hidden;-ms-touch-action:none;touch-action:none;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;-ms-text-size-adjust:100%;text-size-adjust:100%;-webkit-backface-visibility:hidden;backface-visibility:hidden;outline:0}.glightbox-container.inactive{display:none}.glightbox-container .gcontainer{position:relative;width:100%;height:100%;z-index:9999;overflow:hidden}.glightbox-container .gslider{-webkit-transition:-webkit-transform .4s ease;transition:-webkit-transform .4s ease;transition:transform .4s ease;transition:transform .4s ease,-webkit-transform .4s ease;height:100%;left:0;top:0;width:100%;position:relative;overflow:hidden;display:-webkit-box!important;display:-ms-flexbox!important;display:flex!important;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.glightbox-container .gslide{width:100%;position:absolute;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;opacity:0}.glightbox-container .gslide.current{opacity:1;z-index:99999;position:relative}.glightbox-container .gslide.prev{opacity:1;z-index:9999}.glightbox-container .gslide-inner-content{width:100%}.glightbox-container .ginner-container{position:relative;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;max-width:100%;margin:auto;height:100vh}.glightbox-container .ginner-container.gvideo-container{width:100%}.glightbox-container .ginner-container.desc-bottom,.glightbox-container .ginner-container.desc-top{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.glightbox-container .ginner-container.desc-left,.glightbox-container .ginner-container.desc-right{max-width:100%!important}.gslide iframe,.gslide video{outline:0!important;border:none;min-height:165px;-webkit-overflow-scrolling:touch;-ms-touch-action:auto;touch-action:auto}.gslide:not(.current){pointer-events:none}.gslide-image{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.gslide-image img{max-height:100vh;display:block;padding:0;float:none;outline:0;border:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;max-width:100vw;width:auto;height:auto;-o-object-fit:cover;object-fit:cover;-ms-touch-action:none;touch-action:none;margin:auto;min-width:200px}.desc-bottom .gslide-image img,.desc-top .gslide-image img{width:auto}.desc-left .gslide-image img,.desc-right .gslide-image img{width:auto;max-width:100%}.gslide-image img.zoomable{position:relative}.gslide-image img.dragging{cursor:-webkit-grabbing!important;cursor:grabbing!important;-webkit-transition:none;transition:none}.gslide-video{position:relative;max-width:100vh;width:100%!important}.gslide-video .plyr__poster-enabled.plyr--loading .plyr__poster{display:none}.gslide-video .gvideo-wrapper{width:100%;margin:auto}.gslide-video::before{content:'';position:absolute;width:100%;height:100%;background:rgba(255,0,0,.34);display:none}.gslide-video.playing::before{display:none}.gslide-video.fullscreen{max-width:100%!important;min-width:100%;height:75vh}.gslide-video.fullscreen video{max-width:100%!important;width:100%!important}.gslide-inline{background:#fff;text-align:left;max-height:calc(100vh - 40px);overflow:auto;max-width:100%;margin:auto}.gslide-inline .ginlined-content{padding:20px;width:100%}.gslide-inline .dragging{cursor:-webkit-grabbing!important;cursor:grabbing!important;-webkit-transition:none;transition:none}.ginlined-content{overflow:auto;display:block!important;opacity:1}.gslide-external{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%;min-width:100%;background:#fff;padding:0;overflow:auto;max-height:75vh;height:100%}.gslide-media{display:-webkit-box;display:-ms-flexbox;display:flex;width:auto}.zoomed .gslide-media{-webkit-box-shadow:none!important;box-shadow:none!important}.desc-bottom .gslide-media,.desc-top .gslide-media{margin:0 auto;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.gslide-description{position:relative;-webkit-box-flex:1;-ms-flex:1 0 100%;flex:1 0 100%}.gslide-description.description-left,.gslide-description.description-right{max-width:100%}.gslide-description.description-bottom,.gslide-description.description-top{margin:0 auto;width:100%}.gslide-description p{margin-bottom:12px}.gslide-description p:last-child{margin-bottom:0}.zoomed .gslide-description{display:none}.glightbox-button-hidden{display:none}.glightbox-mobile .glightbox-container .gslide-description{height:auto!important;width:100%;position:absolute;bottom:0;padding:19px 11px;max-width:100vw!important;-webkit-box-ordinal-group:3!important;-ms-flex-order:2!important;order:2!important;max-height:78vh;overflow:auto!important;background:-webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,0)),to(rgba(0,0,0,.75)));background:linear-gradient(to bottom,rgba(0,0,0,0) 0,rgba(0,0,0,.75) 100%);-webkit-transition:opacity .3s linear;transition:opacity .3s linear;padding-bottom:50px}.glightbox-mobile .glightbox-container .gslide-title{color:#fff;font-size:1em}.glightbox-mobile .glightbox-container .gslide-desc{color:#a1a1a1}.glightbox-mobile .glightbox-container .gslide-desc a{color:#fff;font-weight:700}.glightbox-mobile .glightbox-container .gslide-desc *{color:inherit}.glightbox-mobile .glightbox-container .gslide-desc .desc-more{color:#fff;opacity:.4}.gdesc-open .gslide-media{-webkit-transition:opacity .5s ease;transition:opacity .5s ease;opacity:.4}.gdesc-open .gdesc-inner{padding-bottom:30px}.gdesc-closed .gslide-media{-webkit-transition:opacity .5s ease;transition:opacity .5s ease;opacity:1}.greset{-webkit-transition:all .3s ease;transition:all .3s ease}.gabsolute{position:absolute}.grelative{position:relative}.glightbox-desc{display:none!important}.glightbox-open{overflow:hidden}.gloader{height:25px;width:25px;-webkit-animation:lightboxLoader .8s infinite linear;animation:lightboxLoader .8s infinite linear;border:2px solid #fff;border-right-color:transparent;border-radius:50%;position:absolute;display:block;z-index:9999;left:0;right:0;margin:0 auto;top:47%}.goverlay{width:100%;height:calc(100vh + 1px);position:fixed;top:-1px;left:0;background:#000;will-change:opacity}.glightbox-mobile .goverlay{background:#000}.gclose,.gnext,.gprev{z-index:99999;cursor:pointer;width:26px;height:44px;border:none;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.gclose svg,.gnext svg,.gprev svg{display:block;width:25px;height:auto;margin:0;padding:0}.gclose.disabled,.gnext.disabled,.gprev.disabled{opacity:.1}.gclose .garrow,.gnext .garrow,.gprev .garrow{stroke:#fff}.gbtn.focused{outline:2px solid #0f3d81}iframe.wait-autoplay{opacity:0}.glightbox-closing .gclose,.glightbox-closing .gnext,.glightbox-closing .gprev{opacity:0!important}.glightbox-clean .gslide-description{background:#fff}.glightbox-clean .gdesc-inner{padding:22px 20px}.glightbox-clean .gslide-title{font-size:1em;font-weight:400;font-family:arial;color:#000;margin-bottom:19px;line-height:1.4em}.glightbox-clean .gslide-desc{font-size:.86em;margin-bottom:0;font-family:arial;line-height:1.4em}.glightbox-clean .gslide-video{background:#000}.glightbox-clean .gclose,.glightbox-clean .gnext,.glightbox-clean .gprev{background-color:rgba(0,0,0,.75);border-radius:4px}.glightbox-clean .gclose path,.glightbox-clean .gnext path,.glightbox-clean .gprev path{fill:#fff}.glightbox-clean .gprev{position:absolute;top:-100%;left:30px;width:40px;height:50px}.glightbox-clean .gnext{position:absolute;top:-100%;right:30px;width:40px;height:50px}.glightbox-clean .gclose{width:35px;height:35px;top:15px;right:10px;position:absolute}.glightbox-clean .gclose svg{width:18px;height:auto}.glightbox-clean .gclose:hover{opacity:1}.gfadeIn{-webkit-animation:gfadeIn .5s ease;animation:gfadeIn .5s ease}.gfadeOut{-webkit-animation:gfadeOut .5s ease;animation:gfadeOut .5s ease}.gslideOutLeft{-webkit-animation:gslideOutLeft .3s ease;animation:gslideOutLeft .3s ease}.gslideInLeft{-webkit-animation:gslideInLeft .3s ease;animation:gslideInLeft .3s ease}.gslideOutRight{-webkit-animation:gslideOutRight .3s ease;animation:gslideOutRight .3s ease}.gslideInRight{-webkit-animation:gslideInRight .3s ease;animation:gslideInRight .3s ease}.gzoomIn{-webkit-animation:gzoomIn .5s ease;animation:gzoomIn .5s ease}.gzoomOut{-webkit-animation:gzoomOut .5s ease;animation:gzoomOut .5s ease}@-webkit-keyframes lightboxLoader{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes lightboxLoader{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-webkit-keyframes gfadeIn{from{opacity:0}to{opacity:1}}@keyframes gfadeIn{from{opacity:0}to{opacity:1}}@-webkit-keyframes gfadeOut{from{opacity:1}to{opacity:0}}@keyframes gfadeOut{from{opacity:1}to{opacity:0}}@-webkit-keyframes gslideInLeft{from{opacity:0;-webkit-transform:translate3d(-60%,0,0);transform:translate3d(-60%,0,0)}to{visibility:visible;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}}@keyframes gslideInLeft{from{opacity:0;-webkit-transform:translate3d(-60%,0,0);transform:translate3d(-60%,0,0)}to{visibility:visible;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}}@-webkit-keyframes gslideOutLeft{from{opacity:1;visibility:visible;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{-webkit-transform:translate3d(-60%,0,0);transform:translate3d(-60%,0,0);opacity:0;visibility:hidden}}@keyframes gslideOutLeft{from{opacity:1;visibility:visible;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{-webkit-transform:translate3d(-60%,0,0);transform:translate3d(-60%,0,0);opacity:0;visibility:hidden}}@-webkit-keyframes gslideInRight{from{opacity:0;visibility:visible;-webkit-transform:translate3d(60%,0,0);transform:translate3d(60%,0,0)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}}@keyframes gslideInRight{from{opacity:0;visibility:visible;-webkit-transform:translate3d(60%,0,0);transform:translate3d(60%,0,0)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}}@-webkit-keyframes gslideOutRight{from{opacity:1;visibility:visible;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{-webkit-transform:translate3d(60%,0,0);transform:translate3d(60%,0,0);opacity:0}}@keyframes gslideOutRight{from{opacity:1;visibility:visible;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{-webkit-transform:translate3d(60%,0,0);transform:translate3d(60%,0,0);opacity:0}}@-webkit-keyframes gzoomIn{from{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}to{opacity:1}}@keyframes gzoomIn{from{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}to{opacity:1}}@-webkit-keyframes gzoomOut{from{opacity:1}50%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}to{opacity:0}}@keyframes gzoomOut{from{opacity:1}50%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}to{opacity:0}}@media (min-width:769px){.glightbox-container .ginner-container{width:auto;height:auto;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.glightbox-container .ginner-container.desc-top .gslide-description{-webkit-box-ordinal-group:1;-ms-flex-order:0;order:0}.glightbox-container .ginner-container.desc-top .gslide-image,.glightbox-container .ginner-container.desc-top .gslide-image img{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}.glightbox-container .ginner-container.desc-left .gslide-description{-webkit-box-ordinal-group:1;-ms-flex-order:0;order:0}.glightbox-container .ginner-container.desc-left .gslide-image{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}.gslide-image img{max-height:97vh;max-width:100%}.gslide-image img.zoomable{cursor:-webkit-zoom-in;cursor:zoom-in}.zoomed .gslide-image img.zoomable{cursor:-webkit-grab;cursor:grab}.gslide-inline{max-height:95vh}.gslide-external{max-height:100vh}.gslide-description.description-left,.gslide-description.description-right{max-width:275px}.glightbox-open{height:auto}.goverlay{background:rgba(0,0,0,.92)}.glightbox-clean .gslide-media{-webkit-box-shadow:1px 2px 9px 0 rgba(0,0,0,.65);box-shadow:1px 2px 9px 0 rgba(0,0,0,.65)}.glightbox-clean .description-left .gdesc-inner,.glightbox-clean .description-right .gdesc-inner{position:absolute;height:100%;overflow-y:auto}.glightbox-clean .gclose,.glightbox-clean .gnext,.glightbox-clean .gprev{background-color:rgba(0,0,0,.32)}.glightbox-clean .gclose:hover,.glightbox-clean .gnext:hover,.glightbox-clean .gprev:hover{background-color:rgba(0,0,0,.7)}.glightbox-clean .gprev{top:45%}.glightbox-clean .gnext{top:45%}}@media (min-width:992px){.glightbox-clean .gclose{opacity:.7;right:20px}}@media screen and (max-height:420px){.goverlay{background:#000}} /* End */ /* Start:/bitrix/templates/main/css/slick.css?17645975631775*/ /* Slider */ .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; top: 0; left: 0; display: block; margin-left: auto; margin-right: auto; } .slick-track:before, .slick-track:after { display: table; content: ''; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { display: none; float: left; height: 100%; min-height: 1px; } [dir='rtl'] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } /* End */ /* Start:/bitrix/templates/main/css/style.css?1764597563339190*/ @font-face { font-family: 'Golos Text'; src: url(/bitrix/templates/main/css/../fonts/GolosText-Regular.ttf); font-weight: 400; } @font-face { font-family: 'Golos Text'; src: url(/bitrix/templates/main/css/../fonts/GolosText-Medium.ttf); font-weight: 500; } @font-face { font-family: 'Golos Text'; src: url(/bitrix/templates/main/css/../fonts/GolosText-SemiBold.ttf); font-weight: 600; } @font-face { font-family: 'Golos Text'; src: url(/bitrix/templates/main/css/../fonts/GolosText-Bold.ttf); font-weight: 700; } * { padding: 0; margin: 0; } body { overflow-x: clip; } a { text-decoration: none; color: inherit; transition: 0.3s; } .body-lock { overflow: hidden; } body::after { content: ''; position: fixed; top: 0; right: 0; bottom: 0; left: 0; background-color: rgba(34, 34, 40, 0.40); position: 0; visibility: hidden; transition: 0.3s; } .body-lock::after { opacity: 1; visibility: visible; } button { transition: 0.3s; cursor: pointer; border: 0; outline: 0; background-color: inherit; cursor: pointer; } input { border: 0; outline: 0; } .container { max-width: 1526px; padding: 0 75px; box-sizing: border-box; margin: 0 auto; } .header { /* overflow: hidden; */ padding-top: 16px; padding-bottom: 24px; position: sticky; top: 0; right: 0; left: 0; background: var(--white, #FFF); box-shadow: 0 0 16px 0 rgba(37, 37, 37, 0.10); z-index: 9; transition: 0.3s; } .header-top { transition: 0.3s; } .header-top .container { display: flex; justify-content: space-between; gap: 20px; align-items: center; transition: 0.3s; } .header-top-nav { display: flex; gap: 12px; align-items: center; /* overflow-x: scroll; */ } .header-top-nav::-webkit-scrollbar { display: none; } .header-top-nav-link { color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 19px; white-space: nowrap; opacity: 0.8; } .header-top-nav-link:hover { color: var(--Accend, #FF5A00); opacity: 1; } .header-top-nav-drop { white-space: nowrap; position: relative; } .header-top-nav-drop-btn { color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 19px; transition: 0.3s; display: flex; gap: 4px; align-items: center; cursor: pointer; opacity: 0.8; } .header-top-nav-drop_active .header-top-nav-drop-btn { color: var(--Primary-1, #FF5A00); opacity: 1; } .header-top-nav-drop-btn:hover { color: var(--Accend, #FF5A00); opacity: 1; } .header-top-nav-drop-btn::after { content: ''; width: 12px; height: 12px; background-image: url(/bitrix/templates/main/css/../img/header/arrow.svg); background-size: 100% 100%; display: flex; transition: 0.3s; } .header-top-nav-drop-btn:hover::after { background-image: url(/bitrix/templates/main/css/../img/header/arrow_active.svg); } .header-top-nav-drop_active .header-top-nav-drop-btn::after { transform: rotate(180deg); background-image: url(/bitrix/templates/main/css/../img/header/arrow_active.svg); } .header-top-nav-drop ul { position: absolute; top: 30px; left: 0; display: flex; flex-direction: column; gap: 8px; border-radius: var(--Border-radius-2, 16px); background: var(--white, #FFF); box-shadow: 0 20px 48px 0 rgba(37, 37, 37, 0.16); z-index: 1; list-style: none; padding: 12px 10px; box-sizing: border-box; width: 230px; display: none; } .header-top-nav-drop_active ul { display: flex; } .header-top-nav-drop ul li { width: 100%; display: flex; } .header-top-nav-drop ul a { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; padding: 6px 12px; border-radius: var(--Border-radius-1, 10px); width: 100%; } .header-top-nav-drop ul a:hover { color: var(--Primary-1, #FF5A00); background: rgba(255, 90, 0, 0.05); } .header-top-add { display: flex; gap: 12px; align-items: center; } .header-top-add div { color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 19px; display: flex; gap: 16px; align-items: center; white-space: nowrap; } .header-top-add div span { opacity: 0.8; } .header-top-add div:hover { opacity: 1; } .header-top-add button { opacity: 0.8; color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 19px; } .header-top-add button:hover { color: var(--Accend, #FF5A00); opacity: 1; } .header-top-add div a { color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 500; line-height: 18px; opacity: 0.8; } .header-top-add div a:hover { color: var(--Accend, #FF5A00); opacity: 1; } .header-top-add-soc { display: flex; gap: 16px; align-items: center; } .header-top-add-soc a { width: 16px; height: 16px; } .header-top-add-soc a:hover { opacity: 0.5; } .header-top-add-soc a img { width: 100%; height: 100%; } .header-main { margin-top: 27px; width: 100%; transition: 0.3s; } .header-main .container { display: flex; align-items: center; position: relative; } .header-main-logo { display: flex; gap: 14.23px; align-items: flex-start; } .header-main-logo img:first-child { width: 30.949px; height: 32.753px; } .header-main-logo img:last-child { width: 170.754px; transition: 0.3s; } .header_scrolled .header-main-logo img:last-child { width: 0; } .header-main-catalog-btn { color: var(--white, #FFF); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; display: flex; align-items: center; margin-left: 48px; gap: 12px; padding: 11px 24px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); background: var(--Accend, #FF5A00); } .header-main-catalog-btn::before { content: ''; width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/header/catalog.svg); background-size: 100% 100%; display: flex; } .header-main-catalog-btn:hover, .header-main-catalog-btn.active { background: var(--Dark-primary-1, #E25000); } /* .header-main-catalog-btn:hover::before, .header-main-catalog-btn.active::before { background-image: url(/bitrix/templates/main/css/../img/header/catalog_active.svg); } */ .header_scrolled .header-main-catalog-btn { margin-left: 24px; } .header-main-search { width: 100%; margin-left: 16px; position: relative; } .header-main-search-field { position: relative; display: flex; box-sizing: border-box; padding: 11px 16px; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Grey-1, #F5F3F1); background: var(--white, #FFF); align-items: center; gap: 12px; align-self: stretch; transition: 0.3s; } .header-main-search-field:hover { border: 2px solid var(--Primary-1, #FF5A00); } .header-main-search-field input { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; width: 100%; } .header-main-search-field button { width: 20px; height: 20px; opacity: 0.6; display: flex; background-image: url(/bitrix/templates/main/css/../img/header/search.svg); background-size: 100% 100%; } .header-main-search-field:hover button { opacity: 1; } .header-main-search-result { position: absolute; top: 71px; right: 0; left: 0; /* bottom: -100px; */ margin: auto; max-height: 0; height: calc(100vh - 150px); width: 100%; min-width: 557px; /* width: 100%; */ border-radius: var(--Border-radius-1, 10px); border: 0; background: var(--white, #FFF); box-shadow: 0 20px 48px 0 rgba(37, 37, 37, 0.16); padding: 0; box-sizing: border-box; display: flex; justify-content: space-between; gap: 16px; overflow-y: scroll; transition: 0.3s; } .header-main-search-result.active { max-height: 562px; padding: 24px; border: 2px solid var(--Grey-1, #F5F3F1); } .header_scrolled .header-main-search-result { top: 72px; } .header-main-search-result-cont { /* width: 325px; */ display: flex; flex-direction: column; width: auto; width: 100%; } .header-main-search-result-cont-row { display: flex; flex-direction: column; gap: 18px; height: 420px; overflow-y: scroll; } .header-main-search-result-cont-row::-webkit-scrollbar { display: none; } .header-main-search-result-cont-row .card { display: flex; gap: 16px; border: 0; padding: 0; margin: 0; border: 1px solid var(--Grey-1, #F5F3F1); padding: 16px; box-sizing: border-box; } .header-main-search-result-cont-row .card:hover { box-shadow: none; } .header-main-search-result-cont-row .card-pic { max-width: 96px; min-width: 96px; height: 96px; } .header-main-search-result-cont .card-opt { display: none; } .header-main-search-result-cont .card-price { font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; } .header-main-search-result-cont .card-price-old { font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; text-decoration-line: line-through; } .header-main-search-result-cont .card-price-discount { font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; text-decoration-line: line-through; } .header-main-search-result-cont .card-add { margin-bottom: 0; } .header-main-search-result-cont-row .card-pic { position: unset; } .header-main-search-result-cont-row .card-pic-add { position: absolute; top: 16px; right: 16px; } .header-main-search-result-cont-row .card-pic img { position: unset; } .header-main-search-result-cont-row .card-pic-tags, .header-main-search-result-cont-row .card-pic-preview { display: none; } .header-main-search-result-cont-row .card-cont { width: 100%; } .header-main-search-result-cont-row .card-bot { display: none; } .header-main-search-result-cont-row .card-color { position: absolute; bottom: 16px; left: 16px; margin-bottom: 0; } .header-main-search-result-cont-row .card-color button { display: none; } .header-main-search-result-cont-row .card-color button:nth-child(-n+3) { display: flex; } .header-main-search-result-cont-row .card-title { height: auto; font-size: 12px; font-style: normal; font-weight: 500; line-height: 16px; text-overflow: ellipsis; width: calc(100% - 32px); } .header-main-search-result-cont-row .card-cat { font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; text-overflow: ellipsis; } .header-main-search-result-cont-row .card-pic-add-ver { display: none; } .header-main-search-result-cont-all { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); padding: 11px 24px; box-sizing: border-box; display: flex; width: fit-content; margin-top: auto; } .header-main-search-result-cont-all:hover { background-color: #E8E8E8; } .header-main-search-result-cat { display: flex; flex-direction: column; gap: 16px; max-width: 16px; min-width: 160px; } .header-main-search-result-cat-title { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; } .header-main-search-result-cat ul { display: flex; flex-direction: column; gap: 12px; list-style: none; } .header-main-search-result-cat ul a { color: var(--black, #252525); font-family: "Golos Text"; font-size: 12px; font-style: normal; font-weight: 500; line-height: 16px; } .header-main-search-result-cat ul a:hover { color: #FF5A00; } .header-main-search-result-cat ul a span { color: rgba(37, 37, 37, 0.40); font-family: "Golos Text"; font-size: 12px; font-style: normal; font-weight: 500; line-height: 16px; } .header-main-add { margin-left: 48px; display: flex; gap: 32px; transition: 0.3s; } .header_scrolled .header-main-add { margin-left: 24px; } .header-main-add a, .header-main-add button { display: flex; flex-direction: column; align-items: center; gap: 4px; color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 19px; } .header-main-add a:hover, .header-main-add button:hover { color: var(--Accend, #FF5A00); } .header-main-add .header-main-add-pic { width: 20px; height: 20px; background-size: 100% 100%; transition: 0.3s; } .header-main-add_acc .header-main-add-pic { background-image: url(/bitrix/templates/main/css/../img/header/acc.svg); } .header-main-add_acc:hover .header-main-add-pic { background-image: url(/bitrix/templates/main/css/../img/header/acc_active.svg); } .header-main-add_fav .header-main-add-pic { background-image: url(/bitrix/templates/main/css/../img/header/fav.svg); } .header-main-add_fav:hover .header-main-add-pic { background-image: url(/bitrix/templates/main/css/../img/header/fav_active.svg); } .header-main-add_comp .header-main-add-pic { background-image: url(/bitrix/templates/main/css/../img/header/comp.svg); } .header-main-add_comp:hover .header-main-add-pic { background-image: url(/bitrix/templates/main/css/../img/header/comp_active.svg); } .header-main-add_cart .header-main-add-pic { background-image: url(/bitrix/templates/main/css/../img/header/cart.svg); } .header-main-add_cart:hover .header-main-add-pic { background-image: url(/bitrix/templates/main/css/../img/header/cart_active.svg); } .header-main-add_acc-block { position: relative; } .header-main-add_acc-block_active .header-main-add_acc { color: var(--Primary-1, #FF5A00); } .header-main-add_acc-block_active .header-main-add-pic { background-image: url(/bitrix/templates/main/css/../img/header/acc_active.svg); } .header-main-add_acc-block ul { position: absolute; position: absolute; top: 60px; left: 0; display: flex; flex-direction: column; gap: 8px; border-radius: var(--Border-radius-2, 16px); background: var(--white, #FFF); box-shadow: 0 20px 48px 0 rgba(37, 37, 37, 0.16); z-index: 1; list-style: none; padding: 12px 10px; box-sizing: border-box; width: 230px; display: none; } .header-main-add_acc-block_active ul { display: flex; } .header-main-add_acc-block ul li { width: 100%; display: flex; } .header-main-add_acc-block ul a { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; padding: 6px 12px; border-radius: var(--Border-radius-1, 10px); width: 100%; align-items: flex-start !important; } .header-main-add_acc-block ul a:hover { color: var(--Primary-1, #FF5A00); background: rgba(255, 90, 0, 0.05); } .header-main-add_acc_exit { display: flex !important; align-items: center !important; flex-direction: row !important; gap: 12px !important; } .header-main-add_acc_exit::before { content: ''; width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/header/exit.svg); background-size: 100% 100%; } .header-nav { margin-top: 27px; transition: 0.3s; } .header-nav .container { display: flex; gap: 32px; align-items: center; overflow-x: scroll; } .header-nav .container::-webkit-scrollbar { display: none; } .header-nav a { color: var(--black, #252525); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; white-space: nowrap; } .header-nav a:hover { color: var(--Accend, #FF5A00); } .header-nav_dis { display: flex; align-items: center; gap: 6px; } .header-nav_dis::before { content: ''; width: 22px; height: 22px; background-image: url(/bitrix/templates/main/css/../img/header/dis.svg); background-size: 100% 100%; display: flex; } .header-nav_opt { color: var(--black, #222228); padding: 3px 12px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); } .header_scrolled .header-top { max-height: 0; overflow: hidden; } .header_scrolled .header-top .container { max-height: 0; } .header_scrolled .header-nav { max-height: 0; overflow: hidden; margin: 0; } .header_scrolled .header-main { margin: 0; } .header_scrolled { padding: 12px 0; } .main-banner { margin-top: 56px; } .main-banner .container { display: flex; gap: 16px; } .main-banner-slider { box-sizing: border-box; height: 434px; width: calc(100% - 441px - 16px); position: relative; border-radius: 16px; position: relative; } .main-banner-slider .slick-list { border-radius: 16px; overflow: hidden; } .main-banner-slider .slick-arrow { position: absolute; top: 0; bottom: 0; left: 24px; margin: auto; width: 36px; height: 36px; background-color: var(--white, #FFF); box-shadow: 0 2px 4px 0 rgba(37, 37, 37, 0.16); transition: 0.3s; border-radius: 50%; font-size: 0; background-image: url(/bitrix/templates/main/css/../img/main-popular/arrow.svg); background-size: 20px 20px; background-repeat: no-repeat; background-position: center center; transition: 0.3s; z-index: 1; opacity: 0; } .main-banner-slider:hover .slick-arrow { opacity: 1; } .main-banner-slider .slick-arrow:hover { background-color: var(--Primary-1, #FF5A00); box-shadow: 0 2px 4px 0 rgba(37, 37, 37, 0.16); background-image: url(/bitrix/templates/main/css/../img/main-popular/arrow_active.svg); } .main-banner-slider .slick-next { left: auto; right: 24px; transform: rotate(180deg); } .main-banner-slider .slick-dots { z-index: 1; position: absolute; right: 0; bottom: -20px; left: 0; margin: auto; display: flex; list-style: none; width: fit-content; gap: 8px; } .main-banner-slider .slick-dots li button { font-size: 0; width: 4px; height: 2px; opacity: 0.2; background: #222228; transition: 0.3s; border-radius: 16px; } .main-banner-slider .slick-dots .slick-active button { width: 16px; opacity: 0.6; } .main-banner-slider-row { height: 100%; } .main-banner-slider .slick-slide { display: flex; width: 100%; } .main-banner-slider .slick-slide div { width: 100%; } .main-banner-slider-item { position: relative; height: 100%; width: 100%; /* border-radius: var(--Border-radius-2, 16px); */ overflow: hidden; padding: 64px; box-sizing: border-box; } .main-banner-slider-item-bg { position: absolute; top: 0; right: 0; left: 0; bottom: 0; z-index: -1; } .main-banner-slider-item-bg img { width: 100%; height: 100%; object-fit: cover; object-position: center center; } .main-banner-slider-item-bg_mob { display: none; } .main-banner-slider .slick-list, .main-banner-slider .slick-track { height: 100%; } .main-banner-slider-item-cont { max-width: 416px; display: flex; flex-direction: column; height: 100%; } .main-banner-slider-item-title { color: var(--white, #FFF); font-family: "Golos Text"; font-size: 36px; font-style: normal; font-weight: 600; line-height: 44px; margin-bottom: 24px; } .main-banner-slider-item-text { color: var(--white, #FFF); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; margin-bottom: 24px; } .main-banner-slider-item-chip { margin-top: auto; display: flex; gap: 12px; flex-wrap: wrap; } .main-banner-slider-item-chip div { padding: 3px 12px; border-radius: var(--Border-radius-1, 10px); background: rgba(255, 255, 255, 0.10); box-sizing: border-box; width: fit-content !important; color: var(--white, #FFF); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; } .main-banner-side { max-width: 441px; min-width: 441px; width: 100%; display: flex; flex-direction: column; gap: 16px; box-sizing: border-box; } .main-banner-side-block { position: relative; padding: 32px; box-sizing: border-box; border-radius: 16px; height: 209px; display: flex; flex-direction: column; } .main-banner-side-pic { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; } .main-banner-side-pic img { width: 100%; height: 100%; object-fit: cover; object-position: center center; } .main-banner-side-title { max-width: 263px; color: var(--white, #FFF); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; margin-bottom: 16px; } .main-banner-side-text { max-width: 270px; color: var(--white, #FFF); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .main-banner-side-btn { margin-top: auto; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; padding: 11px 24px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--white, #FFF); background: var(--white, #FFF); width: fit-content; } .main-banner-side-btn:hover { color: #fff; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Accend, #FF5A00); background: var(--Accend, #FF5A00); } .main-popular { margin-top: 80px; } .main-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 32px; } .main-top h2 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; } .main-top a { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; text-overflow: ellipsis; } .main-top a:hover { opacity: 1; color: #FF5A00; } .main-popular .main-top { margin-bottom: 24px; } .main-popular-nav { margin-bottom: 32px; display: flex; border-radius: var(--Border-radius-1, 10px); border: 4px solid var(--Grey-1, #F5F3F1); background: var(--Grey-1, #F5F3F1); width: fit-content; } .main-popular-nav button { padding: 6px 18px; box-sizing: border-box; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; border-radius: var(--Border-radius-1, 10px); } .main-popular-nav button:hover { color: #FF5A00; } .main-popular-nav button.active { background: var(--Accend, #FF5A00); color: #fff; box-shadow: 0 2px 8px 0 rgba(37, 37, 37, 0.24); } .main-card { height: 529px; width: 262px; background-color: red; } .main-popular-slider { position: relative; } .main-popular-slider .slick-list { margin: 0 -8px; } .main-popular-slider .slick-slide { margin: 0 8px; } .main-popular-more { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; padding: 11px 24px; box-sizing: border-box; max-width: 480px; width: 100%; display: flex; justify-content: center; align-items: center; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); margin: 0 auto; margin-top: 12px; } .main-popular-more:hover { background-color: #E8E8E8; } .main-top-mailing { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; text-overflow: ellipsis; display: flex; align-items: center; gap: 10px; } .main-top-mailing::after { content: ''; width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/main-popular/bell.svg); background-size: 100% 100%; display: flex; } .main-top-mailing:hover { opacity: 1; } .main-deal { margin-top: 80px; padding: 56px 0; box-sizing: border-box; background-image: url(/bitrix/templates/main/css/../img/main-deal/bg.png); background-size: cover; background-position: center center; } .main-deal-more { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; padding: 11px 24px; box-sizing: border-box; max-width: 480px; display: flex; justify-content: center; align-items: center; width: 100%; margin: 0 auto; margin-top: 32px; background-color: #fff; border-radius: var(--Border-radius-1, 10px); } .main-deal-more:hover { background-color: #FF5A00; color: #fff; } .main-info { margin-top: 80px; } .main-info h1 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; } .main-info-row { display: flex; gap: 16px; margin-top: 32px; } .main-info-text { width: calc(50% - 8px); padding-right: 64px; box-sizing: border-box; display: flex; flex-direction: column; gap: 24px; } .main-info-text h2 { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; } .main-info-text p { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; } .main-info-vid { width: calc(50% - 8px); box-shadow: 0 8px 24px 0 rgba(37, 37, 37, 0.16); border-radius: var(--Border-radius-2, 16px); overflow: hidden; position: relative; } .main-info-vid-pic { width: 100%; height: 100%; } .main-info-vid-pic img { width: 101%; height: 101%; object-fit: cover; object-position: center center; border-radius: var(--Border-radius-2, 16px); } .main-info-vid-btn { width: 52px; height: 52px; background-image: url(/bitrix/templates/main/css/../img/main-info/btn.svg); background-size: 100% 100%; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; } .main-info-vid-btn:hover { scale: 1.2; } .main-info-slider { margin-top: 48px; } .main-info-slider-item { border-radius: var(--Border-radius-2, 16px); border: 2px solid var(--Grey-1, #F5F3F1); flex-direction: column; padding: 32px; box-sizing: border-box; height: auto; height: 332px; } .main-info-slider .slick-list { margin: 0 -8px; } .main-info-slider .slick-slide { margin: 0 8px; } .main-info-slider-icon { width: 56px; height: 56px; margin-bottom: 20px; } .main-info-slider-icon img { width: 100%; height: 100%; } .main-info-slider-title { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; margin-bottom: 16px; } .main-info-slider-text { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .main-line { /* background-image: url(/bitrix/templates/main/css/../img/main-banner/); */ background: linear-gradient(0deg, #34393B 0%, #34393B 100%), #FAFAFA; padding: 32px 0; margin-top: 80px; position: relative; background-image: url(/bitrix/templates/main/css/../img/main-line/bg.png); background-size: cover; background-position: center center; } /* .main-line::after { content: ''; } */ .main-line .container { display: flex; align-items: center; justify-content: space-between; } .main-line-cont { display: flex; flex-direction: column; gap: 8px; } .main-line-cont h2 { color: var(--white, #FFF); font-family: "Golos Text"; font-size: 36px; font-style: normal; font-weight: 600; line-height: 44px; } .main-line-cont p { color: var(--white, #FFF); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; } .main-line a { padding: 11px 24px; border-radius: var(--Border-radius-1, 10px); /* border: 2px solid var(--white, #FFF); */ background: var(--white, #FFF); box-sizing: border-box; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; } .main-line a:hover { background-color: #FF5A00; color: #fff; } .main-brand { margin-top: 80px; } .main-brand-slider .slick-list { margin: 0 -40px; } .main-brand-slider .slick-slide { margin: 0 40px; } .slider .slick-arrow { position: absolute; top: 0; bottom: 0; margin: auto; left: -52px; width: 36px; height: 36px; background-color: var(--white, #FFF); box-shadow: 0 2px 4px 0 rgba(37, 37, 37, 0.16); border-radius: 50%; background-image: url(/bitrix/templates/main/css/../img/main-popular/arrow.svg); background-size: 20px 20px; background-position: center center; background-repeat: no-repeat; transition: 0.3s; font-size: 0; z-index: 3; opacity: 0; } .slider:hover .slick-arrow { opacity: 1; } .slider .slick-arrow:hover { background-color: var(--Primary-1, #FF5A00); background-image: url(/bitrix/templates/main/css/../img/main-popular/arrow_active.svg); } .slider .slick-next { left: auto; right: -52px; transform: rotate(180deg); box-shadow: 0 -2px 4px 0 rgba(37, 37, 37, 0.16); } .main-brand-item { display: flex !important; align-items: center; height: 129px; } .main-brand-item img { width: 100%; } .main-qst { margin-top: 80px; } .main-qst-cont { padding: 56px; box-sizing: border-box; background-image: url(/bitrix/templates/main/css/../img/main-qst/bg.png); background-size: cover; background-position: center center; border-radius: var(--Border-radius-2, 16px); display: flex; flex-direction: column; align-items: center; } .main-qst-cont h2 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; display: flex; align-items: center; gap: 24px; margin-bottom: 32px; } .main-qst-cont h2::before { content: ''; width: 56px; height: 56px; background-image: url(/bitrix/templates/main/css/../img/main-qst/icon.svg); background-size: 100% 100%; display: flex; } .main-qst-cont p { color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; text-align: center; margin-bottom: 40px; } .main-qst-row { display: flex; gap: 56px; justify-content: center; } .main-qst-row-block { display: flex; flex-direction: column; align-items: center; gap: 8px; } .main-qst-row-block-title { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; } .main-qst-row-block-link { color: var(--black, #252525); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; } .main-qst-row-block-link:hover { color: #FF5A00; } .main-qst-row-block-soc { display: flex; gap: 20px; align-items: center; } .main-qst-row-block-soc a { width: 24px; height: 24px; aspect-ratio: 1/1; } .main-qst-row-block-soc a:hover { opacity: 0.5; } .main-qst-row-block-soc a img { width: 100%; height: 100%; } .main-qst-form-btn { color: var(--white, #FFF); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; padding: 11px 24px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); /* border: 2px solid var(--Accend, #FF5A00); */ background: var(--Accend, #FF5A00); } .main-qst-form-btn:hover { background-color: #E25000; } .main-news { margin-top: 80px; overflow: hidden; } .main-news-nav { display: flex; border-radius: var(--Border-radius-1, 10px); border: 4px solid var(--Grey-1, #F5F3F1); background: var(--Grey-1, #F5F3F1); align-items: center; box-sizing: border-box; } .main-news-nav button { padding: 11px 24px; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; transition: 0.3s; border-radius: var(--Border-radius-1, 10px); background-color: transparent; position: relative; z-index: 1; } .main-news-nav button:hover { color: #FF5A00; } .main-news-nav button.active { padding: 11px 24px; box-shadow: 0 2px 8px 0 rgba(37, 37, 37, 0.24); background: var(--white, #FFF); } .main-news-nav button.active:hover { color: #222228; } .main-news-slider .slick-list { margin: 0 -8px; } .main-news-slider .slick-slide { margin: 0 8px; } .main-news-slider .slick-arrow, .main-actual-slider .slick-arrow { bottom: auto; top: 60px; } .main-news-item { display: flex; flex-direction: column; } .main-news-item-pic { width: 100%; height: 157px; border-radius: 16px; overflow: hidden; background-color: var(--Grey-1, #F5F3F1); margin-bottom: 16px; } .main-news-item-pic img { width: 100%; height: 100%; object-fit: cover; object-position: center center; } .main-news-item-date { opacity: 0.6; align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; text-overflow: ellipsis; margin-bottom: 8px; } .main-news-item-title { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-overflow: ellipsis; } .main-news-item:hover .main-news-item-title { color: #FF5A00; } .main-actual { margin-top: 80px; margin-bottom: 80px; overflow: hidden; } .main-actual-slider .slick-list { margin: 0 -8px; } .main-actual-slider .slick-slide { margin: 0 8px; } .footer { border-top: 2px solid #F5F3F1; padding-bottom: 48px; } .footer-main { display: flex; padding: 48px 0; box-sizing: border-box; gap: 16px; border-bottom: 2px solid var(--Grey-1, #F5F3F1); } .footer-block-top { margin-bottom: 24px; align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; width: 100%; } .footer-block_info { max-width: 564px; width: 100%; } .footer-info { display: flex; flex-wrap: wrap; gap: 64px; row-gap: 32px; } .footer-info-block { width: calc(50% - 32px); display: flex; flex-direction: column; gap: 12px; } .footer-info-block:last-child { width: 100%; } .footer-info-title { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; } .footer-info-link { color: var(--black, #252525); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; } .footer-info-link:hover { color: #FF5A00; } .footer-info-row { display: flex; gap: 16px; } .footer-info-row a { width: 20px; height: 20px; aspect-ratio: 1/1; } .footer-info-row a:hover { opacity: 0.5; } .footer-info-row a img { width: 100%; height: 100%; } .footer-info_add { display: flex; margin-top: 32px; gap: 24px; align-items: center; } .footer-info_add-yandex { width: 150px; height: 50px; } .footer-info_add-yandex img { width: 100%; height: 100%; } .footer-info_add-portal { width: 183px; height: 32px; } .footer-info_add-portal img { width: 100%; height: 100%; } .footer-block_col { max-width: 216px; min-width: 216px; } .footer-block ul { display: flex; flex-direction: column; gap: 16px; list-style: none; } .footer-block ul a { color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 19px; } .footer-block ul a:hover { color: #FF5A00; } .footer-main-add { display: flex; flex-direction: column; gap: 32px; } .footer-block-email { width: 332px; height: 44px; position: relative; background: var(--white, #FFF); display: flex; align-items: center; gap: 12px; box-sizing: border-box; margin-bottom: 10px; transition: 0.3s; } .footer-block-email input { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; width: 100%; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Grey-1, #F5F3F1); padding: 11px 16px; transition: 0.3s; } .footer-block-email input:hover, .footer-block-email input:focus { border-color: #FF5A00; } .footer-block-email button { width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/main-popular/arrow.svg); background-size: 100% 100%; transform: rotate(180deg); display: flex; position: absolute; top: 0; bottom: 0; right: 16px; margin: auto; } .footer-block-check { display: flex; align-items: center; gap: 8px; cursor: pointer; } .footer-block-check input { display: none; } .footer-block-check span { width: 15px; height: 15px; border-radius: 4px; border: 1px solid rgba(34, 34, 40, 0.05); background: var(--Grey-1, #F5F3F1); box-sizing: border-box; transition: 0.3s; position: relative; display: flex; justify-content: center; align-items: center; } .footer-block-check span::after { content: ''; width: 13px; height: 13px; background-image: url(/bitrix/templates/main/css/../img/footer/check.svg); background-size: 100% 100%; opacity: 0; transition: 0.3s; } .footer-block-check:hover span { border: 1.5px solid var(--Primary-1, #FF5A00); background-color: #fff; } .footer-block-check input:checked ~ span { background: var(--Accend, #FF5A00); } .footer-block-check input:checked ~ span::after { opacity: 1; } .footer-block-check-text { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; transition: 0.3s; } .footer-block-check-text a { text-decoration-line: underline; text-decoration-style: solid; text-decoration-skip-ink: none; text-decoration-thickness: auto; text-underline-offset: auto; text-underline-position: from-font; } .footer-block-check:hover .footer-block-check-text { opacity: 1; } .footer-block-soc { display: flex; gap: 24px; flex-wrap: wrap; } .footer-block-soc a { width: 20px; height: 20px; aspect-ratio: 1/1; } .footer-block-soc a:hover { opacity: 0.5; } .footer-block-soc a img { width: 100%; height: 100%; } .footer-block-card { display: flex; gap: 24px; } .footer-block-card div { height: 18px; } .footer-block-card div img { height: 18px; } .footer-bot { margin-top: 40px; display: flex; justify-content: space-between; flex-wrap: wrap; row-gap: 24px; } .footer-bot-copy { color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 19px; } .footer-bot-list { display: flex; gap: 24px; flex-wrap: wrap; } .footer-bot-list a { color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 19px; } .footer-bot-list a:hover { color: #FF5A00; } .footer-bot-list a span { text-decoration-line: underline; text-decoration-style: solid; text-decoration-skip-ink: none; text-decoration-thickness: auto; text-underline-offset: auto; text-underline-position: from-font; } .card { padding: 16px; padding-top: 20px; border-radius: var(--Border-radius-2, 16px); border: 1px solid var(--Grey-1, #F5F3F1); background: var(--white, #FFF); transition: 0.3s; box-sizing: border-box; position: relative; margin-bottom: 20px; } .card:hover { border-radius: var(--Border-radius-2, 16px); background: var(--white, #FFF); box-shadow: 0 4px 16px 0 rgba(37, 37, 37, 0.12); } .card-pic { /* max-width: 230px; */ /* min-width: 230px; */ width: 100%; /* height: 230px; */ aspect-ratio: 1 / 1; position: relative; display: flex; justify-content: space-between; margin-bottom: 16px; } .card-pic img { width: 100%; height: 100%; position: absolute; top: 0; bottom: 0; left: 0; right: 0; object-fit: contain; object-position: center center; z-index: 0; } .card-pic-tags { position: relative; z-index: 1; display: flex; gap: 10px; flex-wrap: wrap; height: fit-content; } .card-pic-tags a { padding: 2px 8px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; /* 138.462% */ background-color: #F5F3F1; } .card-pic-tags .sale { color: var(--Error, #F93C00); background: rgba(249, 60, 0, 0.10); } .card-pic-tags .sale:hover { background-color: #F93C00; color: #fff; } .card-pic-tags .hit { color: #fff; background: #FF5A00; } .card-pic-tags .hit:hover { background: var(--Dark-primary-1, #E25000); } .card-pic-tags .new { color: var(--Success, #27AE60); background: rgba(39, 174, 96, 0.10); } .card-pic-tags .new:hover { background: var(--Success, #27AE60); color: #fff; } .card-pic-tags .rec { color: var(--Primary-2, #4497F8); background: rgba(0, 146, 208, 0.10); } .card-pic-tags .rec:hover { background-color: #4497F8; color: #fff; } .card-pic-tags .gift { color: #222228; background: rgba(242, 175, 74, 0.20); } .card-pic-tags .gift:hover { background-color: #F2AF4A; color: #fff; } .card-pic-preview { position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; z-index: 1; text-align: center; opacity: 0; width: 52px; height: 52px; border-radius: 50%; background-color: #FF5A00; background-image: url(/bitrix/templates/main/css/../img/card/zoom_active.svg); background-size: 20px 20px; background-repeat: no-repeat; background-position: center center; transition: 0.3s; } .card-pic:hover .card-pic-preview { opacity: 1; } .card-pic-preview:hover { background-color: #E25000; } .card-pic-add { display: flex; flex-direction: column; z-index: 1; gap: 16px; } .card-pic-add-fav { width: 20px; height: 20px; aspect-ratio: 1/1; background-image: url(/bitrix/templates/main/css/../img/card/fav.svg); background-size: 100% 100%; transition: 0.3s; } .card-pic-add-fav:hover { background-image: url(/bitrix/templates/main/css/../img/card/fav_hover.svg); } .card-pic-add-fav_active { background-image: url(/bitrix/templates/main/css/../img/card/fav_active.svg); } .card-pic-add-comp { width: 20px; height: 20px; aspect-ratio: 1/1; background-image: url(/bitrix/templates/main/css/../img/card/comp.svg); background-size: 100% 100%; } .card-pic-add-comp:hover { background-image: url(/bitrix/templates/main/css/../img/card/comp_hover.svg); } .card-pic-add-ver { margin-top: auto; width: 20px; height: 20px; aspect-ratio: 1/1; background-image: url(/bitrix/templates/main/css/../img/card/ver.svg); background-size: 100% 100%; } .card-color { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-bottom: 12px; } .card-color button { min-width: 16px; max-width: 16px; height: 16px; border-radius: 50%; border: 2px solid transparent; transition: 0.3s; } .card-color button.active, .card-color button:hover { border-color: #FF5A00; } .card-color a { color: var(--black, #222228); font-family: "Golos Text"; font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; /* 145.455% */ } .card-color a:hover { color: #E25000; } .card-cat { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 1; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; text-overflow: ellipsis; margin-bottom: 4px; opacity: 0.6; } .card-title { display: -webkit-box; /* width: 230px; */ overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 500; line-height: 18px; text-overflow: ellipsis; height: 54px; } .card-title:hover { color: #FF5A00; } .card-art { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; text-overflow: ellipsis; margin-bottom: 6px; } .card-price { display: flex; gap: 8px; flex-wrap: wrap; color: var(--black, #222228); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; align-items: center; margin-bottom: 6px; } .card-price-old { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 19px; text-decoration-line: line-through; } .card-price-discount { color: var(--Error, #F93C00); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .card-opt { display: flex; gap: 12px; margin-bottom: 14px; transition: 0.3s; position: relative; } .card-opt-rrc { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; text-overflow: ellipsis; transition: 0.3s; } .card-opt-rrc:hover { /* opacity: 1; */ } .card-opt-drop { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; text-overflow: ellipsis; display: flex; align-items: flex-start; gap: 4px; cursor: pointer; opacity: 0.6; /* transition: 0.3s; */ } .card-opt-drop:hover { opacity: 1; color: #FF5A00; } .card-opt-drop span { min-width: 12px; max-width: 12px; height: 12px; background-image: url(/bitrix/templates/main/css/../img/card/info.svg); background-size: 100% 100%; transition: 0.3s; } .card-opt-drop:hover span { background-image: url(/bitrix/templates/main/css/../img/card/info_active.svg); } .card-opt-drop-menu { position: absolute; top: 40px; right: 0; left: 0; padding: 12px; border-radius: var(--Border-radius-2, 16px); background: var(--white, #FFF); box-shadow: 0 20px 48px 0 rgba(37, 37, 37, 0.16); display: flex; flex-direction: column; gap: 8px; z-index: 2; list-style: none; display: none; max-width: 260px; } .main-popular-slider .card-opt-drop-menu { top: auto; bottom: 0; } .card-opt-drop-menu::before { content: ''; position: absolute; right: 0; left: 0; top: -40px; height: 40px; background-color: transparent; } .card-opt-drop:hover .card-opt-drop-menu { display: flex; } .card-opt-drop-menu a { display: flex; justify-content: space-between; align-items: center; padding: 6px 12px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); transition: 0.3s; } .card-opt-drop-menu a:hover { background: rgba(255, 90, 0, 0.05); } .card-opt-drop-menu a div:first-child { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; transition: 0.3s; } .card-opt-drop-menu a:hover div:first-child { color: #E25000; } .card-opt-drop-menu a div:last-child { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; text-align: right; transition: 0.3s; } .card-opt-drop-menu a:hover div:last-child { color: #E25000; } .card-opt-drop-menu a.active { background: rgba(255, 90, 0, 0.05); } .card-opt-drop-menu a.active div:first-child { color: #E25000; } .card-opt-drop-menu a.active div:last-child { color: #E25000; } .card-add { display: flex; gap: 10px; align-items: center; margin-bottom: 14px; } .card-rating { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; display: flex; align-items: center; gap: 4px; white-space: nowrap; } .card-rating::before { content: ''; min-width: 16px; max-width: 16px; height: 16px; background-image: url(/bitrix/templates/main/css/../img/card/star.svg); background-size: 100% 100%; display: flex; } .card-rating_dis::before { background-image: url(/bitrix/templates/main/css/../img/card/star_dis.svg); } .card-rating span { opacity: 0.6; transition: 0.3s; } .card-rating span:last-child { font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; } .card:hover .card-rating span:first-child { opacity: 1; } .card-available { display: flex; gap: 4px; align-items: center; color: var(--Success, #27AE60); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; white-space: nowrap; } .card-available span { min-width: 13px; max-width: 13px; height: 13px; border-radius: 50%; background-color: #27AE60; box-sizing: border-box; background-image: url(/bitrix/templates/main/css/../img/card/gal.svg); background-size: 7px; background-repeat: no-repeat; background-position: center center; } .card-available_order { color: var(--black, #222228); } .card-available_order span { background-color: #F2AF4A; } .card-bot { display: flex; align-items: center; gap: 12px; } .card-click { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; } .card-click:hover { color: #FF5A00; } .card-buy { width: 102px; height: 32px; position: relative; } .card-buy-cart { color: var(--white, #FFF); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; border-radius: var(--Border-radius-1, 10px); /* border: 2px solid var(--Accend, #FF5A00); */ background: var(--Accend, #FF5A00); width: 100%; height: 100%; } .card-buy-cart:hover { background-color: #E25000; } .card-buy-counter { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; border-radius: var(--Border-radius-1, 8px); border: 2px solid var(--Grey-1, #F5F3F1); background: var(--Grey-1, #F5F3F1); box-sizing: border-box; display: flex; align-items: center; justify-content: center; gap: 10px; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; opacity: 0; visibility: hidden; transition: 0.3s; } .card-buy-counter_active { opacity: 1; visibility: visible; } .card-buy-counter-less { max-width: 20px; min-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/card/less.svg); background-size: 100% 100%; transition: 0.3s; } .card-buy-counter-less:hover { background-image: url(/bitrix/templates/main/css/../img/card/less_hov.svg); } .card-buy-counter-more { max-width: 20px; min-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/card/more.svg); background-size: 100% 100%; transition: 0.3s; } .card-buy-counter-more:hover { background-image: url(/bitrix/templates/main/css/../img/card/more_hov.svg); } .card-buy-counter-num { width: 16px; } .card-bot-order { color: var(--Accend, #FF5A00); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; padding: 6px 18px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Accend, #FF5A00); background: var(--white, #FFF); } .header-catalog { position: absolute; top: 71px; right: 0; left: 0; background-color: #fff; max-height: 0; /* height: calc(100vh - 110px); */ z-index: 9; transition: 0.3s; overflow: hidden; margin: 0 75px; box-shadow: 0 20px 48px 0 rgba(37, 37, 37, 0.16); border-radius: var(--Border-radius-1, 10px); padding: 0; box-sizing: border-box; display: flex; gap: 40px; } .header-catalog.active { max-height: 492px; padding: 32px; } .header_scrolled .header-catalog { top: 72px; /* height: calc(100vh - 72px); */ } .header-catalog-side { display: flex; flex-direction: column; gap: 12px; max-width: 229px; min-width: 229px; } .header-catalog-side button { display: flex; width: 100%; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; padding: 8px 10px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); gap: 12px; } .header-catalog-side button.active { color: var(--Accend, #FF5A00); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; background: rgba(255, 90, 0, 0.05); } .header-catalog-side button:hover { background: rgba(255, 90, 0, 0.05); } .header-catalog-side-pic { width: 20px; height: 20px; position: relative; } .header-catalog-side-pic img { width: 100%; height: 100%; transition: 0.3s; } .header-catalog-side-pic img.active { position: absolute; top: 0; right: 0; bottom: 0; left: 0; opacity: 0; } .header-catalog-side button.active .header-catalog-side-pic img.active { opacity: 1; } .header-catalog-side button:hover .header-catalog-side-pic img.active { opacity: 1; } .header-catalog-cont { width: 100%; } .header-catalog-cont-block { flex-direction: column; gap: 24px; display: none; } .header-catalog-cont-block.active { display: flex; } .header-catalog-cont-block-title { color: var(--black, #252525); font-family: "Golos Text"; font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; } .header-catalog-cont-block-title span { display: none; } .header-catalog-cont-block-row { display: flex; flex-direction: column; gap: 12px; flex-wrap: wrap; height: 356px; } .header-catalog-cont-block-row-item { display: flex; flex-direction: column; gap: 16px; max-height: 34px; overflow: hidden; transition: 0.3s; } .header-catalog-cont-block-row-item.active { max-height: 400px; } .header-catalog-cont-block-row-item-top { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; text-overflow: ellipsis; display: flex; align-items: center; gap: 8px; transition: 0.3s; cursor: pointer; border-radius: var(--Border-radius-1, 10px); padding: 6px 10px; box-sizing: border-box; height: auto; } .header-catalog-cont-block-row-item.active .header-catalog-cont-block-row-item-top { background: rgba(255, 90, 0, 0.05); color: var(--Primary-1, #FF5A00); } .header-catalog-cont-block-row-item.active .header-catalog-cont-block-row-item-top::before { background-image: url(/bitrix/templates/main/css/../img/catalog-menu/minus.svg); } .header-catalog-cont-block-row-item-top:hover { color: var(--Accend, #FF5A00); } .header-catalog-cont-block-row-item-top::before { content: ''; width: 16px; height: 16px; background-image: url(/bitrix/templates/main/css/../img/catalog-menu/plus.svg); display: flex; transition: 0.3s; } .header-catalog-cont-block-row-item ul { display: flex; flex-direction: column; gap: 10px; flex-wrap: wrap; list-style: none; padding-left: 40px; box-sizing: border-box; } .header-catalog-cont-block-row-item ul a { color: var(--black, #252525); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; } .header-catalog-cont-block-row-item ul a:hover { color: var(--Accend, #FF5A00); } .header-catalog-cont-block-link { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; text-overflow: ellipsis; padding-left: 24px; } .header-catalog-cont-block-link:hover { color: var(--Accend, #FF5A00); } .header-main-menu-btn { display: none; } .header-catalog-cont-block-row-item-top-list_back { display: none; } .header-main-add_tel { display: none !important; } .header-main-add_search { display: none !important; } .bot-menu { display: none; } .header-catalog-cont-block-back { display: none; } .header-top-mob { display: none; } .header-top .footer-info { display: none; } .header-catalog-back { display: none !important; } .header-main-search-close { display: none; } .chip { margin-top: 32px; } .chip .container { display: flex; gap: 16px; overflow-x: scroll; } .chip .container::-webkit-scrollbar { display: none; } .chip a { opacity: 0.4; color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; display: flex; gap: 16px; white-space: nowrap; } .chip a:hover { opacity: 1; } .chip a::after { content: '/'; opacity: 0.4; } .chip a:hover::after { opacity: 0.4; } .chip a:nth-last-child(-n + 2)::after { display: none; } .catalog { margin-top: 24px; } .catalog-title { display: flex; justify-content: space-between; align-items: center; } .catalog-title h1 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 36px; font-style: normal; font-weight: 600; line-height: 44px; } .catalog-row { margin-top: 24px; display: flex; gap: 24px; /* margin-bottom: 80px; */ } .catalog-cont { width: 100%; } .catalog-comp { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 24px; } .catalog-comp-title { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; margin-right: 4px; } .catalog-comp-row { display: flex; gap: 8px; display: contents; } .catalog-comp-row a { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; padding: 3px 12px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); white-space: nowrap; } .catalog-comp-row a:hover { background-color: #E8E8E8; } .catalog-comp-more { min-width: 18px; max-width: 18px; height: 18px; background-image: url(/bitrix/templates/main/css/../img/catalog/comp_arrow.svg); background-size: 100% 100%; display: flex; opacity: 0.6; } .catalog-comp-more:hover { opacity: 1; } .catalog-top { display: flex; align-items: center; width: 100%; margin-bottom: 24px; } .catalog-top_drop { position: relative; } .catalog-top-sort-btn { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; display: flex; gap: 10px; align-items: center; padding: 6px 18px; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); white-space: nowrap; } .catalog-top-sort-btn:hover { background: var(--Grey-3, #E8E8E8); } .catalog-top-sort-btn::before { content: ''; max-width: 20px; min-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/catalog/drop_arrow.svg); background-size: 100% 100%; display: flex; transition: 0.3s; } .catalog-top_drop.active .catalog-top-sort-btn { background: var(--Grey-3, #E8E8E8); } .catalog-top_drop.active .catalog-top-sort-btn::before { transform: rotate(180deg); } .catalog-top_drop-list { display: none; /* max-width: 230px; */ flex-direction: column; gap: 8px; position: absolute; top: 48px; left: 0; background: var(--white, #FFF); box-shadow: 0 20px 48px 0 rgba(37, 37, 37, 0.16); border-radius: var(--Border-radius-2, 16px); padding: 12px 10px; box-sizing: border-box; z-index: 2; } .catalog-top_drop.active .catalog-top_drop-list { display: flex; } .catalog-top-sort-item { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; cursor: pointer; white-space: nowrap; padding: 6px 12px; border-radius: var(--Border-radius-1, 10px); transition: 0.3s; display: flex; align-items: center; justify-content: space-between; gap: 12px; } .catalog-top-sort-item::after { content: ''; max-width: 16px; min-width: 16px; height: 16px; display: flex; } .catalog-top-sort-item:hover { background-color: rgba(255, 90, 0, 0.05); } .catalog-top-sort-item.active { background-color: rgba(255, 90, 0, 0.05); color: var(--Primary-1, #FF5A00); } .catalog-top-sort-item.active::after { background-image: url(/bitrix/templates/main/css/../img/catalog/drop_check.svg); background-size: 100% 100%; } .catalog-top-sort_num { margin-left: auto; } .catalog-top-sort_num .catalog-top-sort-btn { display: flex; flex-direction: row-reverse; } .catalog-top-switch { margin-left: 16px; display: flex; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); border: 2px solid var(--Grey-1, #F5F3F1); } .catalog-top-switch button { padding: 4px 16px; border-radius: var(--Border-radius-1, 10px); display: flex; align-items: center; justify-content: center; position: relative; } .catalog-top-switch button.active { background-color: #FF5A00; box-shadow: 0 2px 8px 0 rgba(37, 37, 37, 0.24); } .catalog-top-switch button:hover { color: #FF5A00; } .catalog-top-switch button img { width: 20px; height: 20px; transition: 0.3s; } .catalog-top-switch button img.catalog-top-switch_hover { position: absolute; transition: 0.3s; opacity: 0; } .catalog-top-switch button img.catalog-top-switch_active { position: absolute; transition: 0.3s; opacity: 0; } .catalog-top-switch button.active img.catalog-top-switch_active { opacity: 1; } .catalog-top-switch button.active img { opacity: 0; } .catalog-top-switch button:hover img.catalog-top-switch_hover { opacity: 1; } .catalog-top-switch button:hover img { opacity: 0; } .catalog-filters { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 32px; } .catalog-filters button { color: var(--Primary-1, #FF5A00); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; padding: 3px 12px; display: flex; gap: 6px; align-items: center; white-space: nowrap; border-radius: var(--Border-radius-1, 10px); border: 1px solid var(--Primary-1, #FF5A00); } .catalog-filters button:hover { background-color: #FF5A00; color: #fff; } .catalog-filters button::after { content: ''; max-width: 16px; min-width: 16px; height: 16px; background-image: url(/bitrix/templates/main/css/../img/catalog/close_active.svg); background-size: 100% 100%; display: flex; transition: 0.3s; } .catalog-filters button:hover::after { background-image: url(/bitrix/templates/main/css/../img/catalog/close_hover.svg); } .catalog-filters-clear { color: #252525 !important; border: 0 !important; } .catalog-filters-clear::after { content: ''; background-image: url(/bitrix/templates/main/css/../img/catalog/close.svg) !important; } .catalog-filters-clear:hover { color: #FF5A00 !important; background-color: transparent !important; } .catalog-filters-clear:hover::after { background-image: url(/bitrix/templates/main/css/../img/catalog/close_active.svg) !important; } .catalog-cont-row { display: flex; gap: 16px; flex-wrap: wrap; } .catalog-cont-row .card { width: calc(100% / 4 - 12px); } .catalog-cont-row .card .card-opt-rrc { /* display: none; */ } .catalog-pag { margin-top: 32px; display: flex; flex-direction: column; gap: 32px; align-items: center; } .catalog-pag-more { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; max-width: 480px; width: 100%; height: 44px; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); } .catalog-pag-more:hover { background-color: #E8E8E8; } .catalog-pag-nav { display: flex; align-items: center; gap: 16px; } .catalog-pag-nav-arrow { width: 20px; height: 44px; background-image: url(/bitrix/templates/main/css/../img/catalog/pag_arrow.svg); background-size: 20px 20px; background-repeat: no-repeat; background-position: center center; transition: 0.3s; } .catalog-pag-nav-arrow:hover { background-image: url(/bitrix/templates/main/css/../img/catalog/pag_arrow_active.svg); } .catalog-pag-nav-arrow_prev { transform: rotate(180deg); } .catalog-pag-nav-item { height: 44px; width: 57px; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; border-radius: var(--Border-radius-1, 10px); display: flex; justify-content: center; align-items: center; } .catalog-pag-nav-item:hover { background: var(--Grey-1, #F5F3F1); } .catalog-pag-nav-item.active { background-color: #FF5A00; color: #fff; } .catalog-pag-nav-item.active:hover { background: var(--Dark-primary-1, #E25000); } .catalog-side { max-width: 255px; min-width: 255px; } .catalog-side-first { display: flex; flex-direction: column; gap: 16px; /* margin-bottom: 24px; */ } .catalog-side-first-back { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; display: flex; align-items: center; gap: 8px; } .catalog-side-first-back:hover { color: #E25000; } .catalog-side-first-back::before { content: ''; max-width: 16px; min-width: 16px; height: 16px; background-image: url(/bitrix/templates/main/css/../img/header/arrow-back.svg); background-size: 100% 100%; opacity: 0.6; transition: 0.3s; } .catalog-side-first-back:hover::before { opacity: 1; background-image: url(/bitrix/templates/main/css/../img/header/arrow-back_hover.svg); } .catalog-side-first-active { color: var(--Primary-1, #FF5A00); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; text-overflow: ellipsis; padding: 6px 10px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); background: rgba(255, 90, 0, 0.05); margin-left: 24px; } .catalog-side-first-row { margin-left: 48px; display: flex; flex-direction: column; gap: 12px; } .catalog-side-first-row a { color: var(--black, #252525); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; text-overflow: ellipsis; } .catalog-side-first-row a:hover { color: #FF5A00; } .catalog-side-block { padding: 24px 0; box-sizing: border-box; border-bottom: 1px solid var(--Grey-1, #F5F3F1); max-height: 70px; overflow: hidden; transition: 0.3s; display: flex; flex-direction: column; } .catalog-side-block.active { max-height: 500px; } .catalog-side-block-top { display: flex; align-items: center; cursor: pointer; margin-bottom: 24px; } .catalog-side-block-top-title { color: var(--black, #252525); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; display: flex; align-items: center; gap: 8px; transition: 0.3s; } .catalog-side-block-top-title:hover { color: #E25000; } .catalog-side-block-top-title::before { content: ''; max-width: 16px; min-width: 16px; height: 16px; background-image: url(/bitrix/templates/main/css/../img/catalog/drop_arrow.svg); background-size: 100% 100%; opacity: 0.6; transition: 0.3s; } .active .catalog-side-block-top-title::before { transform: rotate(180deg); opacity: 1; } .catalog-side-block-top:hover .catalog-side-block-top-title::before { opacity: 1; } .catalog-side-block-top-title:hover::before { background-image: url(/bitrix/templates/main/css/../img/catalog/drop_arrow_active.svg); } .catalog-side-block-top-help { max-width: 20px; min-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/catalog/help.svg); background-size: 100% 100%; display: flex; margin-left: auto; opacity: 0.6; } .catalog-side-block-top-help:hover { opacity: 1; background-image: url(/bitrix/templates/main/css/../img/catalog/help_active.svg); } .catalog-side-block-price { display: flex; gap: 16px; margin-bottom: 16px; } .catalog-side-block-price label { width: 50%; display: flex; flex-direction: column; gap: 10px; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; cursor: pointer; } .catalog-side-block-price label input { color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 19px; height: 39px; width: 100%; padding-left: 12px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Grey-1, #F5F3F1); background: var(--white, #FFF); transition: 0.3s; } .catalog-side-block-price label input:focus, .catalog-side-block-price label input:hover { border-color: #FF5A00; } .catalog-side-block-list { display: flex; flex-direction: column; gap: 8px; } .catalog-side-block-list label { padding: 6px; box-sizing: border-box; display: flex; gap: 10.5px; align-items: center; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; text-overflow: ellipsis; border-radius: var(--Border-radius-1, 10px); transition: 0.3s; cursor: pointer; } .catalog-side-block-list label:hover { background: rgba(255, 90, 0, 0.05); color: var(--Primary-1, #FF5A00); } .catalog-side-block-list label input { display: none; } .catalog-side-block-list label input[type="checkbox"]~span { max-width: 15px; min-width: 15px; height: 15px; border-radius: 4px; border: 1.5px solid rgba(34, 34, 40, 0.05); background: var(--Grey-1, #F5F3F1); display: flex; position: relative; justify-content: center; align-items: center; transition: 0.3s; box-sizing: border-box; overflow: hidden; } .catalog-side-block-list label input[type="checkbox"]~span::after { content: ''; width: 14px; height: 12px; background-image: url(/bitrix/templates/main/css/../img/catalog/gal.svg); background-size: 100% 100%; opacity: 0; transition: 0.3s; } .catalog-side-block-list label:hover input[type="checkbox"]~span { border: 1.5px solid var(--Primary-1, #FF5A00); background-color: #fff; } .catalog-side-block-list label input[type="checkbox"]:checked~span { background-color: #FF5A00; border: 1.5px solid var(--Primary-1, #FF5A00) !important; } .catalog-side-block-list label input[type="checkbox"]:checked~span::after { opacity: 1; } .catalog-side-block-list label input[type="radio"]~span { max-width: 15px; min-width: 15px; height: 15px; background-color: #F5F3F1; border-radius: 50%; box-sizing: border-box; border: 1.5px solid transparent; transition: 0.3s; /* display: flex; */ justify-content: center; align-items: center; } .catalog-side-block-list label input[type="radio"]~span::after { content: ''; max-width: 7px; min-width: 7px; height: 7px; border-radius: 50%; background-color: #FF5A00; transition: 0.3s; opacity: 0; display: flex; margin-top: 3px; margin-left: 2px; } .catalog-side-block-list label:hover input[type="radio"]~span { border: 1.5px solid #FF5A00; } .catalog-side-block-list label input[type="radio"]:checked~span { border: 1.5px solid #FF5A00; background-color: #fff; } .catalog-side-block-list label input[type="radio"]:checked~span::after { opacity: 1; } .catalog-side-block-more { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; height: 32px; width: 100%; display: flex; justify-content: center; align-items: center; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); margin-top: 16px; } .catalog-side-block-more:hover { background-color: #E8E8E8; } .catalog-side-block-search { width: 100%; position: relative; margin-bottom: 16px; } .catalog-side-block-search input[type="text"] { width: 100%; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Grey-1, #F5F3F1); background: var(--white, #FFF); box-sizing: border-box; padding: 10px 12px; color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 19px; /* 135.714% */ padding-right: 32px; transition: 0.3s; } .catalog-side-block-search input[type="text"]:hover, .catalog-side-block-search input[type="text"]:focus { border-color: #FF5A00; } .catalog-side-block-search button { max-width: 18px; min-width: 18px; height: 18px; background-image: url(/bitrix/templates/main/css/../img/header/search.svg); background-size: 100% 100%; position: absolute; top: 0; bottom: 0; margin: auto; right: 12px; } .catalog-side-block-list_color label input[type="checkbox"]~span { border: 0; border-radius: 50%; max-width: 20px; min-width: 20px; height: 20px; } .catalog-side-block-list_color label span::after { display: none !important; } .catalog-side-block-list_avail { margin-top: 24px; } .catalog-side-show { color: var(--white, #FFF); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; width: 100%; height: 44px; display: flex; justify-content: center; align-items: center; border-radius: var(--Border-radius-1, 10px); background: var(--Primary-1, #FF5A00); margin-top: 24px; } .catalog-side-show:hover { background: var(--Dark-primary-1, #E25000); } .catalog-share { position: relative; display: flex; flex-direction: column; align-items: center; } .catalog-share-btn { width: 24px; height: 24px; background-image: url(/bitrix/templates/main/css/../img/catalog/share.svg); background-size: 100% 100%; transition: 0.3s; cursor: pointer; } .catalog-share-btn:hover, .active .catalog-share-btn { background-image: url(/bitrix/templates/main/css/../img/catalog/share_active.svg); } .catalog-share-menu { position: absolute; top: 38px; padding: 12px 10px; box-sizing: border-box; border-radius: var(--Border-radius-2, 16px); background: var(--white, #FFF); box-shadow: 0 20px 48px 0 rgba(37, 37, 37, 0.16); z-index: 5; display: none; flex-direction: column; } .active .catalog-share-menu { display: flex; } .catalog-share-menu-row { display: flex; gap: 20px; padding: 6px 12px; box-sizing: border-box; } .catalog-share-menu-row a { width: 20px; height: 20px; } .catalog-share-menu-row a:hover { opacity: 0.5; } .catalog-share-menu-row a img { width: 100%; height: 100%; } .catalog-share-menu-copy { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; margin-top: 8px; padding: 6px 18px; box-sizing: border-box; gap: 10px; display: flex; align-items: center; justify-content: center; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); width: 100%; } .catalog-share-menu-copy::before { content: ''; max-width: 20px; min-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/catalog/copy.svg); background-size: 100% 100%; display: flex; } .catalog-share-menu-copy:hover { background-color: #E8E8E8; } .catalog-add { margin-bottom: 80px; margin-top: 80px; } .catalog-add .container { display: flex; flex-direction: column; gap: 24px; } .catalog-add p { color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; margin-bottom: 16px; } .catalog-add-block { display: flex; gap: 12px; } .catalog-add-block-title { max-width: 128px; width: 100%; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; /* white-space: nowrap; */ } .catalog-add-block-row { display: flex; gap: 8px; flex-wrap: wrap; } .catalog-add-block-row a { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; padding: 3px 12px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); height: fit-content; white-space: nowrap; } .catalog-add-block-row a:hover { background-color: #E8E8E8; } .catalog-top-filter-btn { display: none; } .catalog-side-top { display: none; } .chip-back { display: none !important; } .card-cont { margin-top: 24px; } .card-cont .container { display: flex; gap: 48px; } .card-cont-info-title { display: flex; gap: 12px; align-items: center; margin-bottom: 16px; } .card-cont-info-title h1 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; } .card-cont-info-add { display: flex; gap: 24px; align-items: center; } .card-cont-info-add .card-rating { gap: 0; } .card-cont-info-add .card-rating::before { max-width: 24px; min-width: 24px; height: 24px; margin-right: 8px; } .card-cont-info-add .card-rating span { color: var(--black, #222228); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; opacity: 1; margin-right: 5px; } .card-cont-info-add .card-rating span:last-child { color: rgba(34, 34, 40, 0.60); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; margin-left: 0; } .card-cont-info-add .card-available { gap: 8px; font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; } .card-cont-info-add .card-available span { max-width: 24px; min-width: 24px; height: 24px; background-size: 12px; background-position: center 8px; } .card-cont-info-add-art { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; } .card-cont-info-color { margin-top: 24px; margin-bottom: 24px; display: flex; flex-direction: column; gap: 12px; position: relative; max-width: 408px; } .card-cont-info-color-title { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; } .card-cont-info-color-drop-btn { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; text-align: left; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; padding: 14px 16px; padding-right: 20px; padding-right: 48px; box-sizing: border-box; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; /* display: flex; */ /* gap: 12px; */ border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Grey-1, #F5F3F1); background: var(--white, #FFF); justify-content: space-between; position: relative; } .card-cont-info-color-drop-btn span { max-width: 18px; min-width: 18px; height: 18px; border-radius: 50%; position: absolute; left: 10px; top: 0; bottom: 0; margin: auto; } .selected .card-cont-info-color-drop-btn { opacity: 1; padding-left: 40px; } .card-cont-info-color.active .card-cont-info-color-drop-btn { opacity: 1; border: 2px solid var(--Primary-1, #FF5A00); } .card-cont-info-color-drop-btn:hover { opacity: 1; border: 2px solid var(--Primary-1, #FF5A00); } .card-cont-info-color-drop-btn::after { content: ''; max-width: 20px; min-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/catalog/drop_arrow.svg); background-size: 100% 100%; display: flex; position: absolute; top: 0; bottom: 0; right: 16px; margin: auto; } .card-cont-info-color.active .card-cont-info-color-drop-btn::after { transform: rotate(180deg); } .card-cont-info-color-drop-menu { display: none; padding: 12px 10px; box-sizing: border-box; border-radius: var(--Border-radius-2, 16px); background: var(--white, #FFF); box-shadow: 0 20px 48px 0 rgba(37, 37, 37, 0.16); position: absolute; top: 100px; right: 0; left: 0; max-height: 268px; min-height: 268px; z-index: 1; } .card-cont-info-color-drop-menu-list { display: flex; flex-direction: column; gap: 8px; /* height: 100%; */ overflow-y: scroll; position: absolute; top: 12px; right: 10px; bottom: 12px; left: 10px; } .card-cont-info-color-drop-menu-list::-webkit-scrollbar { width: 4px; } .card-cont-info-color-drop-menu-list::-webkit-scrollbar-thumb { background: rgba(34, 34, 40, 0.2); border-radius: 4px; } .card-cont-info-color-drop-menu.active { display: flex; } .card-cont-info-color-drop-menu-list div { gap: 12px; max-height: 34px; min-height: 34px; align-items: center; padding: 8px 12px; padding-left: 42px; box-sizing: border-box; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; position: relative; cursor: pointer; line-height: 18px; border-radius: var(--Border-radius-1, 10px); transition: 0.3s; } .card-cont-info-color-drop-menu-list div.selected::after { content: ''; max-width: 16px; min-width: 16px; height: 16px; background-image: url(/bitrix/templates/main/css/../img/card-cont/check.svg); background-size: 100% 100%; position: absolute; top: 0; bottom: 0; right: 12px; margin: auto; } .card-cont-info-color-drop-menu-list div.selected { padding-right: 40px; } .card-cont-info-color-drop-menu-list div:hover, .card-cont-info-color-drop-menu-list div.selected { background: rgba(255, 90, 0, 0.05); color: #FF5A00; } .card-cont-info-color-drop-menu-list div span { border-radius: 50%; max-width: 18px; min-width: 18px; height: 18px; display: flex; position: absolute; left: 12px; top: 0; bottom: 0; margin: auto; background: #F5F3F1; } .card-cont-info .card-price { align-items: flex-end; color: var(--black, #222228); font-family: "Golos Text"; font-size: 36px; font-style: normal; font-weight: 600; line-height: 44px; gap: 12px; margin-bottom: 6px; } .card-cont-info .card-price-old { font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; text-decoration-line: line-through; } .card-cont-info .card-price-discount { font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; } .card-cont-info .card-opt { gap: 16px; align-items: center; margin-bottom: 24px; } .card-cont-info .card-opt-rrc { font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; text-overflow: ellipsis; } .card-cont-info .card-opt-drop { font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; text-overflow: ellipsis; align-items: center; } .card-cont-info .card-opt-drop span { max-width: 20px; min-width: 20px; height: 20px; } .card-cont-info .card-bot { gap: 16px; } .card-cont-info .card-buy { width: 124px; height: 44px; } .card-cont-info .card-buy-cart { /* padding: 11px 24px; */ font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; } .card-cont-info .card-click { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; padding: 11px 24px; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); box-sizing: border-box; } .card-cont-info .card-click:hover { background: #E8E8E8; } .card-cont-info-bot { margin-top: 24px; display: flex; flex-direction: column; gap: 24px; } .card-cont-info-bot button, .card-cont-info-bot a { display: flex; align-items: center; gap: 16px; color: var(--black, #252525); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; } .card-cont-info-bot button:hover, .card-cont-info-bot a:hover { color: #FF5A00; } .card-cont-info-bot-icon { max-width: 24px; min-width: 24px; height: 24px; } .card-cont-info-bot-icon img { width: 100%; height: 100%; } .card-cont-slider { /* max-width: 664px; */ max-width: 764px; /* width: 100%; */ display: flex; gap: 48px; } .card-cont-slider-main { max-width: 644px; /* width: 100%; */ /* height: 644px; */ aspect-ratio: 1 / 1; position: relative; } .card-cont-slider-main .card-pic-add { position: absolute; right: 24px; top: 24px; bottom: 24px; z-index: 1; } .card-cont-slider-main .card-pic-add-fav, .card-cont-slider-main .card-pic-add-comp, .card-cont-slider-main .card-pic-add-ver { width: 24px; height: 24px; } .card-cont-slider-main .card-pic-tags { position: absolute; top: 24px; left: 20px; z-index: 1; } .card-cont-slider-main .card-pic-tags a { padding: 3px 12px; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; /* 146.667% */ } .card-cont-slider-main-row { height: 100%; } .card-cont-slider-main-row .slick-list, .card-cont-slider-main-row .slick-track { height: 100%; } .card-cont-slider-main-row .slick-slide div { height: 100%; } .card-cont-slider-main-item { height: 100%; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-2, #FAFAFA); overflow: hidden; } .card-cont-slider-main-item img { width: 100%; height: 100%; object-fit: contain; } .card-cont-slider-side { display: flex; flex-direction: column; height: 100%; gap: 16px; align-items: center; } .card-cont-slider-side-arrow { max-width: 24px; min-width: 24px; height: 24px; background-image: url(/bitrix/templates/main/css/../img/card-cont/arrow.svg); background-size: 100% 100%; } .card-cont-slider-side-arrow:hover { background-image: url(/bitrix/templates/main/css/../img/card-cont/arrow_hover.svg); } .card-cont-slider-side-arrow_next { transform: rotate(180deg); } .card-cont-slider-side-vid { width: 52px; aspect-ratio: 1/1; padding: 10px; box-sizing: border-box; display: flex; justify-content: center; align-items: center; background: var(--Primary-1, #FF5A00); border-radius: 50%; } .card-cont-slider-side-vid::after { content: ''; width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/card-cont/play.svg); background-size: 100% 100%; display: flex; transition: 0.3s; } .card-cont-slider-side-vid:hover { background: var(--Dark-primary-1, #E25000); } .card-cont-slider-side-item { width: 100%; aspect-ratio: 1/1; background-color: #fff; border-radius: var(--Border-radius-1, 10px); border: 2px solid transparent; box-sizing: border-box; transition: 0.3s; cursor: pointer; overflow: hidden; } .card-cont-slider-side-item img { width: 100%; height: 100%; object-fit: contain; } .card-cont-slider-side-item:hover { border: 2px solid var(--Primary-1, #FF5A00); } .slick-current .card-cont-slider-side-item { border: 2px solid var(--Primary-1, #FF5A00); } .card-cont-slider-side-row .slick-slide { border: 0; margin: 8px 0; } .card-cont-slider-side-row .slick-list { margin: -8px 0; } .card-cont-slider-main .slick-arrow { position: absolute; top: 0; bottom: 0; margin: auto; left: 16px; width: 36px; height: 36px; background-color: var(--white, #FFF); box-shadow: 0 2px 4px 0 rgba(37, 37, 37, 0.16); border-radius: 50%; background-image: url(/bitrix/templates/main/css/../img/main-popular/arrow.svg); background-size: 20px 20px; background-position: center center; background-repeat: no-repeat; transition: 0.3s; font-size: 0; z-index: 2; opacity: 0; } .card-cont-slider-main:hover .slick-arrow { opacity: 1; } .card-cont-slider-main .slick-arrow:hover { background-color: var(--Primary-1, #FF5A00); background-image: url(/bitrix/templates/main/css/../img/main-popular/arrow_active.svg); } .card-cont-slider-main .slick-next { left: auto; right: 16px; transform: rotate(180deg); box-shadow: 0 -2px 4px 0 rgba(37, 37, 37, 0.16); } .card-info { margin-top: 48px; margin-bottom: 80px; } .card-info-nav { display: flex; /* overflow-y: scroll; */ border-radius: var(--Border-radius-1, 10px); padding: 4px; background: var(--Grey-1, #F5F3F1); box-sizing: border-box; width: fit-content; overflow-x: scroll; } .card-info-nav::-webkit-scrollbar { display: none; } .card-info-nav::-webkit-scrollbar { display: none; } .card-info-nav button { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: auto; text-align: center; padding: 0 32px; height: 44px; display: flex; align-items: center; justify-content: center; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); background-color: transparent; display: flex; gap: 12px; } .card-info-nav button:hover { color: var(--Primary-1, #FF5A00); } .card-info-nav button.card-info-nav_vid::before { content: ''; max-width: 20px; min-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/card-cont/vid.svg); background-size: 100% 100%; display: flex; } .card-info-nav button.active { background: var(--white, #FFF); box-shadow: 0 2px 8px 0 rgba(37, 37, 37, 0.24); color: #222228; } .card-info-cont { margin-top: 40px; } .card-info-cont-block { display: none; max-width: 1028px; width: 100%; } .card-info-cont-block.active { display: block; } .card-info-cont-text { display: flex; flex-direction: column; gap: 15px; color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; } .card-info-cont-text a { text-decoration-line: underline; text-decoration-style: solid; text-decoration-skip-ink: none; text-decoration-thickness: auto; text-underline-offset: auto; text-underline-position: from-font; } .card-info-cont-text a:hover { color: #FF5A00; } .card-info-cont-text ul, .card-info-cont-text ol { padding-left: 30px; display: flex; flex-direction: column; gap: 10px; } .card-info-cont-char { margin-top: 32px; } .card-info-cont-char h2 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; margin-bottom: 32px; } .card-info-cont-char-row { display: flex; flex-direction: column; gap: 16px; row-gap: 32px; flex-wrap: wrap; max-height: 706px; } .card-info-cont-char-item { display: flex; flex-direction: column; gap: 24px; width: calc(50% - 8px); } .card-info-cont-char-item h3 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; } .card-info-cont-char-item ul { display: flex; flex-direction: column; gap: 16px; list-style: none; } .card-info-cont-char-item ul li { display: flex; justify-content: space-between; color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; align-items: flex-end; gap: 12px; } .card-info-cont-char-item ul li span { display: flex; gap: 8px; white-space: nowrap; } .card-info-cont-char-item ul li a { max-width: 16px; min-width: 16px; height: 16px; background-image: url(/bitrix/templates/main/css/../img/card/info.svg); background-size: 100% 100%; display: flex; opacity: 0.4; } .card-info-cont-char-item ul li a:hover { opacity: 1; background-image: url(/bitrix/templates/main/css/../img/card/info_active.svg); } .card-info-cont-char-item ul li span:last-child { max-width: 50%; min-width: 50%; font-weight: 600; order: 2; } .card-info-cont-char-item ul li::before { content: ''; width: 100%; height: 5px; border-top: 1px dashed var(--black, #222228); opacity: 0.5; display: flex; order: 1; } .card-info-cont-alert { opacity: 0.6; color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; margin-top: 32px; display: flex; gap: 8px; align-items: flex-start; } .card-info-cont-alert::before { content: ''; max-width: 24px; min-width: 24px; height: 24px; background-image: url(/bitrix/templates/main/css/../img/card-cont/alert.svg); background-size: 100% 100%; display: flex; } .card-info-cont-error { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; margin-top: 32px; padding: 6px 18px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Grey-1, #F5F3F1); display: flex; gap: 10px; } .card-info-cont-error:hover { background-color: #E8E8E8; } .card-info-cont-error::before { content: ''; max-width: 20px; min-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/card-cont/bug.svg); background-size: 100% 100%; display: flex; } .card-info-cont-block h2 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; margin-bottom: 32px; } .card-info-cont-block_opt-row { display: flex; flex-direction: column; gap: 40px; } .card-info-cont-block_opt-item h3 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; margin-bottom: 24px; } .card-info-cont-block_partner { color: var(--white, #FFF); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; padding: 11px 24px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); background: var(--Primary-1, #FF5A00); display: flex; width: fit-content; margin-top: 24px; } .card-info-cont-block_partner:hover { background: var(--Dark-primary-1, #E25000); } .card-info-cont-block_opt-prog { display: flex; gap: 16px; margin-top: 32px; margin-bottom: 32px; } .card-info-cont-block_opt-prog-item { width: -webkit-fill-available; border-radius: var(--Border-radius-2, 16px); background: var(--Grey-2, #FAFAFA); padding: 32px; box-sizing: border-box; } .card-info-cont-block_opt-prog-item-star { display: flex; margin-bottom: 20px; } .card-info-cont-block_opt-prog-item-star img { width: 56px; height: 56px; aspect-ratio: 1/1; } .card-info-cont-block_opt-prog-item-title { color: var(--black, #222228); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; margin-bottom: 8px; } .card-info-cont-block_opt-prog-item-dis { color: var(--Primary-1, #FF5A00); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; margin-bottom: 12px; } .card-info-cont-block_opt-prog-item-price { color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .card-info-cont-block_opt-stages { padding: 32px; box-sizing: border-box; border-radius: var(--Border-radius-2, 16px); background: var(--Grey-2, #FAFAFA); display: flex; flex-wrap: wrap; gap: 32px; margin-top: 32px; } .card-info-cont-block_opt-stages-item { width: calc(100% / 3 - 21.4px); } .card-info-cont-block_opt-stages-item-pic { width: 56px; height: 56px; margin-bottom: 20px; } .card-info-cont-block_opt-stages-item-pic img { width: 100%; height: 100%; } .card-info-cont-block_opt-stages-item-step { color: var(--Primary-1, #FF5A00); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; margin-bottom: 8px; } .card-info-cont-block_opt-stages-item-title { color: var(--black, #222228); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; margin-bottom: 12px; } .card-info-cont-block_opt-stages-item-text { color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .card-info-cont-block_pay { display: flex; gap: 16px; flex-wrap: wrap; } .card-info-cont-block_pay-item { width: calc(100% / 2 - 8px); border-radius: var(--Border-radius-2, 16px); background: var(--Grey-2, #FAFAFA); padding: 32px; box-sizing: border-box; } .card-info-cont-block_pay-pic { width: 56px; height: 56px; margin-bottom: 20px; } .card-info-cont-block_pay-pic img { width: 100%; height: 100%; } .card-info-cont-block_pay-title { color: var(--black, #252525); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; margin-bottom: 16px; } .card-info-cont-block_pay-text { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; display: flex; flex-direction: column; gap: 15px; } .card-info-cont-block_pay-add { margin-top: 16px; opacity: 0.6; align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; } .card-info-cont-block_review { max-width: 100%; } .card-info-cont-block_review-row { display: flex; gap: 48px; } .card-info-cont-block_review-cont { width: 100%; } .card-info-cont-block_review-side { max-width: 300px; min-width: 300px; height: fit-content; padding: 32px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Grey-1, #F5F3F1); position: sticky; top: 100px; } .card-info-cont-block_review-side-num { color: var(--black, #222228); font-family: "Golos Text"; font-size: 36px; font-style: normal; font-weight: 600; line-height: 44px; margin-bottom: 16px; } .card-info-cont-block_review-side-rate { display: flex; gap: 16px; align-items: center; color: var(--black, #222228); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; } .card-info-cont-block_review-side-rate-stars { display: flex; gap: 4px; align-items: center; } .card-info-cont-block_review-side-rate-stars span { max-width: 24px; min-width: 24px; height: 24px; background-image: url(/bitrix/templates/main/css/../img/card-cont/rate_star.svg); background-size: 100% 100%; } .card-info-cont-block_review-side-rate-stars span.dis { background-image: url(/bitrix/templates/main/css/../img/card-cont/rate_star_dis.svg); } .card-info-cont-block_review-side button { color: var(--white, #FFF); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; padding: 11px 24px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); background: var(--Primary-1, #FF5A00); margin-top: 32px; } .card-info-cont-block_review-side button:hover { background: #E25000; } .card-info-cont-block_review-cont-top { display: flex; gap: 16px; } .card-info-cont-block_review-cont-top-item { max-width: 96px; min-width: 96px; height: 96px; border-radius: var(--Border-radius-1, 10px); overflow: hidden; background-color: #F5F3F1; } .card-info-cont-block_review-cont-top-item img { width: 100%; height: 100%; object-fit: cover; } .card-info-cont-block_review-cont-top button { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; margin-left: 8px; } .card-info-cont-block_review-cont-nav { margin-top: 32px; display: flex; align-items: center; gap: 24px; } .card-info-cont-block_review-cont-nav label { display: flex; gap: 10px; align-items: center; } .card-info-cont-block_review-cont-nav label input { display: none; } .card-info-cont-block_review-cont-nav label { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; cursor: pointer; } .card-info-cont-block_review-cont-nav label input[type="checkbox"]~span { max-width: 15px; min-width: 15px; height: 15px; border-radius: 4px; border: 1.5px solid rgba(34, 34, 40, 0.05); background: var(--Grey-1, #F5F3F1); display: flex; position: relative; justify-content: center; align-items: center; transition: 0.3s; box-sizing: border-box; overflow: hidden; } .card-info-cont-block_review-cont-nav label input[type="checkbox"]~span::after { content: ''; width: 14px; height: 12px; background-image: url(/bitrix/templates/main/css/../img/catalog/gal.svg); background-size: 100% 100%; opacity: 0; transition: 0.3s; } .card-info-cont-block_review-cont-nav label:hover input[type="checkbox"]~span { border: 1.5px solid var(--Primary-1, #FF5A00); background-color: #fff; } .card-info-cont-block_review-cont-nav label input[type="checkbox"]:checked~span { background-color: #FF5A00; border: 1.5px solid var(--Primary-1, #FF5A00); } .card-info-cont-block_review-cont-nav label input[type="checkbox"]:checked~span::after { opacity: 1; } .card-info-cont-block_review-list { margin-top: 24px; display: flex; flex-direction: column; gap: 16px; } .card-info-cont-block_review-list-item { padding: 24px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); border: 1px solid var(--Grey-1, #F5F3F1); display: flex; flex-direction: column; gap: 32px; } .card-info-cont-block_review-list-item-top { display: flex; flex-direction: column; gap: 6px; } .card-info-cont-block_review-list-item-name { color: var(--black, #252525); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; } .card-info-cont-block_review-list-item-rate { display: flex; align-items: center; gap: 16px; color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 19px; } .card-info-cont-block_review-list-item-rate-stars { display: flex; gap: 4px; } .card-info-cont-block_review-list-item-rate-stars span { width: 20px; height: 20px; aspect-ratio: 1/1; background-image: url(/bitrix/templates/main/css/../img/card-cont/rate_star.svg); background-size: 100% 100%; display: flex; } .card-info-cont-block_review-list-item-rate-stars span.dis { background-image: url(/bitrix/templates/main/css/../img/card-cont/rate_star_dis.svg); } .card-info-cont-block_review-list-item ul { display: flex; flex-direction: column; gap: 12px; list-style: none; } .card-info-cont-block_review-list-item ul li { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; } .card-info-cont-block_review-list-item ul li span { font-weight: 600; } .card-info-cont-block_review-list-item-pics { display: flex; gap: 16px; overflow-x: scroll; } .card-info-cont-block_review-list-item-pics::-webkit-scrollbar { display: none; } .card-info-cont-block_review-list-item-pics a { max-width: 72px; min-width: 72px; height: 72px; border-radius: var(--Border-radius-1, 10px); } .card-info-cont-block_review-list-item-pics a img { width: 100%; height: 100%; object-fit: cover; object-position: center center; } .card-info-cont-block .main-info-vid { width: 100%; } .card-info-cont-block-req { padding: 11px 24px; display: flex; gap: 12px; align-items: center; color: var(--Primary-1, #FF5A00); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Primary-1, #FF5A00); margin-top: 48px; } .card-info-cont-block-req:hover { background: var(--Dark-primary-1, #E25000); color: var(--white, #FFF); } .card-info-cont-block-req::before { content: ''; max-width: 20px; min-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/card-cont/call.svg); background-size: 100% 100%; display: flex; transition: 0.3s; } .card-info-cont-block-req:hover::before { background-image: url(/bitrix/templates/main/css/../img/card-cont/call_active.svg); } .click-popup { position: fixed; z-index: 10; top: 0; bottom: 0; right: 0; left: 0; background-color: rgba(34, 34, 40, 0.40); display: flex; justify-content: center; align-items: center; display: none; } .click-popup.active { display: flex; } .pop-cont { max-width: 480px; width: 100%; padding: 32px; box-sizing: border-box; border-radius: var(--Border-radius-2, 16px); background: var(--white, #FFF); box-shadow: 0 20px 48px 0 rgba(37, 37, 37, 0.16); position: relative; height: fit-content; max-height: calc(100% - 80px); overflow-y: scroll; } .pop-cont::-webkit-scrollbar { display: none; } .pop-cont-close { width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/pop/close.svg); background-size: 100% 100%; position: absolute; top: 24px; right: 24px; opacity: 0.6; } .pop-cont-close:hover { opacity: 1; } .cont-title { color: var(--black, #252525); font-family: "Golos Text"; font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; margin-bottom: 32px; } .pop-cont .card { display: flex; flex-direction: row; gap: 16.5px; padding: 0; border: 0; } .pop-cont .card:hover { box-shadow: none; } .pop-cont .card-pic { width: 96px; height: fit-content; } .pop-cont .card-pic .card-pic-add, .pop-cont .card-pic .card-pic-tags, .pop-cont .card .card-color, .pop-cont .card-opt, .pop-cont .card-bot { display: none; } .pop-cont .card-cont { margin-top: 0; } .pop-cont .card-title { font-size: 12px; height: auto; margin-bottom: 4px; } .pop-cont .card-cat { font-size: 11px; } .pop-cont form { margin-top: 32px; display: flex; flex-direction: column; } .pop-cont-field { display: flex; flex-direction: column; gap: 12px; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; margin-bottom: 24px; } .pop-cont-field input { height: 50px; padding: 0 16px; box-sizing: border-box; display: flex; align-items: center; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Grey-1, #F5F3F1); background: var(--white, #FFF); transition: 0.3s; } .pop-cont-field input:hover, .card-cont-field input:focus { border: 2px solid var(--Primary-1, #FF5A00); } .pop-cont-check { display: flex; align-items: center; gap: 8px; cursor: pointer; } .pop-cont-check input { display: none; } .pop-cont-check span { max-width: 15px; min-width: 15px; height: 15px; border-radius: 4px; border: 1.5px solid rgba(34, 34, 40, 0.05); background: var(--Grey-1, #F5F3F1); display: flex; position: relative; justify-content: center; align-items: center; transition: 0.3s; box-sizing: border-box; overflow: hidden; } .pop-cont-check input[type="checkbox"]~span::after { content: ''; width: 14px; height: 12px; background-image: url(/bitrix/templates/main/css/../img/catalog/gal.svg); background-size: 100% 100%; opacity: 0; transition: 0.3s; } .pop-cont-check:hover input[type="checkbox"]~span { border: 1.5px solid var(--Primary-1, #FF5A00); background-color: #fff; } .pop-cont-check input[type="checkbox"]:checked~span { background-color: #FF5A00; border: 1.5px solid var(--Primary-1, #FF5A00); } .pop-cont-check input[type="checkbox"]:checked~span::after { opacity: 1; } .pop-cont-check-text { /* opacity: 0.6; */ color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; transition: 0.3s; } .pop-cont-check:hover .card-cont-check-text { opacity: 1; } .pop-cont-check-text a { color: var(--Primary-1, #FF5A00); text-decoration-line: underline; text-decoration-style: solid; text-decoration-skip-ink: auto; text-decoration-thickness: auto; text-underline-offset: auto; text-underline-position: from-font; } .pop-cont-btn { color: var(--white, #FFF); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; width: 100%; padding: 11px 24px; box-sizing: border-box; display: flex; justify-content: center; align-items: center; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Primary-1, #FF5A00); background: var(--Primary-1, #FF5A00); margin-top: 32px; } .pop-cont-btn:hover { background: var(--Dark-primary-1, #E25000); } .price-popup { display: none; } .price-popup.active { position: fixed; z-index: 10; top: 0; bottom: 0; right: 0; left: 0; background-color: rgba(34, 34, 40, 0.40); display: flex; justify-content: center; align-items: center; } .card-cont-info-color_single { display: flex; align-items: center; gap: 12px; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 1; color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 19px; text-overflow: ellipsis; } .card-cont-info-color_single span { max-width: 18px; min-width: 18px; height: 18px; border-radius: 50%; } .size-popup { display: none; } .size-popup.active { position: fixed; z-index: 10; top: 0; bottom: 0; right: 0; left: 0; background-color: rgba(34, 34, 40, 0.40); display: flex; justify-content: center; align-items: center; } .size-popup .pop-cont { max-width: 640px; } .size-popup-pic { width: calc(100% + 64px); margin: 0 -32px; height: 480px; } .size-popup-pic img { width: 100%; height: 100%; object-fit: cover; object-position: center center; } .size-popup-text { margin: 32px 0; display: flex; flex-direction: column; gap: 10px; align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; } .size-popup-close { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; width: 100%; display: flex; justify-content: center; align-items: center; padding: 11px 24px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Grey-1, #F5F3F1); background: var(--Grey-1, #F5F3F1); } .size-popup-close:hover { background-color: #E8E8E8; } .error-popup { display: none; } .error-popup.active { position: fixed; z-index: 10; top: 0; bottom: 0; right: 0; left: 0; background-color: rgba(34, 34, 40, 0.40); display: flex; justify-content: center; align-items: center; } .pop-cont-field textarea { width: 100%; height: 116px; padding: 14px 16px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Grey-1, #F5F3F1); background: var(--white, #FFF); resize: none; color: var(--black, #222228); font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; outline: 0; font-family: "Golos Text"; transition: 0.3s; } .pop-cont-field textarea:hover, .pop-cont-field textarea:focus { border: 2px solid #FF5A00; } .error-popup { display: none; } .error-popup.active { position: fixed; z-index: 10; top: 0; bottom: 0; right: 0; left: 0; background-color: rgba(34, 34, 40, 0.40); display: flex; justify-content: center; align-items: center; } .partner-popup { display: none; } .partner-popup.active { position: fixed; z-index: 10; top: 0; bottom: 0; right: 0; left: 0; background-color: rgba(34, 34, 40, 0.40); display: flex; justify-content: center; align-items: center; } .card-partner { margin-bottom: 80px; } .card-partner-cont { display: flex; flex-direction: column; padding: 32px; border-radius: var(--Border-radius-2, 16px); background: linear-gradient(282deg, rgba(255, 90, 0, 0.10) 0.77%, rgba(255, 90, 0, 0.80) 60.31%), rgba(255, 90, 0, 0.10); flex-direction: column; justify-content: flex-end; align-items: flex-start; position: relative; } .card-partner-cont::after { content: ''; width: 204px; aspect-ratio: 1/1; background-image: url(/bitrix/templates/main/css/../img/card-cont/bag.svg); background-size: 100% 100%; position: absolute; right: 91px; top: 0; bottom: 0; margin: auto; } .card-partner-title { color: var(--white, #FFF); font-family: "Golos Text"; font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; margin-bottom: 16px; } .card-partner-text { color: var(--white, #FFF); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; } .card-partner-btn { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; padding: 11px 24px; border-radius: var(--Border-radius-1, 10px); background: var(--white, #FFF); margin-top: 24px; } .card-partner-btn:hover { background-color: #E8E8E8; } .card-top { position: fixed; top: 0; right: 0; left: 0; height: 70px; background-color: red; background: var(--white, #FFF); box-shadow: 0 0 16px 0 rgba(37, 37, 37, 0.10); } .card-top .container { height: 100%; padding-top: 9px; padding-bottom: 9px; display: flex; align-items: center; } .card-top_active { z-index: 10; } .card-top .card-pic { height: 100%; width: auto; margin-right: 16px; } .card-top .card-title { height: auto; width: auto; margin-bottom: 8px; } .card-top-info-bot { display: flex; gap: 12px; align-items: center; } .card-top-info .card-add { margin-bottom: 0; } .card-top-info .card-art { margin-bottom: 0; } .card-top-info .card-rating span { opacity: 1; } .card-top-info .card-rating span:last-child { opacity: 0.6; } .card-top-price { margin-left: auto; } .card-top-price .card-price { margin-bottom: 0; } .card-top-price .card-opt { margin-bottom: 0; } .card-top-add { margin-left: 53px; } .card-top-add .card-bot { gap: 16px; } .solo-title { margin-top: 24px; } .solo-title .container { display: flex; align-items: center; justify-content: space-between; gap: 16px; } .solo-title h1 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 36px; font-style: normal; font-weight: 600; line-height: 44px; } .brand { margin-top: 24px; margin-bottom: 80px; } .brand-nav { display: flex; background: var(--Grey-1, #F5F3F1); border-radius: var(--Border-radius-1, 10px); padding: 4px; box-sizing: border-box; width: fit-content; margin-bottom: 24px; } .brand-nav button { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; display: flex; align-items: center; gap: 10px; padding: 6px 18px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); white-space: nowrap; } .brand-nav button span { width: 20px; height: 20px; position: relative; } .brand-nav button span img { width: 100%; height: 100%; transition: 0.3s; } .brand-nav button span img.hover { opacity: 0; position: absolute; top: 0; right: 0; bottom: 0; left: 0; } .brand-nav button:hover { color: #FF5A00; } .brand-nav button:hover span img { opacity: 0; } .brand-nav button:hover span img.hover { opacity: 1 !important; } .brand-nav button span img.active { opacity: 0; position: absolute; top: 0; right: 0; bottom: 0; left: 0; } .brand-nav button.active { background: var(--Primary-1, #FF5A00); color: var(--white, #FFF); } .brand-nav button.active span img { opacity: 0; } .brand-nav button.active span img.active { opacity: 1 !important; } .brand-nav button.active:hover span img.hover { opacity: 0 !important; } .brand-row { display: none; flex-direction: column; gap: 16px; } .brand-row.active { display: flex; } .brand-item { display: flex; padding: 24px; border-radius: var(--Border-radius-2, 16px); border: 1px solid var(--Grey-1, #F5F3F1); background: transparent; transition: 0.3s; gap: 32px; } .brand-item:hover { background: var(--white, #FFF); box-shadow: 0 4px 16px 0 rgba(37, 37, 37, 0.12); } .brand-item-pic { max-width: 160px; min-width: 160px; height: 160px; aspect-ratio: 1/1; } .brand-item-pic img { width: 100%; height: 100%; object-fit: contain; object-position: center center; } .brand-item-cont { display: flex; flex-direction: column; gap: 24px; } .brand-item-cont-title { align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; transition: 0.3s; } .brand-item:hover .brand-item-cont-title { color: var(--Primary-1, #FF5A00); } .brand-item-cont-text { align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; } .brand-item-cont-link { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; padding: 6px 18px; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); box-sizing: border-box; width: fit-content; } .brand-item:hover .brand-item-cont-link { background: var(--Primary-1, #FF5A00); color: #fff; } .brand-item:hover .brand-item-cont-link:hover { background: var(--Dark-primary-1, #E25000); } .brand-item-cont-text-extend { display: none; } .brand-page { margin-top: 24px; } .brand-page .catalog-title { margin-bottom: 24px; } .brand-page .card { width: calc(100% / 5 - 12.8px); } .about { margin-top: 24px; margin-bottom: 80px; } .about .container { display: flex; gap: 48px; } .about-side { max-width: 300px; min-width: 300px; width: 100%; display: flex; flex-direction: column; gap: 12px; } .about-side button { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; padding: 8px 16px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); text-align: left; } .about-side button.active { background: rgba(255, 90, 0, 0.05); color: var(--Primary-1, #FF5A00); } .about-side button:hover { color: var(--Primary-1, #FF5A00); } .about-cont { width: calc(100% - 300px - 48px); } .about-cont-block { display: none !important; } .about-cont-block.active { display: flex !important; flex-direction: column; } .about-cont-text { display: flex; flex-direction: column; gap: 15px; color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; } .about-cont-text strong { color: var(--black, #252525); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; } .about-cont-text ul { padding-left: 30px; display: flex; flex-direction: column; gap: 10px; } .about-cont-history { margin-top: 56px; } .about-cont-history h2 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; margin-bottom: 32px; } .about-cont-history-row { margin-top: 32px; display: flex; flex-direction: column; gap: 48px; padding-left: 32px; position: relative; } .about-cont-history-row::before { content: ''; position: absolute; left: 0; top: 10px; bottom: 50px; width: 2px; /* height: 100%; */ background-color: #F5F3F1; } .about-cont-history-item { display: flex; flex-direction: column; position: relative; } .about-cont-history-item-title { color: var(--Primary-1, #FF5A00); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; margin-bottom: 16px; } .about-cont-history-item::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background-color: #FF5A00; position: absolute; left: -34.8px; top: 10px; z-index: 2; } .about-cont-history-item::after { content: ''; left: -32px; top: 0; width: 2px; bottom: 100%; background-color: #FF5A00; position: absolute; z-index: 1; transition: 0.3s; } .about-cont-history-item_active::after { bottom: -63px; } .about-cont-history-item:first-child:after { top: 10px; } .about-cont-history-item:last-child:after { display: none; } .about-cont-history-item-text { display: flex; flex-direction: column; gap: 16px; align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; } .about-cont-history-item-pic { margin-top: 32px; display: flex; flex-direction: column; gap: 24px; } .about-cont-history-item-pic img { width: 100%; height: 348px; border-radius: var(--Border-radius-2, 16px); box-shadow: 0 8px 24px 0 rgba(37, 37, 37, 0.16); object-fit: cover; object-position: center center; } .about-cont-history-item-pic span { opacity: 0.6; color: var(--black, #252525); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; } .about-cont-history-item-s { position: relative; } .about-cont-history-item-s-a { position: relative; } .about-cont-history-item-s span { opacity: 0.6; align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; margin-top: 24px; display: flex; } .slider-counter { position: absolute; color: var(--black, #222228); font-family: "Golos Text"; font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; z-index: 1; bottom: 16px; left: 16px; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); padding: 2px 8px; } .about-cont-history-item-slider { margin-top: 32px; } .about-cont-history-item-slider .slick-slide { margin-right: 16px; max-width: 448px; aspect-ratio: 4/3; border-radius: var(--Border-radius-1, 10px); overflow: hidden; } .about-cont-history-item-slider .slick-slide div { } .about-cont-history-item-vid { margin-top: 48px; display: flex; flex-direction: row; flex-wrap: wrap; gap: 16px; } .about-cont-history-item-vid a { width: calc(100% / 2 - 8px); border-radius: var(--Border-radius-2, 16px); box-shadow: 0 8px 24px 0 rgba(37, 37, 37, 0.16); overflow: hidden; position: relative; } .about-cont-history-item-vid a img { width: 100%; height: 100%; object-fit: cover; object-position: center center; } .about-cont-history-item-vid button { width: 52px; aspect-ratio: 1/1; border-radius: 50%; background: var(--Primary-1, #FF5A00); position: absolute; z-index: 1; top: 0; bottom: 0; left: 0; right: 0; margin: auto; display: flex; justify-content: center; align-items: center; } .about-cont-history-item-vid button:hover { background: var(--Dark-primary-1, #E25000); } .about-cont-history-item-vid button::after { content: ''; width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/card-cont/play.svg); background-size: 100% 100%; display: flex; transition: 0.3s; } .about-cont-block_team { display: flex; flex-direction: column; gap: 40px; } .about-cont-sub { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .about-cont-dir { display: flex; gap: 48px; } .about-cont-dir-side { display: flex; flex-direction: column; max-width: 322px; min-width: 322px; } .about-cont-dir-side-pic { width: 100%; aspect-ratio: 1/1; border-radius: 10px; overflow: hidden; margin-bottom: 24px; } .about-cont-dir-side-pic img { width: 100%; height: 100%; object-fit: cover; object-position: center center; } .about-cont-dir-side-name { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; color: var(--black, #222228); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; text-overflow: ellipsis; margin-bottom: 12px; } .about-cont-dir-side-pos { overflow: hidden; opacity: 0.6; align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; text-overflow: ellipsis; white-space: nowrap; } .about-cont-team { display: flex; flex-direction: column; gap: 32px; } .about-cont-team h3 { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; } .about-cont-team-row { display: flex; gap: 16px; flex-wrap: wrap; } .about-cont-team-item { width: calc(100% / 4 - 12px); } .about-cont-team-item-pic { width: 100%; aspect-ratio: 1/1; border-radius: 10px; overflow: hidden; margin-bottom: 24px; } .about-cont-team-item-pic img { width: 100%; height: 100%; object-fit: cover; object-position: center center; } .about-cont-item-team-name { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-overflow: ellipsis; margin-bottom: 8px; } .about-cont-item-team-pos { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; text-overflow: ellipsis; white-space: nowrap; } .about-cont-block .card-info-cont-block_review-row { flex-direction: column-reverse; gap: 24px; } .about-cont-block .card-info-cont-block_review-side { max-width: 100%; min-width: 0; position: unset; display: flex; align-items: center; padding: 32px; } .about-cont-block .card-info-cont-block_review-side-num { margin-bottom: 0; margin-right: 16px; } .about-cont-block .card-info-cont-block_review-side button { margin: 0; margin-left: auto; } .about-cont-block .card-info-cont-block_review-cont-nav { margin: 0; } .about-cont-recrut { border-radius: var(--Border-radius-1, 10px); padding: 32px; border: 2px solid var(--Grey-1, #F5F3F1); display: flex; flex-direction: column; gap: 24px; margin-bottom: 48px; } .about-cont-recrut-title { color: var(--black, #222228); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; } .about-cont-recrut-row { display: flex; gap: 64px; align-items: flex-end; flex-wrap: wrap; } .about-cont-recrut-item { display: flex; flex-direction: column; gap: 12px; color: var(--black, #252525); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; white-space: nowrap; } .about-cont-recrut-item span { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; } .about-cont-recrut-item a:hover { color: #FF5A00; } .about-cont-recrut-button { color: var(--white, #FFF); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; padding: 11px 24px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); background: var(--Primary-1, #FF5A00); margin-left: auto; } .about-cont-recrut-button:hover { background: #E25000; } .about-cont-vac { margin-top: 48px; display: flex; flex-direction: column; gap: 16px; } .about-cont-vac-item { padding: 32px; border-radius: var(--Border-radius-2, 16px); border: 1px solid var(--Grey-1, #F5F3F1); box-sizing: border-box; max-height: 131px; overflow: hidden; transition: 0.3s; } .about-cont-vac-item:hover { box-shadow: 0 4px 16px 0 rgba(37, 37, 37, 0.12); } .about-cont-vac-item.active { max-height: 2000px; } .about-cont-vac-item-title { align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; margin-bottom: 16px; display: flex; justify-content: space-between; align-items: center; transition: 0.3s; cursor: pointer; } .about-cont-vac-item-title::after { content: ''; max-width: 24px; min-width: 24px; height: 24px; background-image: url(/bitrix/templates/main/css/../img/about/arrow.svg); background-size: 100% 100%; display: flex; transition: 0.3s; } .about-cont-vac-item-title:hover { color: #FF5A00; } .about-cont-vac-item-title:hover::after { background-image: url(/bitrix/templates/main/css/../img/about/arrow_active.svg); } .about-cont-vac-item.active .about-cont-vac-item-title::after { transform: rotate(180deg); } .about-cont-vac-item-top { display: flex; gap: 24px; } .about-cont-vac-item-top span { opacity: 0.8; color: var(--black, #222228); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; } .about-cont-vac-item-top span:first-child { font-weight: 600; } .about-cont-vac-item-cont { margin-top: 32px; display: flex; flex-direction: column; gap: 32px; opacity: 0; transition: 0.3s; } .about-cont-vac-item.active .about-cont-vac-item-cont { opacity: 1; } .about-cont-vac-item-cont-block { display: flex; flex-direction: column; gap: 16px; } .about-cont-vac-item-cont-block_pic { flex-direction: row; gap: 32px; } .about-cont-vac-item-cont-pic { max-width: 320px; aspect-ratio: 1/1; width: 100%; height: fit-content; border-radius: var(--Border-radius-1, 10px); box-shadow: 0 8px 24px 0 rgba(37, 37, 37, 0.16); overflow: hidden; } .about-cont-vac-item-cont-pic img { width: 100%; height: 100%; object-fit: cover; object-position: center center; } .about-cont-vac-item-cont-block-title { color: var(--black, #222228); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .about-cont-vac-btn { color: var(--white, #FFF); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; text-decoration-line: underline; text-decoration-style: solid; text-decoration-skip-ink: auto; text-decoration-thickness: auto; text-underline-offset: auto; text-underline-position: from-font; padding: 11px 24px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); background: var(--Primary-1, #FF5A00); width: fit-content; } .about-cont-vac-btn:hover { background: #E25000; } .about-cont-res { margin-top: 48px; } .about-cont-res-title { align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; margin-bottom: 24px; } .about-cont-res-row { display: flex; flex-direction: column; gap: 16px; } .about-cont-res-item { padding: 32px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); border: 1px solid var(--Grey-1, #F5F3F1); transition: 0.3s; display: flex; flex-direction: column; gap: 32px; max-height: 91px; overflow: hidden; } .about-cont-res-item.active { max-height: 1000px; } .about-cont-res-item:hover { box-shadow: 0 4px 16px 0 rgba(37, 37, 37, 0.12); } .about-cont-res-item-title { color: var(--black, #222228); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; display: flex; justify-content: space-between; align-items: center; transition: 0.3s; cursor: pointer; } .about-cont-res-item-title::after { content: ''; max-width: 24px; min-width: 24px; height: 24px; background-image: url(/bitrix/templates/main/css/../img/about/arrow.svg); background-size: 100% 100%; display: flex; transition: 0.3s; } .about-cont-res-item-title:hover { color: #FF5A00; } .about-cont-res-item-title:hover::after { background-image: url(/bitrix/templates/main/css/../img/about/arrow_active.svg); } .about-cont-res-item.active .about-cont-res-item-title::after { transform: rotate(180deg); } .about-cont-res-item-text { align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; } .about-cont-res-item-text a { color: var(--Primary-1, #FF5A00); text-decoration-line: underline; text-decoration-style: solid; text-decoration-skip-ink: none; text-decoration-thickness: auto; text-underline-offset: auto; text-underline-position: from-font; } .vac-popup { display: none; } .vac-popup.active { position: fixed; z-index: 10; top: 0; bottom: 0; right: 0; left: 0; background-color: rgba(34, 34, 40, 0.40); display: flex; justify-content: center; align-items: center; } .pop-cont-file { } .pop-cont-file input { display: none; } .pop-cont-file-block { padding: 11px 24px; width: 100%; height: 80px; display: flex; color: var(--Primary-1, #FF5A00); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; display: flex; justify-content: center; align-items: center; align-items: center; gap: 12px; border-radius: var(--Border-radius-1, 10px); background: rgba(255, 90, 0, 0.05); cursor: pointer; transition: 0.3s; margin-bottom: 12px; box-sizing: border-box; } .pop-cont-file-block:hover { color: #E25000; } .pop-cont-file-block::before { content: ''; max-width: 20px; min-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/about/sk.svg); background-size: 100% 100%; display: flex; transition: 0.3s; } .pop-cont-file-block:hover::before { background-image: url(/bitrix/templates/main/css/../img/about/sk_active.svg); } .pop-cont-file span { opacity: 0.6; align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; margin-bottom: 12px; } .pop-cont-file-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; } .pop-cont-file-row button { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; display: flex; gap: 6px; align-items: center; padding: 3px 12px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); cursor: pointer; } .pop-cont-file-row button::after { content: ''; max-width: 16px; min-width: 16px; height: 16px; background-image: url(/bitrix/templates/main/css/../img/catalog/close.svg); background-size: 100% 100%; display: flex; transition: 0.3s; } .pop-cont-file-row button:hover::after { background-image: url(/bitrix/templates/main/css/../img/catalog/close_active.svg); } .pop-cont-file-row button:hover { background: #E8E8E8; } .about-cont-qst-nav { display: flex; flex-wrap: wrap; gap: 16px; margin-bottom: 32px; } .about-cont-qst-nav button { display: flex; gap: 12px; align-items: center; padding: 11px 24px; box-sizing: border-box; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; /* 146.667% */ border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); white-space: nowrap; } .about-cont-qst-nav button:hover { background: #E8E8E8; color: #FF5A00; } .about-cont-qst-nav button.active { background-color: #FF5A00; color: #fff; } .about-cont-qst-nav-pic { max-width: 20px; min-width: 20px; height: 20px; position: relative; } .about-cont-qst-nav-pic img { width: 100%; height: 100%; position: absolute; top: 0; right: 0; bottom: 0; left: 0; transition: 0.3s; } .about-cont-qst-nav button:hover img { opacity: 0; } .about-cont-qst-nav-pic img.active { opacity: 0; z-index: 1; } .about-cont-qst-nav-pic img.hover { opacity: 0; z-index: 1; } .about-cont-qst-nav button:hover .about-cont-qst-nav-pic img.hover { opacity: 1 !important; } .about-cont-qst-nav button.active .about-cont-qst-nav-pic img.active { opacity: 1 !important; } .news { margin-top: 32px; margin-bottom: 80px; } .news-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 24px; gap: 24px; } .news-top .catalog-side-block-search { max-width: 300px; margin-bottom: 0; margin-right: auto; } .news-row { display: flex; gap: 16px; flex-wrap: wrap; row-gap: 40px; } .news-row .main-news-item { width: calc(100% / 4 - 12px); } .news-top-add { display: flex; gap: 24px; } .new { margin-top: 24px; margin-bottom: 80px; } .new-top { display: flex; gap: 32px; align-items: center; } .new-top span, .new-top a { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; text-overflow: ellipsis; } .new-top a:hover { opacity: 1; } .new-row { display: flex; gap: 48px; margin-top: 32px; } .new-side { max-width: 300px; min-width: 300px; width: 100%; display: flex; flex-direction: column; gap: 40px; position: sticky; top: 90px; height: fit-content; } .new-side-links { display: flex; flex-direction: column; gap: 12px; } .new-side-links a { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; padding: 8px 16px; border-radius: var(--Border-radius-1, 10px); box-sizing: border-box; } .new-side-links a:hover { background: var(--Grey-1, #F5F3F1); } .new-side-banner { display: flex; flex-direction: column; justify-content: space-between; padding: 24px; box-sizing: border-box; border-radius: var(--Border-radius-2, 16px); background: linear-gradient(282deg, rgba(34, 34, 40, 0.30) 0.77%, rgba(34, 34, 40, 0.80) 60.31%); height: 200px; } .new-side-banner-title { align-self: stretch; color: var(--white, #FFF); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .new-side-banner a { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; padding: 6px 18px; box-sizing: border-box; width: fit-content; border-radius: var(--Border-radius-1, 10px); background: var(--white, #FFF); } .new-side-banner a:hover { background: #E8E8E8; } .new-side-soc { display: flex; flex-direction: column; gap: 32px; } .new-side-soc-title { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; } .new-side-soc .footer-block-soc { display: flex; gap: 32px; } .new-side-soc .footer-block-soc a { width: 24px; height: 24px; aspect-ratio: 1/1; } .new-cont { width: calc(100% - 300px - 48px); display: flex; flex-direction: column; gap: 40px; } .new-cont article { display: flex; flex-direction: column; gap: 40px; } .new-cont article h2 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; margin-bottom: -16px; } .new-cont article .pic { width: 100%; aspect-ratio: 1028.00/684.66; border-radius: var(--Border-radius-2, 16px); overflow: hidden; object-fit: cover; object-position: center center; } .new-cont-text { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; display: flex; flex-direction: column; gap: 15px; } .new-cont-text a { color: var(--Primary-1, #FF5A00); text-decoration-line: underline; text-decoration-style: solid; text-decoration-skip-ink: none; text-decoration-thickness: auto; text-underline-offset: auto; text-underline-position: from-font; } .new-cont-text ul, .new-cont-text ol { display: flex; flex-direction: column; gap: 15px; padding-left: 20px; } .new-cont-text a:hover { color: #E25000; } .new-cont article .about-cont-history-item-slider { margin-top: 0; } .new-cont article blockquote { padding: 32px; box-sizing: border-box; border-radius: var(--Border-radius-2, 16px); background: var(--Grey-2, #FAFAFA); } .new-cont article blockquote .row { display: flex; gap: 32px; } .new-cont article blockquote .text { color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .new-cont article blockquote .text a { color: var(--Primary-1, #FF5A00); text-decoration-line: underline; text-decoration-style: solid; text-decoration-skip-ink: none; text-decoration-thickness: auto; text-underline-offset: auto; text-underline-position: from-font; } .new-cont article blockquote .text a:hover { color: #E25000; } .new-cont article blockquote img { max-width: 128px; min-width: 128px; height: fit-content; aspect-ratio: 1/1; border-radius: var(--Border-radius-1, 10px); object-fit: cover; object-position: center center; overflow: hidden; } .new-cont article blockquote .pos { margin-top: 16px; opacity: 0.6; align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; text-overflow: ellipsis; white-space: nowrap; } .new-cont article blockquote .name { margin-top: 8px; color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 500; line-height: 18px; text-overflow: ellipsis; } .new-cont article .video_pop { width: 100%; aspect-ratio: 1028.00/585.89; border-radius: var(--Border-radius-2, 16px); overflow: hidden; position: relative; } .new-cont article .video_pop img { width: 100%; height: 100%; object-fit: cover; object-position: center center; } .new-cont article .video_pop button { width: 52px; aspect-ratio: 1/1; border-radius: 50%; background: var(--Primary-1, #FF5A00); position: absolute; z-index: 1; top: 0; bottom: 0; left: 0; right: 0; margin: auto; display: flex; justify-content: center; align-items: center; } .new-cont article .video_pop button:hover { background: var(--Dark-primary-1, #E25000); } .new-cont article .video_pop button::after { content: ''; width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/card-cont/play.svg); background-size: 100% 100%; display: flex; transition: 0.3s; } .new-cont-card-slider .slick-list { margin: 0 -8px; } .new-cont-card-slider .slick-slide { margin: 0 8px; } .new-cont-card-slider .card-opt-rrc { display: none; } .new-cont-card-slider .card-bot { flex-direction: column; align-items: flex-start; } .payment { margin-top: 24px; margin-bottom: 80px; } .payment-nav { display: flex; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); padding: 4px; box-sizing: border-box; width: fit-content; } .payment-nav button { padding: 11px 24px; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; border-radius: var(--Border-radius-1, 10px); } .payment-nav button:hover { color: #FF5A00; } .payment-nav button.active { background: var(--Primary-1, #FF5A00); box-shadow: 0 2px 8px 0 rgba(37, 37, 37, 0.24); color: #fff; } .payment-cont { margin-top: 48px; max-width: 1028px; } .payment-cont-item { display: none; } .payment-cont-item.active { display: flex; flex-direction: column; } .waranty { margin-top: 32px; margin-bottom: 80px; } .waranty-nav { display: flex; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); padding: 4px; box-sizing: border-box; width: fit-content; } .waranty-nav button { padding: 11px 32px; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; border-radius: var(--Border-radius-1, 10px); } .waranty-nav button:hover { color: #FF5A00; } .waranty-nav button.active { background: #fff; color: var(--black, #222228); box-shadow: 0 2px 8px 0 rgba(37, 37, 37, 0.24); } .waranty-cont { margin-top: 40px; max-width: 1028px; } .waranty-cont-item { display: none; } .waranty-cont-item.active { display: flex; } .card-info-cont-block_waranty { display: flex; gap: 16px; } .card-info-cont-block_waranty-item { width: -webkit-fill-available; padding: 32px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-2, #FAFAFA); } .card-info-cont-block_waranty-item-pic { width: 56px; aspect-ratio: 1/1; height: -webkit-fill-available; margin-bottom: 20px; } .card-info-cont-block_waranty-item-pic img { width: 100%; height: 100%; } .card-info-cont-block_waranty-item-year { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; margin-bottom: 8px; } .card-info-cont-block_waranty-item-type { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; } .partner { margin-top: 24px; margin-bottom: 80px; } .partner .container { gap: 48px; display: flex; } .partner-side { max-width: 300px; min-width: 300px; display: flex; flex-direction: column; gap: 32px; } .partner-side-nav { display: flex; flex-direction: column; gap: 12px; } .partner-side-nav button { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; padding: 8px 16px; box-sizing: border-box; text-align: left; border-radius: var(--Border-radius-1, 10px); } .partner-side-nav button:hover { color: var(--Primary-1, #FF5A00); } .partner-side-nav button.active { color: var(--Primary-1, #FF5A00); background: rgba(255, 90, 0, 0.05); } .partner-side .card-info-cont-block_partner { margin: 0; width: 100%; display: flex; justify-content: center; align-items: center; } .partner-cont { } .partner-cont-item { display: none; } .partner-cont-item.active { display: flex; flex-direction: column; } .partner-cont-item-opt { display: flex; flex-direction: column; gap: 40px; } .partner-cont-item-opt article { display: flex; flex-direction: column; gap: 24px; } .partner-cont-item-opt article h2 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; } .partner-cont-item-opt article h3 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; } .partner-cont-item-opt-text { color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; display: flex; flex-direction: column; gap: 15px; } .partner-cont-item-opt-text a { text-decoration-line: underline; text-decoration-style: solid; text-decoration-skip-ink: none; text-decoration-thickness: auto; text-underline-offset: auto; text-underline-position: from-font; color: var(--Primary-1, #FF5A00); } .partner-cont-item-opt-text ul { padding-left: 20px; display: flex; flex-direction: column; gap: 10px; } .partner-cont-item-opt-banner { padding: 32px; padding-right: 263px; border-radius: var(--Border-radius-2, 16px); background: linear-gradient(282deg, rgba(255, 90, 0, 0.10) 0.77%, rgba(255, 90, 0, 0.80) 60.31%), rgba(255, 90, 0, 0.10); width: 100%; box-sizing: border-box; position: relative; } .partner-cont-item-opt-banner::after { content: ''; width: 228px; aspect-ratio: 1/1; position: absolute; top: 0; bottom: 0; right: 32px; background-image: url(/bitrix/templates/main/css/../img/partner/pic.svg); background-size: 100% 100%; } .partner-cont-item-opt-banner-title { color: var(--white, #FFF); font-family: "Golos Text"; font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; margin-bottom: 16px; } .partner-cont-item-opt-banner-text { align-self: stretch; color: var(--white, #FFF); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; } .partner-cont-item-opt-banner button { margin-top: 24px; padding: 11px 24px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); background: var(--white, #FFF); color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; } .partner-cont-item-opt-banner button:hover { background: #E8E8E8; } .partner-cont-item-opt article .card-info-cont-block_opt-stages { margin: 0; } .partner-cont-item-opt article .card-info-cont-block_partner { margin: 0; } .card-info-cont-block_partner_hid { display: none; } .partner-cont-item-asort { display: flex; flex-direction: column; gap: 16px; } .partner-cont-item-asort-item { display: flex; gap: 32px; padding: 24px; border-radius: var(--Border-radius-2, 16px); border: 1px solid var(--Grey-1, #F5F3F1); box-sizing: border-box; color: #222228; transition: 0.3s; } .partner-cont-item-asort-item:hover { background: var(--white, #FFF); box-shadow: 0 4px 16px 0 rgba(37, 37, 37, 0.12); color: var(--Primary-1, #FF5A00); } .partner-cont-item-asort-item-pic { width: 96px; aspect-ratio: 1/1; height: fit-content; } .partner-cont-item-asort-item-pic img { width: 100%; height: 100%; object-fit: cover; object-position: center center; } .partner-cont-item-asort-item-cont { display: flex; flex-direction: column; gap: 16px; } .partner-cont-item-asort-item-title { font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; transition: 0.3s; } .partner-cont-item-asort-item-row { display: flex; gap: 16px; } .partner-cont-item-asort-item-row a { display: flex; gap: 10px; align-items: center; justify-content: center; padding: 6px 18px; box-sizing: border-box; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); } .partner-cont-item-asort-item:hover .partner-cont-item-asort-item-row a { background: var(--Primary-1, #FF5A00); color: #fff; } .partner-cont-item-asort-item:hover .partner-cont-item-asort-item-row a:hover { background: var(--Dark-primary-1, #E25000); } .partner-cont-item-asort-item-icon { min-width: 20px; max-width: 20px; height: 20px; position: relative; } .partner-cont-item-asort-item-icon img { width: 100%; height: 100%; transition: 0.3s; } .partner-cont-item-asort-item-icon img.active { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1; opacity: 0; } .partner-cont-item-asort-item:hover .partner-cont-item-asort-item-icon img.active { opacity: 1; } .partner-cont-item-cat-top { display: flex; gap: 16px; margin-bottom: 24px; } .partner-cont-item-cat-row { display: flex; flex-direction: column; gap: 16px; } .partner-cont-item-cat-row-item { display: flex; gap: 32px; padding: 24px; box-sizing: border-box; border-radius: var(--Border-radius-2, 16px); border: 1px solid var(--Grey-1, #F5F3F1); transition: 0.3s; } .partner-cont-item-cat-row-item:hover { border: 1px solid var(--Grey-1, #F5F3F1); background: #FFF; box-shadow: 0 4px 16px 0 rgba(37, 37, 37, 0.12); color: var(--Primary-1, #FF5A00); } .partner-cont-item-cat-row-item-pic { max-width: 160px; min-width: 160px; height: 226px; } .partner-cont-item-cat-row-item-pic img { width: 100%; height: 100%; object-fit: contain; } .partner-cont-item-cat-row-item-cont { display: flex; flex-direction: column; gap: 24px; } .partner-cont-item-cat-row-item-title { font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; transition: 0.3s; } .partner-cont-item-cat-row-item-text { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 4; align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; text-overflow: ellipsis; } .partner-cont-item-cat-row-item:hover .partner-cont-item-asort-item-row a { background: var(--Primary-1, #FF5A00); color: #fff; } .partner-cont-item-cat-row-item:hover .partner-cont-item-asort-item-row a:hover { background: var(--Dark-primary-1, #E25000); } .partner-cont-item-cat-row-item:hover .partner-cont-item-asort-item-icon img.active { opacity: 1; } .partner-cont-item-cat-row-item-text-ext { display: none; } .partner-cont-item-sort { display: flex; gap: 48px; flex-wrap: wrap; } .partner-cont-item-sort a { width: calc(100% / 4 - 36px); display: flex; flex-direction: column; gap: 16px; color: var(--black, #252525); } .partner-cont-item-sort a:hover { color: var(--Primary-1, #FF5A00); } .partner-cont-item-sort-pic { border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Grey-1, #F5F3F1); background: #FFF; box-sizing: border-box; padding: 24px; transition: 0.3s; } .partner-cont-item-sort a:hover .partner-cont-item-sort-pic { background: #FFF; box-shadow: 0 4px 16px 0 rgba(37, 37, 37, 0.12); } .partner-cont-item-sort-pic img { width: 100%; aspect-ratio: 173.00/244.36; } .partner-cont-item-sort-name { font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; text-align: center; } .velo { margin-top: 24px; margin-bottom: 80px; } .velo-top { display: flex; gap: 16px; } .velo-top-cont { padding-right: 64px; } .velo-top-text { color: var(--black, #252525); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; margin-bottom: 16px; } .velo-top-sub { color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; } .velo-top-row { margin-top: 40px; display: flex; gap: 24px; } .velo-top-row button { color: var(--Primary-1, #FF5A00); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; padding: 11px 24px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Primary-1, #FF5A00); background: var(--white, #FFF); } .velo-top-row button:first-child { border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Primary-1, #FF5A00); background: var(--Primary-1, #FF5A00); color: #fff; } .velo-top-row button:hover { background: var(--Dark-primary-1, #E25000); color: #fff; border-color: #E25000; } .velo-top-slider-s { position: relative; } .velo-top-slider-s .slider-counter { display: none; } .velo-top-slider { max-width: 680px; min-width: 680px; width: 100%; } .velo-top-slider .slick-list { box-shadow: 0 8px 24px 0 rgba(37, 37, 37, 0.16); border-radius: 16px; aspect-ratio: 680.00/382.55; } .velo-top-slider img { width: 100%; height: 100%; object-fit: cover; object-position: center center; } .velo-top-slider .slick-arrow { left: 16px; } .velo-top-slider .slick-next { right: 16px; left: auto; } .velo-top-slider .slick-dots { position: absolute; left: 0; right: 0; bottom: -22px; display: flex; margin: auto; justify-content: center; list-style: none; gap: 8px; } .velo-top-slider .slick-dots button { font-size: 0; width: 4px; height: 2px; opacity: 0.2; background: #222228; border-radius: 16px; } .velo-top-slider .slick-dots .slick-active button { width: 16px; opacity: 0.6; } .velo-add { margin-top: 80px; display: flex; gap: 16px; flex-wrap: wrap; } .velo-add-item { width: calc(100% / 3 - 10.7px); padding: 32px; box-sizing: border-box; border-radius: var(--Border-radius-2, 16px); border: 2px solid var(--Grey-1, #F5F3F1); display: flex; flex-direction: column; gap: 20px; } .velo-add-item-pic { width: 56px; height: fit-content; aspect-ratio: 1/1; } .velo-add-item-pic img { width: 100%; } .velo-add-item-text { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .velo-info { margin-top: 80px; } .velo-info h2 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 36px; font-style: normal; font-weight: 600; line-height: 44px; } .velo-info-row { margin-top: 32px; display: flex; gap: 48px; } .velo-info-side { display: flex; flex-direction: column; max-width: 300px; min-width: 300px; } .velo-info-side-top { display: none !important; } .velo-info-side-row { display: flex; flex-direction: column; gap: 12px; } .velo-info-side-row button { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; display: flex; align-items: center; gap: 12px; padding: 8px 16px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); text-align: left; } .velo-info-side-row button.active { color: var(--Primary-1, #FF5A00); background: rgba(255, 90, 0, 0.05); } .velo-info-side-row button:hover { color: var(--Primary-1, #FF5A00); } .velo-info-side-pic { max-width: 20px; min-width: 20px; height: 20px; transition: 0.3s; position: relative; } .velo-info-side-pic img { width: 100%; height: 100%; transition: 0.3s; opacity: 0.6; } .velo-info-side-pic img.active { position: absolute; top: 0; right: 0; bottom: 0; left: 0; opacity: 0; } .velo-info-side-row button.active img { opacity: 0; } .velo-info-side-row button.active img.active { opacity: 1; } .velo-info-side-row button:hover img { opacity: 0; } .velo-info-side-row button:hover img.active { opacity: 1; } .velo-info-cont { display: flex; flex-direction: column; width: 100%; } .velo-info-cont-row { border-radius: var(--Border-radius-2, 16px); border: 2px solid var(--Grey-1, #F5F3F1); padding: 32px; box-sizing: border-box; } .velo-info-cont-row-item { display: none; } .velo-info-cont-row-item.active { display: flex; flex-direction: column; } .velo-info-cont-row-item h3 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; margin-bottom: 24px; } .velo-info-cont-row-item ul { display: flex; flex-direction: column; gap: 24px; list-style: none; } .velo-info-cont-row-item ul li label { display: flex; gap: 12px; align-items: flex-start; cursor: pointer; color: #252525; } .velo-info-cont-row-item ul li label:hover { color: #FF5A00; } .velo-info-cont-row-item ul li label input { display: none; } .velo-info-cont-row-item label input[type="checkbox"]~span { max-width: 15px; min-width: 15px; height: 15px; margin-top: 4px; border-radius: 4px; border: 1.5px solid rgba(34, 34, 40, 0.05); background: var(--Grey-1, #F5F3F1); display: flex; position: relative; justify-content: center; align-items: center; transition: 0.3s; box-sizing: border-box; overflow: hidden; } .velo-info-cont-row-item label input[type="checkbox"]~span::after { content: ''; width: 14px; height: 12px; background-image: url(/bitrix/templates/main/css/../img/catalog/gal.svg); background-size: 100% 100%; opacity: 0; transition: 0.3s; } .velo-info-cont-row-item label:hover input[type="checkbox"]~span { border: 1.5px solid var(--Primary-1, #FF5A00); background-color: #fff; } .velo-info-cont-row-item label input[type="checkbox"]:checked~span { background-color: #FF5A00; border: 1.5px solid var(--Primary-1, #FF5A00) !important; } .velo-info-cont-row-item label input[type="checkbox"]:checked~span::after { opacity: 1; } .velo-info-cont-row-item-row { display: flex; justify-content: space-between; align-items: flex-end; width: 100%; gap: 12px; position: relative; } .velo-info-cont-row-item-row::after { content: ''; display: flex; width: 100%; height: 5px; bottom: 0; border-top: 1px dashed var(--black, #222228); opacity: 0.5; position: absolute; z-index: -1; transition: 0.3s; } .velo-info-cont-row-item label:hover .velo-info-cont-row-item-row::after { border-color: #FF5A00; } .velo-info-cont-row-item-text { display: flex; flex-direction: column; gap: 4px; background-color: #fff; padding-right: 12px; max-width: 804px; } .velo-info-cont-row-item-text-title { font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; transition: 0.3s; } .velo-info-cont-row-item-text-desc { font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; transition: 0.3s; } .velo-info-cont-row-item-num { font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; white-space: nowrap; background-color: #fff; padding-left: 12px; transition: 0.3s; } .velo-info-cont .card-info-cont-alert { margin-top: 24px; } .card-info-cont-res { margin-top: 24px; padding: 32px; box-sizing: border-box; display: flex; justify-content: space-between; align-items: flex-end; border-radius: var(--Border-radius-2, 16px); background: var(--Grey-2, #FAFAFA); } .card-info-cont-res-text { display: flex; flex-direction: column; gap: 12px; color: var(--black, #222228); font-family: "Golos Text"; font-size: 36px; font-style: normal; font-weight: 600; line-height: 44px; } .card-info-cont-res-text span { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; } .card-info-cont-res button { color: var(--white, #FFF); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; padding: 11px 24px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); background: var(--Primary-1, #FF5A00); } .card-info-cont-res button:hover { background: var(--Dark-primary-1, #E25000); } .catalog-top-clear { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; display: flex; align-items: center; gap: 10px; padding: 6px 0; box-sizing: border-box; margin-left: 24px; white-space: nowrap; } .catalog-top-clear::before { content: ''; min-width: 18px; max-width: 18px; height: 18px; background-image: url(/bitrix/templates/main/css/../img/partner/trash.svg); background-size: 100% 100%; display: flex; opacity: 0.4; transition: 0.3s; } .catalog-top-clear:hover { color: #FF5A00; } .catalog-top-clear:hover::before { background-image: url(/bitrix/templates/main/css/../img/partner/trash_active.svg); opacity: 1; } .search { margin-bottom: 24px; position: relative; width: 100%; } .search input { width: 100%; padding: 11px 16px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Grey-1, #F5F3F1); background: var(--white, #FFF); color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; transition: 0.3s; } .search input:hover, .search input:focus { border-color: #FF5A00; } .search-clear { max-width: 20px; min-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/partner/clear.svg); background-size: 100% 100%; position: absolute; right: 16px; top: 0; bottom: 0; margin: auto; z-index: 1; opacity: 0.6; transition: 0.3s; } .search-clear:hover { opacity: 1; } .error { padding: 80px 0; display: flex; justify-content: center; margin-bottom: 80px; margin-top: 32px; } .error-cont { max-width: 478px; width: 100%; display: flex; flex-direction: column; align-items: center; } .error-num { color: var(--Primary-1, #FF5A00); font-family: "Golos Text"; font-size: 128px; font-style: normal; font-weight: 500; line-height: normal; display: flex; align-items: center; margin-bottom: 8px; } .error-num span { width: 128px; aspect-ratio: 1/1; height: fit-content; background-image: url(/bitrix/templates/main/css/../img/partner/wheel.svg); background-size: 100% 100%; } .error-cont h1 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; margin-bottom: 24px; } .error-text { display: flex; flex-direction: column; gap: 20px; color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; text-align: center; } .error-cont a { margin-top: 48px; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; padding: 11px 24px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); } .error-cont a:hover { background: #E8E8E8; } .thx { margin-top: 32px; padding-top: 48px; margin-bottom: 80px; } .thx-cont { display: flex; flex-direction: column; align-items: center; gap: 24px; } .thx-pic { width: 96px; height: fit-content; aspect-ratio: 1/1; } .thx-pic img { width: 100%; height: 100%; } .thx-cont h1 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; } .thx-text { color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; display: flex; flex-direction: column; align-items: center; gap: 24px; text-align: center; } .thx-soc { display: flex; gap: 32px; } .thx-soc a { width: 24px; aspect-ratio: 1/1; height: fit-content; } .thx-soc a:hover { opacity: 0.6; } .thx-back { margin-top: 24px; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; padding: 11px 24px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); } .thx-back:hover { background: #E8E8E8; } .solo-title-print { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; display: flex; align-items: center; gap: 10px; } .solo-title-print::after { content: ''; min-width: 18px; max-width: 18px; height: 18px; transition: 0.3s; opacity: 0.6; background-image: url(/bitrix/templates/main/css/../img/partner/print.svg); background-size: 100% 100%; display: flex; } .solo-title-print:hover { opacity: 1; } .solo-title-print:hover::after { opacity: 1; } .contacts { margin-top: 32px; margin-bottom: 80px; } .contacts-top { border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Grey-1, #F5F3F1); padding: 32px; box-sizing: border-box; margin-bottom: 56px; } .contacts-top .footer-info { } .contacts-top .footer-info-block { width: calc(100% / 4 - 48px); } .contacts-top .footer-info-block:nth-last-child(-n + 2) { width: calc(100% / 2 - 32px); } .contacts-top .footer-info-title { font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; } .contacts-top .footer-info-link { font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; } .feedback-popup { display: none; } .feedback-popup.active { position: fixed; z-index: 10; top: 0; bottom: 0; right: 0; left: 0; background-color: rgba(34, 34, 40, 0.40); display: flex; justify-content: center; align-items: center; } .contacts-top-btn { color: var(--white, #FFF); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; padding: 11px 24px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); background: var(--Primary-1, #FF5A00); margin-top: 32px; } .contacts-top-btn:hover { background: var(--Dark-primary-1, #E25000); } .contacts-adr { margin-bottom: 56px; display: flex; gap: 16px; height: 516px; } .contacts-adr-map { width: 100%; height: 100%; border-radius: var(--Border-radius-1, 10px); overflow: hidden; } .contacts-adr-map iframe { width: 100%; height: 100%; } .contacts-adr-side { max-width: 448px; min-width: 448px; display: flex; flex-direction: column; gap: 16px; } .contacts-adr-side-item { padding: 24px; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Grey-1, #F5F3F1); max-height: 72px; overflow: hidden; box-sizing: border-box; transition: 0.3s; } .contacts-adr-side-item:first-child { max-height: 96px; } .contacts-adr-side-item.active { max-height: 600px !important; } .contacts-adr-side-item-top { display: flex; align-items: center; gap: 16px; color: var(--black, #222228); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; transition: 0.3s; cursor: pointer; margin-bottom: 24px; height: 24px; } .contacts-adr-side-item:first-child .contacts-adr-side-item-top { height: 48px; } .contacts-adr-side-item-top:hover { color: #FF5A00; } .contacts-adr-side-item-top::after { content: ''; max-width: 24px; min-width: 24px; height: 24px; background-image: url(/bitrix/templates/main/css/../img/catalog/drop_arrow.svg); background-size: 100% 100%; transition: 0.3s; opacity: 0.6; margin-left: auto; } .contacts-adr-side-item-top:hover::after { opacity: 1; background-image: url(/bitrix/templates/main/css/../img/catalog/drop_arrow_active.svg); } .contacts-adr-side-item.active .contacts-adr-side-item-top::after { transform: rotate(180deg); opacity: 1; } .contacts-adr-side-item-top-pic { width: 24px; height: -webkit-fill-available; aspect-ratio: 1/1; } .contacts-adr-side-item-top-pic img { width: 100%; height: 100%; } .contacts-adr-side-item-cont { display: flex; flex-direction: column; gap: 24px; } .contacts-adr-side-item-cont-block { display: flex; flex-direction: column; gap: 12px; color: var(--black, #252525); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; } .contacts-adr-side-item-cont-block span { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .coords { display: flex; align-items: center; gap: 6px; color: var(--black, #252525); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; } .coords-text { } .coords-copy { width: 20px; height: 20px; background: url('/bitrix/templates/main/css/../img/partner/copy.svg'); border: none; cursor: pointer; transition: .3s; opacity: 0.6; } .coords-copy.copied { opacity: 1; } .contacts-slider .slick-list { margin: 0 -8px; } .contacts-slider .slick-slide { margin: 0 8px; aspect-ratio: 4/3; border-radius: var(--Border-radius-1, 10px); overflow: hidden; } .contacts-slider .slick-slide div { } .contacts-slider .slick-slide div img { width: 100%; height: 100%; object-fit: cover; object-position: center center; } .contacts-slider-s { position: relative; margin-bottom: 56px; } .contacts-slider-s .slider-counter { } .contacts-rek { padding: 32px; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-2, #FAFAFA); position: relative; } .contacts-rek h2 { color: var(--black, #222228); font-family: "Golos Text"; font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; margin-bottom: 24px; } .contacts-rek-row { display: flex; gap: 32px; } .contacts-rek-col { width: 50%; display: flex; flex-direction: column; gap: 32px; } .contacts-rek-block { display: flex; flex-direction: column; gap: 12px; } .contacts-rek-block-title { opacity: 0.6; align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; } .contacts-rek-block ul { list-style: none; display: flex; flex-direction: column; gap: 12px; color: var(--black, #252525); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; } .contacts-rek-dow { position: absolute; right: 32px; bottom: 32px; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; display: flex; align-items: center; justify-content: center; gap: 12px; padding: 11px 24px; border-radius: var(--Border-radius-1, 10px); background: var(--white, #FFF); box-sizing: border-box; } .contacts-rek-dow:hover { background-color: #E8E8E8; } .contacts-rek-dow::before { content: ''; max-width: 20px; min-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/partner/down.svg); background-size: 100% 100%; display: flex; } .contacts-rek-dow span { display: contents; } .cart { margin-top: 32px; margin-bottom: 80px; } .cart-row { display: flex; gap: 48px; } .cart-side { max-width: 300px; min-width: 300px; display: flex; flex-direction: column; gap: 24px; position: sticky; height: fit-content; top: 80px; } .cart-side-top { display: flex; flex-direction: column; gap: 16px; } .cart-side-top-item { display: flex; flex-direction: column; gap: 8px; } .cart-side-top-title { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; } .cart-side-top-field { display: flex; gap: 8px; justify-content: space-between; align-items: center; } .cart-side-top-field input { color: var(--black, #252525); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; width: 100%; transition: 0.3s; display: none; } .cart-side-top-field input:hover, .cart-side-top-field input:focus { color: var(--Primary-1, #FF5A00); } .cart-side-top-field-info { color: var(--black, #252525); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; transition: 0.3s; } .cart-side-top-field-info:hover { color: var(--Primary-1, #FF5A00); } .cart-side-top-field button { max-width: 18px; min-width: 18px; height: 18px; background-image: url(/bitrix/templates/main/css/../img/cart/pencil.svg); background-size: 100% 100%; display: flex; } .cart-side-promo { position: relative; } .cart-side-promo input { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; padding: 11px 16px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Grey-1, #F5F3F1); background: var(--white, #FFF); width: 100%; transition: 0.3s; } .cart-side-promo input:hover, .cart-side-promo input:focus { border-color: #FF5A00; } .cart-side-promo button { max-width: 20px; min-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/cart/promo_arrow.svg); background-size: 100% 100%; position: absolute; top: 0; bottom: 0; right: 12px; margin: auto; opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; } .cart-side-promo input:hover~button, .cart-side-promo input:focus~button { opacity: 1; } .cart-side-price { list-style: none; display: flex; flex-direction: column; gap: 18px; color: var(--black, #252525); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; } .cart-side-price li { display: flex; justify-content: space-between; gap: 12px; align-items: flex-end; } .cart-side-price li span { white-space: nowrap; } .cart-side-price li span:first-child { order: 0; } .cart-side-price li span:last-child { order: 2; } .cart-side-price li::after { content: ''; order: 1; border-top: 1px dashed var(--black, #222228); width: 100%; height: 5px; opacity: 0.5; } .cart-side-total { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; } .cart-side-total span { white-space: nowrap; } .cart-side-total span:first-child { order: 0; color: var(--black, #252525); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; } .cart-side-total span:last-child { order: 2; color: var(--black, #252525); font-family: "Golos Text"; font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; } .cart-side-total::after { content: ''; order: 1; border-top: 1px dashed var(--black, #222228); width: 100%; height: 5px; opacity: 0.5; } .cart-side-bot { display: flex; flex-direction: column; gap: 12px; } .cart-side-bot button, .cart-side-bot a { font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; width: 100%; padding: 11px 24px; box-sizing: border-box; display: flex; justify-content: center; align-items: center; gap: 12px; border-radius: var(--Border-radius-1, 10px); } .cart-side-bot button.ofor { color: var(--white, #FFF); background: var(--Primary-1, #FF5A00); } .cart-side-bot button.ofor:hover { background: var(--Dark-primary-1, #E25000); } .cart-side-bot .back, .cart-side-bot .save { color: var(--black, #222228); border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); white-space: nowrap; } .cart-side-bot .back:hover, .cart-side-bot .save:hover { background: #E8E8E8; } .cart-side-bot .save::before { content: ''; max-width: 20px; min-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/cart/file.svg); background-size: 100% 100%; display: flex; } .cart-cont { width: 100%; display: flex; flex-direction: column; gap: 56px; } .cart-main-top { display: flex; gap: 24px; align-items: center; padding-left: 16px; } .cart-main-top-all { padding: 6px; box-sizing: border-box; display: flex; gap: 10.5px; align-items: center; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; text-overflow: ellipsis; border-radius: var(--Border-radius-1, 10px); transition: 0.3s; cursor: pointer; } .cart-main-top-all:hover { background: rgba(255, 90, 0, 0.05); color: var(--Primary-1, #FF5A00); } .cart-main-top-all input { display: none; } .cart-main-top-all input[type="checkbox"]~span { max-width: 15px; min-width: 15px; height: 15px; border-radius: 4px; border: 1.5px solid rgba(34, 34, 40, 0.05); background: var(--Grey-1, #F5F3F1); display: flex; position: relative; justify-content: center; align-items: center; transition: 0.3s; box-sizing: border-box; overflow: hidden; } .cart-main-top-all input[type="checkbox"]~span::after { content: ''; width: 14px; height: 12px; background-image: url(/bitrix/templates/main/css/../img/catalog/gal.svg); background-size: 100% 100%; opacity: 0; transition: 0.3s; } .cart-main-top-all:hover input[type="checkbox"]~span { border: 1.5px solid var(--Primary-1, #FF5A00); background-color: #fff; } .cart-main-top-all input[type="checkbox"]:checked~span { background-color: #FF5A00; border: 1.5px solid var(--Primary-1, #FF5A00) !important; } .cart-main-top-all input[type="checkbox"]:checked~span::after { opacity: 1; } .cart-main-top-clear { padding: 6px 0; box-sizing: border-box; display: flex; gap: 10px; align-items: center; justify-content: center; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; } .cart-main-top-clear::before { content: ''; max-width: 18px; min-width: 18px; height: 18px; background-image: url(/bitrix/templates/main/css/../img/cart/trash.svg); background-size: 100% 100%; display: flex; opacity: 0.6; transition: 0.3s; } .cart-main-top-clear:hover::before { opacity: 1; } .cart-main-row { display: flex; flex-direction: column; gap: 16px; margin-top: 16px; } .cart-main-item-block { width: 100%; position: relative; } .cart-main-item-block input[type="checkbox"]~.cart-main-item_as { max-width: 15px; min-width: 15px; height: 15px; border-radius: 4px; border: 1.5px solid rgba(34, 34, 40, 0.05); background: var(--Grey-1, #F5F3F1); display: flex; position: relative; justify-content: center; align-items: center; transition: 0.3s; box-sizing: border-box; overflow: hidden; cursor: pointer; } .cart-main-item_as { max-width: 20px; min-width: 20px; height: 20px; position: absolute !important; top: 16px; left: 16px; } .cart-main-item-block input[type="checkbox"]~.cart-main-item_as::after { content: ''; width: 14px; height: 12px; background-image: url(/bitrix/templates/main/css/../img/catalog/gal.svg); background-size: 100% 100%; opacity: 0; transition: 0.3s; } .cart-main-item-block:hover input[type="checkbox"]~.cart-main-item_as { border: 1.5px solid var(--Primary-1, #FF5A00); background-color: #fff; } .cart-main-item-block input[type="checkbox"]:checked~.cart-main-item_as { background-color: #FF5A00; border: 1.5px solid var(--Primary-1, #FF5A00) !important; } .cart-main-item-block input[type="checkbox"]:checked~.cart-main-item_as::after { opacity: 1; } .cart-main-item-block input { display: none; } .cart-main-item { border-radius: var(--Border-radius-1, 10px); border: 1px solid var(--Grey-1, #F5F3F1); padding: 16px; box-sizing: border-box; display: flex; gap: 24px; transition: 0.3s; } .cart-main-item-block:hover .cart-main-item, .cart-main-item-block input:checked~.cart-main-item { background: var(--white, #FFF); box-shadow: 0 4px 16px 0 rgba(37, 37, 37, 0.12); } .cart-main-item-pic { max-width: 122px; min-width: 122px; aspect-ratio: 1/1; height: fit-content; } .cart-main-item-pic img { width: 100%; height: 100%; object-fit: contain; object-position: center center; } .cart-main-item-cont { display: flex; flex-direction: column; max-width: 524px; width: 100%; } .cart-main-item-cont-title { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 500; line-height: 18px; text-overflow: ellipsis; margin-bottom: 8px; } .cart-main-item-block:hover .cart-main-item .cart-main-item-cont-title, .cart-main-item-block input:checked~.cart-main-item .cart-main-item-cont-title { color: var(--Primary-1, #FF5A00); } .cart-main-item-cont-add { display: flex; align-items: center; gap: 12px; } .cart-main-item-cont-add-art { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; text-overflow: ellipsis; } .cart-main-item-cont .card-cont-info-color { max-width: 100%; margin: 0; margin-top: 16px; } .cart-main-item-cont .card-cont-info-color-drop-btn { padding-top: 10px; padding-bottom: 10px; } .cart-main-item-cont .card-cont-info-color-drop-menu { top: 52px; } .cart-main-item-counter { display: flex; flex-direction: column; gap: 8px; align-items: center; margin: 0 auto; } .cart-main-item-counter-sub { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 19px; } .cart-main-item-counter-block { padding: 6px 18px; box-sizing: border-box; display: flex; align-items: center; gap: 10px; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); } .cart-main-item-counter-block-btn { max-width: 20px; min-width: 20px; height: 20px; background-size: 100% 100%; transition: 0.3s; } .cart-main-item-counter-block-btn_less { background-image: url(/bitrix/templates/main/css/../img/card/less.svg); } .cart-main-item-counter-block-btn_less:hover { background-image: url(/bitrix/templates/main/css/../img/card/less_hov.svg); } .cart-main-item-counter-block-btn_more { background-image: url(/bitrix/templates/main/css/../img/card/more.svg); } .cart-main-item-counter-block-btn_more:hover { background-image: url(/bitrix/templates/main/css/../img/card/more_hov.svg); } .cart-main-item-counter-block-num { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; width: 24px; } .cart-main-item-price { display: flex; flex-direction: column; margin: 0 auto; } .cart-main-item-price-total { color: var(--black, #222228); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; } .cart-main-item-price-bot { display: flex; align-items: center; gap: 8px; } .cart-main-item-price-old { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 19px; text-decoration-line: line-through; } .cart-main-item-price-dis { color: var(--Error, #F93C00); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .cart-main-item-add { display: flex; flex-direction: column; gap: 16px; margin-left: auto; } .cart-main-item-add-del { min-width: 20px; max-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/cart/trash.svg); background-size: 100% 100%; opacity: 0.4; transition: 0.3s; } .cart-main-item-add-del:hover { background-image: url(/bitrix/templates/main/css/../img/cart/trash_active.svg); opacity: 1; } .cart-main-item-add-fav { min-width: 20px; max-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/card/fav.svg); background-size: 100% 100%; transition: 0.3s; } .cart-main-item-add-fav:hover { background-image: url(/bitrix/templates/main/css/../img/card/fav_hover.svg); opacity: 1; } .cart-main-item-add-comp { min-width: 20px; max-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/card/comp.svg); background-size: 100% 100%; transition: 0.3s; } .cart-main-item-add-comp:hover { background-image: url(/bitrix/templates/main/css/../img/card/comp_hover.svg); opacity: 1; } .cart-block { display: flex; flex-direction: column; gap: 32px; } .cart-title { display: flex; align-items: center; justify-content: space-between; gap: 24px; /* margin-bottom: 32px; */ } .cart-title h2 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; } .cart-title a { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; text-overflow: ellipsis; } .cart-title a:hover { opacity: 1; } .cart-block-field { display: flex; flex-direction: column; gap: 12px; } .cart-block-field-title { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; } .cart-block-field-a { position: relative; width: 100%; } .cart-block-field-a input { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; padding: 14px 16px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Grey-1, #F5F3F1); background: var(--white, #FFF); width: 100%; transition: 0.3s; } .cart-block-field-a textarea { padding: 14px 16px; box-sizing: border-box; width: 100%; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Grey-1, #F5F3F1); width: 100%; height: 92px; resize: none; outline: none !important; transition: 0.3s; } .cart-block-field-a input:hover, .cart-block-field-a input:focus, .cart-block-field-a textarea:hover, .cart-block-field-a textarea:focus { border-color: #FF5A00; } .cart-block-field-a_loc { max-width: 20px; min-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/cart/loc.svg); background-size: 100% 100%; position: absolute; top: 0; bottom: 0; right: 16px; margin: auto; opacity: 0.6; transition: 0.3s; } .cart-block-field-a input:hover~.cart-block-field-a_loc, .cart-block-field-a input:focus~.cart-block-field-a_loc { opacity: 1; } .cart-block-del { display: flex; flex-direction: column; gap: 16px; } .cart-block-del-item { position: relative; } .cart-block-del-item-cont { padding: 24px; padding-left: 60px; box-sizing: border-box; border-radius: var(--Border-radius-2, 16px); border: 1px solid var(--Grey-1, #F5F3F1); display: flex; flex-direction: column; gap: 16px; cursor: pointer; } .cart-block-del-item input[type="radio"]:checked~.cart-block-del-item-cont { background: rgba(255, 90, 0, 0.05); } .cart-block-del-item input { display: none; } .cart-block-del-item input[type="radio"]~span { max-width: 18px; min-width: 18px; height: 18px; background-color: #F5F3F1; border-radius: 50%; box-sizing: border-box; border: 1.5px solid transparent; transition: 0.3s; display: flex; justify-content: center; align-items: center; position: absolute; left: 27px; top: 27px; } .cart-block-del-item input[type="radio"]~span::after { content: ''; max-width: 10px; min-width: 10px; height: 10px; border-radius: 50%; background-color: #FF5A00; transition: 0.3s; opacity: 0; display: flex; } .cart-block-del-item:hover input[type="radio"]~span { border: 1.5px solid #FF5A00; } .cart-block-del-item input[type="radio"]:checked~span { border: 1.5px solid #FF5A00; background-color: #fff; } .cart-block-del-item input[type="radio"]:checked~span::after { opacity: 1; } .cart-block-del-item-title { color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; transition: 0.3s; } .cart-block-del-item input[type="radio"]:checked~.cart-block-del-item-cont .cart-block-del-item-title { color: var(--Primary-1, #FF5A00); } .cart-block-del-item-adr { color: var(--black, #222228); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; display: flex; gap: 8px; } .cart-block-del-item-adr::before { content: ''; max-width: 20px; min-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/cart/loc_active.svg); background-size: 100% 100%; display: flex; margin-top: 2px; } .cart-block-del-item-text { color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; display: flex; flex-direction: column; gap: 15px; } .cart-block-del-item-text ul { padding-left: 30px; display: flex; flex-direction: column; gap: 10px; } .cart-block-del-item-map { width: 100%; height: 320px; border-radius: var(--Border-radius-1, 10px); overflow: hidden; margin-top: 8px; } .cart-block-del-item-map iframe { width: 100%; height: 100%; } .cart-block-form { display: flex; gap: 24px; flex-wrap: wrap; } .cart-block-form-item { display: flex; flex-direction: column; gap: 12px; width: calc(100% / 3 - 16px); } .cart-block-form-item_long { width: 100%; } .cart-block-form-item span { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; } .cart-block-form-item input { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; padding: 14px 16px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Grey-1, #F5F3F1); transition: 0.3s; } .cart-block-form-item textarea { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; padding: 14px 16px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Grey-1, #F5F3F1); transition: 0.3s; height: 92px; outline: none !important; resize: none; } .cart-block-form-item input:hover, .cart-block-form-item input:focus { border-color: #FF5A00; } .cart-block-form-item textarea:hover, .cart-block-form-item textarea:focus { border-color: #FF5A00; } .cart-block-form .pop-cont-check { width: 100%; } .cart-block-form input[type='submit'] { color: var(--white, #FFF); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; padding: 11px 24px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); background: var(--Primary-1, #FF5A00); cursor: pointer; transition: 0.3s; } .cart-block-form input[type='submit']:hover { background: #E25000; } .comp { margin-top: 24px; margin-bottom: 80px; } .comp-nav { display: flex; gap: 16px; overflow-x: scroll; margin: 0 -16px; padding: 0 16px; margin-bottom: 24px; } .comp-nav::-webkit-scrollbar { display: none; } .comp-nav button { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; white-space: nowrap; padding: 11px 24px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); } .comp-nav button:hover { background: #E8E8E8; } .comp-nav button.active { color: var(--white, #FFF); background: var(--Primary-1, #FF5A00); } .comp-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 24px; white-space: nowrap; overflow-x: scroll; margin: 0 -16px; padding: 0 16px; margin-bottom: 24px; } .comp-top::-webkit-scrollbar { display: none; } .comp-top label { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; display: flex; align-items: center; gap: 10px; cursor: pointer; } .comp-top label input { display: none; } .comp-top label input[type="checkbox"]~span { max-width: 15px; min-width: 15px; height: 15px; border-radius: 4px; border: 1.5px solid rgba(34, 34, 40, 0.05); background: var(--Grey-1, #F5F3F1); display: flex; position: relative; justify-content: center; align-items: center; transition: 0.3s; box-sizing: border-box; overflow: hidden; } .comp-top label input[type="checkbox"]~span::after { content: ''; width: 14px; height: 12px; background-image: url(/bitrix/templates/main/css/../img/catalog/gal.svg); background-size: 100% 100%; opacity: 0; transition: 0.3s; } .comp-top label:hover input[type="checkbox"]~span { border: 1.5px solid var(--Primary-1, #FF5A00); background-color: #fff; } .comp-top label input[type="checkbox"]:checked~span { background-color: #FF5A00; border: 1.5px solid var(--Primary-1, #FF5A00) !important; } .comp-top label input[type="checkbox"]:checked~span::after { opacity: 1; } .comp .card { border-radius: 0; padding-bottom: 0; } .comp .card:hover { box-shadow: none; } .card-comp { display: flex; flex-direction: column; list-style: none; border-top: 1px solid var(--Grey-1, #F5F3F1); margin: 0 -16px; margin-top: 24px; } .card-comp li { display: flex; flex-direction: column; gap: 16px; padding: 16px; box-sizing: border-box; align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; border-bottom: 1px solid var(--Grey-1, #F5F3F1); transition: 0.3s; } .card-comp li.hover { background: var(--Grey-2, #FAFAFA); } .card-comp li span { opacity: 0; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; } .slick-current .card-comp li span { opacity: 0.6; } .comp .main-popular-slider { margin-right: -4px; } .comp .main-popular-slider .slick-slide { margin: 0; } .comp .main-popular-slider .slick-list { margin: 0; } .client { margin-top: 32px; margin-bottom: 80px; } .client .container { display: flex; gap: 48px; } .client-side { max-width: 300px; min-width: 300px; display: flex; flex-direction: column; gap: 12px; } .client-side button, .client-side .exit { padding: 8px 16px; box-sizing: border-box; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; border-radius: var(--Border-radius-1, 10px); display: flex; align-items: flex-start; } .client-side button.active { color: var(--Primary-1, #FF5A00); background: rgba(255, 90, 0, 0.05); } .client-side button:hover, .client-side .exit:hover { color: var(--Primary-1, #FF5A00); } .client-side .exit { gap: 12px; } .client-side .exit::before { content: ''; max-width: 20px; min-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/client/exit.svg); background-size: 100% 100%; display: flex; } .client-cont { width: 100%; } .client-cont-item { display: none; } .client-cont-item.active { display: flex; flex-direction: column; } .client-cont-info { padding: 32px; box-sizing: border-box; border-radius: var(--Border-radius-2, 16px); border: 2px solid var(--Grey-1, #F5F3F1); display: flex; gap: 32px; position: relative; margin-bottom: 40px; } .client-cont-info-left { } .client-cont-info-left label { display: flex; flex-direction: column; align-items: center; gap: 11px; opacity: 0.6; align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; text-align: center; cursor: pointer; transition: 0.3s; } .client-cont-info-left:hover label { opacity: 1; } .client-cont-info-left input { display: none; } .client-cont-info-pic { width: 96px; height: fit-content; aspect-ratio: 1/1; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); overflow: hidden; display: flex; justify-content: center; align-items: center; } .client-cont-info-pic::after { content: ''; width: 40px; height: 40px; background-image: url(/bitrix/templates/main/css/../img/client/person.svg); background-size: 100% 100%; display: flex; } .client-cont-info-main { width: 100%; } .client-cont-info-title { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; margin-bottom: 24px; } .client-cont-info-row { display: flex; gap: 24px 64px; flex-wrap: wrap; } .client-cont-info-row-item { /* width: calc(100% / 3 - 42.7px); */ display: flex; flex-direction: column; gap: 12px; } .client-cont-info-row-item span { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; } .client-cont-info-row-item-text { color: var(--black, #252525); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; } .client-cont-info-row-item-text a { color: var(--Primary-1, #FF5A00); text-decoration-line: underline; text-decoration-style: solid; text-decoration-skip-ink: none; text-decoration-thickness: auto; text-underline-offset: auto; text-underline-position: from-font; } .client-cont-info-row-item-text ul { display: flex; flex-direction: column; gap: 16px; list-style: none; max-width: 643px; } .client-cont-set { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; padding: 11px 24px; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); box-sizing: border-box; position: absolute; right: 32px; bottom: 32px; } .client-cont-set:hover { background: var(--Grey-3, #E8E8E8); } .client-cont-orders { } .client-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 24px; } .client-top h2 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; } .client-top a { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; text-overflow: ellipsis; } .client-top a:hover { opacity: 1; } .client-cont-orders { display: flex; flex-direction: column; } .client-cont-orders-row { display: flex; flex-direction: column; gap: 16px; } .client-cont-orders-item { padding: 24px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Grey-1, #F5F3F1); position: relative; transition: 0.3s; color: var(--black, #252525); } .client-cont-orders-item_dis { background: var(--Grey-2, #FAFAFA); border-color: transparent; } .client-cont-orders-item:hover { background: var(--white, #FFF); box-shadow: 0 4px 16px 0 rgba(37, 37, 37, 0.12); color: var(--Primary-1, #FF5A00); } .client-cont-orders-item-title { font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; margin-bottom: 10px; } .client-cont-orders-item-add { display: flex; gap: 16px; opacity: 0.6; color: var(--black, #252525); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; } .client-cont-orders-item-bot { margin-top: 24px; display: flex; gap: 16px; } .client-cont-orders-item-bot button { padding: 4px 16px; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Grey-1, #F5F3F1); background: var(--Grey-1, #F5F3F1); display: flex; align-items: center; gap: 10px; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; } .client-cont-orders-item-pic { max-width: 20px; min-width: 20px; height: 20px; position: relative; } .client-cont-orders-item-pic img { width: 100%; height: 100%; transition: 0.3s; } .client-cont-orders-item-pic img.active { position: absolute; top: 0; bottom: 0; right: 0; left: 0; opacity: 0; } .client-cont-orders-item:hover .client-cont-orders-item-bot button { background: var(--Primary-1, #FF5A00); color: #fff; } .client-cont-orders-item:hover .client-cont-orders-item-bot button:hover { background: var(--Dark-primary-1, #E25000); } .client-cont-orders-item:hover .client-cont-orders-item-pic img.active { opacity: 1; } .client-cont-orders-item-total { position: absolute; top: 24px; right: 24px; display: flex; flex-direction: column; gap: 4px; align-items: flex-end; color: var(--black, #222228); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; } .client-cont-orders-item-total span { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; text-overflow: ellipsis; } .client-cont-orders-more { margin: 0 auto; margin-top: 24px; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; max-width: 480px; width: 100%; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); padding: 11px 24px; box-sizing: border-box; } .client-cont-orders-more:hover { background: #E8E8E8; } .news-top-add .archive { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; padding: 6px 18px; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); box-sizing: border-box; white-space: nowrap; } .news-top-add .archive:hover { background: #E8E8E8; } .client-cont-item-back { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; width: fit-content; margin-bottom: 16px; display: flex; align-items: center; gap: 10px; display: flex; align-items: center; } .client-cont-item-back::before { content: ''; max-width: 18px; min-width: 18px; height: 18px; background-image: url(/bitrix/templates/main/css/../img/header/arrow-back.svg); background-size: 100% 100%; display: flex; opacity: 0.4; transition: 0.3s; } .client-cont-item-back:hover::before { opacity: 1; } .client-cont-orders-item_solo { margin-bottom: 40px; } .client-cont-orders-item_solo .client-cont-orders-item-title { font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; } .client-cont-orders-item-info { margin-top: 24px; display: flex; gap: 24px 64px; max-width: 466px; flex-wrap: wrap; } .client-cont-orders-item-info div { display: flex; flex-direction: column; gap: 12px; color: var(--black, #252525); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; } .client-cont-orders-item-info div span { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; } .client-cont-sost-row { display: flex; flex-direction: column; gap: 16px; } .client-cont-sost-row .cart-main-item:hover { box-shadow: 0 4px 16px 0 rgba(37, 37, 37, 0.12); } .client-cont-sost-row .cart-main-item:hover .cart-main-item-cont-title { color: var(--Primary-1, #FF5A00); } .client-cont-sost-row .cart-main-item-counter-block { max-width: 120px; min-width: 120px; justify-content: center; } .client-cont-sost-row .cart-main-item-counter-block-btn { display: none; } .client-cont-sost-row .card-cont-info-color-drop-menu { display: none; } .client-cont-sost-row .card-cont-info-color-drop-btn { border: 0 !important; margin: 0 !important; height: auto !important; } .client-cont-sost-row .card-cont-info-color-drop-btn::after { display: none; } .client-cont-item_set { gap: 40px; } .client-cont-set-par { display: flex; flex-direction: column; } .client-cont-set-par button { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; text-overflow: ellipsis; padding: 12px 16px; box-sizing: border-box; border-radius: 10px; width: fit-content; text-align: left; } .client-cont-set-par button:hover { color: #FF5A00; } .client-cont-set-par button.active { color: #FF5A00; background: rgba(255, 90, 0, 0.05); } .client-cont-set-files { } .client-cont-set-files-row { display: flex; flex-direction: column; gap: 16px; margin-bottom: 24px; } .client-cont-set-files-item { padding: 16px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Grey-1, #F5F3F1); display: flex; gap: 16px; } .client-cont-set-files-pic { max-width: 40px; min-width: 40px; height: 40px; background-size: 100% 100%; } .client-cont-set-files-item_xls .client-cont-set-files-pic { background-image: url(/bitrix/templates/main/css/../img/client/excel.svg); } .client-cont-set-files-item_pdf .client-cont-set-files-pic { background-image: url(/bitrix/templates/main/css/../img/client/pdf.svg); } .client-cont-set-files-item_doc .client-cont-set-files-pic { background-image: url(/bitrix/templates/main/css/../img/client/doc.svg); } .client-cont-set-files-item_image .client-cont-set-files-pic { background-image: url(/bitrix/templates/main/css/../img/client/picture.svg); } .client-cont-set-files-item_file .client-cont-set-files-pic { background-image: url(/bitrix/templates/main/css/../img/client/file.svg); } .client-cont-set-files-cont { display: flex; flex-direction: column; gap: 12px; } .client-cont-set-files-cont-title { color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .client-cont-set-files-cont-bot { display: flex; gap: 16px; } .client-cont-set-files-cont-bot a { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; padding: 4px 16px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; gap: 10px; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); } .client-cont-set-files-cont-bot a:hover { background: #E8E8E8; } .client-cont-set-files-cont-bot a::before { content: ''; max-width: 20px; min-width: 20px; height: 20px; background-size: 100% 100%; display: flex; } .client-cont-set-files-cont-bot_down::before { background-image: url(/bitrix/templates/main/css/../img/client/download.svg); } .client-cont-set-files-cont-bot_preview::before { background-image: url(/bitrix/templates/main/css/../img/client/preview.svg); } .client-cont-cont-set-adr { } .client-cont-cont-set-adr-row { display: flex; flex-direction: column; gap: 16px; margin-bottom: 24px; } .client-cont-cont-set-adr-item { display: flex; gap: 24px; align-items: center; } .client-cont-cont-set-adr-item-cont { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; padding: 14px 16px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Grey-1, #F5F3F1); background: var(--white, #FFF); width: 100%; } .client-cont-cont-set-adr-item button { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; display: flex; align-items: center; gap: 12px; padding: 11px 0; box-sizing: border-box; } .client-cont-cont-set-adr-item button:hover { color: #FF5A00; } .client-cont-cont-set-adr-item button::before { content: ''; max-width: 20px; min-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/client/close.svg); background-size: 100% 100%; } .client-cont-set-adr-add { color: var(--Primary-1, #FF5A00); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; padding: 11px 24px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; gap: 12px; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Primary-1, #FF5A00); background: var(--white, #FFF); } .client-cont-set-adr-add:hover { background: #E25000; color: #fff; border-color: transparent; } .client-cont-set-adr-add::before { content: ''; max-width: 20px; min-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/client/plus.svg); background-size: 100% 100%; display: flex; } .client-cont-set-adr-add:hover::before { background-image: url(/bitrix/templates/main/css/../img/client/plus_active.svg); } .client-cont-set-alert { color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; display: flex; align-items: center; gap: 12px; } .client-cont-set-alert::before { content: ''; display: flex; max-width: 24px; min-width: 24px; height: 24px; background-image: url(/bitrix/templates/main/css/../img/client/alert.svg); background-size: 100% 100%; } .client-cont-set-pass { margin-top: 26px; display: flex; gap: 24px; } .client-cont-set-pass label { width: 50%; display: flex; flex-direction: column; gap: 12px; } .client-cont-set-pass-title { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; } .client-cont-set-pass label input { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; padding: 14px 16px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Grey-1, #F5F3F1); background: var(--white, #FFF); transition: 0.3s; } .client-cont-set-pass label input:hover, .client-cont-set-pass label input:focus { border-color: #FF5A00; } .client-cont-set-pass label span { opacity: 0.6; align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; } .client-cont-set-final { margin-top: 40px; padding: 11px 24px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); background: var(--Primary-1, #FF5A00); color: var(--white, #FFF); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; display: flex; justify-content: center; align-items: center; } .client-cont-set-final:hover { background: #E25000; } .client-cont-rek-text { margin-bottom: 40px; display: flex; flex-direction: column; gap: 15px; color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; } .client-cont-rek .cart-block-form-item { width: 100%; } .pop-cont-file_solo { margin-top: 24px; } .pop-cont-file_solo .pop-cont-file-block { margin-top: 24px; } .cookie { position: fixed; bottom: 16px; left: 16px; z-index: 9; padding: 16px; box-sizing: border-box; border-radius: var(--Border-radius-2, 16px); background: var(--white, #FFF); box-shadow: 0 20px 48px 0 rgba(37, 37, 37, 0.16); max-width: 330px; display: flex; flex-direction: column; gap: 16px; } .cookie-title { align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; } .cookie a { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; padding: 6px 18px; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); } .cookie a:hover { background: var(--Grey-3, #E8E8E8); } .comp_popup { position: fixed; top: 200px; right: 16px; border-radius: var(--Border-radius-2, 16px); background: var(--white, #FFF); box-shadow: 0 20px 48px 0 rgba(37, 37, 37, 0.16); padding: 16px; box-sizing: border-box; display: flex; gap: 16px; max-width: 320px; color: var(--black, #222228); display: none; } .comp_popup.active { display: flex; } .comp_popup:hover { color: #FF5A00; } .comp_popup-pic { max-width: 56px; min-width: 56px; height: fit-content; aspect-ratio: 1/1; } .comp_popup-pic img { width: 100%; height: 100%; object-fit: contain; } .comp_popup-cont { display: flex; flex-direction: column; gap: 8px; } .comp_popup-cont-title { font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; transition: 0.3s; padding-right: 32px; } .comp_popup-cont-text { color: var(--black, #222228); font-family: "Golos Text"; font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; text-overflow: ellipsis; } .comp_popup-close { max-width: 20px; min-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/modal/close.svg); background-size: 100% 100%; transition: 0.3s; position: absolute; top: 16px; right: 16px; } .comp_popup-close:hover { background-image: url(/bitrix/templates/main/css/../img/modal/close_active.svg); } .main-news-all { display: none; } @media (max-width: 1366px) { .main-banner, .main-popular, .main-deal, .main-info, .main-line, .main-brand, .main-qst, .main-news, .main-actual { margin-top: 56px; } .main-actual { margin-bottom: 56px; } .footer-info { gap: 24px; } .footer-info-block { width: 100%; } .catalog-cont-row .card { width: calc(100% / 3 - 10.7px); } .catalog-side { max-width: 284px; min-width: 284px; } .catalog-share { align-items: flex-end; } .brand { margin-bottom: 56px; } .brand-page .card { width: calc(100% / 4 - 12px); } .velo-top-slider { max-width: 600px; min-width: 600px; } .cart-main-item-cont { max-width: 364px; } .client { margin-bottom: 56px; } .client-cont-info-row-item-text ul { max-width: 483px; } } @media (max-width: 1279px) { .container { padding: 0 16px; } .header { padding: 14px 0; /* padding: 0; */ /* box-shadow: none; */ } .header-main { margin-top: 0; /* padding: 14px 0; */ /* box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.10); */ } .header-main-logo { width: 32px; height: 32px; } .header-main-logo img { width: 100%; height: 100%; } .header-main-logo img:last-child { display: none; } .header-main-catalog-btn { margin-left: 24px; height: 44px; } .header-main-add { margin-left: 24px; } .header-main-add a, .header-main-add button { font-size: 0; line-height: normal; width: 20px; height: 20px; gap: 0; } .main-banner-slider .slick-list { border-radius: 0; } .header-main-search-field { height: 44px; } .header-main-menu-btn { width: 20px; height: 20px; aspect-ratio: 1/1; background-image: url(/bitrix/templates/main/css/../img/header/menu-btn.svg); background-size: 100% 100%; display: flex; } .main-banner { /* margin: 0 -16px; */ margin-top: 0; width: 100%; } .main-banner .container { padding: 0; } .main-banner-side { display: none; } .main-banner-slider { width: 100%; border-radius: 0; height: 484px; overflow: visible; } .main-banner-slider-controls { right: 0; left: 0; width: fit-content; margin: auto; bottom: -20px; /* background-color: red; */ } .main-banner-slider-controls_arrow { display: none; } .main-banner-slider-controls_dots div { opacity: 0.2; background: #222228; } .main-banner-slider-controls_dots_active { opacity: 0.6; } .main-popular { margin-top: 48px; overflow: hidden; } .main-top h2 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; } .main-top a { font-size: 0; width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/main-brand/arrow.svg); background-size: 100% 100%; display: flex; opacity: 1; } .main-top-mailing { background-image: none !important; height: auto !important; width: auto !important; font-size: 15px !important; font-style: normal; font-weight: 400; line-height: 22px; text-overflow: ellipsis; opacity: 0.6 !important; } .main-popular-nav { margin-bottom: 24px; } .card { max-width: 236px; width: 100%; padding: 10px 8px 16px; } .card-cat { font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; text-overflow: ellipsis; margin-bottom: 2px; } .card-title { font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; text-overflow: ellipsis; height: 48px; } .card-price { gap: 6px; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; } .card-price-discount { font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; text-decoration-line: line-through; } .card-opt { font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; text-overflow: ellipsis; gap: 4px; margin-bottom: 10px; } .card-opt-drop { font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; text-overflow: ellipsis; } .card-rating { font-size: 11px; } .card-rating::before { max-width: 12px; min-width: 12px; height: 12px; } .card-available { font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; gap: 4px; } .card-available span { max-width: 10px; min-width: 10px; height: 10px; } .card-add { margin-bottom: 12px; } .card-click { font-size: 10px; } .main-popular-more { margin-top: 4px; max-width: 100%; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; padding: 6px 18px; } .main-popular-slider .slick-list { margin: 0 -4px; overflow: visible; } .main-popular-slider .slick-slide { margin: 0 4px; } .main-deal { margin-top: 48px; padding: 32px 0; overflow: hidden; } .main-deal-more { width: 100%; max-width: none; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; padding: 6px 18px; margin-top: 24px; } .main-info { margin-top: 48px; overflow: hidden; } .main-info-row { flex-direction: column; gap: 40px; } .main-info-text { width: 100%; padding: 0; gap: 16px; } .main-info h1 { font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; } .main-info-text h2 { font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .main-info-text p { font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .main-info-vid { width: 100%; height: 396px; overflow: hidden; } .main-info-slider .slick-slide { /* margin: 0; */ margin: 0 4px; } .main-info-slider .slick-list { margin: 0 -4px; margin: 0; overflow: visible; } .main-info-slider-item { max-width: 240px; min-width: 240px; padding: 24px; height: 272px; } .main-info-slider-icon { width: 40px; height: 40px; margin-bottom: 20px; } .main-info-slider-title { font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; margin-bottom: 16px; } .main-info-slider-text { font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; } .main-line { margin-top: 48px; padding: 21px 0; } .main-line-cont h2 { font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; } .main-line-cont p { font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; } .main-line a { padding: 6px 18px; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; } .main-brand { margin-top: 48px; overflow: hidden; } .main-brand-slider .slick-list { margin: 0 -20px; } .main-brand-slider .slick-slide { margin: 0 20px; } .main-qst { margin-top: 47px; } .main-qst .container { padding: 0; } .main-qst-cont { border-radius: 0; background-size: contain; padding: 32px 16px; } .main-qst-cont h2 { font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; margin-bottom: 24px; } .main-qst-cont h2::before { width: 40px; height: 40px; } .main-qst-cont p { font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; text-align: center; margin-bottom: 32px; } .main-qst-row { flex-wrap: wrap; gap: 56px; row-gap: 24px; width: 100%; } .main-qst-row-block-title { font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; } .main-qst-row-block-link { font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .main-qst-form-btn { width: 100%; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; padding: 6px 18px; } .main-news { margin-top: 48px; } .main-news-nav button { font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; padding: 6px 18px; } .main-news-nav button.active { padding: 6px 18px; } .main-news-slider .slick-list { margin: 0 -4px; } .main-news-slider .slick-slide { margin: 0 4px; } .main-news-item-pic { height: 151px; margin-bottom: 16px; } .main-actual { margin-top: 48px; margin-bottom: 48px; } .footer { padding-bottom: 24px; } .footer-main { flex-direction: column; padding-top: 0; gap: 0; } .footer-block { width: 100%; max-width: 100%; /* padding-bottom: 20px; */ /* padding-top: 20px; */ border-bottom: 1px solid var(--Grey-1, #F5F3F1); max-height: 62px; overflow: hidden; box-sizing: border-box; transition: 0.3s; } .footer-block_active { max-height: 600px; padding-bottom: 20px; } .footer-block-top { height: 62px; margin: 0; display: flex; align-items: center; justify-content: space-between; } .footer-block-top::after { content: ''; width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/footer/arrow.svg); background-size: 100% 100%; display: flex; transition: 0.3s; } .footer-block_active .footer-block-top::after { transform: rotate(180deg); } .footer-main-add { gap: 0; } .footer-info { gap: 32px; } .footer-info-block { width: calc(100% / 3 - 22px); } .footer-info-title { font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; } .footer-info-link { font-size: 14px; font-style: normal; font-weight: 400; line-height: 19px; } .footer-info-block:last-child { width: calc(100% / 3 * 2 - 22px); } .header-catalog { position: fixed; margin: 0; border-radius: 0; box-shadow: none; top: 72px; bottom: 0; right: 0; left: 0; height: auto; max-height: 100%; right: 100%; /* padding-top: 20px; */ box-sizing: border-box; } .header-catalog.active { max-height: 100%; right: 0; padding: 24px 16px; padding-top: 10px; } .header-catalog .container { padding: 0; height: 100%; } .header-catalog-side { max-width: 100%; min-width: 0; width: 100%; height: 100%; overflow-y: scroll; box-sizing: border-box; gap: 24px; } .header-catalog-side button { padding: 0; background-color: transparent !important; color: #222228 !important; border-bottom: 1px solid #F5F3F1; align-items: center; padding: 0; border: 0; } .header-catalog-side button::after { content: ''; width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/footer/arrow.svg); background-size: 100% 100%; display: flex; transform: rotate(-90deg); margin-left: auto; opacity: 0.6; } .header-catalog-side-pic img.active { opacity: 0 !important; } .header-catalog-cont { position: absolute; top: 0; bottom: 0; left: 100%; right: 0; z-index: 1; background-color: #fff; overflow-y: scroll; box-sizing: border-box; max-width: 100%; overflow: hidden; padding: 0; transition: 0.3s; } .header-catalog-cont_mob-active { max-width: 100%; padding: 0 16px; padding-bottom: 20px; left: 0; right: 0; } .header-catalog-cont-block { gap: 24px; overflow-y: scroll; height: 100%; } .header-catalog-cont-block::-webkit-scrollbar { display: none; } .header-catalog-cont-block-title { color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; display: flex; justify-content: space-between; align-items: center; } .header-catalog-cont-block-title::after { content: ''; width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/footer/arrow.svg); transform: rotate(-90deg); display: flex; opacity: 0.6; } .header-catalog-cont-block-back { display: flex; align-items: center; gap: 8px; opacity: 0.6; color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .header-catalog-cont-block-back::before { content: ''; width: 18px; height: 18px; background-image: url(/bitrix/templates/main/css/../img/header/arrow-back.svg); background-size: 100% 100%; display: flex; } .header-catalog-cont-block-row { height: 100%; gap: 24px; flex-wrap: nowrap; } .header-catalog-cont-block-row-item { overflow: visible; height: auto; } .header-catalog-cont-block-row-item-top { color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 500; line-height: 18px; display: flex; flex-direction: row-reverse; justify-content: space-between; padding: 0; height: 20px; } .header-catalog-cont-block-link { color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 500; line-height: 18px; padding: 0; height: 20px; } .header-catalog-cont-block-row-item-top::before { background-image: url(/bitrix/templates/main/css/../img/footer/arrow.svg); transform: rotate(-90deg); width: 20px; height: 20px; background-size: 100% 100%; opacity: 0.6; } .header-catalog-cont-block-row-item ul { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-color: #fff; padding: 0 16px; gap: 0; overflow-y: scroll; flex-wrap: nowrap; padding-bottom: 20px; z-index: 1; left: 100%; transition: 0.3s; gap: 24px; } .header-catalog-cont-block-row-item.active ul { display: flex; left: 0; } .header-catalog-cont-block-row-item ul a { color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 500; line-height: 18px; display: flex; justify-content: space-between; align-items: center; } .header-catalog-cont-block-row-item-top-list_back { opacity: 0.6; color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; display: flex; align-items: center; gap: 8px; margin-bottom: 0; } .header-catalog-cont-block-row-item-top-list_back::before { content: ''; min-width: 18px; max-width: 18px; height: 18px; background-image: url(/bitrix/templates/main/css/../img/header/arrow-back.svg); background-size: 100% 100%; display: flex; } .header-nav { display: none; } .header-main-search-result { top: 72px; max-width: 100%; width: 100%; /* height: -webkit-fill-available; */ /* height: -moz-available; */ border-radius: 0; box-shadow: none; } .header-main-search-result.active { max-height: 562px; } .header-main-search-result-cont-row .card { width: 100%; max-width: 100%; } .header-top { position: fixed; top: 72px; left: 0; right: 0; bottom: 0; background-color: #fff; z-index: 2; max-height: 100%; left: 100%; transition: 0.3s; overflow-y: scroll; padding-bottom: 20px; } .header-top::-webkit-scrollbar { display: none; } .header-top_active { left: 0; } .header-top .container { flex-direction: column; gap: 24px; align-items: flex-start; } .header-top-nav { width: 100%; max-width: 100%; flex-direction: column; align-items: flex-start; gap: 26px; padding: 24px 0; border-top: 2px solid var(--Grey-1, #F5F3F1); border-bottom: 2px solid var(--Grey-1, #F5F3F1); } .header-top-nav-drop { width: 100%; max-height: 18px; } .header-top-nav-drop_active { max-height: 300px; } .header-top-nav-drop-btn, .header-top-nav-link { height: 18px; width: 100%; justify-content: space-between; box-sizing: border-box; color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 500; line-height: 18px; } .header-top-nav-drop-btn::after { width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/footer/arrow.svg); opacity: 0.6; } .header-top-nav-drop ul { position: unset; margin-top: 10px; width: 100%; border-radius: 0; box-shadow: none; padding: 0; gap: 10px; } .header-top-nav-drop ul a { padding: 0; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 18px; } .header-top-add { flex-direction: column; align-items: flex-start; display: none; } .header-top .footer-info { display: flex; } .header-top .footer-info-block:last-child { width: calc(100% / 3 - 22px); } .header-main-add_tel { display: flex !important; } .header-top-mob { display: flex; flex-direction: column; width: 100%; } .header-top-mob-cat { color: var(--white, #FFF); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; padding: 6px 12px; box-sizing: border-box; background: var(--Primary-1, #FF5A00); width: 100%; border-radius: var(--Border-radius-1, 10px); display: flex; align-items: center; justify-content: center; gap: 10px; margin-bottom: 24px; display: none; } .header-top-mob-cat::before { content: ''; width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/header/catalog.svg); background-size: 100% 100%; display: flex; } .header-top-mob-list { display: flex; flex-direction: column; gap: 24px; } .header-top-mob-list-item { display: flex; align-items: center; color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 500; line-height: 18px; } .header-top-mob-list-item-pic { width: 20px; height: 20px; margin-right: 12px; } .header-top-mob-list-item-pic img { width: 100%; height: 100%; } .header-top-mob-list-item span { color: var(--white, #FFF); font-family: "Golos Text"; font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; padding: 2px 8px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); background: var(--Primary-1, #FF5A00); margin-left: auto; } .chip { margin-top: 24px; } .catalog { margin-top: 16px; } .catalog-row { /* margin-bottom: 40px; */ } .catalog-title h1 { font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; } .catalog-comp { flex-wrap: nowrap; overflow-x: scroll; margin: 0 -16px; padding: 0 16px; margin-bottom: 24px; } .catalog-comp::-webkit-scrollbar { display: none; } .catalog-comp-more { display: none; } .catalog-comp-row { display: flex; } .catalog-comp-row a { display: flex !important; } .catalog-top-filter-btn { display: flex; gap: 10px; align-items: center; padding: 6px 18px; box-sizing: border-box; color: var(--Primary-1, #FF5A00); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Primary-1, #FF5A00); margin-right: 16px; } .catalog-top-filter-btn::before { content: ''; max-width: 20px; min-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/catalog/filter.svg); background-size: 100% 100%; } .catalog-cont-row .card { max-width: 100%; width: calc(100% / 4 - 12px); } .catalog-pag { gap: 24px; } .catalog-pag-more { max-width: 100%; height: 32px; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; } .catalog-pag-nav { width: 100%; } .catalog-pag-nav-arrow { height: 32px; margin-right: auto; } .catalog-pag-nav-arrow_next { margin-right: 0; margin-left: auto; } .catalog-pag-nav { gap: 16px; } .catalog-pag-nav-item { height: 32px; width: 43px; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; } .catalog-add { margin-bottom: 40px; margin-top: 40px; } .catalog-add-block { margin: 0 -16px; padding: 0 16px; align-items: center; overflow-x: scroll; } .catalog-add-block::-webkit-scrollbar { display: none; } .catalog-add-block-row { flex-wrap: nowrap; } .catalog-add-block-title { max-width: none; width: auto; white-space: nowrap; } .catalog-side { display: none; position: fixed; z-index: 10; top: 0; right: 0; bottom: 0; left: 0; background-color: #fff; max-width: 100%; min-width: 0; overflow-y: scroll; /* padding: 16px; */ padding-bottom: 24px; padding-top: 0; } .catalog-side::-webkit-scrollbar { display: none; } .catalog-side_open { display: block; flex-direction: column; } .catalog-side-top { display: flex; align-items: center; position: sticky; top: 0; background: var(--white, #FFF); box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.10); padding: 12px 16px; box-sizing: border-box; height: 48px; align-items: center; } .catalog-side-top-title { color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; margin-right: 18px; } .catalog-side-top-clear { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; } .catalog-side-top-close { max-width: 20px; min-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/catalog/close.svg); background-size: 100% 100%; display: flex; margin-left: auto; } .catalog-side-first { padding: 24px 16px; display: none; } .catalog-side-block { padding: 24px 16px; } .catalog-side-block-list_avail { padding: 24px 16px; margin: 0; padding-bottom: 0; } .catalog-side-show { margin: 0 16px; margin-top: 24px; width: -webkit-fill-available; } .card-top { display: none; } .card-cont .container { flex-direction: column; } .card-cont-slider-side { display: none; } .card-cont-slider { max-width: 100%; } .card-cont-slider-main { max-width: 100%; aspect-ratio: unset; width: 100%; } .card-cont-slider-main-row { display: flex; gap: 20px; flex-wrap: nowrap; overflow-x: scroll; margin: 0 -16px; } .card-cont-slider-main-row::-webkit-scrollbar { display: none; } .card-cont-slider-main .slick-list { margin: 0 -4px; } .card-cont-slider-main .slick-slide { height: auto !important; margin: 0 4px; } .card-cont-slider-main-item { max-width: 640px; min-width: 640px; aspect-ratio: 1/1; height: auto !important; } .card-cont .container { gap: 26px; } .card-cont-info-title { justify-content: space-between; } .card-cont-info-title h1 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; } .card-cont-info-color { max-width: 100%; } .card-cont-info .card-buy { width: 50%; height: 32px; } .card-cont-info .card-click { width: 50%; height: 32px; padding: 0; } .card-info-nav button { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; padding: 0 18px; height: 32px; } .card-info-cont { margin-top: 32px; } .card-info-cont-char-item ul li { color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .card-info-cont-block h2 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; margin-bottom: 24px; } .card-info-cont-char-item { gap: 16px; } .card-info-cont-char-item h3 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .card-info-cont-error { width: 100%; display: flex; justify-content: center; align-items: center; } .card-info { margin-top: 40px; margin-bottom: 48px; } .card-partner { margin-bottom: 24px; } .card-partner-title { align-self: stretch; color: var(--white, #FFF); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; margin-bottom: 16px; } .card-partner-text { align-self: stretch; color: var(--white, #FFF); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .card-partner-btn { margin-top: 24px; padding: 6px 18px; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; } .card-info-cont-block_review-row { flex-direction: column-reverse; gap: 40px; } .card-info-cont-block_review-side { width: 100%; max-width: 100%; position: unset; padding: 24px; display: flex; align-items: center; flex-direction: row; flex-wrap: wrap; } .card-info-cont-block_review-side-num { color: var(--black, #222228); font-family: "Golos Text"; font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; width: fit-content; margin-bottom: 0; margin-right: 16px; } .card-info-cont-block_review-side-rate { width: fit-content; gap: 16px; color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .card-info-cont-block_review-side-rate-stars span { max-width: 20px; min-width: 20px; height: 20px; } .card-info-cont-block_review-side button { width: 100%; color: var(--white, #FFF); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; padding: 6px 18px; } .card-info-cont-block_review-cont-top button { display: none; } .card-info-cont-block_review-cont-top { overflow-x: scroll; } .card-info-cont-block_review-cont-top::-webkit-scrollbar { display: none; } .card-info-cont-block_opt-item h3 { margin-bottom: 16px; align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .card-info-cont-block_partner { width: 100%; display: flex; justify-content: center; align-items: center; padding: 6px 18px; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; } .card-info-cont-block-req { color: var(--Primary-1, #FF5A00); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; margin-top: 40px; width: 100%; padding: 6px 18px; display: flex; justify-content: center; } .brand-item-pic { max-width: 128px; min-width: 128px; height: 128px; } .brand-item-cont-title { align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .brand-item-cont-text { align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .brand-item-cont-link { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; width: 100%; } .brand { margin-bottom: 48px; } .solo-title h1 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; } .about { margin-top: 16px; margin-bottom: 48px; } .about .container { flex-direction: column; gap: 24px; } .about-side { max-width: 100%; min-width: 0; flex-direction: row; gap: 16px; overflow-x: scroll; margin-left: -16px; margin-right: -16px; padding: 0 16px; } .about-side::-webkit-scrollbar { display: none; } .about-side button { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; padding: 6px 18px; background: var(--Grey-1, #F5F3F1); border-radius: 10px; white-space: nowrap; } .about-side button.active { color: var(--white, #FFF); background: var(--Primary-1, #FF5A00); } .about-cont { width: 100%; } .about-cont-text { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .about-cont-text strong { margin-top: 12px; align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .about-cont-history { margin-top: 40px; } .about-cont-history h2 { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; margin-bottom: 24px; } .about-cont-history-row { gap: 40px; } .about-cont-history-item-title { align-self: stretch; color: var(--Primary-1, #FF5A00); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; margin-bottom: 16px; } .about-cont-history-item-text { align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; gap: 10px; } .about-cont-history-item-slider .slick-arrow { display: none !important; } .about-cont-history-item_active::after { bottom: -56px; } .about-cont-history-item-slider .slick-slide { margin-right: 8px; } .about-cont-history-item-vid { margin-top: 40px; } .about-cont-block .card-info-cont-block_review-side { row-gap: 32px; padding: 24px; } .about-cont-recrut { padding: 24px; } .about-cont-recrut-row { flex-wrap: wrap; gap: 64px; row-gap: 24px; } .about-cont-recrut-button { width: 100%; padding: 6px 18px; color: var(--white, #FFF); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; } .about-cont-recrut-title { color: var(--black, #222228); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .about-cont-vac-item { padding: 24px; max-height: 108px; } .about-cont-vac-item-title { margin-bottom: 16px; align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .about-cont-vac-item-top span { font-size: 14px; font-style: normal; line-height: 20px; } .about-cont-vac-btn { width: 100%; color: var(--white, #FFF); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; padding: 6px 18px; } .about-cont-res-title { align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; margin-bottom: 24px; } .about-cont-res-item { max-height: 72px; padding: 24px; } .about-cont-res-item-title { flex: 1 0 0; color: var(--black, #222228); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .about-cont-res-item-text { align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .about-cont-qst-nav { margin: 0 -16px; padding: 0 16px; flex-wrap: nowrap; overflow-x: scroll; margin-bottom: 32px; } .about-cont-qst-nav button { padding: 6px 18px; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; } .about-cont-qst-nav::-webkit-scrollbar { display: none; } .news { margin-top: 24px; margin-bottom: 48px; } .news-top .catalog-side-block-search { max-width: 100%; } .news-top .catalog-side-block-search input { padding: 8px 12px; } .news-row .main-news-item { width: calc(100% / 3 - 10.7px); } .new { margin-bottom: 48px; } .new-row { flex-direction: column; gap: 40px; margin-top: 24px; } .new-top span, .new-top a { font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; text-overflow: ellipsis; } .new-cont { width: 100%; } .new-cont-text { font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .about-cont-history-item-s span { margin-top: 16px; } .new-cont article h2 { font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; } .new-cont-card-slider { display: flex; gap: 8px; overflow-x: scroll; } .new-cont-card-slider::-webkit-scrollbar { display: none; } .new-cont-card-slider .card { min-width: 236px; } .new-side-links, .new-side-banner { display: none; } .new-side { max-width: 100%; min-width: 0; } .new-side-soc-title { font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .payment { margin-bottom: 48px; } .payment-nav button { padding: 6px 18px; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; } .payment-cont { margin-top: 32px; } .waranty { margin-bottom: 48px; margin-top: 24px; } .waranty-cont { margin-top: 32px; } .waranty-nav button { padding: 6px 18px; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; } .card-info-cont-block_waranty-item { padding: 24px; } .card-info-cont-block_waranty-item-pic { width: 40px; } .card-info-cont-block_waranty-item-year { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .card-info-cont-block_waranty-item-type { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .partner { margin-bottom: 48px; } .partner .container { flex-direction: column; gap: 24px; } .partner-side { max-width: 100%; min-width: 0; } .partner-side .card-info-cont-block_partner { display: none; } .partner-side-nav { flex-direction: row; margin: 0 -16px; padding: 0 16px; overflow-x: scroll; } .partner-side-nav::-webkit-scrollbar { display: none; } .partner-side-nav button { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; white-space: nowrap; text-align: center; padding: 6px 18px; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); } .partner-side-nav button.active { background-color: #FF5A00; color: #fff; } .partner-cont-item-opt { gap: 32px; } .partner-cont-item-opt article { gap: 16px; } .partner-cont-item-opt article h3 { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .partner-cont-item-opt-text { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .card-info-cont-block_partner_hid { display: flex; } .partner-cont-item-opt-banner-title { font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; } .partner-cont-item-opt-banner-text { align-self: stretch; color: var(--white, #FFF); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .partner-cont-item-opt-banner button { padding: 6px 18px; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; } .partner-cont-item-opt article h2 { font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; } .partner-cont-item-asort-item-title { font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .partner-cont-item-cat-top { margin-left: -16px; margin-right: -16px; padding: 0 16px; overflow-x: scroll; } .partner-cont-item-cat-top::-webkit-scrollbar { display: none; } .partner-cont-item-cat-row-item-title { color: var(--black, #222228); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .partner-cont-item-cat-row-item .partner-cont-item-asort-item-row a { width: 50%; } .partner-cont-item-cat-row-item-text { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 5; align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; text-overflow: ellipsis; } .velo { margin-top: 16px; margin-bottom: 48px; } .velo-top { flex-direction: column; gap: 48px; } .velo-top-cont { padding-right: 0; } .velo-top-text { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; margin-bottom: 24px; } .velo-top-sub { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .velo-top-row { margin-top: 24px; gap: 24px; } .velo-top-row button { width: -webkit-fill-available; padding: 6px 18px; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; } .velo-top-slider-s { overflow: hidden; margin-left: -16px; margin-right: -16px; padding: 0 16px; } .velo-top-slider { max-width: 100%; width: 100%; min-width: 0; } .velo-top-slider .slick-arrow { display: none !important; } .velo-top-slider .slick-list { aspect-ratio: 0; box-shadow: none; border-radius: 0; overflow: visible; } .velo-top-slider .slick-slide { max-width: 488px; width: 100%; aspect-ratio: 4/3; border-radius: var(--Border-radius-1, 10px); overflow: hidden; margin: 0 8px; } .velo-top-slider .slick-slide div { height: 100%; } .velo-top-slider-s .slider-counter { display: block; left: 32px; } .velo-add { margin-top: 48px; } .velo-add-item { padding: 24px; gap: 20px; } .velo-add-item-pic { width: 40px; } .velo-add-item-text { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; } .velo-info { margin-top: 48px; } .velo-info h2 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; } .velo-info-row { flex-direction: column; margin-top: 32px; gap: 24px; } .velo-info-side { max-width: 100%; min-width: 0; position: relative; } .velo-info-side-top { display: flex !important; padding: 0 16px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); border: 2px solid var(--Grey-1, #F5F3F1); background: var(--white, #FFF); color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; gap: 12px; height: 50px; display: flex; align-items: center; } .velo-info-side-top::after { content: ''; max-width: 20px; min-width: 20px; height: 20px; display: flex; background-image: url(/bitrix/templates/main/css/../img/catalog/drop_arrow.svg); background-size: 100% 100%; margin-left: auto; opacity: 0.6; transition: 0.3s; } .velo-info-side-top.open { border-color: #FF5A00; color: #FF5A00; } .velo-info-side-top.open::after { transform: rotate(180deg); background-image: url(/bitrix/templates/main/css/../img/catalog/drop_arrow_active.svg); opacity: 1; } .velo-info-side-top::before { content: ''; min-width: 20px; max-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/about/qst/qst8.svg); background-size: 100% 100%; transition: 0.3s; } .velo-info-side-top.open::before { background-image: url(/bitrix/templates/main/css/../img/about/qst/qst8_hover.svg); } .velo-info-side-top-pic { width: 20px; height: 20px; position: relative; } .velo-info-side-top-pic img { width: 100%; height: 100%; transition: 0.3s; } .velo-info-side-top-pic img.active { position: absolute; top: 0; bottom: 0; left: 0; right: 0; opacity: 0; } .velo-info-side-top.open .velo-info-side-top-pic img.active { opacity: 1; } .velo-info-side-row { position: absolute; top: 70px; right: 0; left: 0; background-color: #fff; z-index: 1; box-shadow: 0 8px 24px 0 rgba(37, 37, 37, 0.16); border-radius: 16px; display: none; } .velo-info-side-row.open { display: flex; } .velo-info-cont-row { padding: 16px; } .velo-info-cont-row-item h3 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; margin-bottom: 24px; } .velo-info-cont-row-item-text-title { color: var(--black, #252525); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; } .velo-info-cont-row-item-text-desc { color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .velo-info-cont .card-info-cont-alert { color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; align-items: center; } .card-info-cont-res { padding: 24px; flex-direction: column; align-items: flex-start; gap: 16px; } .card-info-cont-res-text { color: var(--black, #222228); font-family: "Golos Text"; font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; } .card-info-cont-res-text span { color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 19px; } .card-info-cont-res button { width: 100%; padding: 6px 18px; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; } .error { margin-bottom: 48px; margin-top: 24px; padding: 48px 0; } .error .container { width: 100%; } .error-cont { max-width: 100%; width: 100%; } .error-num { color: var(--Primary-1, #FF5A00); font-family: "Golos Text"; font-size: 96px; font-style: normal; font-weight: 500; line-height: normal; } .error-num span { width: 96px; } .error-cont h1 { font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .error-text { gap: 15px; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .error-cont a { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; padding: 6px 18px; width: 100%; margin-top: 40px; } .thx { margin-bottom: 40px; padding-top: 40px; margin-top: 24px; } .thx-pic { width: 72px; } .thx-cont h1 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; } .thx-text { color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .thx-back { width: 100%; padding: 6px 18px; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; } .contacts { margin-bottom: 48px; margin-top: 24px; } .contacts-top { padding: 24px; margin-bottom: 48px; } .contacts-top .footer-info { gap: 16px; row-gap: 32px; } .contacts-top .footer-info-block { width: calc(100% / 4 - 12px); } .contacts-top .footer-info-title { font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; } .contacts-top .footer-info-link { font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .contacts-top .footer-info-block:nth-last-child(-n + 2) { width: calc(100% / 2 - 8px); } .contacts-top-btn { font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; padding: 6px 18px; width: 100%; } .contacts-adr { flex-direction: column; gap: 16px; height: auto; margin-bottom: 48px; } .contacts-adr-map { height: 400px; } .contacts-adr-side { max-width: 100%; min-width: 0; } .contacts-adr-side-item:first-child { max-height: 72px; } .contacts-adr-side-item:first-child .contacts-adr-side-item-top { height: 30px; } .contacts-slider-s { margin-bottom: 48px; } .contacts-slider .slick-list { margin: 0; } .contacts-slider .slick-slide { max-width: 320px; margin: 0; margin-right: 8px; } .contacts-rek { padding: 24px; } .contacts-rek h2 { color: var(--black, #222228); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; margin-bottom: 24px; } .contacts-rek-row { flex-direction: column; } .contacts-rek-col { width: 100%; } .contacts-rek-dow { position: unset; margin-top: 24px; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; padding: 11px 24px; } .solo-title-print { font-size: 14px; font-style: normal; font-weight: 400; line-height: 19px; text-overflow: ellipsis; } .cart-block-form input[type='submit'] { display: none; } .cart { margin-top: 24px; margin-bottom: 48px; } .cart-row { flex-direction: column; gap: 48px; } .cart-main-top-all { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; } .cart-main-item-cont { max-width: 488px; } .cart-title h2 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; } .cart-block-del-item-text { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .cart-block-del-item-adr { color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; } .cart-side { max-width: 100%; min-width: 0; } .comp { margin-top: 24px; margin-bottom: 48px; } .comp .main-popular-slider { overflow: hidden; } .card-comp li { gap: 10px; align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 500; line-height: 18px; } .card-comp li span { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; } .comp .card-click { display: none; } .comp-nav button { padding: 6px 18px; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; } .client { margin-top: 24px; margin-bottom: 48px; } .client .container { flex-direction: column; gap: 24px; } .client-side { max-width: 100%; min-width: 0; flex-direction: row; overflow-x: scroll; margin: 0 -16px; padding: 0 16px; gap: 16px; } .client-side::-webkit-scrollbar { display: none; } .client-side button { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; display: flex; align-items: center; justify-content: center; padding: 6px 18px; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); white-space: nowrap; } .client-side button.active { background-color: #FF5A00; color: #fff; } .client-cont-info { padding: 24px; } .client-cont-info-title { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; } .client-cont-info-row-item span { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; } .client-cont-info-row-item-text { color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 500; line-height: 18px; } .client-cont-info-row-item-text ul { max-width: 100%; font-size: 14px; font-style: normal; font-weight: 500; line-height: 18px; } .client-cont-set { margin-top: 24px; position: unset; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; padding: 6px 18px; } .client-top h2 { font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; } .client-cont-orders-more { width: 100%; max-width: 100%; padding: 6px 18px; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; } .pop-cont-file-block { /* height: 44px; */ height: auto; } .client-cont-set-files-cont-title { color: var(--black, #252525); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; } .client-cont-set-adr-add { width: 100%; padding: 6px 18px; color: var(--Primary-1, #FF5A00); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; } .client-cont-set-final { width: 100%; padding: 6px 18px; } .client-cont-rek-text { font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .main-info-slider { display: flex; gap: 8px; overflow-x: scroll; margin-left: -16px; margin-right: -16px; padding: 0 16px; } .main-info-slider::-webkit-scrollbar { display: none; } } @media (max-width: 1023px) { .header { padding: 12px 0; } .header-main-catalog-btn { display: none; } .header-main-search-field { display: none; } .header-main-add_acc-block { display: none !important; } .header-main-add_search { display: flex !important; } .header-main-logo { max-width: 163px; min-width: 163px; height: 24px; background-image: url(/bitrix/templates/main/css/../img/header/logo3.svg); background-size: 100% 100%; } .header-main-logo img { display: none; } .header-main-add_cart { display: none !important; } .header-main-add { gap: 24px; margin-left: auto; } .header-top { top: 48px; } .main-banner-slider { height: 362px; } .main-banner-slider-item { padding: 32px; } .main-banner-slider-item-chip div { font-size: 13px; } .main-popular, .main-deal, .main-info, .main-line, .main-brand, .main-qst, .main-news, .main-actual { margin-top: 40px; } .main-actual { margin-bottom: 40px; } .main-news-item { max-width: 320px; } .main-brand-item { max-width: 96px; } .bot-menu { display: flex; position: fixed; bottom: 0; right: 0; left: 0; z-index: 9; padding: 8px; box-sizing: border-box; display: flex; background-color: #fff; height: 58px; box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.10); } .bot-menu-item { display: flex; flex-direction: column; gap: 4px; height: 100%; width: -webkit-fill-available; width: -moz-available; align-items: center; color: var(--black, #252525); font-family: "Golos Text"; font-size: 11px; font-style: normal; font-weight: 400; line-height: 18px; } .bot-menu-item img { width: 20px; height: 20px; } .header-top { bottom: 58px; } .header-catalog { top: 42px; bottom: 58px; padding-top: 20px; } .header-top-mob-cat { display: flex; } .header-catalog-back { display: flex !important; opacity: 0.6; color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; display: flex; gap: 8px; align-items: center; } .header-catalog-back::before { content: ''; width: 18px; height: 18px; background-image: url(/bitrix/templates/main/css/../img/header/arrow-back.svg); background-size: 100% 100%; display: flex; } .header-catalog-back::after { display: none !important; } .header-main-search { display: flex; position: fixed; top: 0; right: 0; bottom: 100%; left: 0; background-color: #fff; margin: 0; overflow: hidden; transition: 0.3s; } .header-main-search_active { bottom: 58px; overflow-y: scroll; } .header-main-search-top { width: 100%; padding: 8px 16px; box-sizing: border-box; box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.10); position: absolute; top: 0; right: 0; left: 0; display: flex; align-items: center; gap: 16px; } .header-main-search-field { display: flex; width: 100%; } .header-main-search-close { display: flex; min-width: 20px; max-width: 20px; height: 20px; background-image: url(/bitrix/templates/main/css/../img/header/close.svg); background-size: 100% 100%; display: flex; } .header-main-search-field input { color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 19px; } .header-main-search-result, .header-main-search-result.active { max-height: 100%; flex-direction: column-reverse; justify-content: flex-end; padding: 0 16px; gap: 24px; min-width: 0; border: 0; } .header-main-search-result-cont-all { position: absolute; bottom: 0; right: 16px; left: 16px; /* width: 100%; */ width: auto; z-index: 2; justify-content: center; align-items: center; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; padding: 6px 18px; box-sizing: border-box; } .header-main-search-result-cont-row { height: 30vh; padding-bottom: 100px; } .header-main-search-result-cont-row .card { padding: 12px; } .header-main-search-result-cont-row .card-pic { max-width: 72px; min-width: 72px; height: 72px; } .header-catalog-cont_mob-active, .header-catalog-cont-block-row-item ul { padding-top: 10px; } .header-top .footer-info-block:last-child { width: 100%; } .chip { } .chip a { display: none; } .chip-back { display: flex !important; gap: 8px !important; } .chip-back::after { display: none; } .chip-back::before { content: ''; max-width: 18px; min-width: 18px; height: 18px; background-image: url(/bitrix/templates/main/css/../img/header/arrow-back.svg); background-size: 100% 100%; } .catalog-comp-title { font-size: 14px; font-style: normal; font-weight: 400; line-height: 19px; } .catalog-comp-row a { padding: 3px 12px; } .catalog-filters { flex-wrap: nowrap; overflow-x: scroll; margin: 0 -16px; padding: 0 16px; margin-bottom: 32px; } .catalog-filters::-webkit-scrollbar { display: none; } .catalog-cont-row .card { width: calc(100% / 3 - 10.7px); } .catalog-pag { margin-top: 14px; gap: 24px; } .catalog-pag-more { font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; height: 32px; } .card-cont-slider-main-item { max-width: 485px; min-width: 485px; } .card-cont-slider-main .card-pic-tags { left: 8px; top: 8px; } .card-info-cont-text { gap: 10px; align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .card-info-cont-char-row { max-height: 100%; } .card-info-cont-char-item { width: 100%; } .card-info-cont-alert { color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .card-cont-info-color-drop-btn { padding: 11px 16px; padding-right: 40px; } .card-cont-info .card-price { color: var(--black, #222228); font-family: "Golos Text"; font-size: 24px; font-style: normal; font-weight: 600; line-height: 32px; } .card-cont-info .card-price-old { color: var(--black, #222228); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; text-decoration-line: line-through; } .card-cont-info .card-price-discount { color: var(--Error, #F93C00); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .card-partner-text { max-width: 489px; } .card-partner-cont::after { right: 32px; } .card-info-cont-block_review-cont-top { gap: 8px; } .card-info-cont-block_review-cont-top-item { max-width: 72px; min-width: 72px; height: 72px; } .card-info-cont-block_partner { color: var(--white, #FFF); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; } .card-info-cont-block_opt-prog { flex-wrap: wrap; } .card-info-cont-block_opt-prog-item { width: calc(50% - 8px); padding: 24px; } .card-info-cont-block_opt-prog-item:last-child { width: 100%; } .card-info-cont-block_opt-prog-item-star { margin-bottom: 12px; } .card-info-cont-block_opt-prog-item-star img { width: 40px; height: 40px; } .card-info-cont-block_opt-prog-item-title { align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; margin-bottom: 8px; } .card-info-cont-block_opt-prog-item-dis { align-self: stretch; color: var(--Primary-1, #FF5A00); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 500; line-height: 18px; margin-bottom: 10px; } .card-info-cont-block_opt-stages { padding: 24px; gap: 24px; } .card-info-cont-block_opt-stages-item { width: calc(50% - 12px); } .card-info-cont-block_opt-stages-item-pic { width: 40px; height: 40px; margin-bottom: 12px; } .card-info-cont-block_pay-item { padding: 24px; } .card-info-cont-block_pay-pic { width: 40px; height: 40px; margin-bottom: 12px; } .card-info-cont-block_pay-title { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; margin-bottom: 16px; } .card-info-cont-block_pay-text { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .card-info-cont-block_pay-add { color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .card-cont-slider-main .card-pic-add { right: 8px; top: 8px; } .card-cont-slider-main .card-pic-add-fav, .card-cont-slider-main .card-pic-add-comp { width: 20px; height: 20px; } .brand-page .card { width: calc(100% / 3 - 10.7px); } .about-cont-history-item-pic img { height: 250px; border-radius: var(--Border-radius-2, 16px); } .about-cont-history-item-slider .slick-slide { max-width: 320px; } .about-cont-history-item::before { top: 8px; } .about-cont-dir { flex-direction: column; gap: 32px; } .about-cont-dir-side { max-width: 100%; min-width: 0; } .about-cont-team-row { gap: 8px; flex-wrap: nowrap; margin: 0 -16px; padding: 0 16px; overflow-x: scroll; } .about-cont-team-row::-webkit-scrollbar { display: none; } .about-cont-team-item { max-width: 234px; min-width: 234px; } .about-cont-recrut { margin-bottom: 40px; } .about-cont-vac { margin-top: 40px; } .news-row .main-news-item-pic { height: 112px; } .new-top { margin: 0 -16px; padding: 0 16px; overflow-x: scroll; } .new-top::-webkit-scrollbar { display: none; } .card-info-cont-block_opt-row { gap: 32px; } .partner-cont-item-sort { gap: 40px; row-gap: 48px; } .partner-cont-item-sort a { width: calc(100% / 3 - 26.7px); } .velo-top-slider .slick-slide { max-width: 320px; } .velo-add { flex-wrap: nowrap; overflow-x: scroll; margin-left: -16px; margin-right: -16px; padding: 0 16px; } .velo-add::-webkit-scrollbar { display: none; } .velo-add-item { max-width: 240px; min-width: 240px; } .velo-info-row { margin-top: 24px; } .error { margin-bottom: 40px; } .error-num { font-size: 72px; font-style: normal; font-weight: 500; line-height: normal; } .error-num span { width: 72px; } .contacts-top .footer-info { gap: 32px; } .contacts-top .footer-info-block { width: calc(100% / 2 - 16px); } .contacts-top .footer-info-block:nth-last-child(-n + 2) { width: 100%; } .contacts-adr-map { height: 300px; } .contacts-slider .slick-slide { max-width: 240px; } .cart-main-item-cont { max-width: 232px; } .cart-block-form-item { width: 100%; } .client-cont-set-pass { flex-direction: column; } .client-cont-set-pass label { width: 100%; } .footer { padding-bottom: 100px; } .cookie { bottom: 62px; left: 16px; right: 16px; } .cookie-title { align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } } @media (max-width: 767px) { .header-main-logo { max-width: 24px; min-width: 24px; height: 24px; background-image: url(/bitrix/templates/main/css/../img/header/logo1.svg); } .main-banner-slider { height: auto; aspect-ratio: 40/31; } .main-banner-slider-item { padding: 32px 16px; } .main-banner-slider-item-cont { display: flex; flex-direction: column; justify-content: flex-end; align-items: center; text-align: center; margin: 0 auto; } .main-banner-slider-item-bg img { display: none; } .main-banner-slider-item-bg_mob { display: flex !important; } .main-banner-slider-item-chip { display: none; } .main-banner-slider-item-title { font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; text-align: center; margin-bottom: 24px; } .main-banner-slider-item-text { font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; text-align: center; margin-bottom: 0; } .main-popular-nav-sk { overflow-x: scroll; margin: 0 -16px; padding: 0 16px; } .main-popular-nav-sk::-webkit-scrollbar { display: none; } .main-popular-nav { max-width: fit-content; } .main-popular-nav::-webkit-scrollbar { display: none; } .card-pic-tags div { font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; } .card-opt { flex-direction: column; margin-bottom: 8px; } .card-add { flex-direction: column; align-items: flex-start; } .card-click { display: none; } .card-buy { width: 100%; } .main-top-mailing { font-size: 0 !important; } .main-top h2 { font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .main-info h1 { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .main-info-row { margin-top: 24px; } .main-info-vid { height: 115px; } .main-info-slider-item { max-width: 160px; min-width: 160px; padding: 16px; height: 310px; } .main-info-slider-icon { margin-bottom: 12px; } .catalog-add { margin-top: 24px; } .main-info-slider-title { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 12px; font-style: normal; font-weight: 500; line-height: 16px; margin-bottom: 10px; } .main-line { padding: 25px 0; } .main-line .container { flex-direction: column; gap: 24px; align-items: flex-start; } .main-line-cont h2 { align-self: stretch; color: var(--white, #FFF); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .main-line-cont p { font-size: 11px; } .main-qst-cont { background-size: contain; height: auto; } .main-news-nav { width: fit-content; } .main-news-nav::-webkit-scrollbar { display: none; } .main-news-nav button { white-space: nowrap; padding: 4px 16px; } .main-news .main-top a { display: none; } .main-news-item { max-width: 240px; min-width: 240px; } .main-news-item-pic { height: 114px; } .footer-info { gap: 24px; } .footer-info-block { width: 100%; } .footer-info-block:last-child { width: 100%; } .footer-info_add { flex-direction: column; gap: 24px; align-items: flex-start; } .catalog-title { align-items: center; } .catalog-title h1 { font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; } .catalog-share-btn { width: 20px; height: 20px; } .catalog-row { /* margin-top: 24px; */ } .catalog-top { overflow-x: scroll; margin: 0 -16px; padding: 0 16px; margin-bottom: 24px; gap: 16px; } .catalog-top::-webkit-scrollbar { display: none; } .catalog-filters { margin-bottom: 24px; } .catalog-top-filter-btn { margin: 0; padding: 4px 16px; } .catalog-top-switch { margin: 0; } .catalog-cont-row { gap: 8px; } .catalog-cont-row .card { width: calc(100% / 2 - 4px); } .catalog-top_drop-list { position: fixed; max-width: 100%; width: 100%; top: 0; bottom: 0; right: 0; left: 0; height: 100%; } .main-popular-nav button { padding: 4px 16px;font-size: 13px; } .card { max-width: 160px; } .main-deal-more { margin-top: 0; } .main-popular-slider { display: flex; gap: 8px; flex-wrap: nowrap; overflow-x: scroll; margin-left: -16px; margin-right: -16px; padding: 0 16px; } .main-popular-slider::-webkit-scrollbar { display: none; } .main-top { margin-bottom: 24px; } .main-brand-slider { height: 97px; display: flex; align-items: center; } .footer-main { padding-bottom: 0; border: 0; } .main-news-slider, .main-actual-slider { margin: 0 -16px; padding: 0 16px; display: flex; gap: 8px; overflow-x: scroll; } .main-news-slider::-webkit-scrollbar, .main-actual-slider::-webkit-scrollbar { display: none; } .card-info-nav { /* width: calc(100% + 32px); margin-left: -16px; margin-right: -16px; padding-right: 16px; padding-left: 16px; */ } .card-cont-slider-main-item { max-width: 240px; min-width: 240px; } .card-cont .container { gap: 16px; } .card-cont-info-title h1 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .card-cont-info-add .card-rating::before { max-width: 16px; min-width: 16px; height: 16px; margin-right: 4px; } .card-cont-info-add .card-rating span { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; } .card-cont-info-add { gap: 12px; } .card-cont-info-add .card-rating span:last-child { color: rgba(34, 34, 40, 0.60); font-family: "Golos Text"; font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; } .card-cont-info-add .card-available span { max-width: 16px; min-width: 16px; height: 16px; background-size: 10px; background-position: center; } .card-cont-info-add .card-available { color: var(--Success, #27AE60); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; } .card-cont-info-add-art { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; } .card-cont-info .card-opt { flex-direction: row; gap: 16px; } .card-cont-info .card-opt-rrc { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; text-overflow: ellipsis; } .card-cont-info .card-opt-drop { overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; text-overflow: ellipsis; } .card-cont-info .card-click { display: block; } .card-info-nav button { white-space: nowrap; } .card-info-cont-char-item ul li span { white-space: wrap; } .card-info-cont-char-item ul li { /* color: var(--black, #252525); */ font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; } .card-partner-cont { padding: 16px; padding-top: 104px; } .card-partner-cont::after { width: 80px; top: 16px; left: 16px; right: auto; bottom: auto; } .card-cont-slider-main .card-pic-tags { gap: 8px; } .card-cont-slider-main .card-pic-tags a { padding: 2px 8px; font-family: "Golos Text"; font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; } .card-info-cont-block_review-side { padding: 16px; } .card-info-cont-block_review-cont-nav { overflow-x: scroll; } .card-info-cont-block_review-cont-nav::-webkit-scrollbar { display: none; } .card-info-cont-block_review-cont-nav label { white-space: nowrap; } .card-info-cont-block_review-list-item { gap: 16px; padding: 16px; } .card-info-cont-block_review-list-item ul li { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 14px; font-style: normal; line-height: 20px; } .card-info-cont-block_opt-prog-item { width: 100%; padding: 16px; } .card-info-cont-block_opt-stages { padding: 16px; } .card-info-cont-block_opt-stages-item { width: 100%; } .card-info-cont-block_pay-item { padding: 16px; width: 100%; } .pop-cont { max-height: 100%; border-radius: 0; height: 100%; padding: 16px; padding-top: 20px; } .size-popup .pop-cont { padding-top: 16px; padding-bottom: 37px; } .pop-cont-close { top: 14px; right: 16px; } .size-popup .pop-cont-close { top: 18px; right: 16px; } .cont-title { color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; margin-right: 20px; margin-bottom: 24px; } .size-popup .cont-title { margin-bottom: 16px; } .size-popup-pic { height: 240px; } .size-popup-text { margin: 24px 0; color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .size-popup-close { color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; padding: 6px 18px; } .pop-cont .card { max-width: 100%; } .pop-cont-btn { color: var(--white, #FFF); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; padding: 6px 0; } .brand { overflow: hidden; margin-bottom: 40px; } .brand-nav { width: fit-content; } .brand-nav::-webkit-scrollbar { display: none; } .brand-nav button { padding: 6px 18px; } .brand-item { flex-wrap: wrap; padding: 24px 16px; row-gap: 16px; } .brand-item-pic { max-width: 72px; min-width: 72px; height: 72px; } .brand-item-cont { display: contents; } .brand-item-cont-title { display: flex; align-items: center; color: var(--black, #222228); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .brand-item-cont-text { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; align-self: stretch; overflow: hidden; } .brand-item-cont-text_full { -webkit-line-clamp: none; } .brand-item-cont-text-extend { display: flex; color: var(--Primary-1, #FF5A00); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; text-overflow: ellipsis; } .solo-title h1 { color: var(--black, #252525); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; } .brand-page .card { width: calc(100% / 2 - 4px); } .about { margin-bottom: 40px; } .about-cont-history-row { gap: 32px; } .about-cont-history-item-pic img { height: 100px; } .about-cont-history-row { padding-left: 14px; } .about-cont-history-item::before { left: -17px; } .about-cont-history-item-slider .slick-slide { max-width: 272px; } .about-cont-history-item::after { left: -14px; } .about-cont-history-item_active::after { bottom: -47px; } .about-cont-history-item-vid a { width: 100%; height: 155px; border-radius: var(--Border-radius-2, 16px); } .about-cont-history-row::before { bottom: 65px; } .about-cont-team { gap: 24px; } .about-cont-team h3 { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .about-cont-team-item { max-width: 160px; min-width: 160px; } .about-cont-block .card-info-cont-block_review-side { padding: 16px; } .about-cont-recrut { padding: 16px; gap: 24px; } .about-cont-recrut-row { row-gap: 16px; } .about-cont-recrut-button { margin-top: 8px; } .about-cont-vac-item { padding: 16px; max-height: 156px; } .about-cont-vac-item.active { max-height: 4000px; } .about-cont-vac-item-title { gap: 24px; align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 500; line-height: 18px; } .about-cont-vac-item.active .about-cont-vac-item-title { font-size: 16px; } .about-cont-vac-item-top { flex-direction: column; row-gap: 16px; } .about-cont-vac-item-cont-block_pic { flex-direction: column; } .about-cont-res { margin-top: 40px; } .about-cont-res-title { align-self: stretch; color: var(--black, #222228); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .about-cont-res-item { padding: 16px; max-height: 56px; } .about-cont-res-item-title { color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 500; line-height: 18px; } .news-top { flex-direction: column; align-items: flex-start; } .news-row { row-gap: 24px; } .news-row .main-news-item { max-width: 100%; width: 100%; } .news-top-add { margin: 0 -16px; padding: 0 16px; width: 100%; overflow-x: scroll; } .news-top-add::-webkit-scrollbar { display: none; } .new-row { gap: 32px; } .new-cont article { gap: 32px; } .new-cont article blockquote { padding: 16px; display: flex; flex-direction: row; flex-wrap: wrap; gap: 16px; row-gap: 24px; } .new-cont article blockquote .text { font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; } .new-cont article blockquote .row { display: contents; } .new-cont article blockquote img { max-width: 96px; min-width: 96px; } .new-cont-card-slider .card { max-width: 160px; min-width: 160px; } .payment { margin-bottom: 40px; } .card-info-cont-block_waranty { flex-direction: column; gap: 16px; } .card-info-cont-block_waranty-item { padding: 16px; } .card-info-cont-block_waranty-item-pic { margin-bottom: 12px; } .partner-cont-item-opt-banner { padding: 16px; border-radius: var(--Border-radius-2, 16px); display: flex; flex-direction: column; } .partner-cont-item-opt-banner::after { position: unset; display: flex; order: 0; width: 80px; margin-bottom: 8px; } .partner-cont-item-opt-banner-title { order: 1; } .partner-cont-item-opt-banner-text { order: 2; } .partner-cont-item-opt-banner button { order: 3; } .partner-cont-item-asort-item { flex-direction: column; padding: 16px; } .partner-cont-item-asort-item-row { flex-direction: column; } .partner-cont-item-cat-row-item { padding: 16px; flex-direction: column; gap: 24px; } .partner-cont-item-cat-row-item-cont { gap: 16px; } .partner-cont-item-cat-row-item .partner-cont-item-asort-item-row a { width: 100%; } .partner-cont-item-cat-row-item-text-ext { display: flex; text-align: left; width: fit-content; color: var(--Primary-1, #FF5A00); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; text-overflow: ellipsis; } .partner-cont-item-cat-row-item-text_full { -webkit-line-clamp: 30; } .partner-cont-item-sort { gap: 32px; row-gap: 40px; } .partner-cont-item-sort a { width: calc(100% / 2 - 16px); } .velo { margin-bottom: 40px; } .velo-top { gap: 24px; } .velo-top-row { flex-wrap: wrap; gap: 16px; } .velo-top-row button { width: calc(50% - 8px); } .velo-top-row button:first-child { width: 100%; } .velo-top-slider .slick-slide { max-width: 288px; } .velo-add { margin-top: 24px; gap: 8px; } .velo-add-item { gap: 12px; padding: 16px; max-width: 160px; min-width: 160px; } .velo-add-item-text { color: var(--black, #252525); font-family: "Golos Text"; font-size: 12px; font-style: normal; font-weight: 500; line-height: 16px; } .velo-info { margin-top: 24px; } .velo-info h2 { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 20px; font-style: normal; font-weight: 600; line-height: 27px; margin-bottom: 24px; } .velo-info-side-top { height: 44px; } .velo-info-cont-row-item h3 { align-self: stretch; color: var(--black, #252525); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; margin-bottom: 24px; } .velo-info-cont-row-item-row::after { display: none; } .velo-info-cont-row-item-row { flex-direction: column; align-items: flex-start; } .velo-info-cont-row-item-text { padding-right: 0; } .velo-info-cont-row-item-num { padding-left: 0; } .velo-info-cont .card-info-cont-alert { align-items: flex-start; } .solo-title-print { font-size: 0; } .contacts { margin-bottom: 40px; } .contacts-top { padding: 16px; margin-bottom: 40px; } .contacts-top .footer-info { row-gap: 24px; } .contacts-top .footer-info-block { width: 100%; } .contacts-top-btn { margin-top: 24px; } .contacts-adr { margin-bottom: 40px; } .contacts-adr-map { height: 288px; } .contacts-adr-side-item { padding: 16px; max-height: 80px; } .contacts-adr-side-item-top { margin-bottom: 24px; height: 48px; } .contacts-adr-side-item:first-child { max-height: 104px; } .contacts-adr-side-item:first-child .contacts-adr-side-item-top { height: 72px; } .contacts-slider-s { margin-bottom: 40px; } .contacts-rek { padding: 16px; } .contacts-rek-dow { font-size: 15px; font-style: normal; font-weight: 500; line-height: 22px; text-align: center; padding: 11px 24px; } .contacts-rek-dow span { display: none; } .cart { margin-bottom: 40px; margin-top: 24px; } .cart-main-top { white-space: nowrap; margin: 0 -16px; padding: 0 16px; overflow-x: scroll; } .cart-main-top::-webkit-scrollbar { display: none; } .cart-main-item { flex-wrap: wrap; gap: 12px; row-gap: 12px; } .cart-main-item-pic { max-width: 72px; min-width: 72px; order: 0; margin-right: 4px; } .cart-main-item-add { order: 2; margin: 0; } .cart-main-item-cont { display: contents; } .cart-main-item-cont-title { order: 1; max-width: calc(100% - 88px - 32px); display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; color: var(--black, #222228); font-family: "Golos Text"; font-size: 12px; font-style: normal; font-weight: 500; line-height: 16px; text-overflow: ellipsis; margin: 0; } .cart-main-item-cont-add { order: 3; } .cart-main-item .card-cont-info-color { order: 4; margin: 0; width: 100%; } .cart-main-item-counter { order: 5; margin: 0; margin-right: auto; } .cart-main-item-price { order: 6; margin-top: auto; margin-bottom: auto; margin-right: 0; } .cart-main-item-price-total { text-align: right; color: var(--black, #222228); font-family: "Golos Text"; font-size: 16px; font-style: normal; font-weight: 600; line-height: 24px; } .cart-main-item-price-old, .cart-main-item-price-dis { font-size: 13px; font-style: normal; font-weight: 400; line-height: 18px; text-decoration-line: line-through; } .cart-cont { gap: 40px; } .cart-title { flex-direction: column; gap: 16px; align-items: flex-start; } .cart-block { gap: 24px; } .cart-block-del-item-cont { padding: 16px; } .cart-block-del-item input[type="radio"]~span { left: 19px; top: 19px; } .cart-block-del-item-title { padding-left: 30px; } .cart-block-del-item-map { height: 256px; } .cart-block-form-item { width: 100%; } .cart-main-item_as { left: 12px; top: 12px; } .comp { margin-bottom: 40px; } .comp .main-popular-slider { overflow-x: scroll; gap: 0; margin-right: -16px; } .client { margin-bottom: 40px; } .client-cont-info { padding: 16px; gap: 24px; flex-direction: column; align-items: flex-start; } .client-cont-set { width: 100%; } .client-top a { display: none; } .client-cont-orders-item { padding: 16px; } .client-cont-orders-item-total { position: unset; align-items: flex-start; margin-top: 16px; } .client-cont-orders-item-bot { flex-direction: column; gap: 16px; } .client-cont-orders-item-bot button { display: flex; justify-content: center; align-items: center; } .client-cont-sost-row .cart-main-item-counter-block { max-width: 84px; min-width: 84px; } .cart-block-form-item span { color: var(--black, #222228); font-family: "Golos Text"; font-size: 14px; font-style: normal; font-weight: 500; line-height: 18px; } .cart-block-form-item input { padding: 11px 16px; } .client-cont-set-par button { padding: 6px 16px; font-size: 15px; font-style: normal; font-weight: 400; line-height: 22px; } .client-cont-set-files-item { flex-direction: column; gap: 16px; } .client-cont-set-files-cont-bot { flex-direction: column; } .client-cont-cont-set-adr-item button { font-size: 0; gap: 0; } .client-cont-set-final { margin-top: 32px; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; } .card-pic-preview { display: none; } .card-price { gap: 0 6px; } .card-price-old { opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; text-decoration-line: line-through; } .card-opt-rrc { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; opacity: 0.6; color: var(--black, #222228); font-family: "Golos Text"; font-size: 11px; font-style: normal; font-weight: 400; line-height: 16px; text-overflow: ellipsis; } .footer-block-email { width: 100%; } .footer-block-check { align-items: flex-start; } .main-news-all { display: flex; width: 100%; color: var(--black, #222228); font-family: "Golos Text"; font-size: 13px; font-style: normal; font-weight: 500; line-height: 20px; text-align: center; padding: 6px 18px; box-sizing: border-box; border-radius: var(--Border-radius-1, 10px); background: var(--Grey-1, #F5F3F1); justify-content: center; align-items: center; margin-top: 24px; } } /* End */ /* Start:/bitrix/templates/main/css/second.css?1764597563147*/ @media (max-width: 1366px) { } @media (max-width: 1279px) { } @media (max-width: 1023px) { } @media (max-width: 767px) { } /* End */ /* /bitrix/templates/main/css/jquery.css?17645975631775 */ /* /bitrix/templates/main/css/lightbox.min.css?176459756313749 */ /* /bitrix/templates/main/css/slick.css?17645975631775 */ /* /bitrix/templates/main/css/style.css?1764597563339190 */ /* /bitrix/templates/main/css/second.css?1764597563147 */