/* Start:/local/templates/kraska/design/fonts/CeraPro/stylesheet.css?17278929814603*/ @font-face { font-family: 'Cera Pro'; src: url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Italic.eot'); src: local('Cera Pro Italic'), local('CeraPro-Italic'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Italic.eot?#iefix') format('embedded-opentype'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Italic.woff') format('woff'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Italic.ttf') format('truetype'); font-weight: normal; font-style: italic; } @font-face { font-family: 'Cera Pro'; src: url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Regular.eot'); src: local('Cera Pro Regular'), local('CeraPro-Regular'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Regular.eot?#iefix') format('embedded-opentype'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Regular.woff') format('woff'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Regular.ttf') format('truetype'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Cera Pro'; src: url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-BlackItalic.eot'); src: local('Cera Pro Black Italic'), local('CeraPro-BlackItalic'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-BlackItalic.eot?#iefix') format('embedded-opentype'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-BlackItalic.woff') format('woff'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-BlackItalic.ttf') format('truetype'); font-weight: 900; font-style: italic; } @font-face { font-family: 'Cera Pro'; src: url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Light.eot'); src: local('Cera Pro Light'), local('CeraPro-Light'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Light.eot?#iefix') format('embedded-opentype'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Light.woff') format('woff'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Light.ttf') format('truetype'); font-weight: 300; font-style: normal; } @font-face { font-family: 'Cera Pro'; src: url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-BoldItalic.eot'); src: local('Cera Pro Bold Italic'), local('CeraPro-BoldItalic'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-BoldItalic.eot?#iefix') format('embedded-opentype'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-BoldItalic.woff') format('woff'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-BoldItalic.ttf') format('truetype'); font-weight: bold; font-style: italic; } @font-face { font-family: 'Cera Pro'; src: url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Black.eot'); src: local('Cera Pro Black'), local('CeraPro-Black'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Black.eot?#iefix') format('embedded-opentype'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Black.woff') format('woff'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Black.ttf') format('truetype'); font-weight: 900; font-style: normal; } @font-face { font-family: 'Cera Pro'; src: url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Medium.eot'); src: local('Cera Pro Medium'), local('CeraPro-Medium'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Medium.eot?#iefix') format('embedded-opentype'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Medium.woff') format('woff'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Medium.ttf') format('truetype'); font-weight: 500; font-style: normal; } @font-face { font-family: 'Cera Pro'; src: url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Bold.eot'); src: local('Cera Pro Bold'), local('CeraPro-Bold'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Bold.eot?#iefix') format('embedded-opentype'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Bold.woff') format('woff'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Bold.ttf') format('truetype'); font-weight: bold; font-style: normal; } @font-face { font-family: 'Cera Pro'; src: url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Thin.eot'); src: local('Cera Pro Thin'), local('CeraPro-Thin'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Thin.eot?#iefix') format('embedded-opentype'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Thin.woff') format('woff'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-Thin.ttf') format('truetype'); font-weight: 100; font-style: normal; } @font-face { font-family: 'Cera Pro'; src: url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-MediumItalic.eot'); src: local('Cera Pro Medium Italic'), local('CeraPro-MediumItalic'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-MediumItalic.eot?#iefix') format('embedded-opentype'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-MediumItalic.woff') format('woff'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-MediumItalic.ttf') format('truetype'); font-weight: 500; font-style: italic; } @font-face { font-family: 'Cera Pro'; src: url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-LightItalic.eot'); src: local('Cera Pro Light Italic'), local('CeraPro-LightItalic'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-LightItalic.eot?#iefix') format('embedded-opentype'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-LightItalic.woff') format('woff'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-LightItalic.ttf') format('truetype'); font-weight: 300; font-style: italic; } @font-face { font-family: 'Cera Pro'; src: url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-ThinItalic.eot'); src: local('Cera Pro Thin Italic'), local('CeraPro-ThinItalic'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-ThinItalic.eot?#iefix') format('embedded-opentype'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-ThinItalic.woff') format('woff'), url('/local/templates/kraska/design/fonts/CeraPro/CeraPro-ThinItalic.ttf') format('truetype'); font-weight: 100; font-style: italic; } /* End */ /* Start:/local/templates/kraska/design/js/fancybox/jquery.fancybox.min.css?172789298112799*/ body.compensate-for-scrollbar{/*overflow:hidden*/}.fancybox-active{height:auto}.fancybox-is-hidden{left:-9999px;margin:0;position:absolute!important;top:-9999px;visibility:hidden}.fancybox-container{-webkit-backface-visibility:hidden;height:100%;left:0;outline:none;position:fixed;-webkit-tap-highlight-color:transparent;top:0;-ms-touch-action:manipulation;touch-action:manipulation;transform:translateZ(0);width:100%;z-index:99992}.fancybox-container *{box-sizing:border-box}.fancybox-bg,.fancybox-inner,.fancybox-outer,.fancybox-stage{bottom:0;left:0;position:absolute;right:0;top:0}.fancybox-outer{-webkit-overflow-scrolling:touch;overflow-y:auto}.fancybox-bg{background:#1e1e1e;opacity:0;transition-duration:inherit;transition-property:opacity;transition-timing-function:cubic-bezier(.47,0,.74,.71)}.fancybox-is-open .fancybox-bg{opacity:.9;transition-timing-function:cubic-bezier(.22,.61,.36,1)}.fancybox-caption,.fancybox-infobar,.fancybox-navigation .fancybox-button,.fancybox-toolbar{direction:ltr;opacity:0;position:absolute;transition:opacity .25s ease,visibility 0s ease .25s;visibility:hidden;z-index:99997}.fancybox-show-caption .fancybox-caption,.fancybox-show-infobar .fancybox-infobar,.fancybox-show-nav .fancybox-navigation .fancybox-button,.fancybox-show-toolbar .fancybox-toolbar{opacity:1;transition:opacity .25s ease 0s,visibility 0s ease 0s;visibility:visible}.fancybox-infobar{color:#ccc;font-size:13px;-webkit-font-smoothing:subpixel-antialiased;height:44px;left:0;line-height:44px;min-width:44px;mix-blend-mode:difference;padding:0 10px;pointer-events:none;top:0;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.fancybox-toolbar{right:0;top:0}.fancybox-stage{direction:ltr;overflow:visible;transform:translateZ(0);z-index:99994}.fancybox-is-open .fancybox-stage{overflow:hidden}.fancybox-slide{-webkit-backface-visibility:hidden;display:none;height:100%;left:0;outline:none;overflow:auto;-webkit-overflow-scrolling:touch;padding:44px;position:absolute;text-align:center;top:0;transition-property:transform,opacity;white-space:normal;width:100%;z-index:99994}.fancybox-slide:before{content:"";display:inline-block;font-size:0;height:100%;vertical-align:middle;width:0}.fancybox-is-sliding .fancybox-slide,.fancybox-slide--current,.fancybox-slide--next,.fancybox-slide--previous{display:block}.fancybox-slide--image{overflow:hidden;padding:44px 0}.fancybox-slide--image:before{display:none}.fancybox-slide--html{padding:6px}.fancybox-content{background:#fff;display:inline-block;margin:0;max-width:100%;overflow:auto;-webkit-overflow-scrolling:touch;padding:44px;position:relative;text-align:left;vertical-align:middle}.fancybox-slide--image .fancybox-content{animation-timing-function:cubic-bezier(.5,0,.14,1);-webkit-backface-visibility:hidden;background:transparent;background-repeat:no-repeat;background-size:100% 100%;left:0;max-width:none;overflow:visible;padding:0;position:absolute;top:0;transform-origin:top left;transition-property:transform,opacity;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:99995}.fancybox-can-zoomOut .fancybox-content{cursor:zoom-out}.fancybox-can-zoomIn .fancybox-content{cursor:zoom-in}.fancybox-can-pan .fancybox-content,.fancybox-can-swipe .fancybox-content{cursor:grab}.fancybox-is-grabbing .fancybox-content{cursor:grabbing}.fancybox-container [data-selectable=true]{cursor:text}.fancybox-image,.fancybox-spaceball{background:transparent;border:0;height:100%;left:0;margin:0;max-height:none;max-width:none;padding:0;position:absolute;top:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:100%}.fancybox-spaceball{z-index:1}.fancybox-slide--iframe .fancybox-content,.fancybox-slide--map .fancybox-content,.fancybox-slide--pdf .fancybox-content,.fancybox-slide--video .fancybox-content{height:100%;overflow:visible;padding:0;width:100%}.fancybox-slide--video .fancybox-content{background:#000}.fancybox-slide--map .fancybox-content{background:#e5e3df}.fancybox-slide--iframe .fancybox-content{background:#fff}.fancybox-iframe,.fancybox-video{background:transparent;border:0;display:block;height:100%;margin:0;overflow:hidden;padding:0;width:100%}.fancybox-iframe{left:0;position:absolute;top:0}.fancybox-error{background:#fff;cursor:default;max-width:400px;padding:40px;width:100%}.fancybox-error p{color:#444;font-size:16px;line-height:20px;margin:0;padding:0}.fancybox-button{background:rgba(30,30,30,.6);border:0;border-radius:0;box-shadow:none;cursor:pointer;display:inline-block;height:44px;margin:0;padding:10px;position:relative;transition:color .2s;vertical-align:top;visibility:inherit;width:44px}.fancybox-button,.fancybox-button:link,.fancybox-button:visited{color:#ccc}.fancybox-button:hover{color:#fff}.fancybox-button:focus{outline:none}.fancybox-button.fancybox-focus{outline:1px dotted}.fancybox-button[disabled],.fancybox-button[disabled]:hover{color:#888;cursor:default;outline:none}.fancybox-button div{height:100%}.fancybox-button svg{display:block;height:100%;overflow:visible;position:relative;width:100%}.fancybox-button svg path{fill:currentColor;stroke-width:0}.fancybox-button--fsenter svg:nth-child(2),.fancybox-button--fsexit svg:first-child,.fancybox-button--pause svg:first-child,.fancybox-button--play svg:nth-child(2){display:none}.fancybox-progress{background:#ff5268;height:2px;left:0;position:absolute;right:0;top:0;transform:scaleX(0);transform-origin:0;transition-property:transform;transition-timing-function:linear;z-index:99998}.fancybox-close-small{background:transparent;border:0;border-radius:0;color:#ccc;cursor:pointer;opacity:.8;padding:8px;position:absolute;right:-12px;top:-44px;z-index:401}.fancybox-close-small:hover{color:#fff;opacity:1}.fancybox-slide--html .fancybox-close-small{color:currentColor;padding:10px;right:0;top:0}.fancybox-slide--image.fancybox-is-scaling .fancybox-content{overflow:hidden}.fancybox-is-scaling .fancybox-close-small,.fancybox-is-zoomable.fancybox-can-pan .fancybox-close-small{display:none}.fancybox-navigation .fancybox-button{background-clip:content-box;height:100px;opacity:0;position:absolute;top:calc(50% - 50px);width:70px}.fancybox-navigation .fancybox-button div{padding:7px}.fancybox-navigation .fancybox-button--arrow_left{left:0;left:env(safe-area-inset-left);padding:31px 26px 31px 6px}.fancybox-navigation .fancybox-button--arrow_right{padding:31px 6px 31px 26px;right:0;right:env(safe-area-inset-right)}.fancybox-caption{background:linear-gradient(0deg,rgba(0,0,0,.85) 0,rgba(0,0,0,.3) 50%,rgba(0,0,0,.15) 65%,rgba(0,0,0,.075) 75.5%,rgba(0,0,0,.037) 82.85%,rgba(0,0,0,.019) 88%,transparent);bottom:0;color:#eee;font-size:14px;font-weight:400;left:0;line-height:1.5;padding:75px 44px 25px;pointer-events:none;right:0;text-align:center;z-index:99996}@supports (padding:max(0px)){.fancybox-caption{padding:75px max(44px,env(safe-area-inset-right)) max(25px,env(safe-area-inset-bottom)) max(44px,env(safe-area-inset-left))}}.fancybox-caption--separate{margin-top:-50px}.fancybox-caption__body{max-height:50vh;overflow:auto;pointer-events:all}.fancybox-caption a,.fancybox-caption a:link,.fancybox-caption a:visited{color:#ccc;text-decoration:none}.fancybox-caption a:hover{color:#fff;text-decoration:underline}.fancybox-loading{animation:a 1s linear infinite;background:transparent;border:4px solid #888;border-bottom-color:#fff;border-radius:50%;height:50px;left:50%;margin:-25px 0 0 -25px;opacity:.7;padding:0;position:absolute;top:50%;width:50px;z-index:99999}@keyframes a{to{transform:rotate(1turn)}}.fancybox-animated{transition-timing-function:cubic-bezier(0,0,.25,1)}.fancybox-fx-slide.fancybox-slide--previous{opacity:0;transform:translate3d(-100%,0,0)}.fancybox-fx-slide.fancybox-slide--next{opacity:0;transform:translate3d(100%,0,0)}.fancybox-fx-slide.fancybox-slide--current{opacity:1;transform:translateZ(0)}.fancybox-fx-fade.fancybox-slide--next,.fancybox-fx-fade.fancybox-slide--previous{opacity:0;transition-timing-function:cubic-bezier(.19,1,.22,1)}.fancybox-fx-fade.fancybox-slide--current{opacity:1}.fancybox-fx-zoom-in-out.fancybox-slide--previous{opacity:0;transform:scale3d(1.5,1.5,1.5)}.fancybox-fx-zoom-in-out.fancybox-slide--next{opacity:0;transform:scale3d(.5,.5,.5)}.fancybox-fx-zoom-in-out.fancybox-slide--current{opacity:1;transform:scaleX(1)}.fancybox-fx-rotate.fancybox-slide--previous{opacity:0;transform:rotate(-1turn)}.fancybox-fx-rotate.fancybox-slide--next{opacity:0;transform:rotate(1turn)}.fancybox-fx-rotate.fancybox-slide--current{opacity:1;transform:rotate(0deg)}.fancybox-fx-circular.fancybox-slide--previous{opacity:0;transform:scale3d(0,0,0) translate3d(-100%,0,0)}.fancybox-fx-circular.fancybox-slide--next{opacity:0;transform:scale3d(0,0,0) translate3d(100%,0,0)}.fancybox-fx-circular.fancybox-slide--current{opacity:1;transform:scaleX(1) translateZ(0)}.fancybox-fx-tube.fancybox-slide--previous{transform:translate3d(-100%,0,0) scale(.1) skew(-10deg)}.fancybox-fx-tube.fancybox-slide--next{transform:translate3d(100%,0,0) scale(.1) skew(10deg)}.fancybox-fx-tube.fancybox-slide--current{transform:translateZ(0) scale(1)}@media (max-height:576px){.fancybox-slide{padding-left:6px;padding-right:6px}.fancybox-slide--image{padding:6px 0}.fancybox-close-small{right:-6px}.fancybox-slide--image .fancybox-close-small{background:#4e4e4e;color:#f2f4f6;height:36px;opacity:1;padding:6px;right:0;top:0;width:36px}.fancybox-caption{padding-left:12px;padding-right:12px}@supports (padding:max(0px)){.fancybox-caption{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}}}.fancybox-share{background:#f4f4f4;border-radius:3px;max-width:90%;padding:30px;text-align:center}.fancybox-share h1{color:#222;font-size:35px;font-weight:700;margin:0 0 20px}.fancybox-share p{margin:0;padding:0}.fancybox-share__button{border:0;border-radius:3px;display:inline-block;font-size:14px;font-weight:700;line-height:40px;margin:0 5px 10px;min-width:130px;padding:0 15px;text-decoration:none;transition:all .2s;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap}.fancybox-share__button:link,.fancybox-share__button:visited{color:#fff}.fancybox-share__button:hover{text-decoration:none}.fancybox-share__button--fb{background:#3b5998}.fancybox-share__button--fb:hover{background:#344e86}.fancybox-share__button--pt{background:#bd081d}.fancybox-share__button--pt:hover{background:#aa0719}.fancybox-share__button--tw{background:#1da1f2}.fancybox-share__button--tw:hover{background:#0d95e8}.fancybox-share__button svg{height:25px;margin-right:7px;position:relative;top:-1px;vertical-align:middle;width:25px}.fancybox-share__button svg path{fill:#fff}.fancybox-share__input{background:transparent;border:0;border-bottom:1px solid #d7d7d7;border-radius:0;color:#5d5b5b;font-size:14px;margin:10px 0 0;outline:none;padding:10px 15px;width:100%}.fancybox-thumbs{background:#ddd;bottom:0;display:none;margin:0;-webkit-overflow-scrolling:touch;-ms-overflow-style:-ms-autohiding-scrollbar;padding:2px 2px 4px;position:absolute;right:0;-webkit-tap-highlight-color:rgba(0,0,0,0);top:0;width:212px;z-index:99995}.fancybox-thumbs-x{overflow-x:auto;overflow-y:hidden}.fancybox-show-thumbs .fancybox-thumbs{display:block}.fancybox-show-thumbs .fancybox-inner{right:212px}.fancybox-thumbs__list{font-size:0;height:100%;list-style:none;margin:0;overflow-x:hidden;overflow-y:auto;padding:0;position:absolute;position:relative;white-space:nowrap;width:100%}.fancybox-thumbs-x .fancybox-thumbs__list{overflow:hidden}.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar{width:7px}.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-track{background:#fff;border-radius:10px;box-shadow:inset 0 0 6px rgba(0,0,0,.3)}.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-thumb{background:#2a2a2a;border-radius:10px}.fancybox-thumbs__list a{-webkit-backface-visibility:hidden;backface-visibility:hidden;background-color:rgba(0,0,0,.1);background-position:50%;background-repeat:no-repeat;background-size:cover;cursor:pointer;float:left;height:75px;margin:2px;max-height:calc(100% - 8px);max-width:calc(50% - 4px);outline:none;overflow:hidden;padding:0;position:relative;-webkit-tap-highlight-color:transparent;width:100px}.fancybox-thumbs__list a:before{border:6px solid #ff5268;bottom:0;content:"";left:0;opacity:0;position:absolute;right:0;top:0;transition:all .2s cubic-bezier(.25,.46,.45,.94);z-index:99991}.fancybox-thumbs__list a:focus:before{opacity:.5}.fancybox-thumbs__list a.fancybox-thumbs-active:before{opacity:1}@media (max-width:576px){.fancybox-thumbs{width:110px}.fancybox-show-thumbs .fancybox-inner{right:110px}.fancybox-thumbs__list a{max-width:calc(100% - 10px)}} /* End */ /* Start:/local/templates/kraska/design/js/scroll/jquery.mCustomScrollbar.css?172789298154850*/ /* == malihu jquery custom scrollbar plugin == Plugin URI: http://manos.malihu.gr/jquery-custom-content-scroller */ /* CONTENTS: 1. BASIC STYLE - Plugin's basic/essential CSS properties (normally, should not be edited). 2. VERTICAL SCROLLBAR - Positioning and dimensions of vertical scrollbar. 3. HORIZONTAL SCROLLBAR - Positioning and dimensions of horizontal scrollbar. 4. VERTICAL AND HORIZONTAL SCROLLBARS - Positioning and dimensions of 2-axis scrollbars. 5. TRANSITIONS - CSS3 transitions for hover events, auto-expanded and auto-hidden scrollbars. 6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS 6.1 THEMES - Scrollbar colors, opacity, dimensions, backgrounds etc. via ready-to-use themes. */ /* ------------------------------------------------------------------------------------------------------------------------ 1. BASIC STYLE ------------------------------------------------------------------------------------------------------------------------ */ .mCustomScrollbar{ -ms-touch-action: pinch-zoom; touch-action: pinch-zoom; /* direct pointer events to js */ } .mCustomScrollbar.mCS_no_scrollbar, .mCustomScrollbar.mCS_touch_action{ -ms-touch-action: auto; touch-action: auto; } .mCustomScrollBox{ /* contains plugin's markup */ position: relative; overflow: hidden; height: 100%; max-width: 100%; outline: none; direction: ltr; } .mCSB_container{ /* contains the original content */ overflow: hidden; width: auto; height: auto; } /* ------------------------------------------------------------------------------------------------------------------------ 2. VERTICAL SCROLLBAR y-axis ------------------------------------------------------------------------------------------------------------------------ */ .mCSB_inside > .mCSB_container{ margin-right: 30px; } .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden{ margin-right: 0; } /* non-visible scrollbar */ .mCS-dir-rtl > .mCSB_inside > .mCSB_container{ /* RTL direction/left-side scrollbar */ margin-right: 0; margin-left: 30px; } .mCS-dir-rtl > .mCSB_inside > .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden{ margin-left: 0; } /* RTL direction/left-side scrollbar */ .mCSB_scrollTools{ /* contains scrollbar markup (draggable element, dragger rail, buttons etc.) */ position: absolute; width: 16px; height: auto; left: auto; top: 0; right: 0; bottom: 0; } .mCSB_outside + .mCSB_scrollTools{ right: -26px; } /* scrollbar position: outside */ .mCS-dir-rtl > .mCSB_inside > .mCSB_scrollTools, .mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools{ /* RTL direction/left-side scrollbar */ right: auto; left: 0; } .mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools{ left: -26px; } /* RTL direction/left-side scrollbar (scrollbar position: outside) */ .mCSB_scrollTools .mCSB_draggerContainer{ /* contains the draggable element and dragger rail markup */ position: absolute; top: 0; left: 0; bottom: 0; right: 0; height: auto; } .mCSB_scrollTools a + .mCSB_draggerContainer{ margin: 20px 0; } .mCSB_scrollTools .mCSB_draggerRail{ width: 2px; height: 100%; margin: 0 auto; -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; } .mCSB_scrollTools .mCSB_dragger{ /* the draggable element */ cursor: pointer; width: 100%; height: 30px; /* minimum dragger height */ z-index: 1; } .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ /* the dragger element */ position: relative; width: 4px; height: 100%; margin: 0 auto; -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; text-align: center; } .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{ width: 12px; /* auto-expanded scrollbar */ } .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{ width: 8px; /* auto-expanded scrollbar */ } .mCSB_scrollTools .mCSB_buttonUp, .mCSB_scrollTools .mCSB_buttonDown{ display: block; position: absolute; height: 20px; width: 100%; overflow: hidden; margin: 0 auto; cursor: pointer; } .mCSB_scrollTools .mCSB_buttonDown{ bottom: 0; } /* ------------------------------------------------------------------------------------------------------------------------ 3. HORIZONTAL SCROLLBAR x-axis ------------------------------------------------------------------------------------------------------------------------ */ .mCSB_horizontal.mCSB_inside > .mCSB_container{ margin-right: 0; margin-bottom: 30px; } .mCSB_horizontal.mCSB_outside > .mCSB_container{ min-height: 100%; } .mCSB_horizontal > .mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden{ margin-bottom: 0; } /* non-visible scrollbar */ .mCSB_scrollTools.mCSB_scrollTools_horizontal{ width: auto; height: 16px; top: auto; right: 0; bottom: 0; left: 0; } .mCustomScrollBox + .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal{ bottom: -26px; } /* scrollbar position: outside */ .mCSB_scrollTools.mCSB_scrollTools_horizontal a + .mCSB_draggerContainer{ margin: 0 20px; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail{ width: 100%; height: 2px; margin: 7px 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger{ width: 30px; /* minimum dragger width */ height: 100%; left: 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ width: 100%; height: 4px; margin: 6px auto; } .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{ height: 12px; /* auto-expanded scrollbar */ margin: 2px auto; } .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{ height: 8px; /* auto-expanded scrollbar */ margin: 4px 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft, .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight{ display: block; position: absolute; width: 20px; height: 100%; overflow: hidden; margin: 0 auto; cursor: pointer; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft{ left: 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight{ right: 0; } /* ------------------------------------------------------------------------------------------------------------------------ 4. VERTICAL AND HORIZONTAL SCROLLBARS yx-axis ------------------------------------------------------------------------------------------------------------------------ */ .mCSB_container_wrapper{ position: absolute; height: auto; width: auto; overflow: hidden; top: 0; left: 0; right: 0; bottom: 0; margin-right: 30px; margin-bottom: 30px; } .mCSB_container_wrapper > .mCSB_container{ padding-right: 30px; padding-bottom: 30px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_vertical{ bottom: 20px; } .mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_horizontal{ right: 20px; } /* non-visible horizontal scrollbar */ .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden + .mCSB_scrollTools.mCSB_scrollTools_vertical{ bottom: 0; } /* non-visible vertical scrollbar/RTL direction/left-side scrollbar */ .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal{ right: 0; } /* RTL direction/left-side scrollbar */ .mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal{ left: 20px; } /* non-visible scrollbar/RTL direction/left-side scrollbar */ .mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal{ left: 0; } .mCS-dir-rtl > .mCSB_inside > .mCSB_container_wrapper{ /* RTL direction/left-side scrollbar */ margin-right: 0; margin-left: 30px; } .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden > .mCSB_container{ padding-right: 0; } .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden > .mCSB_container{ padding-bottom: 0; } .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden{ margin-right: 0; /* non-visible scrollbar */ margin-left: 0; } /* non-visible horizontal scrollbar */ .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden{ margin-bottom: 0; } /* ------------------------------------------------------------------------------------------------------------------------ 5. TRANSITIONS ------------------------------------------------------------------------------------------------------------------------ */ .mCSB_scrollTools, .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCSB_scrollTools .mCSB_buttonUp, .mCSB_scrollTools .mCSB_buttonDown, .mCSB_scrollTools .mCSB_buttonLeft, .mCSB_scrollTools .mCSB_buttonRight{ -webkit-transition: opacity .2s ease-in-out, background-color .2s ease-in-out; -moz-transition: opacity .2s ease-in-out, background-color .2s ease-in-out; -o-transition: opacity .2s ease-in-out, background-color .2s ease-in-out; transition: opacity .2s ease-in-out, background-color .2s ease-in-out; } .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar, /* auto-expanded scrollbar */ .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail{ -webkit-transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out; -moz-transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out; -o-transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out; transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out; } /* ------------------------------------------------------------------------------------------------------------------------ 6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS ------------------------------------------------------------------------------------------------------------------------ */ /* ---------------------------------------- 6.1 THEMES ---------------------------------------- */ /* default theme ("light") */ .mCSB_scrollTools{ opacity: 0.75; filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; } .mCS-autoHide > .mCustomScrollBox > .mCSB_scrollTools, .mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools{ opacity: 0; filter: "alpha(opacity=0)"; -ms-filter: "alpha(opacity=0)"; } .mCustomScrollbar > .mCustomScrollBox > .mCSB_scrollTools.mCSB_scrollTools_onDrag, .mCustomScrollbar > .mCustomScrollBox ~ .mCSB_scrollTools.mCSB_scrollTools_onDrag, .mCustomScrollBox:hover > .mCSB_scrollTools, .mCustomScrollBox:hover ~ .mCSB_scrollTools, .mCS-autoHide:hover > .mCustomScrollBox > .mCSB_scrollTools, .mCS-autoHide:hover > .mCustomScrollBox ~ .mCSB_scrollTools{ opacity: 1; filter: "alpha(opacity=100)"; -ms-filter: "alpha(opacity=100)"; } .mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.4); filter: "alpha(opacity=40)"; -ms-filter: "alpha(opacity=40)"; } .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.75); filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; } .mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.85); filter: "alpha(opacity=85)"; -ms-filter: "alpha(opacity=85)"; } .mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.9); filter: "alpha(opacity=90)"; -ms-filter: "alpha(opacity=90)"; } .mCSB_scrollTools .mCSB_buttonUp, .mCSB_scrollTools .mCSB_buttonDown, .mCSB_scrollTools .mCSB_buttonLeft, .mCSB_scrollTools .mCSB_buttonRight{ background-image: url(/local/templates/kraska/design/js/scroll/mCSB_buttons.png); /* css sprites */ background-repeat: no-repeat; opacity: 0.4; filter: "alpha(opacity=40)"; -ms-filter: "alpha(opacity=40)"; } .mCSB_scrollTools .mCSB_buttonUp{ background-position: 0 0; /* sprites locations light: 0 0, -16px 0, -32px 0, -48px 0, 0 -72px, -16px -72px, -32px -72px dark: -80px 0, -96px 0, -112px 0, -128px 0, -80px -72px, -96px -72px, -112px -72px */ } .mCSB_scrollTools .mCSB_buttonDown{ background-position: 0 -20px; /* sprites locations light: 0 -20px, -16px -20px, -32px -20px, -48px -20px, 0 -92px, -16px -92px, -32px -92px dark: -80px -20px, -96px -20px, -112px -20px, -128px -20px, -80px -92px, -96px -92px, -112 -92px */ } .mCSB_scrollTools .mCSB_buttonLeft{ background-position: 0 -40px; /* sprites locations light: 0 -40px, -20px -40px, -40px -40px, -60px -40px, 0 -112px, -20px -112px, -40px -112px dark: -80px -40px, -100px -40px, -120px -40px, -140px -40px, -80px -112px, -100px -112px, -120px -112px */ } .mCSB_scrollTools .mCSB_buttonRight{ background-position: 0 -56px; /* sprites locations light: 0 -56px, -20px -56px, -40px -56px, -60px -56px, 0 -128px, -20px -128px, -40px -128px dark: -80px -56px, -100px -56px, -120px -56px, -140px -56px, -80px -128px, -100px -128px, -120px -128px */ } .mCSB_scrollTools .mCSB_buttonUp:hover, .mCSB_scrollTools .mCSB_buttonDown:hover, .mCSB_scrollTools .mCSB_buttonLeft:hover, .mCSB_scrollTools .mCSB_buttonRight:hover{ opacity: 0.75; filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; } .mCSB_scrollTools .mCSB_buttonUp:active, .mCSB_scrollTools .mCSB_buttonDown:active, .mCSB_scrollTools .mCSB_buttonLeft:active, .mCSB_scrollTools .mCSB_buttonRight:active{ opacity: 0.9; filter: "alpha(opacity=90)"; -ms-filter: "alpha(opacity=90)"; } /* theme: "dark" */ .mCS-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.15); } .mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); } .mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: rgba(0,0,0,0.85); } .mCS-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: rgba(0,0,0,0.9); } .mCS-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -80px 0; } .mCS-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -80px -20px; } .mCS-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -80px -40px; } .mCS-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -80px -56px; } /* ---------------------------------------- */ /* theme: "light-2", "dark-2" */ .mCS-light-2.mCSB_scrollTools .mCSB_draggerRail, .mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail{ width: 4px; background-color: #fff; background-color: rgba(255,255,255,0.1); -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; } .mCS-light-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 4px; background-color: #fff; background-color: rgba(255,255,255,0.75); -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; } .mCS-light-2.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-light-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ width: 100%; height: 4px; margin: 6px auto; } .mCS-light-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.85); } .mCS-light-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-light-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.9); } .mCS-light-2.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px 0; } .mCS-light-2.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -20px; } .mCS-light-2.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -40px; } .mCS-light-2.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -56px; } /* theme: "dark-2" */ .mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.1); -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; } .mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; } .mCS-dark-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); } .mCS-dark-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-dark-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); } .mCS-dark-2.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px 0; } .mCS-dark-2.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -20px; } .mCS-dark-2.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -40px; } .mCS-dark-2.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -56px; } /* ---------------------------------------- */ /* theme: "light-thick", "dark-thick" */ .mCS-light-thick.mCSB_scrollTools .mCSB_draggerRail, .mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail{ width: 4px; background-color: #fff; background-color: rgba(255,255,255,0.1); -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .mCS-light-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 6px; background-color: #fff; background-color: rgba(255,255,255,0.75); -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail{ width: 100%; height: 4px; margin: 6px 0; } .mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ width: 100%; height: 6px; margin: 5px auto; } .mCS-light-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.85); } .mCS-light-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-light-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.9); } .mCS-light-thick.mCSB_scrollTools .mCSB_buttonUp{ background-position: -16px 0; } .mCS-light-thick.mCSB_scrollTools .mCSB_buttonDown{ background-position: -16px -20px; } .mCS-light-thick.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -20px -40px; } .mCS-light-thick.mCSB_scrollTools .mCSB_buttonRight{ background-position: -20px -56px; } /* theme: "dark-thick" */ .mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.1); -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); } .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); } .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonUp{ background-position: -96px 0; } .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonDown{ background-position: -96px -20px; } .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -100px -40px; } .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonRight{ background-position: -100px -56px; } /* ---------------------------------------- */ /* theme: "light-thin", "dark-thin" */ .mCS-light-thin.mCSB_scrollTools .mCSB_draggerRail{ background-color: #fff; background-color: rgba(255,255,255,0.1); } .mCS-light-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 2px; } .mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail{ width: 100%; } .mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ width: 100%; height: 2px; margin: 7px auto; } /* theme "dark-thin" */ .mCS-dark-thin.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.15); } .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); } .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); } .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); } .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonUp{ background-position: -80px 0; } .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonDown{ background-position: -80px -20px; } .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -80px -40px; } .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonRight{ background-position: -80px -56px; } /* ---------------------------------------- */ /* theme "rounded", "rounded-dark", "rounded-dots", "rounded-dots-dark" */ .mCS-rounded.mCSB_scrollTools .mCSB_draggerRail{ background-color: #fff; background-color: rgba(255,255,255,0.15); } .mCS-rounded.mCSB_scrollTools .mCSB_dragger, .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger, .mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger{ height: 14px; } .mCS-rounded.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 14px; margin: 0 1px; } .mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger{ width: 14px; } .mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ height: 14px; margin: 1px 0; } .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{ width: 16px; /* auto-expanded scrollbar */ height: 16px; margin: -1px 0; } .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{ width: 4px; /* auto-expanded scrollbar */ } .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{ height: 16px; /* auto-expanded scrollbar */ width: 16px; margin: 0 -1px; } .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{ height: 4px; /* auto-expanded scrollbar */ margin: 6px 0; } .mCS-rounded.mCSB_scrollTools .mCSB_buttonUp{ background-position: 0 -72px; } .mCS-rounded.mCSB_scrollTools .mCSB_buttonDown{ background-position: 0 -92px; } .mCS-rounded.mCSB_scrollTools .mCSB_buttonLeft{ background-position: 0 -112px; } .mCS-rounded.mCSB_scrollTools .mCSB_buttonRight{ background-position: 0 -128px; } /* theme "rounded-dark", "rounded-dots-dark" */ .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); } .mCS-rounded-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.15); } .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); } .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); } .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -80px -72px; } .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -80px -92px; } .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -80px -112px; } .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -80px -128px; } /* theme "rounded-dots", "rounded-dots-dark" */ .mCS-rounded-dots.mCSB_scrollTools_vertical .mCSB_draggerRail, .mCS-rounded-dots-dark.mCSB_scrollTools_vertical .mCSB_draggerRail{ width: 4px; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{ background-color: transparent; background-position: center; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail{ background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAANElEQVQYV2NkIAAYiVbw//9/Y6DiM1ANJoyMjGdBbLgJQAX/kU0DKgDLkaQAvxW4HEvQFwCRcxIJK1XznAAAAABJRU5ErkJggg=="); background-repeat: repeat-y; opacity: 0.3; filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)"; } .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{ height: 4px; margin: 6px 0; background-repeat: repeat-x; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonUp{ background-position: -16px -72px; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonDown{ background-position: -16px -92px; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -20px -112px; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonRight{ background-position: -20px -128px; } /* theme "rounded-dots-dark" */ .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail{ background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYV2NkIAAYSVFgDFR8BqrBBEifBbGRTfiPZhpYjiQFBK3A6l6CvgAAE9kGCd1mvgEAAAAASUVORK5CYII="); } .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -96px -72px; } .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -96px -92px; } .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -100px -112px; } .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -100px -128px; } /* ---------------------------------------- */ /* theme "3d", "3d-dark", "3d-thick", "3d-thick-dark" */ .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-repeat: repeat-y; background-image: -moz-linear-gradient(left, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0) 100%); background-image: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0.5)), color-stop(100%,rgba(255,255,255,0))); background-image: -webkit-linear-gradient(left, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%); background-image: -o-linear-gradient(left, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%); background-image: -ms-linear-gradient(left, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%); background-image: linear-gradient(to right, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%); } .mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ background-repeat: repeat-x; background-image: -moz-linear-gradient(top, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0) 100%); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.5)), color-stop(100%,rgba(255,255,255,0))); background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%); background-image: -o-linear-gradient(top, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%); background-image: -ms-linear-gradient(top, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%); background-image: linear-gradient(to bottom, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%); } /* theme "3d", "3d-dark" */ .mCS-3d.mCSB_scrollTools_vertical .mCSB_dragger, .mCS-3d-dark.mCSB_scrollTools_vertical .mCSB_dragger{ height: 70px; } .mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger{ width: 70px; } .mCS-3d.mCSB_scrollTools, .mCS-3d-dark.mCSB_scrollTools{ opacity: 1; filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)"; } .mCS-3d.mCSB_scrollTools .mCSB_draggerRail, .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; } .mCS-3d.mCSB_scrollTools .mCSB_draggerRail, .mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail{ width: 8px; background-color: #000; background-color: rgba(0,0,0,0.2); box-shadow: inset 1px 0 1px rgba(0,0,0,0.5), inset -1px 0 1px rgba(255,255,255,0.2); } .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-3d.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-3d.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #555; } .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 8px; } .mCS-3d.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{ width: 100%; height: 8px; margin: 4px 0; box-shadow: inset 0 1px 1px rgba(0,0,0,0.5), inset 0 -1px 1px rgba(255,255,255,0.2); } .mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ width: 100%; height: 8px; margin: 4px auto; } .mCS-3d.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px -72px; } .mCS-3d.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -92px; } .mCS-3d.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -112px; } .mCS-3d.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -128px; } /* theme "3d-dark" */ .mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.1); box-shadow: inset 1px 0 1px rgba(0,0,0,0.1); } .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{ box-shadow: inset 0 1px 1px rgba(0,0,0,0.1); } .mCS-3d-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px -72px; } .mCS-3d-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -92px; } .mCS-3d-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -112px; } .mCS-3d-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -128px; } /* ---------------------------------------- */ /* theme: "3d-thick", "3d-thick-dark" */ .mCS-3d-thick.mCSB_scrollTools, .mCS-3d-thick-dark.mCSB_scrollTools{ opacity: 1; filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)"; } .mCS-3d-thick.mCSB_scrollTools, .mCS-3d-thick-dark.mCSB_scrollTools, .mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer{ -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; } .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .mCSB_inside + .mCS-3d-thick.mCSB_scrollTools_vertical, .mCSB_inside + .mCS-3d-thick-dark.mCSB_scrollTools_vertical{ right: 1px; } .mCS-3d-thick.mCSB_scrollTools_vertical, .mCS-3d-thick-dark.mCSB_scrollTools_vertical{ box-shadow: inset 1px 0 1px rgba(0,0,0,0.1), inset 0 0 14px rgba(0,0,0,0.5); } .mCS-3d-thick.mCSB_scrollTools_horizontal, .mCS-3d-thick-dark.mCSB_scrollTools_horizontal{ bottom: 1px; box-shadow: inset 0 1px 1px rgba(0,0,0,0.1), inset 0 0 14px rgba(0,0,0,0.5); } .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ box-shadow: inset 1px 0 0 rgba(255,255,255,0.4); width: 12px; margin: 2px; position: absolute; height: auto; top: 0; bottom: 0; left: 0; right: 0; } .mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ box-shadow: inset 0 1px 0 rgba(255,255,255,0.4); } .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #555; } .mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ height: 12px; width: auto; } .mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer{ background-color: #000; background-color: rgba(0,0,0,0.05); box-shadow: inset 1px 1px 16px rgba(0,0,0,0.1); } .mCS-3d-thick.mCSB_scrollTools .mCSB_draggerRail{ background-color: transparent; } .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px -72px; } .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -92px; } .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -112px; } .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -128px; } /* theme: "3d-thick-dark" */ .mCS-3d-thick-dark.mCSB_scrollTools{ box-shadow: inset 0 0 14px rgba(0,0,0,0.2); } .mCS-3d-thick-dark.mCSB_scrollTools_horizontal{ box-shadow: inset 0 1px 1px rgba(0,0,0,0.1), inset 0 0 14px rgba(0,0,0,0.2); } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ box-shadow: inset 1px 0 0 rgba(255,255,255,0.4), inset -1px 0 0 rgba(0,0,0,0.2); } .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ box-shadow: inset 0 1px 0 rgba(255,255,255,0.4), inset 0 -1px 0 rgba(0,0,0,0.2); } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #777; } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer{ background-color: #fff; background-color: rgba(0,0,0,0.05); box-shadow: inset 1px 1px 16px rgba(0,0,0,0.1); } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: transparent; } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px -72px; } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -92px; } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -112px; } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -128px; } /* ---------------------------------------- */ /* theme: "minimal", "minimal-dark" */ .mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical, .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical{ right: 0; margin: 12px 0; } .mCustomScrollBox.mCS-minimal + .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox.mCS-minimal + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal{ bottom: 0; margin: 0 12px; } /* RTL direction/left-side scrollbar */ .mCS-dir-rtl > .mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical, .mCS-dir-rtl > .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical{ left: 0; right: auto; } .mCS-minimal.mCSB_scrollTools .mCSB_draggerRail, .mCS-minimal-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: transparent; } .mCS-minimal.mCSB_scrollTools_vertical .mCSB_dragger, .mCS-minimal-dark.mCSB_scrollTools_vertical .mCSB_dragger{ height: 50px; } .mCS-minimal.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-minimal-dark.mCSB_scrollTools_horizontal .mCSB_dragger{ width: 50px; } .mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.2); filter: "alpha(opacity=20)"; -ms-filter: "alpha(opacity=20)"; } .mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-minimal.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.5); filter: "alpha(opacity=50)"; -ms-filter: "alpha(opacity=50)"; } /* theme: "minimal-dark" */ .mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.2); filter: "alpha(opacity=20)"; -ms-filter: "alpha(opacity=20)"; } .mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.5); filter: "alpha(opacity=50)"; -ms-filter: "alpha(opacity=50)"; } /* ---------------------------------------- */ /* theme "light-3", "dark-3" */ .mCS-light-3.mCSB_scrollTools .mCSB_draggerRail, .mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail{ width: 6px; background-color: #000; background-color: rgba(0,0,0,0.2); } .mCS-light-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 6px; } .mCS-light-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-light-3.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_draggerRail{ width: 100%; height: 6px; margin: 5px 0; } .mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, .mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{ width: 12px; } .mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, .mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{ height: 12px; margin: 2px 0; } .mCS-light-3.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px -72px; } .mCS-light-3.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -92px; } .mCS-light-3.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -112px; } .mCS-light-3.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -128px; } /* theme "dark-3" */ .mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); } .mCS-dark-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); } .mCS-dark-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-dark-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); } .mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.1); } .mCS-dark-3.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px -72px; } .mCS-dark-3.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -92px; } .mCS-dark-3.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -112px; } .mCS-dark-3.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -128px; } /* ---------------------------------------- */ /* theme "inset", "inset-dark", "inset-2", "inset-2-dark", "inset-3", "inset-3-dark" */ .mCS-inset.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail{ width: 12px; background-color: #000; background-color: rgba(0,0,0,0.2); } .mCS-inset.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 6px; margin: 3px 5px; position: absolute; height: auto; top: 0; bottom: 0; left: 0; right: 0; } .mCS-inset.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ height: 6px; margin: 5px 3px; position: absolute; width: auto; top: 0; bottom: 0; left: 0; right: 0; } .mCS-inset.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{ width: 100%; height: 12px; margin: 2px 0; } .mCS-inset.mCSB_scrollTools .mCSB_buttonUp, .mCS-inset-2.mCSB_scrollTools .mCSB_buttonUp, .mCS-inset-3.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px -72px; } .mCS-inset.mCSB_scrollTools .mCSB_buttonDown, .mCS-inset-2.mCSB_scrollTools .mCSB_buttonDown, .mCS-inset-3.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -92px; } .mCS-inset.mCSB_scrollTools .mCSB_buttonLeft, .mCS-inset-2.mCSB_scrollTools .mCSB_buttonLeft, .mCS-inset-3.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -112px; } .mCS-inset.mCSB_scrollTools .mCSB_buttonRight, .mCS-inset-2.mCSB_scrollTools .mCSB_buttonRight, .mCS-inset-3.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -128px; } /* theme "inset-dark", "inset-2-dark", "inset-3-dark" */ .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); } .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); } .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); } .mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.1); } .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonUp, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonUp, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px -72px; } .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonDown, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonDown, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -92px; } .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonLeft, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonLeft, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -112px; } .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonRight, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonRight, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -128px; } /* theme "inset-2", "inset-2-dark" */ .mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: transparent; border-width: 1px; border-style: solid; border-color: #fff; border-color: rgba(255,255,255,0.2); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail{ border-color: #000; border-color: rgba(0,0,0,0.2); } /* theme "inset-3", "inset-3-dark" */ .mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail{ background-color: #fff; background-color: rgba(255,255,255,0.6); } .mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.6); } .mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); } .mCS-inset-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); } .mCS-inset-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-inset-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); } .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.75); } .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.85); } .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.9); } /* ---------------------------------------- */ /* End */ /* Start:/local/templates/kraska/design/css/selectric.css?17278929814543*/ /*====================================== Selectric v1.13.0 ======================================*/ .selectric-wrapper { position: relative; cursor: pointer; } .selectric-responsive { width: 100%; } .selectric { border: 1px solid #DDD; border-radius: 0px; background: #F8F8F8; position: relative; overflow: hidden; } .selectric .label { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0 38px 0 10px; font-size: 12px; line-height: 38px; color: #444; height: 38px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .selectric .button { display: block; position: absolute; right: 0; top: 0; width: 38px; height: 38px; line-height: 38px; background-color: #F8f8f8; color: #BBB; text-align: center; font: 0/0 a; *font: 20px/38px Lucida Sans Unicode, Arial Unicode MS, Arial; } .selectric .button:after { content: " "; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; width: 0; height: 0; border: 4px solid transparent; border-top-color: #BBB; border-bottom: none; } .selectric-focus .selectric { border-color: #aaaaaa; } .selectric-hover .selectric { border-color: #c4c4c4; } .selectric-hover .selectric .button { color: #a2a2a2; } .selectric-hover .selectric .button:after { border-top-color: #a2a2a2; } .selectric-open { z-index: 9999; } .selectric-open .selectric { border-color: #c4c4c4; } .selectric-open .selectric-items { display: block; } .selectric-disabled { filter: alpha(opacity=50); opacity: 0.5; cursor: default; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .selectric-hide-select { position: relative; overflow: hidden; width: 0; height: 0; } .selectric-hide-select select { position: absolute; left: -100%; } .selectric-hide-select.selectric-is-native { position: absolute; width: 100%; height: 100%; z-index: 10; } .selectric-hide-select.selectric-is-native select { position: absolute; top: 0; left: 0; right: 0; height: 100%; width: 100%; border: none; z-index: 1; box-sizing: border-box; opacity: 0; } .selectric-input { position: absolute !important; top: 0 !important; left: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; margin: 0 !important; padding: 0 !important; width: 1px !important; height: 1px !important; outline: none !important; border: none !important; *font: 0/0 a !important; background: none !important; } .selectric-temp-show { position: absolute !important; visibility: hidden !important; display: block !important; } /* Items box */ .selectric-items { display: none; position: absolute; top: 100%; left: 0; background: #F8F8F8; border: 1px solid #c4c4c4; z-index: -1; box-shadow: 0 0 10px -6px; } .selectric-items .selectric-scroll { height: 100%; overflow: auto; } .selectric-above .selectric-items { top: auto; bottom: 100%; } .selectric-items ul, .selectric-items li { list-style: none; padding: 0; margin: 0; font-size: 12px; line-height: 20px; min-height: 20px; } .selectric-items li { display: block; padding: 10px; color: #666; cursor: pointer; } .selectric-items li.selected { background: #E0E0E0; color: #444; } .selectric-items li.highlighted { background: #D0D0D0; color: #444; } .selectric-items li:hover { background: #D5D5D5; color: #444; } .selectric-items .disabled { filter: alpha(opacity=50); opacity: 0.5; cursor: default !important; background: none !important; color: #666 !important; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .selectric-items .selectric-group .selectric-group-label { font-weight: bold; padding-left: 10px; cursor: default; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background: none; color: #444; } .selectric-items .selectric-group.disabled li { filter: alpha(opacity=100); opacity: 1; } .selectric-items .selectric-group li { padding-left: 25px; } /* End */ /* Start:/local/templates/kraska/design/css/slick.css?17278929811807*/ /* 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; } .slick-track:before, .slick-track:after { display: table; content: ''; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { display: none; float: left; height: 100%; min-height: 1px; } [dir='rtl'] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } /* End */ /* Start:/local/templates/kraska/design/css/style.css?1791537448185195*/ /* Eric Meyer's CSS Reset */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } html{ width: 100%; height: 100%; overflow-x: hidden; } html:before{ } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; } /* End of Eric Meyer's CSS Reset */ article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; } body { font-family: 'Cera Pro', sans-serif; height: 100%; color: #313A46; } .wrapper { min-width: 100%; min-height: 100%; max-width: 100%; margin: 0 auto; } .wrapper-inside{ width: calc(100% - 120px); margin: 0 auto; max-width: 1800px; } a{ color: #313A46; text-decoration: none; } a:hover{ text-decoration: underline; } img, svg{ vertical-align: top; } .icon{ display: inline-block; } .h1, h1{ font-size: 40px; font-weight: 700; line-height: 56px; } .h2, h2{ font-size: 36px; font-weight: 700; line-height: 48px; } .h3, h3{ font-size: 32px; font-weight: 700; line-height: 40px; } .h4, h4{ font-size: 28px; font-weight: 700; line-height: 32px; } .large{ font-size: 22px; font-weight: 500; line-height: 32px; } p{ font-size: 16px; font-weight: 500; line-height: 24px; } .style-2{ font-size: 16px; font-weight: 400; line-height: 24px; } .small{ font-size: 14px; font-weight: 400; line-height: 16px; } .error{ color: #C00; } .content-mode{ } .content-mode h2{ margin-top: 32px; margin-bottom: 25px; } .content-mode p{ margin-bottom: 12px; } .content-mode p:last-of-type { margin-bottom: 0px; } .content-mode ul{ /*padding-left: 20px;*/ margin-bottom: 12px; } .content-mode ul li{ /*margin-bottom: 12px;*/ position: relative; padding-left: 24px; } .content-mode ul li:before { content: ""; position: absolute; display: inline-block; width: 4px; height: 4px; background: #313A46; border-radius: 50%; left: 9px; top: 11px; } .content-mode.detail-text p{ margin-bottom: 16px; } .content-mode.detail-text ul{ } .content-mode.detail-text ul li{ margin-bottom: 8px; } .content-mode.detail-text ul li p{ margin-bottom: 0px; } .content-mode.detail-text ul li:before{ top: 8px; } .content-mode.detail-text ul li:last-of-type{ margin-bottom: 0px; } .content-mode .content-page-img{ margin-bottom: 27px; } .content-mode .content-page-img img{ border-radius: 8px; max-width: 100%; } b{ font-weight: bold; } i{ font-style: italic; } .bg-dark-500{ background: #313A46; } .bg-dark-400{ background: #7F8286; } .bg-gray-500{ background: #D2DAED; } .bg-gray-400{ background: #EEF0F5; } .bg-red-500{ background: #BE707D; } .bg-white-500{ background: white; } .bg-greene-500{ background: #21B527; } .bg-dark-500{ color: white; } .bg-dark-500 a{ color: white; } .bg-white-500{ color: #313A46; } .bg-white-500 a{ color: #313A46; } .btn{ font-family: 'Cera Pro'; position: relative; border: 0px; cursor: pointer; font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; display: inline-block; padding: 16px 24px; border-radius: 8px; -webkit-transition: .6s cubic-bezier(.645,.045,.355,1); -o-transition: .6s cubic-bezier(.645,.045,.355,1); transition: .6s cubic-bezier(.645,.045,.355,1); box-sizing: border-box; } .btn:hover{ text-decoration: none; } .btn-primary{ background: #313A46; color: white; } .btn-primary.disabled{ background: #313A46; } .btn-primary:hover{ background: #30363E; } .btn-primary:focus{ background: #313A46; color: white; } .btn-secondary{ background: #EEF0F5; } .btn-secondary.disabled{ background: #EEF0F5; color: #313A46; } .btn-primary.disabled.calcBtnNextStep{ background: #EEF0F5; color: #313A46 } .btn-primary.disabled.sendCalculatorForm{ background: #EEF0F5; color: #313A46 } .btn-secondary:focus{ background: #EEF0F5; } .btn-secondary:hover{ background: #D2DAED; } .btn-small{ padding: 12px 24px; } .with-2-icons{ padding: 12px 16px; } .btn-with-icon{ display: flex; gap: 8px; } .btn-with-icon .icon{ display: flex; width: 24px; height: 24px; align-items: center; justify-content: center; } .btn-full-size{ width: 100%; text-align: center; } .section{ vertical-align: top; display: inline-block; width: 100%; } .pd-top{ } .pd-bottom{ } .mg-top{ margin-top: 100px; } .mg-bottom{ margin-bottom: 100px; } .mg-bottom-small{ margin-bottom: 20px; } /* .mg-top{ margin-top: 1.86vw; } .mg-bottom{ margin-bottom: 2.79vw; } .padding-mod{ position: relative; padding: 4.575vw 3.268vw; } .padding-mod-footer{ position: relative; padding: 3.268vw 3.268vw; } .pd-top{ padding-top: 2.61437vw; } .pd-bottom{ padding-bottom: 2.61437vw; } .mrgn-top{ margin-top: 1.9608vw; } .mrgn-bottom{ margin-bottom: 1.9608vw; } */ .link-with-icon{ display: flex; align-items: center; gap: 12px; } .link-with-icon:hover{ text-decoration: none; } .link-with-icon .icon{ } .link-with-icon .text{ } .link-with-nothing{ text-decoration: none!important; position: relative; } .link-with-nothing:before { content: ""; position: absolute; display: inline-block; width: 100%; height: 1px; background: #313A46; left: 0px; bottom: 0px; transition: all 0.3s ease; } .link-with-nothing:hover{ text-decoration: none; } .link-with-nothing:hover:before{ opacity: 0; } .checkbox-politica p a{ /*text-decoration: underline;*/ } .checkbox-politica p a:hover{ /*text-decoration: none;*/ } form .line-label{ display: inline-block; width: 100%; margin-bottom: 4px; } form .big-size .line-label{ margin-bottom: 9px; } .form-input{ } .form-input input[type=number], .form-input input[type=text], .form-input input[type=tel], .form-input input[type=password], .form-input textarea{ border-radius: 8px; border: 1px solid #D2DAED; background: #FFF; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; color: #313A46; padding: 10px 12px 12px; font-family: "Cera Pro"; width: 100%; box-sizing: border-box; transition: all 0.3s ease; outline: none; } .form-input input[type=number]:focus, .form-input input[type=text]:focus, .form-input input[type=tel]:focus, .form-input input[type=password]:focus, .form-input textarea:focus { outline: none; border: 1px solid #313A46; } .form-input .bx-sls .bx-ui-sls-fake, .form-input .bx-sls .bx-ui-sls-route{ border-radius: 8px; border: 1px solid #D2DAED; background: #FFF; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; color: #313A46; padding: 10px 0px 12px !important; font-family: "Cera Pro"; width: 100%; box-sizing: border-box; transition: all 0.3s ease; outline: none; height: 100%; } .form-input .bx-sls .bx-ui-sls-container{ min-height: 48px; } .form-input .bx-sls .dropdown-block{ border: 1px solid #D2DAED; padding: 0 32px 0 40px; border-radius: 8px; box-shadow: none; } .form-input .bx-sls .dropdown-icon{ top: 17px; } .form-input .bx-sls .dropdown-fade2white{ top: 0px; height: 100%; border-radius: 8px; } .form-input .bx-sls .bx-ui-sls-clear{ margin-top: 0px; top: 9px; } .form-input .bx-sls .bx-ui-sls-pane{ padding: 0px; padding-top: 10px; position: absolute; border: 1px solid #D2DAED; width: calc(100% + 2px); box-sizing: border-box; left: -1px; background: white; z-index: 1; border-top: 0px; border-radius: 0 0 8px 8px; box-shadow: none; } .form-input textarea{ height: 98px; resize: none; } .input-with-icon{ position: relative; } .input-with-icon .input-icon{ position: absolute; left: 19px; top: 15px; } .input-with-icon .form-input input[type=text]{ padding-left: 47px; } .form-input-number{ position: relative; } .form-input-number .number-controller{ position: absolute; top: 50%; transform: translateY(-50%); } .form-input-number .number-controller.minus{ left: 16px; } .form-input-number .number-controller.plus{ right: 16px; } .form-input-number input{ text-align: center; padding: 10px 44px 12px; } .password-field{ position: relative; } .password-field .password-open{ position: absolute; right: 20px; top: 12px; } .password-open.active{ } .password-open .password-open-active{ position: absolute; left: 0px; top: 0px; opacity: 0; } .password-open .password-open-inactive{ opacity: 1; } .password-open.active .password-open-active{ opacity: 1; } .password-open.active .password-open-inactive{ opacity: 0; } .select-pseudo{ position: relative; } .select-pseudo.active{ } .select-pseudo-selected{ display: flex; justify-content: space-between; align-items: center; border-radius: 8px; border: 1px solid #D2DAED; background: #FFF; box-sizing: border-box; padding: 11px 11px 11px 16px; cursor: pointer; } .select-pseudo-selected .name{ display: flex; align-items: center; gap: 8px; } .select-pseudo-selected .color{ display: inline-block; width: 20px; height: 20px; border-radius: 50%; } .select-pseudo-selected .icon{ transition: all 0.3s ease; } .select-pseudo.active .select-pseudo-selected .icon{ transform: rotate(180deg); } .select-pseudo.active .select-pseudo-selected{ border-radius: 8px 8px 0 0; border-bottom: 1px solid white; } .select-pseudo-list{ padding-top: 10px; position: absolute; border: 1px solid #D2DAED; width: 100%; box-sizing: border-box; background: white; z-index: 1; border-top: 0px; border-radius: 0 0 8px 8px; } .select-pseudo-list .select-pseudo-list-item{ cursor: pointer; padding: 11px 11px 11px 16px; transition: all 0.3s ease; } .select-pseudo-list .select-pseudo-list-item:hover{ background: #EEF0F5; } .select-pseudo-list .select-pseudo-list-item.current{ background: #EEF0F5; } .form-field-four-line{ display: flex; margin: 0 -6px 8px; } .form-field-four-line .form-field-line-item{ width: 25%; box-sizing: border-box; padding: 0 6px; } .form-field-four-line .form-field-line-item.form-btn{ } .form-field-four-line .form-field-line-item.form-btn .btn{ width: 100%; } .form-field-two-line{ display: flex; margin: 0 -6px 8px; } .form-field-two-line .form-field-line-item, .form-field-two-line .form-field-one-line{ width: 50%; box-sizing: border-box; padding: 0 6px; } .form-field-two-line .form-field-one-line .form-field-line-item{ padding: 0px; width: 100%; } .personal-remember-line{ display: flex; justify-content: space-between; margin-bottom: 20px; } .politica-text{ text-align: center; } .shildic-item{ display: inline-flex; padding: 4px 8px; justify-content: center; align-items: center; gap: 10px; border-radius: 8px; } .status-icon{ display: flex; gap: 3px; align-items: center; } .button-on-center{ text-align: center; } .projects-list { display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(2, 1fr); grid-column-gap: 24px; grid-row-gap: 32px; margin-bottom: 32px; } .div1 { grid-area: 1 / 1 / 3 / 2; } .div2 { grid-area: 1 / 2 / 2 / 3; } .div3 { grid-area: 1 / 3 / 2 / 4; } .div4 { grid-area: 2 / 2 / 3 / 3; } .div5 { grid-area: 2 / 3 / 3 / 4; } .project-item{ } .project-item a{ text-decoration: none; } .project-item a .project-item-container{ } .project-item a .project-item-picture{ position: relative; margin-bottom: 20px; } .project-item a .project-item-picture .shildics{ position: absolute; left: 15px; top: 15px; } .project-item a .project-item-picture img{ border-radius: 8px; width: 100%; } .project-item a .project-item-desc{ display: flex; justify-content: space-between; } .project-item a .project-date{ margin-bottom: 10px; } .project-item-desc-status{ display: flex; gap: 16px; padding-right: 7px; } .header{ } .header-line-top{ border-bottom: 1px solid #EEF0F5; } .header-line-top-container{ display: flex; padding: 7px 0 8px; justify-content: space-between; } .header-top-menu{ } .header-top-menu ul{ display: flex; gap: 22px; } .header-top-menu ul li{ } .header-top-menu ul li a{ } .header-top-menu ul li a.header-top-menu-calc-link{ display: inline-flex; align-items: center; gap: 4px; } .header-top-menu-icon{ display: inline-flex; width: 18px; height: 18px; flex: 0 0 18px; } .header-top-menu-icon img{ display: block; width: 18px; height: 18px; } .header-line-middle-container{ display: flex; padding: 12px 0 20px 0px; align-items: flex-start; gap: 36px; } .header-search{ width: 100%; } .header-phone{ width: 130px; display: flex; flex-direction: column; white-space: nowrap; } .header-phone-number{ } .header-phone-number a{ text-decoration: none; } .header-basket{ width: 130px; display: flex; white-space: nowrap; } .header-basket a{ display: flex; gap: 8px; } .header-basket a:hover{ text-decoration: none; } .header-basket-icon{ position: relative; } .header-basket-icon .header-backet-count{ position: absolute; display: flex; width: 20px; height: 20px; border-radius: 50%; align-items: center; justify-content: center; color: white; font-size: 12px; font-weight: 500; line-height: 140%; /* 16.8px */ letter-spacing: -0.276px; top: 0px; right: 2px; } .main-menu{ } .main-menu ul{ display: flex; padding: 12px 0; justify-content: space-between; align-items: center; } .main-menu ul li{ } .main-menu ul li a{ color: white; letter-spacing: -0.276px; text-transform: uppercase; text-decoration: none; position: relative; } .main-menu ul li a:before{ /*content: "";*/ position: absolute; display: inline-block; width: 0; height: 1px; background: white; left: 0px; bottom: 0px; transition: all 0.3s ease; } .main-menu ul li a:hover:before, .main-menu ul li a.active:before{ width: 100%; } .main-menu ul li a.link-with-icon{ gap: 8px; } .slick-slider-btns{ } .slick-slider-btns .slick-slider-btn{ display: flex; width: 48px; height: 48px; border-radius: 50%; background: rgba(255,255,255,0.8); align-items: center; justify-content: center; color: #313A46; cursor: pointer; } .products-list-item-slider-btn .slick-arrow.slick-hidden{ display: none; } .slick-slider-btns .slick-slider-btn.bg-gray-400{ background: #EEF0F5; -webkit-transition: .6s cubic-bezier(.645,.045,.355,1); -o-transition: .6s cubic-bezier(.645, .045, .355, 1); transition: .6s cubic-bezier(.645,.045,.355,1); } .slick-slider-btns .slick-slider-btn.bg-gray-400:hover{ background: #D2DAED; opacity: 1; } .slick-slider-btns .slick-slider-btn svg{ } .slick-slider-btns .slick-slider-btn.btn-next svg{ transform: rotate(180deg); } .section-main-banner{ padding-top: 64px; } .section-main-banner-container{ display: flex; justify-content: space-between; } .main-banner-slider{ position: relative; border-radius: 8px; overflow: hidden; width: 74.675%; } .main-banner-slider .main-banner-slider-btn{ } .main-banner-slider .main-banner-slider-btn .slick-slider-btn{ position: absolute; z-index: 1; top: 50%; transform: translateY(-50%); } .main-banner-slider .main-banner-slider-btn .slick-slider-btn.btn-prev{ left: 24px; } .main-banner-slider .main-banner-slider-btn .slick-slider-btn.btn-next{ right: 24px; } .main-slider-item{ } .main-slider-item .main-slider-item-content{ position: relative; } .main-slider-item .main-slider-item-pic{ } .main-slider-item .main-slider-item-desc{ position: absolute; display: inline-block; width: 100%; height: 100%; left: 0px; top: 0px; box-sizing: border-box; padding: 136px; } .main-slider-item .main-slider-item-desc .main-slider-item-desc-container{ width: 25%; height: 100%; display: flex; flex-direction: column; justify-content: center; } .main-slider-item .main-slider-item-desc .main-slider-item-btn{ margin-top: 24px; } .section-main-actions{ position: relative; border-radius: 8px; overflow: hidden; width: 24%; } .section-main-actions-desc{ position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; box-sizing: border-box; padding: 32px 23px; } .section-main-actions-desc .section-main-actions-btn{ margin-top: 24px; } .section-content-header{ text-align: center; margin-bottom: 4px; } .section-content-header.left{ text-align: left; } .catalog-groups-list, .articles-list-item-slider, .products-list-item-slider{ position: relative; } .catalog-groups-list .catalog-groups-list-btn, .articles-list-item-slider .articles-list-item-slider-btn, .products-list-item-slider .products-list-item-slider-btn{ position: absolute; right: 0px; top: -52px; display: flex; gap: 16px; } .catalog-groups-list .catalog-groups-list-btn{ } .catalog-groups-slider, .articles-list-slider, .products-list-slider{ margin: 0 -12px; } .catalog-groups-slider .catalog-group-item, .articles-list-slider .articles-list-item, .products-list-slider .product-card-item{ box-sizing: border-box; padding: 20px 12px; } .catalog-group-item{ } .catalog-group-item a{ text-align: center; } .catalog-group-item a .catalog-group-item-pic{ margin-bottom: 20px; } .catalog-group-item a .catalog-group-item-pic img{ border-radius: 8px; width: 100%; } .catalog-group-item a .catalog-group-item-name{ } .articles-list-item{ } .articles-list-item-container{ display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; box-sizing: border-box; padding: 15px; border-radius: 8px; border: 1px solid #EEF0F5; background: #FFF; box-shadow: 0px 4px 16px 0px rgba(49, 58, 70, 0.10); height: 100%; } .articles-list-item-pic{ position: relative; width: 41.305%; } .articles-list-item-pic img{ border-radius: 8px; width: 100%; } .articles-list-item .articles-list-item-pic .shildics{ position: absolute; left: 16px; top: 16px; } .articles-list-item-desc{ width: 58.695%; padding-left: 4.375%; padding-top: 7px; box-sizing: border-box; display: flex; flex-direction: column; justify-content: space-between; } .articles-list-item-container.without-photo { padding: 22px 23px; } .articles-list-item-container.without-photo .articles-list-item-desc{ width: 100%; padding: 0px; } .articles-list-item-desc .articles-list-item-name{ } .articles-list-item-container.without-photo .articles-list-item-desc .articles-list-item-name { margin-bottom: 8px; } .articles-list-item-container.without-photo .articles-list-item-desc .articles-list-item-date{ margin-bottom: 20px; } .articles-list-item-desc .articles-list-item-text{ margin-top: 12px; } .articles-list-item-desc .articles-list-item-btn{ margin-top: 24px; } .articles-list-item-slider + .button-on-center{ margin-top: 12px; } .products-list-item-slider{ margin-bottom: 30px; } .product-card-item{ width: 100%; } .product-card-banner-btn{ margin-top: 10px; } .product-card-item a{ text-decoration: none; } .product-card-item a .product-card-container{ } .product-card-picture{ position: relative; height: 310px; } .smaller-card .product-card-picture{ height: 200px; } .product-card-picture .product-card-picture-bg{ display: inline-block; width: 100%; height: 100%; } .product-card-picture .product-card-picture-bg img{ width: 100%; height: 100%; object-fit: cover; } .item-banka .product-card-picture .product-card-picture-bg{ text-align: center; padding: 20px; box-sizing: border-box; } .item-banka .product-card-picture .product-card-picture-bg img{ width: auto; object-fit: contain; width: 100%; height: 100%; margin: 0 auto; } .item-banka .product-card-picture .product-card-picture-bg.kartina-pic{ padding: 0px; } .product-card-picture.with-bank{ } .product-card-picture.with-bank .product-card-picture-bank{ position: absolute; left: 12px; bottom: 12px; width: 35%; max-width: 132px; } .product-card-picture.with-bank .product-card-picture-bank img{ max-width: 100%; } .product-card-item a .product-card-container{ } .product-card-desc{ margin-top: 20px; text-align: center; } .product-card-container.item-video .product-card-desc{ text-align: left; } .product-card-price{ margin-top: 10px; } .product-card-picture.item-kartina-list .product-card-picture-bg.kartina-pic{ display: flex; align-items: center; /*height: auto;*/ } .product-card-picture.item-kartina-list .product-card-picture-bg.kartina-pic img{ height: auto; max-height: 100%; } .product-card-container.item-banner{ border-radius: 8px; border: 1px solid #EEF0F5; background: #FFF; box-shadow: 0px 4px 16px 0px rgba(49, 58, 70, 0.10); box-sizing: border-box; padding: 24px; } .item-banner .product-card-banner-pic{ } .item-banner .product-card-banner-pic img{ width: 100%; border-radius: 8px; } .item-banner .product-card-banner-desc{ display: flex; flex-direction: column; justify-content: center; align-items: center; margin-top: 24px; } .large.center{ text-align: center; } .faq-item{ border-bottom: 1px solid #D2DAED; } .faq-item-header{ } .faq-item .faq-item-header{ } .faq-item-header a{ display: flex; justify-content: space-between; align-items: center; padding: 32px 0; text-decoration: none; } .faq-item-header a .faq-item-name{ } .faq-item-header a .faq-item-icon{ transition: all 0.3s ease; } .open .faq-item-header a .faq-item-icon{ transform: rotate(180deg); } .faq-item:last-of-type .faq-item-header a .faq-item-icon{ morder-bottom: 0px; } .faq-item-body{ padding-bottom: 32px; } .catalog-filter-menu-item{ position: relative; } .catalog-filter-menu-item a .icon.arrow{ transition: all 0.3s ease; } .catalog-filter-menu-item a.selected .icon.arrow{ transform: rotate(180deg); } .filter-menu-item-block{ position: absolute; border-radius: 12px; background: #FFF; box-shadow: 0px 1px 20px 0px rgba(31, 35, 45, 0.15); box-sizing: border-box; padding: 16px; z-index: 10; width: 320px; left: 50%; transform: translateX(-50%); top: calc(100% + 12px); } .filter-menu-item-block.first-item{ left: 0px; transform: unset; } .filter-menu-item-block.last-item{ left: auto; right: 0px; transform: unset; } .filter-menu-item-block:after { bottom: 100%; left: 50%; border: solid transparent; content: ""; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(255, 255, 255, 0); border-bottom-color: white; border-width: 8px; margin-left: -8px; } .filter-menu-item-block.first-item:after{ left: 25%; } .filter-menu-item-block.last-item:after{ left: 75%; } .brand-list-item{ height: 100%; width: 100%; box-sizing: border-box; padding: 16px 20px; border-radius: 8px; background: #FFF; box-shadow: 0px 4px 16px 0px rgba(49, 58, 70, 0.10); } .brand-list-item a{ text-decoration: none; display: flex; flex-direction: column; gap: 8px; justify-content: center; align-items: center; } .brand-list-item .brand-list-item-pic{ height: 64px; display: flex; justify-content: center; align-items: center; } .brand-list-item .brand-list-item-pic img{ height: 100%; } .brand-list-item .brand-list-item-name{ } .checkbox-color-control{ } .pseudo-checkbox-control{ display: flex; gap: 8px; align-items: center; } .pseudo-checkbox-control input{ display: none; } .pseudo-checkbox-control .checkbox-color-sphere{ position: relative; display: inline-block; width: 20px; height: 20px; border-radius: 50%; } .pseudo-checkbox-control input:checked + .checkbox-color-sphere{ } .pseudo-checkbox-control input:checked + .checkbox-color-sphere:before{ content: ""; position: absolute; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: white; left: 50%; top: 50%; transform: translate(-50%, -50%); } .pseudo-checkbox-control .checkbox-color-name{ white-space: nowrap; } .radio-button-item{ margin-bottom: 14px; } .radio-button-item label{ display: flex; gap: 12px; align-items: center; } .manager-form-inside{ display: flex; flex-direction: column; gap: 31px; width: 100%; max-width: 689px; position: relative; z-index: 2; } .manager-form-title{ color: #313B47; font-size: 40px; font-style: normal; font-weight: 700; line-height: normal; width: 100%; } .manager-form-desc{ color: var(--Dark500, #313A46); font-size: 22px; font-style: normal; font-weight: 400; line-height: normal; } .manager-form-section-input input{ color: #6B6D7C; font-size: 16px; font-style: normal; font-weight: 300; line-height: normal; padding: 14px 16px 17px 16px; border-radius: 8px; border: 1px solid #CEDBEB; background: #FFF; box-sizing: border-box; width: 100%; } .manager-form-section-input{ width: calc(50% - 14px); max-width: 275px; } .manager-form-section-inputs{ display: flex; flex-wrap: wrap; gap: 28px; } .manager-form-container{ padding: 109px 165px; border-radius: 35px; border: 2px solid #CEDBEB; position: relative; overflow: hidden; } .manager-form-img{ position: absolute; right: 0; top: 0; width: 100%; height: 100%; } .manager-form-img img{ width: 100%; height: 100%; object-fit: cover; } .manager-form-section .btn{ padding: 17px 30px; font-size: 18px; font-style: normal; font-weight: 500; line-height: normal; } .manager-form-title.desktop{ display: inline-block; } .manager-form-title.mobile{ display: none; } .section-manager-form{ padding: 40px 0; } .product-price-warning{ display: flex; gap: 12px; padding: 12px 3px; align-items: center; color: var(--Dark500, #313A46); font-size: 16px; font-style: normal; font-weight: 500; line-height: 18px; /* 112.5% */ } .product-price-warning-icon svg{ display: flex; } .product-price-warning-text{ width: calc(100% - 32px); } .h1-desc{ margin-top: 24px; color: #313A46; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; /* 150% */ } .questions-container{ width: 100%; max-width: 1200px; margin: 0 auto; margin-top: 69px; } .questions-container .large{ color: var(--Dark500, #313A46); font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; /* 150% */ } .accordion-title{ color: var(--Dark500, #313A46); font-size: 36px; font-style: normal; font-weight: 700; line-height: 48px; /* 133.333% */ width: calc(100% - 30px); } .accordion-head{ display: flex; justify-content: space-between; align-items: center; cursor: pointer; } .accordion-icon { width: 24px; height: 24px; position: relative; } .accordion-icon::before, .accordion-icon::after { content: ''; position: absolute; left: 50%; top: 50%; width: 12px; height: 1.5px; background: #313A46; transition: transform 300ms ease, width 300ms ease; } .accordion-icon::before { transform: translate(-50%, -50%) rotate(0deg); } .accordion-icon::after { transform: translate(-50%, -50%) rotate(90deg); } .accordion.active .accordion-icon::before { width: 9px; transform: translate(-82%, -50%) rotate(45deg); } .accordion.active .accordion-icon::after { width: 9px; transform: translate(-18%, -50%) rotate(-45deg); } .accordion{ padding: 35px 72px; } .accordions .accordion:not(:last-child){ border-bottom: 1px solid #D2DAED; } .accordions{ border-radius: 12px; background: #FFF; box-shadow: 0 4px 16px 0 rgba(49, 58, 70, 0.10); } .accordion-body-inside{ padding-top: 30px; } .accordion-body-inside p { color: var(--Dark400, #7F8286); font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; /* 150% */ } .accordion-body { display: grid; grid-template-rows: 0fr; opacity: 0; overflow: hidden; transition: grid-template-rows 350ms cubic-bezier(0.4, 0, 0.2, 1), opacity 250ms ease; } .accordion-body-inside { min-height: 0; padding-top: 0; overflow: hidden; transition: padding-top 350ms cubic-bezier(0.4, 0, 0.2, 1); } .accordion.active .accordion-body { grid-template-rows: 1fr; opacity: 1; } .accordion.active .accordion-body-inside { padding-top: 30px; } .question-form{ border-radius: 12px; border: 1px solid var(--Gray400, #EEF0F5); background: linear-gradient(270deg, rgba(255, 255, 255, 0.00) 14.47%, rgba(255, 255, 255, 0.65) 32.76%), linear-gradient(270deg, rgba(255, 255, 255, 0.00) 14.47%, rgba(255, 255, 255, 0.89) 32.76%), linear-gradient(270deg, rgba(255, 255, 255, 0.00) 14.47%, rgba(255, 255, 255, 0.65) 32.76%); box-shadow: 0 4px 16px 0 rgba(49, 58, 70, 0.10); padding: 59px 407px 58px 62px; position: relative; overflow: hidden; } .question-form-bg{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: -1; } .question-form-container{ margin-top: 85px; } .question-form-bg img{ width: 110%; height: 100%; object-fit: cover; } .question-form-title{ color: var(--Dark500, #313A46); font-size: 36px; font-style: normal; font-weight: 700; line-height: 48px; /* 133.333% */ margin-bottom: 11px; } .question-form-desc{ color: var(--Dark500, #313A46); font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; /* 150% */ } .question-form-desc p{ display: flex; align-items: center; gap: 8px; } .question-form-desc-number{ color: var(--Dark500, #313A46); font-size: 22px; font-style: normal; font-weight: 500; line-height: 32px; /* 145.455% */ 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; display: flex; align-items: center; gap: 8px; } .question-form-desc-number-icon{ display: flex; } .question-form-input input{ padding: 16px; border-radius: 8px; border: 1px solid var(--Gray500, #D2DAED); background: #FFF; color: var(--Dark400, #7F8286); font-size: 14px; font-style: normal; font-weight: 400; line-height: 16px; /* 114.286% */ width: 100%; box-sizing: border-box; } .question-form-input-section{ display: flex; flex-wrap: wrap; gap: 12px; } .question-form-input{ width: 100%; } .w-50 .question-form-input{ width: calc(50% - 6px); } .question-form-input-sections{ display: flex; flex-direction: column; gap: 16px; } .question-form-body .btn{ width: 100%; margin: 40px 0 28px } .question-form-body{ margin-top: 40px; } @media (max-width: 767px) { .product-price-warning{ font-size: 14px; font-style: normal; font-weight: 500; line-height: 20px; /* 142.857% */ } } @media (hover: hover) { .radio-button-item label:hover{ cursor: pointer; } } .radio-button-item label input{ display: none; } .radio-button-item label .pseudo-radio{ display: inline-block; width: 20px; height: 20px; border-radius: 50%; box-sizing: border-box; border: 1px solid #D2DAED; position: relative; background: white; flex-shrink: 0; } .radio-button-item label input:checked + .pseudo-radio{ background: #313A46; border: 1px solid #313A46; } .radio-button-item label .pseudo-radio:before{ content: ""; position: absolute; display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: white; left: 50%; top: 50%; transform: translate(-50%, -50%); } .radio-button-item label .name { max-width: calc(100% - 20px - 12px); } .normal-checkbox-control{ } .normal-checkbox-control label{ display: flex; gap: 10px; align-items: center; } @media (hover: hover) { .normal-checkbox-control label:hover { cursor: pointer; } } .normal-checkbox-control label input{ display: none; } .normal-checkbox-control label .pseudo-checkbox{ display: inline-block; width: 20px; height: 20px; border-radius: 2px; border: 1px solid #D2DAED; background: #FFF; box-sizing: border-box; position: relative; transition: all 0.3s ease; } .normal-checkbox-control label input:checked + .pseudo-checkbox{ background: #313A46; border: 1px solid #313A46; } .normal-checkbox-control label .pseudo-checkbox:before{ content: ""; position: absolute; display: inline-block; width: 12px; height: 9px; background: url(/local/templates/kraska/design/css/../img/check-active.svg) no-repeat center center; left: 50%; top: 50%; transform: translate(-50%, -50%); } .normal-checkbox-control label .name{ transition: all 0.3s ease; } .normal-checkbox-control label input:checked + .pseudo-checkbox + .name{ font-weight: 500; } .chars-table{ margin-top: 8px; border-radius: 8px; box-sizing: border-box; padding: 0 16px; } .chars-table-item-line{ display: flex; border-bottom: 1px solid #D2DAED; align-items: center; } .chars-table-item{ box-sizing: border-box; padding: 12px 0 9px; } .chars-table-item.line-1{ width: 50.85%; padding: 12px 16px 9px 0; } .chars-table-item.line-2{ width: 17.2%; text-align: right; padding: 12px 16px 9px; } .chars-table-item.line-3{ width: 17.9%; padding: 12px 16px 9px; } .chars-table-item.line-4{ width: 17.05%; padding: 12px 0 9px 16px; } .in-3-line .chars-table-item.line-1{ width: 50%; padding: 12px 16px 9px 0; } .in-3-line .chars-table-item.line-2{ width: 25%; text-align: right; padding: 12px 16px 9px; } .in-3-line .chars-table-item.line-3{ width: 25%; padding: 12px 16px 9px; text-align: right; } .calculator-form-result-numbers .in-4-line .chars-table-item.line-1{ width: 182px; } .calculator-form-result-numbers .in-4-line .chars-table-item.line-2{ width: 110px; } .calculator-form-result-numbers .in-4-line .chars-table-item.line-3{ width: 140px; padding-right: 0px; text-align: right; display: flex; align-items: center; justify-content: right; } .calculator-form-result-numbers .in-4-line .chars-table-item.line-4{ width: 120px; } .in-5-line .chars-table-item.line-1{ width: 25.81%; padding: 12px 16px 9px 0; } .in-5-line .chars-table-item.line-2{ width: 20.05%; text-align: right; padding: 12px 16px 9px; } .in-5-line .chars-table-item.line-3{ width: 18.2%; padding: 12px 16px 9px; text-align: right; } .in-5-line .chars-table-item.line-4{ width: 12.9%; padding: 12px 0 9px 16px; color: #7F8286; display: flex; align-items: center; justify-content: end; } .in-5-line .chars-table-item.line-5{ width: 23.04%; padding: 12px 0 9px 16px; } .chars-table-body{ } .chars-table-body .chars-table-item{ padding-top: 7px; padding-bottom: 5px; } .chars-table-body.in-5-line .chars-table-item{ padding-top: 7px; padding-bottom: 5px; } .chars-table-footer{ padding: 12px 0; } .chars-table-footer-container{ display: flex; justify-content: space-between; } .chars-table-footer-container.calc-modef{ align-items: center; } .chars-table-footer-container.calc-modef .chars-table-footer-summary{ display: flex; flex-direction: column; gap: 4px; } .chars-table-footer-btn{ display: flex; gap: 12px; align-items: center; } .global-chars-block{ padding: 4px; box-sizing: border-box; border-radius: 12px; margin-top: 8px; } .global-chars-block .chars-table-tabs{ padding: 0px; } .chars-table-tabs{ display: flex; margin: 0 -6px; padding-top: 12px; padding-bottom: 8px; } .chars-table-tabs .chars-table-tabs-item{ width: 50%; box-sizing: border-box; padding: 0 6px; } .chars-table-tabs .chars-table-tabs-item a{ display: inline-block; width: 100%; color: #313A46; font-family: "Cera Pro"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; text-align: center; padding: 8px 8px; border-radius: 8px; text-decoration: none; transition: all 0.3s ease; box-sizing: border-box; height: 100%; display: flex; align-items: center; justify-content: center; } .chars-table-tabs .chars-table-tabs-item a.active{ font-weight: 500; background: #FFF; box-shadow: 0px 1px 4px 0px rgba(183, 188, 193, 0.37); } .chars-table-form{ padding-top: 8px; padding-bottom: 8px; border-bottom: 1px solid #D2DAED; } .chars-table-block-item{ padding-top: 8px; } .chars-table-block-item p.large{ border-bottom: 1px solid #D2DAED; padding-bottom: 8px; } .chars-table-checkbox{ padding-top: 8px; padding-bottom: 8px; border-bottom: 1px solid #D2DAED; } .chars-table-checkbox-desc{ margin-top: 12px; } .chars-table-selector-checkbox-item{ display: flex; justify-content: space-between; align-items: center; } .chars-table-selector-checkbox-item .normal-checkbox-control-checked{ min-width: 50%; max-width: 50%; } .tec-chars-menu{ display: flex; gap: 32px; border-bottom: 1px solid #D2DAED; margin-bottom: 23px; } .tec-chars-menu-item{ padding-bottom: 16px; } .tec-chars-menu-item a{ text-decoration: none; position: relative; } .tec-chars-menu-item a.active:before{ content: ""; position: absolute; display: inline-block; width: 100%; height: 2px; background: #313A46; left: 0px; bottom: -17px; } .tec-chars-table{ width: 52%; } .tec-chars-table .tec-chars-line{ margin-bottom: 15px; } .tec-chars-table .tec-chars-line:last-of-type{ margin-bottom: 0px; } .tec-chars-line{ display: flex; justify-content: space-between; gap: 12px; } .tec-chars-line .tec-chars-line-name{ width: 30.5%; } .tec-chars-line .tec-chars-line-name p{ border-bottom: 1px solid #EEF0F5; } .tec-chars-line .tec-chars-line-desc{ width: 69.5%; } p.with-query{ display: flex; gap: 4px; align-items: center; } p.with-query .icon{ display: flex; align-items: center; justify-content: center; } .quantity-control-container{ display: flex; gap: 12px; } .quantity-control-container .quantity-link{ } .quantity-control-container .quantity-link a, .form-input-number a{ display: flex; width: 28px; height: 28px; border-radius: 8px; background: #FFF; box-shadow: 0px 1px 4px 0px rgba(183, 188, 193, 0.37); align-items: center; justify-content: center; } .quantity-control-container .quantity-link a.disabled, .form-input-number a.disabled{ opacity: 0.4; } .quantity-control-container .quantity-input{ display: flex; align-items: center; justify-content: center; } .quantity-control-container .quantity-input input{ border: 0px; width: 24px; height: 24px; color: #313A46; text-align: center; font-family: "Cera Pro"; font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; padding: 0px; background: none; outline: none; } .pagenavigation{ display: flex; justify-content: space-around; margin-top: 32px; } .pagenavigation ul{ display: flex; gap: 12px; } .pagenavigation ul li{ } .pagenavigation ul li a{ display: flex; width: 48px; height: 48px; align-items: center; justify-content: center; border-radius: 50%; background: #EEF0F5; font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; text-decoration: none; transition: all 0.3s ease; } .pagenavigation ul .cp_prev{ display: flex; width: 48px; height: 48px; align-items: center; justify-content: center; border-radius: 50%; background: #EEF0F5; font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; text-decoration: none; transition: all 0.3s ease; } .pagenavigation ul li a.current{ background: #313A46; color: white; } .pagenavigation ul li a:hover{ background: #D2DAED; } .breadcrumbs{ display: inline-block; width: 100%; margin-bottom: 20px; } .breadcrumbs ul{ } .breadcrumbs ul li{ float: left; margin-right: 4px; } .breadcrumbs ul li a{ text-decoration: none; position: relative; } .breadcrumbs ul li a:before{ content: ""; position: absolute; display: inline-block; width: 100%; height: 1px; background: #313A46; left: 0px; bottom: 0px; transition: all 0.3s ease; } .breadcrumbs ul li a:hover{ } .breadcrumbs ul li a:hover:before{ opacity: 0; } .breadcrumbs ul li span{ } .section-email-container{ display: flex; align-items: center; justify-content: center; height: 512px; } .form-input-line.section-email{ display: flex; gap: 12px; } .form-input-line.section-email .form-input{ width: 100%; } .section-email-title{ margin-bottom: 10px; } .section-email-form{ width: 510px; } .slick-slider-item-container{ } .slick-slider-item-container .slick-list{ } .slick-slider-item-container .slick-list .slick-track{ display: flex; } .slick-slider-item-container .slick-list .slick-track .slick-slide{ height: auto; } main.content{ padding-bottom: 480px; } main.content.order-page{ padding-bottom: 176px; } .footer{ width: 100%; margin: -480px auto 0; position: relative; z-index: 1; height: 480px; box-sizing: border-box; padding: 64px 0; } .footer.order-page{ margin: -176px auto 0; height: 176px; } .footer-line-top{ display: flex; justify-content: space-between; padding-bottom: 32px; box-sizing: border-box; border-bottom: 1px solid rgba(255,255,255,0.1); gap: 16px; } .footer.order-page .footer-line-top{ border-bottom: 0px; } .footer-line-top-left, .footer-contacts{ display: flex; align-items: center; gap: 32px; } @media (max-width: 1279px) { .footer-line-top-left, .footer-contacts{ display: flex; align-items: flex-start; gap: 20px; white-space: nowrap; } .footer-line-top-right{ width: 100%; display: flex; align-items: flex-end; flex-direction: column; } } .footer-contacts{ flex-wrap: wrap; } .footer-line-top-right iframe{ display: block; } .footer-line-top-right .yandex-rating-caption{ display: block; margin-top: 4px; font-size: 11px; line-height: 1.3; color: rgba(255,255,255,0.65); text-decoration: none; white-space: nowrap; } .footer-line-top-right .yandex-rating-caption:hover{ color: #fff; text-decoration: underline; } .footer-social{ padding-left: 32px; border-left: 1px solid rgba(255,255,255,0.1); } .footer-social ul{ display: flex; align-items: flex-start; gap: 16px; } .footer-menu-container{ display: flex; align-items: flex-start; gap: 121px; } .footer-line-bottom{ padding-top: 35px; } .footer-menu-item{ width: 263px; } .footer-menu-item ul{ display: flex; flex-direction: column; align-items: flex-start; gap: 20px; } .footer-menu-item ul li{ } .footer-menu-item ul li a{ } .footer-menu-item ul li a:hover{ } .slick-slider-dots{ } .slick-slider-dots .slick-dots{ display: flex; gap: 8px; justify-content: center; } .slick-slider-dots .slick-dots li{ line-height: 8px; } .slick-slider-dots .slick-dots li button{ border: 0px; padding: 0px; margin: 0px; display: inline-block; font-size: 0px; width: 8px; height: 8px; border-radius: 50%; background: #D2DAED; vertical-align: top; } .slick-slider-dots .slick-dots li.slick-active{ } .slick-slider-dots .slick-dots li.slick-active button{ background: #313A46; } .section-email-section{ background: url(/local/templates/kraska/design/css/../img/section-email-bg.jpg) no-repeat center center; background-size: cover; } .section-catalog-page{ padding-top: 20px; } .section-catalog-page h1{ margin-bottom: 20px; } .search-mobile-form{ margin-bottom: 20px; } .catalog-filter-menu{ display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; } .catalog-filter-menu + .catalog-filter-menu{ margin-top: 20px; } .catalog-groups-section{ display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 16px -12px 19px; } .catalog-groups-section .catalog-groups-section-item{ width: 25%; padding: 16px 12px; box-sizing: border-box; } .catalog-groups-section-container{ margin-bottom: 120px; } .colored-filter-block{ display: flex; gap: 16px; margin-top: 24px; } .section-catalog-page .colored-filter-block{ flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; overscroll-behavior-inline: contain; -webkit-overflow-scrolling: touch; } .section-catalog-page .colored-filter-block-item{ flex: 0 0 auto; } .colored-filter-carousel__header{ display: flex; align-items: center; gap: 24px; } .colored-filter-carousel__header h2{ margin-bottom: 0; } .colored-filter-carousel__navigation{ display: none; align-items: center; gap: 8px; margin-left: auto; } .colored-filter-carousel__button{ padding: 0; border: 0; font: inherit; } .colored-filter-carousel__button:disabled{ opacity: 0.3; cursor: default; } .slick-slider-btns .colored-filter-carousel__button.bg-gray-400:disabled:hover{ background: #EEF0F5; opacity: 0.3; } @media (min-width: 1280px){ .colored-filter-carousel.has-overflow .colored-filter-carousel__navigation{ display: flex; } .section-catalog-page .colored-filter-block{ scrollbar-width: none; } .section-catalog-page .colored-filter-block::-webkit-scrollbar{ display: none; } } .catalog-list-section-products-container{ margin-top: 16px; } .catalog-list-section-products{ display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 16px -12px 16px; } .catalog-list-section-products .catalog-list-section-products-item{ width: 25%; box-sizing: border-box; padding: 16px 12px; } .category-item-description{ margin-top: 120px; width: 66.66%; } .filter-menu-item-block-list{ max-height: 200px; padding-bottom: 20px; } .filter-menu-item-block-list .normal-checkbox-control{ margin-bottom: 12px; } .filter-menu-item-block-list .selected-pseudo-item{ margin-bottom: 12px; } .filter-menu-item-block-list .selected-pseudo-item:last-of-type{ margin-bottom: 0px; } .filter-menu-item-block-btn{ } .filter-menu-item-block-btn a{ width: 100%; text-align: center; } .detail-page-picture{ position: relative; } .detail-page-picture.one-picture{ box-sizing: border-box; border: 1px solid #EEF0F5; } .detail-page-picture.lepnina-mod{ box-sizing: border-box; border: 1px solid #EEF0F5; } .detail-page-picture.one-picture img{ margin: 64px 0; } .detail-page-picture.one-picture.decor-mode{ box-sizing: border-box; border: 0px; } .detail-page-picture.one-picture.decor-mode img{ margin: 0px; } .detail-page-gallery{ /*height: auto;*/ height: 100%; } @media (max-width: 768px) { .detail-page-gallery{ height: 100%; } } .detail-page-gallery .detail-page-gallery-item{ height: 100%; position: relative; } .detail-page-gallery .detail-page-gallery-item a{ display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; } .detail-page-picture.one-picture.decor-mode .detail-page-gallery .detail-page-gallery-item a{ align-items: start; } .detail-page-gallery .detail-page-gallery-item img{ max-width: 100%; } .small-gallery-item{ border-radius: 8px; box-sizing: border-box; padding: 16px 16px 22px; } .small-gallery-item-title{ margin-bottom: 12px; } .small-gallery-btns{ } .small-gallery-btns .slick-slider-btn, .detail-gallery-btns .slick-slider-btn{ position: absolute; top: 50%; transform: translateY(-50%); z-index: 1; } .small-gallery-btns .slick-slider-btn.btn-prev{ left: 0px; } .small-gallery-btns .slick-slider-btn.btn-next{ right: 0px; } .detail-gallery-btns .slick-slider-btn.btn-prev{ left: 24px; } .detail-gallery-btns .slick-slider-btn.btn-next{ right: 24px; } .small-gallery{ padding: 0 60px; margin: 0 -6px; } .small-gallery-item-container{ position: relative; } .small-gallery .small-gallery-pic-item{ box-sizing: border-box; padding: 0 6px; } .small-gallery .small-gallery-pic-item a{ display: inline-block; width: 80px; height: 80px; border-radius: 8px; } .section-detail-page{ margin-top: 28px; margin-bottom: 20px; } .detail-page-catalog-content{ display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 0 -12px; } .detail-page-catalog-content .detail-page-left{ width: 58.375%; box-sizing: border-box; padding: 0 12px; } .detail-page-catalog-content .detail-page-right{ width: 41.625%; box-sizing: border-box; padding: 0 12px; } .detail-page-catalog-content .detail-page-picture{ /*margin-bottom: 24px;*/ /*height: 100%;*/ } .detail-page-catalog-content .detail-page-picture.one-picture{ height: 100%; } .detail-page-other-gallery{ display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 0 -12px; } .detail-page-other-gallery .detail-page-other-gallery-item{ width: 50%; box-sizing: border-box; padding: 0 12px; } .detail-page-content-container{ } .detail-page-content-container h1, .detail-page-content-container .h1{ margin-bottom: 26px; } .detail-page-changer-type{ margin-top: 24px; margin-bottom: 16px; } .section-personal-container{ width: 584px; margin: 20px auto; } .personal-form{ border-radius: 8px; border: 1px solid #EEF0F5; background: #FFF; box-shadow: 0px 4px 16px 0px rgba(49, 58, 70, 0.10); } .personal-form.linked-block{ margin-top: 24px; } .personal-form-container{ box-sizing: border-box; padding: 28px 24px 32px; } .personal-form.linked-block .personal-form-container{ padding: 22px 24px 24px; } .personal-form-container h1{ margin-bottom: 26px; } .personal-form-content{ } .personal-form-content .form-field-one-line{ margin-bottom: 20px; } .personal-form-content .form-field-one-line:last-of-type{ margin-bottom: 0px; } .personal-form-tabs .global-chars-block{ margin-bottom: 16px; } #confirm-login{ width: 416px; text-align: center; padding: 0px; border-radius: 8px; } .popup-item{ } .popup-item-container{ box-sizing: border-box; padding: 20px; } .popup-item-body-title{ margin-bottom: 12px; margin-top: 26px; } .popup-item-body-phoneApprove{ margin: 24px 0; } .phoneApprove-container{ width: 228px; display: flex; gap: 12px; margin: 0 auto; } .phoneApprove-container .phoneApprove-item{ } .phoneApprove-item input{ width: 48px; height: 48px; padding: 12px 12px 12px 12px; box-sizing: border-box; border-radius: 12px; border: 1px solid #D2DAED; background: #FFF; text-align: center; outline: none; } .error .phoneApprove-item input{ border: 1px solid #C00; } .dropdown-menu{ position: absolute; width: 100%; left: 0px; z-index: 100; } .dropdown-menu-container{ background: #FFF; box-shadow: 0px 4px 16px 0px rgba(49, 58, 70, 0.10); display: flex; } .dropdown-menu-container ul{ display: inline-block; width: 280px; padding: 16px 0; } .dropdown-menu-container ul li{ width: 100%; } .dropdown-menu-container ul li a{ display: inline-block; width: 100%; box-sizing: border-box; padding: 12px 36px; text-decoration: none; transition: all 0.3s ease; } .dropdown-menu-container ul li a.active{ background: #EEF0F5; } .dropdown-menu-container ul li a:hover{ } .dropdown-menu-show{ border-left: 1px solid #D2DAED; width: calc(100% - 280px); position: relative; } .dropdown-menu-show .dropdown-menu-show-item{ position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; box-sizing: border-box; padding: 24px; } .dropdown-menu-show .dropdown-menu-show-item.close{ opacity: 0; visibility: hidden; transform: translateY(-5px); transition: all 0.3s ease; } .dropdown-menu-show .dropdown-menu-show-item.open{ opacity: 1; visibility: visible; transform: translateY(0px); } .dropdown-menu-show-header{ display: flex; align-items: center; margin-bottom: 23px; } .dropdown-menu-show-header .dropdown-menu-show-title{ margin-right: 24px; } .dropdown-menu-show-body{ display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 0 -16px; height: calc(100% - 55px); overflow-y: auto; } .dropdown-menu-show-body-item{ margin-bottom: 32px; } .dropdown-menu-show-body .dropdown-menu-show-body-container{ width: 20%; box-sizing: border-box; padding: 0 16px; } .dropdown-menu-show-body .dropdown-menu-show-body-container.rowcount-1{ width: 100%; } .dropdown-menu-show-body .dropdown-menu-show-body-container.rowcount-2{ width: 50%; } .dropdown-menu-show-body .dropdown-menu-show-body-container.rowcount-3{ width: 33.33%; } .dropdown-menu-show-body .dropdown-menu-show-body-container.rowcount-4{ width: 25%; } .dropdown-menu-show-body .dropdown-menu-show-body-container.rowcount-5{ width: 20%; } .dropdown-menu-show-body .dropdown-menu-show-body-container.rowcount-6{ width: 16.66%; } .dropdown-menu-show-body .dropdown-menu-show-body-container ul{ padding: 0px; width: 100%; } .dropdown-menu-show-body .dropdown-menu-show-body-container ul li{ margin-bottom: 10px; } .dropdown-menu-show-body .dropdown-menu-show-body-container ul li:last-of-type{ margin-bottom: 0px; } .dropdown-menu-show-body .dropdown-menu-show-body-container ul li a{ padding: 0px; } .dropdown-menu-show-body-name{ margin-bottom: 12px; } .show-link-icon{ display: flex; } .show-link-icon .name{ } .show-link-icon .icon{ transform: rotate(180deg); display: flex; align-items: center; width: 26px; height: 26px; justify-content: center; background: #EEF0F5; border-radius: 50%; margin-left: 8px; } .page-title-section{ display: flex; width: 100%; } .page-title-section h1{ float: left; } .page-title-section .basket-count{ margin-top: 24px; margin-left: 18px; } .basket-page{ margin-top: 24px; } .basket-page-container{ /* display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 0 -12px; */ } .basket-page-container-left{ /*width: calc(100% - 456px);*/ box-sizing: border-box; padding: 0 12px; } .basket-page-container-right{ /*width: 456px;*/ box-sizing: border-box; padding: 0 12px; } .basket-page-conroller{ border-radius: 8px; border: 1px solid #EEF0F5; background: #FFF; box-shadow: 0px 4px 16px 0px rgba(49, 58, 70, 0.10); display: flex; justify-content: space-between; padding: 24px; } .basket-summary{ border-radius: 8px; } .basket-summary-container{ box-sizing: border-box; padding: 24px 16px; } .basket-summary-title{ margin-bottom: 24px; } .basket-summery-line-item{ display: flex; justify-content: space-between; margin-bottom: 24px; } .basket-summery-line-item-name{ width: 100%; border-bottom: 1px solid #D2DAED; } .basket-summery-line-item-value{ white-space: nowrap; } .basket-page-list{ margin-top: 24px; border-radius: 8px; border: 1px solid #EEF0F5; background: #FFF; box-shadow: 0px 4px 16px 0px rgba(49, 58, 70, 0.10); box-sizing: border-box; padding: 32px 24px; } .basket-page-list.basket-services-list{ } .basket-item{ display: flex; margin: 0 -12px; padding-bottom: 32px; margin-bottom: 32px; border-bottom: 1px solid #EEF0F5; } .basket-item:last-of-type{ padding-bottom: 0px; margin-bottom: 0px; border-bottom: 0px solid #EEF0F5; } .basket-item .basket-item-cell{ box-sizing: border-box; padding: 0 12px; } .basket-item a{ text-decoration: none; } .basket-item-check{ width: 44px; } .basket-item-pic{ width: 288px; } .basket-item-pic .product-card-picture{ height: 190px; } .basket-item-name{ width: 46.875%; } .basket-item-name-title{ margin-top: 5px; } .basket-item-quantity{ width: 128px; } .basket-item-quantity .quantity-control{ margin-top: 8px; } .basket-item-price{ width: 192px; text-align: right; } .basket-item-price .basket-item-price-title{ margin-top: 5px; } .basket-item-remove{ width: 48px; } .basket-item-remove a{ display: inline-block; margin-top: 8px; } .basket-page-list.basket-services-list{ padding: 30px 24px; } .basket-page-list.basket-services-list .basket-item-name-title{ margin-top: 0px; } .basket-page-list.basket-services-list .basket-item-name-title .small{ margin-top: 8px; } .basket-page-list.basket-services-list .basket-item .basket-item-check{ padding: 7px 12px; } .basket-page-list.basket-services-list .basket-item .basket-item-pic{ width: 60%; } .basket-page-list.basket-services-list .basket-item .basket-item-price{ width: 30%; } .basket-page-list.basket-services-list .basket-item-price .basket-item-price-title{ margin-top: 0px; } .basket-page-list.basket-services-list .basket-item-remove a{ margin-top: 3px; } .basket-header{ border-bottom: 1px solid #EEF0F5; padding: 20px 0; width: 100%; } .basket-header-container{ display: flex; justify-content: space-between; align-items: center; } .section-order-page{ margin-top: 61px; } .order-page-ask{ display: flex; align-items: center; gap: 12px; margin-top: 26px; margin-bottom: 32px; } .order-page-block{ border-radius: 8px; border: 1px solid #EEF0F5; background: #FFF; box-shadow: 0px 4px 16px 0px rgba(49, 58, 70, 0.10); } .order-page-block-container{ box-sizing: border-box; padding: 32px 24px 0; } .order-page-block-item{ margin-bottom: 32px; } .order-page-block-title{ margin-bottom: 12px; } .order-page-block-content{ width: 57%; min-width: 736px; } .location-line{ display: flex; gap: 20px; align-items: center; } .order-fields{ margin-top: 16px; } .order-fields .line-label{ display: inline-block; width: 100%; margin-bottom: 5px; } .order-fields .form-field-one-line{ margin-bottom: 15px; } .order-page-block-item.mg-el-top{ margin-top: 30px; } .order-page-success{ display: flex; justify-content: center; align-items: center; text-align: center; } .order-success-block{ margin-top: 24px; width: 52%; margin-bottom: 56px; } .order-success-block .tec-chars-line{ margin-bottom: 16px; } .order-siccess-btn{ margin-top: 32px; width: 50%; max-width: 400px; } .order-page-success .order-page-success-title{ margin-bottom: 24px; } .order-page-success .footer-social{ justify-content: center; padding-left: 0px; margin-top: 32px; } .order-page-success .footer-social ul{ justify-content: center; } .order-samovivoz{ } .order-samovivoz .tec-chars-line{ margin-bottom: 16px; } .order-page-map{ } .order-page-map .order-page-map-container{ border-radius: 8px; overflow: hidden; } .decor-effects-pics{ margin-top: 24px; } .decor-effects-pics-container{ display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 0 -4px; padding-top: 4px; padding-bottom: 4px; } .decor-effects-pics-container .decor-effects-pics-item{ width: 20%; box-sizing: border-box; padding: 4px; } .decor-effects-pics-container .decor-effects-pics-item img{ width: 100%; } .authors{ margin-top: 32px; } .author-list-item{ display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 0 -12px; margin-bottom: 12px; align-items: center; } .author-item{ box-sizing: border-box; padding: 0 12px; margin-bottom: 20px; width: 16.675%; } .author-item-pic{ margin-bottom: 20px; } .author-item-pic img{ border-radius: 50%; width: 100%; } .author-item-name{ text-align: center; } .author-work-items{ display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; padding: 45px 12px; box-sizing: border-box; margin: 0 -12px; width: calc(100% - 16.675%); } .author-work-one-item{ width: 20%; text-align: center; box-sizing: border-box; padding: 0 12px; } .author-work-one-item a{ text-decoration: none; } .author-work-one-item-pic{ } .author-work-one-item-pic img{ } .author-work-one-item-name{ margin-top: 20px; } .painting-form{ text-align: center; } .painting-form-block{ width: 624px; box-sizing: border-box; padding: 32px 24px; margin: 0 auto; margin-top: -183px; position: relative; z-index: 10; border-radius: 8px; text-align: left; } .painting-form--article .painting-form-block{ margin-top: 0; margin-left: 0; margin-right: 0; } .painting-form--article{ margin-top: 48px; margin-bottom: 48px; } .painting-form--article .form-field-one-btn{ margin-bottom: 20px; } .painting-form-block-title{ margin-bottom: 20px; } .painting-form-content .form-field-two-line{ margin-bottom: 20px; } .painting-form-content .form-field-one-btn{ margin-top: 20px; text-align: right; } .author-text{ display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 0 -12px; } .author-text-btn{ display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 0 -12px; margin-top: 52px; } .author-text-btn .author-text-btn-item{ width: 50%; padding: 0 12px; box-sizing: border-box; } .author-text-left{ width: 83.325%; box-sizing: border-box; padding: 0 12px; } .author-text-right{ width: 16.675%; box-sizing: border-box; padding: 0 12px; display: flex; align-items: end; } .mobile-menu{ position: fixed; width: 100%; height: 100%; z-index: 10; transition: all 0.3s ease; } .mobile-menu.close{ transform: translateX(100%); } .mobile-menu-steps{ position: relative; height: 100%; } .mobile-menu-close{ position: absolute; right: 16px; top: 12px; z-index: 1; } .mobile-menu-container{ position: relative; padding-top: 8px; } .mobile-menu-body{ padding: 16px; box-sizing: border-box; } .mobile-menu-body ul li{ margin-bottom: 20px; } .mobile-menu-body ul li a.parent-item{ display: flex; justify-content: space-between; align-items: center; } .mobile-menu-header{ position: relative; padding-top: 13px; padding-bottom: 14px; border-bottom: 1px solid #EEF0F5; margin-bottom: 7px; } .mobile-menu-header .back-link{ position: absolute; left: 16px; top: 12px; display: inline-block; } .mobile-menu-step-list{ width: 400%; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; height: 100%; transition: all 0.3s ease; } .mobile-menu-step-list.step-1{ transform: translateX(0); } .mobile-menu-step-list.step-2{ transform: translateX(-25%); } .mobile-menu-step-list.step-3{ transform: translateX(-50%); } .mobile-menu-step-list.step-4{ transform: translateX(-75%); } .mobile-menu-step-list .mobile-menu-step{ width: 25%; height: 100%; } .mobile-menu-header-title{ display: inline-block; text-align: center; width: 100%; } .section-main-banner{ } .main-banner-slider{ width: 100%; } .main-slider-item .main-slider-item-pic{ vertical-align: top; } .main-slider-item .main-slider-item-pic img{ width: 100%; } .main-slider-item .main-slider-item-desc .main-slider-item-desc-container{ width: 50%; } .section-main-actions{ width: 100%; height: 100%; } .section-main-actions .section-main-actions-pic{ height: 100%; } .section-main-actions .section-main-actions-pic img{ width: 100%; height: 100%; object-fit: cover; } .projects-list{ margin-top: 23px; } .products-list-item-slider { margin-bottom: 10px; } .project-item{ height: 100%; } .project-item a{ display: inline-block; height: 100%; } .project-item a .project-item-container{ height: 100%; display: flex; flex-direction: column; } .project-item a .project-item-picture{ /*height: 100%;*/ } .project-item a .project-item-picture img{ width: 100%; /*height: 100%;*/ object-fit: cover; max-height: 388px; } .footer-line-bottom { padding-top: 33px; } .footer-menu-item ul{ gap: 12px; } .section-services-list{ padding: 1.25rem 0 0; } .services-list-item{ display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 15px -12px 0; } .services-list-item .articles-list-item{ width: 33.33%; box-sizing: border-box; padding: 12px; } .section-social-list .services-list-item .articles-list-item{ width: 25%; } .service-page-detail{ margin-top: 27px; } .article-detail-sidebar{ position: sticky; top: 20px; align-self: flex-start; } .other-services-list{ margin-top: 24px; } .other-services-list .other-services-list-item{ margin-bottom: 24px; } .other-services-list .other-services-list-item:last-of-type{ margin-bottom: 0px; } .service-detail-text .service-detail-text-block{ margin-bottom: 36px; } .form-on-page{ padding: 30px 23px; } .form-on-page.personal-form{ min-width: 888px; width: 62.5%; box-sizing: border-box; } .form-on-page-title{ margin-bottom: 16px; } .form-on-page .form-field-one-line{ margin-bottom: 16px; } .form-on-page .form-field-two-line{ margin-bottom: 16px; } .form-on-page .form-field-one-btn{ margin-top: 20px; margin-bottom: 19px; } .form-on-page .form-field-after-line{ margin-bottom: 8px; } .ideias-list-container{ margin-top: 28px; } .ideias-list-container .button-on-center{ margin-top: 32px; margin-bottom: 24px; } .ideias-list-parent { display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 1fr); grid-column-gap: 24px; grid-row-gap: 32px; } .ideias-list-item.div1 { grid-area: 1 / 1 / 3 / 3; } .ideias-list-item.div2 { grid-area: 1 / 3 / 2 / 4; } .ideias-list-item.div3 { grid-area: 2 / 3 / 3 / 4; } .ideias-list-item.div4 { grid-area: 3 / 1 / 4 / 2; } .ideias-list-item.div5 { grid-area: 3 / 2 / 4 / 3; } .ideias-list-item.div6 { grid-area: 3 / 3 / 4 / 4; } .videos-list-container{ display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .products-list-slider{ /* width: 100%; display: flex; */ } .videos-list-container .product-card-item{ width: 25%; } .news-list-block{ margin-bottom: 20px; } .news-detail-text{ padding-right: 152px; } .news-detail-text-container{ border-bottom: 1px solid #EEF0F5; margin-bottom: 32px; } .news-detail-text-container a{ text-decoration: underline; } .news-detail-text-container a:hover{ text-decoration: none; } .comments-block-list{ margin-top: 26px; margin-bottom: 26px; } .comments-list-item{ border-radius: 8px; box-sizing: border-box; padding: 24px; margin-bottom: 24px; } .comments-list-item-header{ display: flex; gap: 12px; align-items: center; margin-bottom: 12px; } .comments-list-item-header p{ margin-bottom: 0px !important; } .content-mode.detail-text .comments-list-item-body p{ margin-bottom: 10px; } .content-mode.detail-text .comments-list-item-body p:last-of-type{ margin-bottom: 0px; } .calculator-form-result{ border-radius: 8px; box-sizing: border-box; padding: 100px 10%; width: 100%; } .empty-calc-result{ display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 15px; } .empty-calc-result .calc-text{ text-align: center; } .calculator-form-result-numbers{ margin-top: 0px; } .calculator-form-content{ padding: 30px 23px; } .calculator-steps-list{ display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 0 -8px; } .calculator-steps-list .calculator-step-item{ width: 25%; padding: 0 8px; box-sizing: border-box; } .calculator-steps-list.in-3-line .calculator-step-item { width: 33.33%; } .calculator-steps-list.in-2-line .calculator-step-item{ width: 50%; } .calculator-steps-list .calculator-step-item .calculator-step-item-name{ display: inline-block; position: relative; } .calculator-steps-list .calculator-step-item .calculator-step-item-line{ width: 100%; height: 4px; border-radius: 4px; background: #D2DAED; margin-top: 13px; } .calculator-steps-list .calculator-step-item.active .calculator-step-item-line{ background: #313A46; } .calculator-steps-list .calculator-step-item.active.success .calculator-step-item-line{ background: #21B527; } .calculator-steps-list .calculator-step-item.active.success .calculator-step-item-name{ color: #21B527; } .calculator-steps-list .calculator-step-item.active.success .calculator-step-item-name:before{ content: ""; position: absolute; display: inline-block; width: 16px; height: 16px; background: url(/local/templates/kraska/design/css/../img/icon-galka.svg) no-repeat center center; right: -20px; } .calculator-steps-body{ box-sizing: border-box; padding-top: 31px; } .calculator-steps-body-title{ margin-bottom: 9px; } .calculator-steps-body-title.mg-el-top{ margin-top: 9px; } .calculator-brands-selector{ display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: -8px; } .calculator-brands-selector + .button-on-center{ margin-top: 20px; } .calculator-brands-selector .calculator-brands-selector-item{ box-sizing: border-box; padding: 8px; width: 25%; } .calculator-brands-selector .calculator-brands-selector-item .radio-button-item{ margin-bottom: 0px; height: 100%; } .calculator-brands-selector .calculator-brands-selector-item label{ border-radius: 8px; border: 1px solid #D2DAED; background: #FFF; box-sizing: border-box; padding: 12px 10px; justify-content: center; cursor: pointer; position: relative; height: 100%; } .calculator-brands-popup{ position: absolute; left: 50%; top: calc(100% + 12px); transform: translate(-50%, -4px); border-radius: 12px; background: #FFF; box-shadow: 0px 1px 20px 0px rgba(31, 35, 45, 0.15); width: calc(100% + 24px); box-sizing: border-box; padding: 16px; text-align: center; z-index: 1; opacity: 0; visibility: hidden; transition: all 0.3s ease; } .calculator-brands-popup:after { bottom: 100%; left: 50%; border: solid transparent; content: ""; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(255, 255, 255, 0); border-bottom-color: #ffffff; border-width: 8px; margin-left: -8px; } .calculator-brands-popup p{ line-height: 20px; } .calculator-brands-selector .calculator-brands-selector-item label:hover .calculator-brands-popup{ transform: translate(-50%, 0px); opacity: 1; visibility: visible; } .calculator-brands-item{ width: 100%; } .calculator-brands-item .calculator-brands-item-pic{ height: 48px; margin-bottom: 6px; display: flex; align-items: center; justify-content: center; } .calculator-brands-item.kraski-mod .calculator-brands-item-pic{ height: 64px; } .calculator-brands-item.coler-mod .calculator-brands-item-pic{ height: 64px; width: 100%; } .calculator-brands-item.lepnina-mod .calculator-brands-item-pic{ height: 242px; width: 100%; } .calculator-brands-item.coler-mod .calculator-brands-item-pic .color-block-item{ display: inline-block; width: 100%; height: 100%; border-radius: 8px; } .calculator-brands-item .calculator-brands-item-pic img{ max-height: 100%; max-width: 100%; } .calculator-brands-item .calculator-brands-item-name{ display: flex; gap: 8px; justify-content: center; align-items: center; } .calculator-brands-item .calculator-brands-item-name .name{ width: calc(100% - 30px); } .calculator-steps-conroller{ display: inline-block; width: 100%; margin-top: 32px; } .calculator-steps-conroller .calculator-steps-btn{ } .calculator-steps-conroller .calculator-steps-btn.btn-next{ float: right; } .calculator-steps-conroller .calculator-steps-btn.btn-prev{ float: left; } .calculator-page-text{ display: inline-block; width: 100%; } .calculator-page-text h2, .calculator-page-text .h2{ margin-top: 0px; } .calculator-color-block .colored-filter-block{ display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 24px; } .calculator-color-block + .calculator-brands-selector{ margin-bottom: 16px; } .text-block-like-list{ display: inline-block; width: 100%; margin-bottom: 24px; } .text-block-like-list:last-of-type{ margin-top: 8px; } .text-block-like-list .text-block-like-list-title{ margin-bottom: 8px; } .text-block-like-list .text-block-like-list-desc{ } .share__list{ display: flex; gap: 16px; } .calculator-form-result-numbers{ width: 100%; } .calculator-decor-item{ } .calculator-decor-item.active{ box-sizing: border-box; position: relative; } .calculator-decor-item a{ display: inline-block; } .calculator-decor-item.active a{ position: relative; } .calculator-decor-item a:before{ content: ""; position: absolute; width: 100%; height: 100%; box-sizing: border-box; transition: all 0.3s ease; } .calculator-decor-item.active a:before { border: 2px solid #0b011d; } .calculator-decor-item a img{ width: 100%; } .calculator-decor-item.active a img{ } .xs-view, .slick-slide .xs-view{ display: none; } .xs-md-view, .slick-slide .xs-md-view{ display: none; } .md-view, .slick-slide .md-view{ display: none; } .lg-md-view, .slick-slide .lg-md-view{ display: none; } .lg-view, .slick-slide .lg-view{ display: inline-block; } .header-line-mobile{ display: none; } .service-page-detail-left.col-item.col-9.col-xs-1.mg-null{ margin-top: 0; } .quantity-control{ display: inline-block; } .header-line-message{ } .header-line-message .header-line-message-container{ position: relative; padding: 12px 0px; } .header-line-message-container p a{ text-decoration: underline; } .header-line-message-container p a:hover{ text-decoration: none; } .header-line-message-container a.close-message{ position: absolute; right: 0px; top: 12px; } .actionPage{ } .actionPage .d-flex{ display: flex; margin: 16px -12px 19px; width: 100%; } .actionPage .d-flex.col-3{ } .actionPage .d-flex.col-3 .col{ width: 33.33%; box-sizing: border-box; padding: 16px 12px; } .actionPage .d-flex.col-3 .col .color-card{ } .actionPage .d-flex.col-3 .col .color-card img{ width: 100%; } .actionPage .d-flex.col-3 .col .color-card .color-card__text{ margin-top: 20px; text-align: center; } .actionPage .p-relative{ display: inline-block; width: 100%; margin-top: 20px; margin-bottom: 20px; } .actionPage .p-relative div{ display: inline-block; } .actionPage .p-relative div img{ } .actionPage .p-relative{ } .service-page-detail-left{ } .service-page-detail-left .news-list{ width: 100%; } .service-page-detail-left .news-list .news-item__img-wrap{ width: 100%; } .service-page-detail-left .news-list .news-item__img{ width: 100%; height: auto; } .a-popular{ display: grid; grid-template-columns: 1fr 1fr 1fr; gap:30px 40px; margin-top: 20px; } .a-popular__item{ display: flex; border:1px solid #D0D6E7; min-height:180px; } .a-popular__img{ position: relative; width:40%; display: flex; align-items: center; justify-content: center; } .a-popular__img-mobile{display: none;} .a-popular__content{ padding: 18px; } .a-popular__link{ display: inline-block; font-weight: 300; font-size: 15px; line-height: 20px; margin-bottom: 7px; } .a-popular__link_title{ font-weight: 700; font-size: 20px; line-height: 30px; color: #313A46; margin-bottom: 10px; } .a-popular__link_more{ font-weight: 500; } /* Catalog landing page */ .catalog-main-page__content{ margin-top: 50px; margin-bottom: 100px; } .catalog-main-page .a-popular{ grid-template-columns: repeat(3, minmax(0, 1fr)); } .catalog-main-page .a-popular__item, .catalog-main-page .a-popular__content{ min-width: 0; } .catalog-main-page .a-popular__img{ flex-shrink: 0; overflow: hidden; } .catalog-main-page .a-popular__img img{ display: block; max-width: 100%; max-height: 100%; object-fit: contain; } .catalog-main-page .a-popular__img img.a-popular__img-mobile{ display: none; } .catalog-main-page .a-popular__link{ max-width: 100%; overflow-wrap: anywhere; } @media (max-width: 1279px){ .catalog-main-page__content{ margin-top: 40px; margin-bottom: 80px; } .catalog-main-page .a-popular{ grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; } } @media (max-width: 767px){ .catalog-main-page__content{ margin-top: 24px; margin-bottom: 56px; } .catalog-main-page .a-popular{ grid-template-columns: minmax(0, 1fr); gap: 16px; margin-top: 0; } .catalog-main-page .a-popular__item{ display: grid; grid-template-columns: minmax(120px, 36%) minmax(0, 1fr); min-height: 180px; } .catalog-main-page .a-popular__img{ width: 100%; } .catalog-main-page .a-popular__content{ padding: 16px; } .catalog-main-page .a-popular__link_title{ font-size: 18px; line-height: 24px; } } @media (max-width: 480px){ .catalog-main-page__content{ margin-top: 20px; margin-bottom: 48px; } .catalog-main-page .a-popular__item{ display: block; min-height: 0; } .catalog-main-page .a-popular__img{ aspect-ratio: 2 / 1; } .catalog-main-page .a-popular__img img.a-popular__img-mobile{ display: block; width: 100%; height: 100%; object-fit: cover; } .catalog-main-page .a-popular__img img.a-popular__img-desktop{ display: none; } } @media (max-width: 1919px){ .xs-view, .slick-slide .xs-view{ display: none; } .xs-md-view, .slick-slide .xs-md-view{ display: none; } .lg-view, .slick-slide .lg-view{ display: none; } .md-view, .slick-slide .md-view{ display: none; } .lg-md-view, .slick-slide .lg-md-view{ display: inline-block; } .chars-table{ padding: 0 12px; } .chars-table-item{ letter-spacing: -0.28px; } .chars-table-item-line{ position: relative; } .chars-table-item-line.quantity-active{ padding-bottom: 23px; } .in-5-line .chars-table-item.line-1 { width: 17.5%; padding: 7px 8px 5px 4px; } .in-5-line .chars-table-item.line-3{ } .in-5-line .chars-table-item.line-4 { width: 12.5%; padding: 7px 8px 5px 4px; } .in-4-line .chars-table-item.line-1{ width: 48.5%; } .in-5-line .chars-table-item.line-2 { width: 23%; text-align: right; padding: 7px 8px 5px; } .in-5-line .chars-table-item.line-2 p.with-query{ justify-content: end; } .in-5-line .chars-table-item.line-3, .in-4-line .chars-table-item.line-2 { width: 22.75%; padding: 7px 8px 5px; } .in-5-line .chars-table-item.line-4, .in-4-line .chars-table-item.line-3{ position: absolute; width: 28.75%; right: 0; top: 10%; display: inline-block; padding: 0px 0px 0px 24px; text-align: right; display: none !important; } .calculator-form-result-numbers .in-4-line .chars-table-item.line-4{ width: calc(100% - 292px); min-width: 132px; } .in-5-line .chars-table-item.line-5, .in-4-line .chars-table-item.line-4 { width: 28.75%; padding: 7px 0px 5px 24px; text-align: right; } .in-5-line .chars-table-item.line-5 .quantity-control-container, .in-4-line .chars-table-item.line-4 .quantity-control-container{ justify-content: end; } .form-field-four-line{ display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .form-field-four-line .form-field-line-item{ width: 50%; margin-bottom: 8px; } .form-field-four-line .form-field-line-item:nth-last-child(1), .form-field-four-line .form-field-line-item:nth-last-child(2){ margin-bottom: 0px; } .small-gallery .small-gallery-pic-item a{ width: 100%; } .quantity-control{ display: inline-block; } .quantity-control .price-custome-block{ width: 100%; text-align: left; margin-top: 12px; } } @media (max-width: 1279px){ /* .xs-view, .slick-slide .xs-view{ display: none; } .xs-md-view, .slick-slide .xs-md-view{ display: none; } .lg-view, .slick-slide .lg-view{ display: none; } .lg-md-view, .slick-slide .lg-md-view{ display: none; } .md-view, .slick-slide .md-view{ display: inline-block; } .lg-view, .slick-slide .lg-view{ display: none; } .lg-md-view, .slick-slide .lg-md-view{ display: none; } .md-view, .slick-slide .md-view{ display: none; } .xs-view, .slick-slide .xs-view{ display: none; } .xs-md-view, .slick-slide .xs-md-view{ display: inline-block; } */ .lg-view, .slick-slide .lg-view{ display: none; } .lg-md-view, .slick-slide .lg-md-view{ display: none; } .md-view, .slick-slide .md-view{ display: none; } .xs-md-view, .slick-slide .xs-md-view{ display: none; } .xs-view, .slick-slide .xs-view{ display: inline-block; } .wrapper-inside { width: calc(100% - 30px); margin: 0 auto; max-width: 1800px; } h1, .h1{ font-size: 22px; font-weight: 700; line-height: 32px; } h2, .h2{ font-size: 22px; font-weight: 700; line-height: 32px; } h3, .h3{ font-size: 20px; font-weight: 700; line-height: 28px; } .large{ font-size: 18px; font-weight: 500; line-height: 24px; } p{ font-size: 14px; font-weight: 500; line-height: 20px; } .style-2{ font-size: 14px; font-weight: 400; line-height: 20px; } .small{ font-size: 12px; font-weight: 400; line-height: 20px; } .btn{ padding: 12px 20px; font-size: 14px; } .with-2-icons{ padding: 12px 16px; } .btn .text{ white-space: nowrap; } .mg-top { margin-top: 64px; } .mg-bottom-small{ margin-bottom: 0px; } .section-content-header{ text-align: left; margin-bottom: 4px; } .section-content-header.xs-header-margin{ margin-bottom: 4px; } .header-line-top{ display: none; } .header-line-middle{ display: none; } .header-line-bottom{ display: none; } .header-line-mobile{ display: inline-block; width: 100%; } .header-line-mobile-top{ padding: 12px 0; } .header-line-mobile-top-container{ display: flex; justify-content: space-between; align-items: center; } .header-actions-group{ display: flex; align-items: center; gap: 16px; } .header-mobile-search{ } .header-mobile-search a{ display: flex; width: 24px; height: 24px; justify-content: center; align-items: center; } .header-line-mobile-bottom-container{ display: flex; justify-content: space-between; } .mobile-menu-open{ } .mobile-menu-open a{ display: flex; width: 24px; height: 24px; justify-content: center; align-items: center; } .mobile-menu-cart a{ display: flex; width: 24px; height: 24px; justify-content: center; align-items: center; } .header-line-mobile-bottom{ padding: 12px 0; } .section-main-banner { padding-top: 24px; } .section-main-banner-container{ flex-direction: column; } .main-banner-slider{ width: 100%; } .main-slider-item .main-slider-item-desc{ padding: 24px 16px; } .main-slider-item .main-slider-item-desc .main-slider-item-desc-container{ width: 100%; justify-content: start; } .main-slider-item .main-slider-item-desc .main-slider-item-btn { margin-top: 14px; } .main-slider-item .main-slider-item-desc .main-slider-item-btn a{ width: 100%; text-align: center; } .main-banner-slider .main-banner-slider-btn .slick-slider-btn{ width: 32px; height: 32px; } .main-banner-slider .main-banner-slider-btn .slick-slider-btn svg{ width: 6px; height: 8px; } .main-banner-slider .main-banner-slider-btn .slick-slider-btn.btn-prev { left: 12px; } .main-banner-slider .main-banner-slider-btn .slick-slider-btn.btn-next { right: 12px; } .section-main-actions{ width: 100%; margin-top: 22px; } .section-main-actions-desc{ padding: 24px 16px; } .section-main-actions-desc .section-main-actions-btn { margin-top: 16px; } .section-main-actions-desc .section-main-actions-btn a{ width: 100%; text-align: center; } .catalog-groups-list .catalog-groups-list-btn{ display: none; } .catalog-groups-slider{ display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 0 -8px; padding-top: 17px; } .catalog-groups-slider .catalog-group-item:nth-last-child(1), .catalog-groups-slider .catalog-group-item:nth-last-child(2){ margin-bottom: 0px; padding-bottom: 0px; } .catalog-group-item a .catalog-group-item-pic { margin-bottom: 15px; } .catalog-groups-list .catalog-groups-list-btn, .articles-list-item-slider .articles-list-item-slider-btn, .products-list-item-slider .products-list-item-slider-btn{ display: none; } .articles-list-item-container{ flex-direction: column; padding: 15px 15px 24px 15px; position: relative; } .articles-list-item-pic{ width: 100%; /*height: 40.5775%;*/ } .articles-list-item-desc{ padding: 0px; width: 100%; margin-top: 16px; /*height: calc(100% - 40.5775% - 16px);*/ padding-bottom: 64px; } .articles-list-item-desc .articles-list-item-btn{ position: absolute; margin-top: 16px; bottom: 24px; left: 0px; width: 100%; box-sizing: border-box; padding: 0 15px; } .articles-list-item-desc .articles-list-item-btn a{ width: 100%; text-align: center; } .slick-slider-item-container .slick-list{ padding-right: 25%; } .main-banner-slider .slick-slider-item-container .slick-list{ padding-right: 0; } .catalog-groups-slider, .articles-list-slider, .products-list-slider{ margin: 0 -8px; } .catalog-groups-slider .catalog-group-item, .articles-list-slider .articles-list-item, .products-list-slider .product-card-item{ padding: 17px 8px; } .catalog-groups-slider .catalog-group-item{ width: 50%; padding: 0 8px; /*margin-bottom: 24px;*/ padding-bottom: 24px; } .articles-list-slider .articles-list-item{ padding: 17px 8px; } .articles-list-item-slider .slick-slider-dots, .products-list-item-slider .slick-slider-dots{ margin-top: 2px; } .projects-list{ display: inline-block; width: 100%; margin-top: 16px; margin-bottom: 20px; } .projects-list .projects-list-item .project-item-picture{ } .project-item a .project-item-picture{ margin-bottom: 13px; } .projects-list .projects-list-item .project-item-picture img{ width: 100%; } .projects-list .projects-list-item{ margin-bottom: 24px; } .projects-list .projects-list-item:last-of-type{ margin-bottom: 0px; } .project-item a .project-item-desc{ flex-direction: column; } .project-item-desc-status{ margin-top: 4px; } .project-item-desc-status{ gap: 20px; } .button-on-center a{ width: 100%; text-align: center; } .product-card-picture{ height: 155px; } .product-card-picture.with-bank .product-card-picture-bank{ } .product-card-picture.with-bank .product-card-picture-bank img{ max-width: 75px; } .product-card-picture.item-kartina-list{ height: 208px; } .product-card-desc { margin-top: 16px; } .products-list-item-slider { margin-bottom: 20px; } .product-card-price { margin-top: 5px; } .section-email-section{ background: url(/local/templates/kraska/design/css/../img/section-email-bg-xs.jpg) no-repeat center center; background-size: cover; } .section-email-form{ width: 100%; } .form-input-line.section-email{ flex-direction: column; } .section-email-container{ height: 430px; /*justify-content: start;*/ align-items: start; padding-top: 64px; box-sizing: border-box; } .section-email-title { margin-bottom: 8px; } .section-email-title br{ display: none; } .section-email-form .form-btn .btn{ width: 100%; text-align: center; } .form-input input[type=text], .form-input textarea{ font-size: 14px; } .footer-social{ padding-left: 32px; border-left: 0px; position: relative; } .footer-social:before{ content: ''; display: inline-block; position: absolute; left: 0px; top: 0; height: 100%; width: 1px; background: #FFFFFF; opacity: 0.1; } .footer-line-bottom { padding-top: 19px; } .footer-menu-item ul{ gap: 12px; } main.content{ /*padding-bottom: 1380px;*/ } .footer{ /*margin: -1380px auto 0;*/ /*height: 1380px;*/ } main.content.order-page{ padding-bottom: 276px; } .footer.order-page { margin: -276px auto 0; height: 276px; } .main-banner-slider .slick-dots{ display: none !important; } .main-slider-item .main-slider-item-pic{ width: 100%; } .main-slider-item .main-slider-item-pic img{ width: 100%; } .section-main-actions-pic{ } .section-main-actions-pic img{ width: 100%; } .link-with-icon{ gap: 5px; } .breadcrumbs{ margin-bottom: 0px; } .section-catalog-page{ padding-top: 0px; } .page-title-section .basket-count{ display: none; } .basket-page { margin-top: 20px; } .basket-page-conroller{ flex-direction: column; padding: 21px 19px 19px; } .basket-page-conroller .set-all{ margin-bottom: 10px; } .basket-page-conroller .remove-all{ margin-left: -4px; } .basket-page-container-left{ width: 100%; } .basket-page-container-right{ width: 100%; margin-top: 20px; } .basket-page-list { margin-top: 20px; padding: 27px 15px; } .basket-item{ position: relative; flex-direction: column; margin: 0; padding-bottom: 0px; padding-bottom: 20px; margin-bottom: 20px; } .basket-item .basket-item-cell{ padding: 0px; } .basket-item-check{ width: 100%; } .basket-item .basket-item-cell.basket-item-check{ padding: 4px; box-sizing: border-box; } .basket-item .basket-item-cell.basket-item-pic{ width: auto; margin-top: -24px; padding-left: 40px; } .basket-item .basket-item-cell.basket-item-pic .product-card-picture.with-bank{ height: 156px; } .basket-item-pic .product-card-picture { height: 157px; } .basket-item-name{ width: 100%; margin-top: 15px; } .basket-item-quantity{ width: 80px; } .basket-item-quantity .quantity-control { margin-top: 16px; } .basket-item-remove{ position: absolute; right: 0px; bottom: 19px; width: auto; } .basket-item-remove a{ margin-top: 0px; } .basket-item-price{ position: absolute; width: auto; right: 40px; bottom: 19px; } .basket-item:last-of-type .basket-item-remove{ bottom: -4px; } .basket-item:last-of-type .basket-item-price{ bottom: -4px; } .basket-page-list.basket-services-list{ padding: 27px 15px; } .basket-page-list.basket-services-list .basket-item .basket-item-check{ padding: 4px; } .basket-page-list.basket-services-list .basket-item .basket-item-pic{ width: 100%; padding-bottom: 36px; } .basket-page-list.basket-services-list .basket-item .basket-item-price{ width: auto; } .quantity-control-container{ gap: 4px; } .quantity-control-container .quantity-link a, .form-input-number a{ width: 24px; height: 24px; } .quantity-control-container .quantity-input input{ font-size: 14px; } .slide-basket-element{ position: fixed; left: 0px; bottom: 56px; width: 100%; padding: 8px 0; background: #FFF; box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.25); z-index: 10; transition: all 0.3s ease; } .slide-basket-element.hide{ bottom: 0px; } .slide-basket-element-container{ display: flex; justify-content: space-between; } .normal-checkbox-control label{ gap: 8px; } .normal-checkbox-control label .pseudo-checkbox{ width: 16px; height: 16px; } .basket-header{ padding: 10px 0; } .section-order-page { margin-top: 23px; } .order-page-ask{ margin-top: 12px; margin-bottom: 21px; } .order-page-block-container{ padding: 23px 15px 0; } .order-page-block-title{ margin-bottom: 9px; } .location-line{ gap: 16px; } .order-page-block-item { margin-bottom: 22px; } .order-page-map{ } .order-page-map img{ width: 100%; } .order-page-block-content{ width: 100%; min-width: auto; } .basket-summary-container{ padding: 24px 16px; } .basket-summary-title { margin-bottom: 24px; } .basket-summery-line-item{ margin-bottom: 16px; } .basket-summery-btn{ margin-top: 24px; } .order-success-block{ width: 100%; } .order-siccess-btn{ width: 100%; } .order-page-success-container .socials svg{ width: 32px; height: 32px; } .section-personal-container{ width: 100%; } .personal-form-container h1 { margin-bottom: 16px; } .personal-form-container { padding: 24px 16px 24px; } .personal-form.linked-block .personal-form-container{ padding: 22px 16px; } .personal-form.linked-block .personal-form-container{ text-align: center; } .personal-form.linked-block .personal-form-container a{ display: inline-block; } .personal-remember-line{ } .catalog-filter-menu{ margin-top: 20px; /* overflow-y: hidden; overflow-x: scroll; */ /*justify-content: center;*/ /* white-space: nowrap; flex-wrap: nowrap; */ } .catalog-filter-menu.mobile-view{ width: 100%; display: inline-block; } .catalog-filter-menu.mobile-view .slick-list{ overflow: hidden; margin-right: -15px; margin-left: -15px; } .catalog-filter-menu.mobile-view .catalog-filter-menu-item{ margin: 0 6px; } .catalog-filter-menu.desktop-mode{ justify-content: center; } .catalog-filter-menu.desktop-mode .catalog-filter-menu-item{ position: absolute; } .catalog-filter-menu.desktop-mode .catalog-filter-menu-item a.btn.controllerFilterBlock{ display: none; } .filter-menu-item-block.first-item, .filter-menu-item-block.last-item{ left: 50%; transform: translateX(-50%); } .filter-menu-item-block.first-item:after, .filter-menu-item-block.last-item:after { left: 50%; } .catalog-groups-section{ margin-top: 4px; margin-left: 0px; margin-right: 0px; margin-bottom: 8px; } .catalog-groups-section .catalog-groups-section-item{ width: 50%; padding: 16px 0px; } .catalog-groups-section-container { margin-bottom: 64px; } .catalog-groups-section.kraski-mod{ margin-bottom: 0px; } .catalog-groups-section.kraski-mod .catalog-groups-section-item:last-of-type{ padding-bottom: 0px; } .colored-filter-block{ margin-top: 22px; overflow-y: hidden; overflow-x: scroll; } .pseudo-checkbox-control{ gap: 10px; } .pseudo-checkbox-control .checkbox-color-sphere{ width: 16px; height: 16px; } .catalog-list-section-products-container { margin-top: 12px; } .catalog-list-section-products{ margin-top: 0px; margin-left: 0; margin-right: 0; margin-bottom: 12px; } .catalog-list-section-products .catalog-list-section-products-item{ width: 100%; padding: 12px 0; } .form-field-two-line{ display: inline-block; margin: 0px; width: 100%; } .form-field-four-line{ display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 0px; } .form-field-two-line .form-field-line-item{ width: 100%; padding: 0px; margin-bottom: 15px; } .form-field-four-line .form-field-line-item{ width: 50%; margin-bottom: 8px; } .form-field-two-line .form-field-line-item:last-of-type{ margin-bottom: 0px; } .product-card-container.item-banka .product-card-picture{ height: 208px; } .slick-slide .product-card-container.item-banka .product-card-picture{ height: 155px; } .slick-slide .product-card-picture.with-bank{ height: 155px; } .slick-slide.smaller-card .product-card-picture{ height: 155px; } .product-card-picture.with-bank{ height: 208px; } .product-card-picture.with-bank .product-card-picture-bank img{ max-width: 100%; } .product-card-container.item-banner{ padding: 16px; } .item-banner .product-card-banner-desc{ margin-top: 16px; flex-direction: column; } .item-banner .product-card-banner-desc .product-card-banner-btn{ width: 100%; margin-top: 16px; } .item-banner .product-card-banner-desc .product-card-banner-btn a{ width: 100%; text-align: center; } .pagenavigation{ margin-top: 24px; } .pagenavigation ul li a{ width: 32px; height: 32px; font-size: 14px; } .filter-menu-item-block{ width: 290px; } .catalog-filter-menu + .catalog-filter-menu { margin-top: 16px; } .category-item-description{ width: 100%; } .faq-item-header a{ padding: 20px 0; } .faq-item-header a .faq-item-icon{ } .faq-item-header a .faq-item-icon svg{ width: 32px; height: 32px; } .faq-item-body { padding-bottom: 20px; } .content-mode p { margin-bottom: 0px; } .section-detail-page{ margin-top: 0px; margin-bottom: 0px; } .detail-page-mobile-title{ width: 100%; margin-bottom: 20px; } .detail-page-catalog-content{ margin: 0px; display: inline-block; width: 100%; } .detail-page-catalog-content .detail-page-left{ width: 100%; padding: 0px; } .detail-page-catalog-content .detail-page-right{ width: 100%; padding: 0px; } .detail-page-catalog-content .detail-page-picture{ margin-bottom: 20px; } .detail-page-gallery .detail-page-gallery-item{ } .detail-page-gallery .detail-page-gallery-item img{ width: 100%; } .detail-gallery-btns .slick-slider-btn.btn-prev { left: 12px; } .detail-gallery-btns .slick-slider-btn.btn-next { right: 12px; } .detail-page-other-gallery{ display: none; } .detail-page-content-container h1, .detail-page-content-container .h1{ display: none; } .chars-table { margin-top: 12px; padding: 16px; } .chars-table-header{ display: none; } .chars-table-item-line{ flex-direction: column; padding-bottom: 4px; margin-bottom: 8px; } .chars-table-body .chars-table-item, .chars-table-body.in-5-line .chars-table-item, .chars-table-body.in-3-line .chars-table-item{ width: 100% !important; padding: 0px !important; display: flex; justify-content: space-between; text-align: left !important; margin-bottom: 3px; position: relative !important; bottom: auto !important; } .chars-table-body .chars-table-item span.name{ width: 42%; } .chars-table-body .chars-table-item p{ text-align: right; } .chars-table-footer { padding: 8px 0 0; } .chars-table-footer-container{ flex-direction: column; } .chars-table-footer-summary{ margin-bottom: 12px; } .chars-table-footer-btn{ width: 100%; flex-direction: column; } .detail-page-changer-type { margin-top: 20px; margin-bottom: 16px; } .chars-table-selector-checkbox-item{ flex-direction: column; align-items: start; } .chars-table-selector-checkbox-item .normal-checkbox-control-checked{ margin-top: 10px; width: 100%; } .chars-table-footer-btn a{ width: 100%; text-align: center; } .chars-table-block-item{ padding-top: 0px; } .chars-table-block-item p.large{ margin-bottom: 8px; } .chars-table-checkbox{ margin-bottom: 8px; } .slick-slider-btns .slick-slider-btn{ width: 32px; height: 32px; } .slick-slider-btns .slick-slider-btn svg{ width: 7px; height: 10px; } .tec-chars-menu{ overflow-x: scroll; gap: 20px; margin-bottom: 19px; } .tec-chars-menu-item { padding-bottom: 6px; } .tec-chars-menu-item a{ } .tec-chars-menu-item a p{ font-size: 14px; white-space: nowrap; } .tec-chars-table{ width: 100%; } .tec-chars-table .tec-chars-line{ margin-bottom: 13px; position: relative; } .tec-chars-line .tec-chars-line-name{ width: 50%; } /* .tec-chars-line .tec-chars-line-name p{ border-bottom: 0px; } .tec-chars-line .tec-chars-line-name p:before{ content: ""; position: absolute; display: inline-block; width: 100%; border-bottom: 1px solid #EEF0F5; top: 22px; } */ .tec-chars-line .tec-chars-line-desc{ width: 50%; text-align: right; } /* .tec-chars-line .tec-chars-line-desc p{ display: inline; background: white; position: relative; z-index: 1; } */ .chars-table-form{ margin-bottom: 8px; } .chars-table-form-tabs{ } .chars-table-form-tabs .form-btn{ } .chars-table-form-tabs .form-btn .btn{ width: 100%; text-align: center; } .decor-effects-pics-container .decor-effects-pics-item{ width: 50%; } .author-text{ flex-direction: column; margin: 0px; } .author-item-pic{ margin-bottom: 0px; } .author-text-right{ width: 100%; padding: 0px; order: 1; } .author-text-left{ width: 100%; padding: 0px; order: 2; } .author-text-btn{ margin: 0px; margin-top: 20px; } .author-text-btn .author-text-btn-item{ width: 100%; margin-bottom: 16px; padding: 0px; } .mobile-main-fixed-block{ position: fixed; bottom: 0px; z-index: 10; width: 100%; padding: 8px 0; transition: all 0.3s ease; } .mobile-main-fixed-block.hide{ transform: translateY(100%); } .mobile-fixed-menu{ } .mobile-fixed-menu ul{ display: flex; gap: 34px; justify-content: space-between; } .mobile-fixed-menu li{ } .mobile-fixed-menu li a{ font-size: 12px; font-weight: 500; display: flex; width: 100%; text-align: center; flex-direction: column; align-items: center; } .mobile-fixed-menu li a .mobile-fixed-icon{ position: relative; display: inline-block; width: 24px; height: 24px; margin-bottom: 4px; } .mobile-fixed-basket-count{ position: absolute; top: -6px; right: -8px; min-width: 8px; height: 16px; padding: 0 4px; border-radius: 8px; background-color: #C74253; color: #FFFFFF; font-size: 10px; line-height: 16px; text-align: center; } .mobile-fixed-menu li a .mobile-fixed-icon .inactive{ opacity: 1; transition: all 0.3s ease; } .mobile-fixed-menu li a.active .mobile-fixed-icon .inactive{ opacity: 0; } .mobile-fixed-menu li a .mobile-fixed-icon .active{ position: absolute; top: 0px; opacity: 0; transition: all 0.3s ease; } .mobile-fixed-menu li a.active .mobile-fixed-icon .active{ opacity: 1; } .tec-chars-menu-item a.active:before{ bottom: -6px; } .detail-page-picture.one-picture img{ margin: 24px 0; } .section-autors-new-container{ } .section-autors-new-container .wrapper-inside{ width: 100%; } .section-autors-new-container .wrapper-inside h2{ width: calc(100% - 30px); margin: 0 15px; } .authors { margin-top: 20px; } .author-list-item{ flex-direction: column; margin: 0; margin-bottom: 20px; } .author-list-item:last-of-type{ margin-bottom: 0px; } .author-item{ width: calc(100% - 30px); display: flex; margin-bottom: 16px; padding: 0; margin: 0 15px 16px; } .author-item-pic{ width: 27%; } .author-item-name{ width: 73%; text-align: left; box-sizing: border-box; padding-left: 16px; display: flex; align-items: center; } .author-work-items{ padding: 0px; width: 100%; margin: 0px; } .author-work-items .slick-list{ padding: 0px 25.5% 0 7px; /*overflow: visible !important;*/ } .author-work-one-item{ padding: 0px 8px; } .author-work-one-item-pic{ height: 155px; } .author-work-one-item-pic img{ width: 100%; height: 100%; object-fit: cover; } .author-work-one-item-name { margin-top: 16px; } .painting-form{ box-sizing: border-box; padding: 0 15px; } .painting-form img{ width: 100%; border-radius: 8px; } .painting-form-block { margin-top: 20px; width: 100%; padding: 32px 16px; } .painting-form-block .btn{ width: 100%; } section.section-services-list{ padding-top: 0px; } .services-list-item .articles-list-item{ width: 50%; } .section-social-list .services-list-item .articles-list-item{ width: 25%; } .service-page-detail { margin-top: 20px; } .content-mode.detail-text ul li{ padding-left: 21px; margin-bottom: 5px; } .service-detail-text .service-detail-text-block { margin-bottom: 26px; } .form-on-page{ padding: 23px 15px; } .form-on-page.personal-form{ min-width: auto; width: 100%; } .form-on-page .form-field-one-btn { margin-top: 20px; margin-bottom: 20px; } .form-on-page .form-field-after-line { margin-bottom: 0px; } .section-services-list{ width: 100%; overflow-x: hidden; } .service-page-detail-left{ margin-top: 36px; } .article-detail-sidebar{ position: static; align-self: stretch; } .other-services-list{ margin: 24px -8px 24px; } .other-services-list.slick-slider{ padding-right: 26%; } .other-services-list.slick-slider .slick-list{ overflow: visible !important; } .other-services-list.slick-slider .slick-list .slick-track{ display: flex; } .other-services-list .other-services-list-item{ padding: 0 8px; box-sizing: border-box; margin-bottom: 0px; height: auto; } .other-services-list .other-services-list-item .product-card-item{ height: 100%; } .other-services-list .other-services-list-item .product-card-item .product-card-container{ height: 100%; position: relative; padding-bottom: 87px; } .other-services-list .other-services-list-item .product-card-item .product-card-container .product-card-banner-desc{ } .other-services-list .other-services-list-item .product-card-item .product-card-container .product-card-banner-btn{ position: absolute; left: 0px; bottom: 24px; width: 100%; box-sizing: border-box; padding: 0 16px; } .ideias-list-container{ margin-top: 21px; } .ideias-list-parent{ display: inline-block; width: 100%; } .ideias-list-item{ margin-bottom: 24px; } .ideias-list-item:last-of-type{ margin-bottom: 0px; } .ideias-list-container .button-on-center{ margin-bottom: 0px; margin-top: 18px; } .articles-list-item-slider + .button-on-center { margin-top: 20px; } .shildic-item{ padding: 2px 8px; } .products-list-item-slider.videos-list-container{ margin-bottom: 0px; } .videos-list-container .product-card-item{ width: 100%; } .articles-list-item-container.without-photo .articles-list-item-desc{ margin-top: 0px; padding-bottom: 44px; } .articles-list-item-container.without-photo { padding: 23px 15px; } .news-detail-text{ padding-right: 0px; } .calculator-brands-selector .calculator-brands-selector-item{ width: 50%; } .calculator-detail-page .service-page-detail-left{ margin-top: 0px; } .calculator-form-content { padding: 23px 15px; } .calculator-steps-list{ margin: 0 -6px; } .calculator-steps-list .calculator-step-item{ width: 16.66%; padding: 20px 6px 0; position: relative; } .calculator-steps-list .calculator-step-item.active{ width: 50%; flex-grow: 1; } .calculator-steps-list.in-3-line .calculator-step-item{ width: 16.66%; } .calculator-steps-list.in-3-line .calculator-step-item.active{ width: 66.66% } .calculator-steps-list .calculator-step-item.active.success{ width: 16.66% } .calculator-steps-list .calculator-step-item .calculator-step-item-name{ position: absolute; left: 6px; top: 0px; } .calculator-steps-list .calculator-step-item .calculator-step-item-name span{ opacity: 0; } .calculator-steps-list .calculator-step-item.active .calculator-step-item-name span{ opacity: 1; white-space: nowrap; } .calculator-steps-list .calculator-step-item.active.success .calculator-step-item-name span{ opacity: 0; } .calculator-steps-list .calculator-step-item.active.success .calculator-step-item-name:before{ left: 0px; top: 4px; } .calculator-steps-list .calculator-step-item .calculator-step-item-line{ margin-top: 4px; } .calculator-steps-body{ padding-top: 19px; } .calculator-brands-selector .calculator-brands-selector-item label{ flex-direction: column; gap: 5px; } .calculator-brands-popup{ position: relative; width: 100%; left: 0px; opacity: 1; visibility: visible; transform: unset; padding: 0px; box-shadow: unset; top: 0px; } .calculator-brands-popup:after{ display: none; } .calculator-brands-selector .calculator-brands-selector-item label:hover .calculator-brands-popup{ transform: unset; } .share__list{ } .share__list img{ width: 32px; height: 32px; } .empty-calc-result{ gap: 11px; } .calculator-form-result{ padding: 24px 10%; margin-top: 20px; } .text-block-like-list:last-of-type{ margin-bottom: 0px; } .calculator-color-block .colored-filter-block{ flex-wrap: unset; } .calculator-steps-conroller{ margin-top: 16px; } .shtucaturka-list .calculator-brands-item .calculator-brands-item-name{ justify-content: start; } .manager-form-container{ padding: 190px 27px 55px; border-radius: 15px; border: 2px solid #CEDBEB; display: flex; justify-content: center; } .manager-form-title{ text-align: center; font-size: 22px; font-style: normal; font-weight: 700; line-height: normal; } .manager-form-desc{ text-align: center; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; } .manager-form-section-input{ width: 100%; max-width: 100%; } .manager-form-title.desktop{ display: none; } .manager-form-title.mobile{ display: inline-block; } .section-manager-form{ padding: 15px 0; } .manager-form-section-input input{ color: #6B6D7C; font-size: 14px; font-style: normal; font-weight: 300; line-height: normal; } .manager-form-section-inputs{ gap: 19px; } .manager-form-section .btn{ font-size: 16px; font-style: normal; font-weight: 500; line-height: normal; width: 100%; text-align: center; padding: 13px 8px; } .manager-form-img img{ object-position: top center; } } @media (max-width: 767px) { .services-list-item .articles-list-item{ width: 100%; } .section-social-list .services-list-item .articles-list-item{ width: 50%; } .calculator-brands-selector .calculator-brands-selector-item{ width: 100%; } } .thanks-container{ display: flex; flex-direction: column; justify-content: center; align-items: center; width: 75%; margin: 0 auto; } .thanks-inside{ display: flex; flex-direction: column; justify-content: center; align-items: center; } .thanks-inside p{ font-size: 22px; font-weight: 500; line-height: 32px; text-align: center; text-underline-position: from-font; text-decoration-skip-ink: none; color: #313A46; } .thanks-product-items{ display: flex; flex-wrap: wrap; gap: 24px; margin-top: 47px; } .thanks-product-item{ width: calc(33.333% - 16px); box-sizing: border-box; padding: 24px; border: 1px solid #EEF0F5; box-shadow: 0px 4px 16px 0px #313A461A; } .thanks-product-item .title{ font-size: 16px; font-weight: 500; line-height: 24px; text-align: left; text-underline-position: from-font; text-decoration-skip-ink: none; color: #313A46; margin-top: 20px; } .thanks-product-item .btn-with-product{ width: 100%; padding: 12px; font-size: 16px; font-weight: 500; line-height: 24px; text-align: center; text-underline-position: from-font; text-decoration-skip-ink: none; border-radius: 8px; background: #EEF0F5; box-sizing: border-box; margin-top: 16px; } .thanks-product-item .img{ width: 100%; height: 160px; overflow: hidden; border-radius: 8px; } .thanks-product-item .img img{ width: 100%; height: 100%; object-fit: cover; } .thanks-product-item .bottom-info{ height: calc(100% - 160px); display: flex; flex-direction: column; justify-content: space-between; } .thanks-logo{ margin-bottom: 22px; } .section-thanks{ padding-top: 24px; padding-bottom: 20px; } .search-input{ width: 100%; position: relative; margin-top: 25px; } .thanks-inside.not-found-container{ width: 50%; } .search-input .icon{ position: absolute; top: 50%; left: 16px; transform: translateY(-50%); } .search-input input{ width: 100%; border: 1px solid #D2DAED; border-radius: 8px; padding: 12px; padding-left: 48px; font-family: Cera Pro; font-size: 16px; font-weight: 400; line-height: 24px; text-align: left; text-underline-position: from-font; text-decoration-skip-ink: none; color: #313A46; box-sizing: border-box; } @media (max-width: 1279px) { .thanks-container{ width: 100%; } .thanks-inside.not-found-container{ width: 100%; } } @media (max-width: 756px) { .thanks-product-item{ width: 100%; } .calculator-steps-conroller:not(.color) { position: fixed; bottom: 56px; left: 0; background: white; padding: 15px 15px; box-sizing: border-box; z-index: 10; box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.25); } .b24-widget-button-position-bottom-right{ right: 20px !important; bottom: 150px !important; } } .lepnina-example{ position: fixed; right: 0px; top: 50%; z-index: 10; transition: all 0.3s ease; } .fancybox-active .lepnina-example{ transform: translateX(100%); } .lepnina-example a{ display: inline-block; border-radius: 8px 0px 0px 8px; color: white; background: #BE707D; padding: 12px 14px 12px 10px; font-size: 18px; font-style: normal; font-weight: 400; line-height: 24px; text-decoration: none; transition: all 0.3s ease; } .service-detail-text-block .show-all-btn.js-hidden-text-show{ font-family: 'Cera Pro', sans-serif; font-weight: 300; font-size: 15px; line-height: 100%; letter-spacing: -0.28px; border: none; background: none; border-bottom: 2px solid #313a46; padding: 16px 0 8px; width: 145px; } .detail-page-left.rtb-video{ height: 100%; } @media (max-width: 756px) { /*padding: 10px 10px 10px 8px;*/ .detail-page-gallery .detail-page-gallery-item a iframe{ height: 305px; } } .lepnina-example a:hover{ background: #DB8E9B; } .lepnina-example a .lepnina-example-container{ display: flex; align-items: center; gap: 8px; } .lepnina-example a .icon{ display: flex; align-items: center; } .lepnina-example a .icon svg{ vertical-align: top; } .lepnina-example a .number{ } .tec-chars-box-item{ } .tec-chars-box-item ol{ list-style-type: decimal; } .tec-chars-box-item ul{ list-style-type: disc; } .tec-chars-box-item ol, .tec-chars-box-item ul{ margin-top: 14px; padding-left: 20px; } .tec-chars-box-item ol li, .tec-chars-box-item ul li{ margin-bottom: 14px; } .tec-chars-box-item ol li:last-child, .tec-chars-box-item ul li:last-child{ margin-bottom: 0px; } .tec-chars-box-item table{ border-collapse: collapse; } .tec-chars-box-item table td{ padding: 5px; border: 1px solid #0b011d; } .basket-page-container-right .basket-summary{ position: sticky; top: 20px; } /*Новые стили для страницы контактов*/ :root { --column1: calc(100% / 12 - 15px); --column2: calc(100% / 12 * 2 - 15px); --column3: calc(100% / 12 * 3 - 15px); --column4: calc(100% / 12 * 4 - 15px); --column5: calc(100% / 12 * 5 - 15px); --column6: calc(50% - 15px); --column7: calc(100% / 12 * 7 - 15px); --column8: calc(100% / 12 * 8 - 15px); --column9: calc(100% / 12 * 9 - 15px); --column10: calc(100% / 12 * 10 - 15px); --column11: calc(100% / 12 * 11 - 15px); --column12: 100%; } [class*="copyrights-pane"] { display: none !important; } .contact { margin-top: 21px; } .contact h1 { margin-bottom: 42px; } .contact__wrapper { display: flex; justify-content: space-between; flex-wrap: wrap; row-gap: 60px; align-items: flex-start; } .contact__address { display: flex; flex-wrap: wrap; column-gap: 36px; row-gap: 20px; width: var(--column5); } .contact__telephone { width: calc(50% - 18px); } .contact__social { display: flex; flex-wrap: wrap; max-width: 216px; column-gap: 20px; width: calc(50% - 18px); row-gap: 12px; } .contact__requisite { width: var(--column5); } .contact__requisite p { font-weight: 500; font-size: 22px; line-height: 32px; margin-bottom: 16px; } .contact__form { width: var(--column6); } .contact__address-list { width: 100%; border-top: 1px solid rgba(238, 240, 245, 1); padding-top: 40px; } .contact__address-list li { padding-left: 26px; position: relative; } .contact__address-list li p:last-of-type { margin-bottom: 6px; } .contact__address-list li+li { margin-top: 30px; } .contact__address-list img { position: absolute; left: 0; top: 0; } .contact__map { min-height: 418px; width: calc(var(--column6) + 3px); } .contact__map .ymaps-2-1-79-map { width: 100% !important; } .contact__requisite-list li:first-child { font-weight: 500; font-size: 16px; line-height: 24px; } .contact__requisite-list li { font-weight: 400; font-size: 16px; line-height: 24px; color: rgba(49, 58, 70, 1); } .contact__telephone a { font-weight: 700; font-size: 22px; line-height: 32px; transition: 0.3s ease; position: relative; overflow: visible; } .contact__form { padding: 40px; background: rgba(238, 240, 245, 1); width: calc(var(--column6) + 3px); box-sizing: border-box; display: flex; flex-direction: column; gap: 16px; } .contact__form p { margin-bottom: 4px; font-size: 36px; font-weight: 700; line-height: 48px; } .contact__form a { border-bottom: 1px solid; font-weight: 400; font-size: 14px; line-height: 20px; color: rgba(21, 27, 41, 1); } .contact__form button { max-width: 250px; padding: 16px; border-radius: 6px; border: none; background-color: rgba(49, 58, 70, 1); color: white; font-weight: 500; font-size: 16px; line-height: 24px; } .contact__form a:hover { text-decoration: none; } .input { border: 1px solid rgba(210, 218, 237, 1); border-radius: 8px; resize: none; padding: 16px; box-sizing: border-box; } .contact__form-tel { width: calc(50% - 8px); } .contact__form-name { width: calc(50% - 8px); } .input:focus { outline: none; } .contact__form-info label { display: flex; flex-direction: column; } .contact__form-info { display: flex; flex-wrap: wrap; gap: 16px; } .contact__form-info .input { margin-top: 10px; } .input-error { border: 1px solid red; } .error-message { color: red; font-size: 12px; margin-top: 5px; display: none; } .contact__form-message { width: 100%; } .contact__form-message textarea { min-height: 90px; } .contact__telephone span { margin-left: 10px; } .contact span { font-weight: 400; font-size: 14px; line-height: 20px; color: rgba(127, 130, 134, 1); } .contact__form-checkbox { display: flex; flex-direction: column; } .contact__form-checkbox label { width: 100%; font-weight: 400; font-size: 14px; line-height: 20px; padding: 2px 0 2px 30px; cursor: pointer; position: relative; color: rgba(127, 130, 134, 1); } input[type="checkbox"] { position: absolute; width: 20px; height: 20px; left: 2px; top: 50%; transform: translateY(-50%); margin: 0; border: 1px solid rgba(210, 218, 237, 1); cursor: pointer; } .contact__social a { padding-left: 24px; position: relative; font-weight: 500; font-size: 16px; line-height: 24px; } .green { color: rgba(63, 185, 104, 1); } .blue { color: rgba(61, 134, 194, 1); } .contact__social img { position: absolute; left: 0; top: 50%; transform: translateY(-50%); } .contact>.contact__form { width: 100%; margin-top: 20px; display: none; } .contact>.contact__form button { width: 100%; margin-top: 20px; max-width: 100%; } .section-catalog-page .wrapper-inside .article{ margin-top: 64px; } .unwrap-block__head.js-unwrap-head{ font-size: 16px; font-weight: 400; line-height: 24px; } .unwrap-block.js-unwrap-block{ margin-bottom: 10px; } @media (max-width: 1650px) { .contact__wrapper { flex-direction: column; } .contact__wrapper>* { width: 100%; } .contact__form { display: none; } .contact>.contact__form { display: block; } .contact+.section-email-section { margin-top: 0; } .contact__form p { text-align: center; } } @media (max-width: 837px) { .content-page-img a iframe{ height: 100%; } .contact { margin-top: -3px; } .contact__address { column-gap: 0; } .contact h1 { margin-bottom: 21px; } .contact__address-list p { font-size: 16px; font-weight: 500; line-height: 24px; } .contact__address-list { padding-top: 18px; } .contact__wrapper { row-gap: 20px; } .contact__form .wrapper-inside { width: calc(100% - 72px); } .contact__form p { margin-bottom: 20px; } .contact__form-info { margin-bottom: 16px; } .contact>.contact__form button { width: 100%; margin-top: 17px; max-width: 100%; } } @media (max-width: 835px) { .contact__form .wrapper-inside { width: calc(100% - 31px); } .contact__form { padding: 24px 0; } .contact__address { flex-direction: column; } .contact__telephone { width: 100%; } .contact__social { width: 100%; } .contact__telephone a { font-size: 20px; } .contact__social { row-gap: 14px; } .contact__address-list li+li { margin-top: 20px; } .contact__address-list { padding-top: 20px; } .contact__map { min-height: 300px; } .contact__map .ymaps-2-1-79-map { max-height: 300px; } .contact__requisite-list li:first-child { font-weight: 400; font-size: 14px; line-height: 20px; } .contact__requisite-list li { font-weight: 400; font-size: 14px; line-height: 20px; } .contact>.contact__form { margin-top: 40px; } .contact__form-name { width: 100%; } .contact__form-tel { width: 100%; } .contact__form p { margin-bottom: 21px; } .contact__form-checkbox label { font-size: 12px; line-height: 130%; } .contact__form a { font-size: 12px; line-height: 130%; } input[type="checkbox"] { top: 8px; transform: translateY(0); } .contact__form-info { margin-bottom: 11px; } .contact__form-checkbox label { padding: 0px 0 2px 32px; } } /*Новые стили для страницы контактов*/ .service-detail-text-block .h2 { font-size: 22px; font-weight: 500; line-height: 32px; margin-bottom: 20px; } @media (max-width: 767px) { .service-detail-text { margin-bottom: 15px; } } .article p { font-weight: 400; } @media (max-width: 1279px) { .form-field-two-line .form-field-one-line { width: 100%; padding: 0; } } .article li{ margin-left: 20px; line-height: 24px; } .service-page-detail .product-card-picture { height: 100%; } .service-page-detail .product-card-price p { margin: 0; } .service-page-detail .product-card-price { margin: 0; } .service-page-detail .product-card-container.item-kraska .product-card-picture.with-bank { height: 240px; } .article ol { list-style: disc; } @media (max-width: 767px) { .h1-desc{ margin-top: 20px; color: var(--Dark500, #313A46); font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; /* 142.857% */ } .questions-container{ margin-top: 40px; } .accordion{ padding: 20px 14.5px; } .accordion-title{ font-size: 22px; font-style: normal; font-weight: 700; line-height: 32px; /* 145.455% */ } .accordion-body-inside p{ font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; /* 142.857% */ } .question-form{ padding: 166px 15px 20px 15px; } .question-form-container{ margin-top: 40px; } .question-form-desc{ display: none; } .question-form-title{ font-size: 22px; font-style: normal; font-weight: 700; line-height: 32px; /* 145.455% */ } .w-50 .question-form-input{ width: 100%; } .question-form-body{ margin-top: 20px; } .question-form-input-sections{ gap: 20px; } .question-form-input-section{ gap: 20px; } .question-form-body .btn{ margin: 20px 0 20px; } .question-form-bg{ z-index: 1; } .question-form-inside{ position: relative; z-index: 2; } .section-description-container { max-width: 100%; overflow-x: hidden; } .question-form-bg img{ object-position: top; } .questions-container .tec-chars-menu{ width: calc(100% + 30px); margin-left: -15px; padding: 0 15px; box-sizing: border-box; } .section-description-container .tec-chars-menu { -ms-overflow-style: none; scrollbar-width: none; } .section-description-container .tec-chars-menu::-webkit-scrollbar { display: none; } .service-page-detail .product-card-container.item-kraska .product-card-picture.with-bank { height: 208px; } .service-page-detail .slick-slide .product-card-container.item-kraska .product-card-picture.with-bank { height: 155px; } } @media (max-width: 1279px) { .contact__form p { font-size: 22px; font-weight: 700; line-height: 32px; } .footer-menu-container{ gap: 32px; flex-wrap: wrap; } .footer-menu-item{ width: calc(33.333% - 64px / 3); } } .article p.h2 { font-weight: 700; } .content .article { padding-top: 50px; } .input-icon { background: none; border: none; padding: 0; cursor: pointer; display: flex; align-items: center; } .back-to-top-button { position: fixed; right: 130px; bottom: 50px; z-index: 9; display: flex; width: 52px; height: 52px; padding: 0; align-items: center; justify-content: center; border: 1px solid #313A46; border-radius: 50%; background: #313A46; box-shadow: 0 6px 20px rgba(49, 58, 70, 0.24); color: #FFF; cursor: pointer; opacity: 0; visibility: hidden; transform: translateY(12px); pointer-events: none; transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s ease, background-color 0.2s ease, border-color 0.2s ease; } .back-to-top-button.is-visible { opacity: 1; visibility: visible; transform: translateY(0); pointer-events: auto; } .back-to-top-button svg { display: block; } .back-to-top-button:focus-visible { outline: 3px solid rgba(214, 179, 106, 0.55); outline-offset: 3px; } @media (hover: hover) { .back-to-top-button:hover { border-color: #D6B36A; background: #D6B36A; } } @media (max-width: 756px) { .back-to-top-button { right: 24px; bottom: calc(78px + env(safe-area-inset-bottom, 0px)); left: auto; width: 46px; height: 46px; } } @media (prefers-reduced-motion: reduce) { .back-to-top-button { transition: none; } } .catalog-brand-item { position: relative; width: 100%; height: 100%; border-radius: 8px; background: #FFF; padding: 16px 20px; box-sizing: border-box; /* важно */ overflow: visible; } .swiper-slide-visible .catalog-brand-item{ box-shadow: 0 4px 16px 0 rgba(49, 58, 70, 0.10); } .catalog-brand-item-inside { width: 100%; height: 100%; position: relative; } .catalog-brand-item-logo { width: 100%; height: 64px; display: flex; align-items: center; justify-content: center; } .catalog-brand-item-logo img { object-fit: contain; width: auto; height: auto; max-width: 100%; max-height: 100%; } .catalog-brand-item-title { color: var(--Dark500, #313A46); font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; text-align: center; } .catalog-brand-item-visible { display: flex; flex-direction: column; gap: 12px; opacity: 1; visibility: visible; transform: translateY(0); transition: opacity 0.25s ease, visibility 0.25s ease, transform 0.25s ease; } .catalog-brand-item-hover { position: absolute; top: -16px; left: -20px; right: -20px; min-height: calc(100% + 32px); height: auto; padding: 16px 20px; box-sizing: border-box; border-radius: 8px; background: #FFF; box-shadow: 0 8px 24px rgba(49, 58, 70, 0.15); display: flex; align-items: center; justify-content: center; opacity: 0; visibility: hidden; transform: translateY(8px); z-index: 10; transition: opacity 0.25s ease, visibility 0.25s ease, transform 0.25s ease; } .catalog-brand-item-hover-items { width: 100%; display: flex; flex-direction: column; gap: 4px; margin: 0; padding: 0; color: var(--Dark500, #313A46); font-size: 14px; font-style: normal; font-weight: 500; line-height: 24px; text-align: center; } .catalog-brand-item-hover-items li { list-style: none; } .catalog-brand-item-hover-items a { color: inherit; text-decoration: none; } .catalog-brand-item:hover { z-index: 20; } .catalog-brand-item:hover .catalog-brand-item-visible { opacity: 0; visibility: hidden; transform: translateY(-8px); } .catalog-brand-item:hover .catalog-brand-item-hover { opacity: 1; visibility: visible; transform: translateY(0); } .catalog-brands-swiper .swiper{ overflow: visible; } .catalog-brands-swiper{ position: relative; } .catalog-brand-swiper-arrow{ width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; background: #EEF0F5; border-radius: 9999px; position: absolute; z-index: 2; top: 50%; cursor: pointer; } .catalog-brand-swiper-arrow.left{ left: 0; transform: translate(-50%, -50%); } .catalog-brand-swiper-arrow.right{ right: 0; transform: translate(50%, -50%); } .catalog-list-items{ display: flex; flex-wrap: wrap; gap: 24px; } .catalog-list-item{ width: calc(25% - 18px); border-radius: 12px; border: 1px solid var(--Gray400, #EEF0F5); background: #FFF; box-shadow: 0 4px 16px 0 rgba(49, 58, 70, 0.10); padding: 16px 16px 20px 16px; box-sizing: border-box; display: flex; flex-direction: column; gap: 12px; height: auto; } .catalog-list-item-img{ display: inline-block; width: 100%; aspect-ratio: 1 / 1; border-radius: 8px; overflow: hidden; } .catalog-list-item-img img{ width: 100%; } .catalog-list-item-title{ color: var(--Dark500, #313A46); font-size: 22px; font-style: normal; font-weight: 700; line-height: 32px; /* 145.455% */ margin-bottom: 16px; display: inline-block; } .catalog-list-item-links{ display: flex; flex-direction: column; gap: 8px; } .catalog-list-item-links a{ color: var(--Dark500, #313A46); font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; /* 150% */ } .catalog-list-item-arrow-link{ display: flex; margin-top: auto; align-items: center; color: var(--Dark500, #313A46); font-size: 16px; font-style: normal; font-weight: 700; line-height: 24px; /* 150% */ gap: 4px; } .catalog-brands-container{ margin-bottom: 32px; } .catalog-list-item-desc{ flex-grow: 1; display: flex; flex-direction: column; gap: 16px; justify-content: space-between; } .catalog-advantages-items{ display: flex; flex-wrap: wrap; gap: 24px; } .catalog-advantages-item{ width: calc(33.333% - 16px); border-radius: 12px; background: var(--Gray400, #EEF0F5); padding: 20px; box-sizing: border-box; position: relative; overflow: hidden; } .catalog-advantages-item-background{ position: absolute; right: -10.568px; top: 0px; } .catalog-advantages-item-number{ color: var(--Dark500, #313A46); font-size: 140px; font-style: normal; font-weight: 500; line-height: 140px; /* 100% */ } .catalog-advantages-item-number-desc{ color: var(--Dark500, #313A46); font-size: 48px; font-style: normal; font-weight: 500; line-height: 48px; /* 100% */ } .catalog-advantages-item-text{ color: var(--Dark500, #313A46); font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; /* 150% */ } .catalog-advantages-item-desc{ display: flex; flex-direction: column; gap: 32px; } .catalog-advantages{ margin-top: 64px; } .catalog-brand-swiper-pagination .swiper-pagination-bullet{ width: 8px; height: 8px; background: #D2DAED; opacity: 1; } .catalog-brand-swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{ background: #313A46; } .catalog-brand-swiper-pagination{ display: flex; justify-content: center; margin-top: 20px; display: none; } .catalog-brand-pop-up{ display: none; } .catalog-page-inside{ overflow: hidden; width: calc(100% + 48px); margin-left: -24px; padding: 0 24px; box-sizing: border-box; } @media (max-width: 768px) { .catalog-page-inside{ overflow: visible; width: 100%; margin-left: 0; padding: 0; } .catalog-brand-swiper-pagination{ display: flex; } .catalog-brand-swiper-arrow{ display: none; } .catalog-brand-item-logo{ height: 32px; } .catalog-brand-item-visible{ gap: 8px; } .catalog-brand-item-hover{ display: none; } .catalog-brand-item:hover .catalog-brand-item-visible{ opacity: 1; visibility: visible; transform: none; } .catalog-brand-item-title{ font-size: 12px; line-height: 20px; /* 166.667% */ } .catalog-brand-pop-up{ position: fixed; bottom: 0; left: 0; z-index: 999; width: 100%; padding: 15px 15px 24px 15px; border-radius: 12px 12px 0 0; background: #FFF; box-sizing: border-box; display: flex; flex-direction: column; gap: 16px; transform: translateY(100%); opacity: 0; pointer-events: none; transition: all 300ms linear; } .catalog-brand-pop-up.active{ transform: translateY(0); opacity: 1; pointer-events: auto; } .shadow-bg{ position: fixed; inset: 0; width: 100%; height: 100%; z-index: 998; background: var(--Dark500, #313A46); transition: all 300ms ease-in; pointer-events: none; opacity: 0; } .shadow-bg.active{ opacity: 0.5; pointer-events: auto; } .catalog-brand-pop-up-head-title{ color: var(--Dark500, #313A46); font-size: 18px; font-style: normal; font-weight: 500; line-height: 24px; /* 133.333% */ width: calc(100% - 25px); } .catalog-brand-pop-up-head{ display: flex; justify-content: space-between; align-items: center; } .catalog-brand-item-hover-items{ text-align: left; } .catalog-list-item{ width: 100%; } .catalog-list-item-title{ font-size: 18px; line-height: 24px; /* 133.333% */ } .catalog-list-item-links a{ font-size: 14px; line-height: 20px; /* 142.857% */ } .catalog-list-item-arrow-link{ font-size: 14px; line-height: 24px; /* 171.429% */ } .catalog-list-items{ gap: 20px; } .catalog-advantages-item{ width: 100%; } .catalog-advantages-item-background{ display: none; } .catalog-advantages-item-number{ font-size: 100px; line-height: 100px; /* 100% */ } .catalog-advantages-item-number-desc{ font-size: 48px; line-height: 48px; /* 100% */ } .catalog-advantages-item-text{ font-size: 14px; line-height: 20px; /* 142.857% */ } } .mobile-filter-container { position: fixed; top: 0; left: 0; z-index: 9999; width: 100%; /* fallback */ height: 100vh; /* корректнее для Safari / Chrome mobile */ height: 100dvh; background: #FFF; box-shadow: 0 4px 16px 0 rgba(49, 58, 70, 0.10); opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(20px); transition: opacity 0.25s ease, visibility 0.25s ease, transform 0.25s ease; } .mobile-filter-container.active { opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0); } .mobile-filter-inside { width: 100%; height: 100%; display: flex; flex-direction: column; overflow: hidden; } .mobile-filter-head { position: relative; flex-shrink: 0; padding: 12px 30px; padding-top: calc(12px + env(safe-area-inset-top)); border-bottom: 1px solid var(--Gray400, #EEF0F5); box-sizing: border-box; } .mobile-filter-title { color: var(--Dark500, #313A46); font-size: 14px; font-style: normal; font-weight: 500; line-height: 24px; text-align: center; } .mobile-filter-btn-close { position: absolute; right: 16px; /* * Центрируем относительно обычной высоты header, * но учитываем safe-area сверху. */ top: calc(50% + env(safe-area-inset-top) / 2); transform: translateY(-50%); display: flex; align-items: center; justify-content: center; cursor: pointer; } .mobile-filter-body { padding: 24px 16px; box-sizing: border-box; flex: 1 1 auto; min-height: 0; overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch; } .mobile-filter-section-item-title { color: var(--Dark500, #313A46); font-size: 14px; font-style: normal; font-weight: 500; line-height: 20px; } .mobile-filter-items ul li { color: var(--Dark500, #313A46); font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .mobile-filter-items { display: flex; flex-direction: column; gap: 12px; } .mobile-filter-section-item { display: flex; flex-direction: column; gap: 12px; } .mobile-filter-section-items .mobile-filter-section-item:not(:first-child) { padding: 20px 0; border-bottom: 1px solid #EEF0F5; } .mobile-filter-section-items .mobile-filter-section-item:first-child { padding: 0 0 20px 0; border-bottom: 1px solid #EEF0F5; } /* Checkbox */ .custom-checkbox { display: flex; align-items: center; gap: 8px; cursor: pointer; } .custom-checkbox input { position: absolute; opacity: 0; pointer-events: none; } .checkbox-custom { width: 24px; height: 24px; flex-shrink: 0; border: 1px solid #D2DAED; border-radius: 4px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; background: #FFF; transition: background 0.2s ease, border-color 0.2s ease; } .custom-checkbox input:checked + .checkbox-custom { background: #313A46; border-color: #313A46; } .custom-checkbox input:checked + .checkbox-custom::after { content: ""; width: 10px; height: 6px; border-left: 2px solid #FFF; border-bottom: 2px solid #FFF; transform: translateY(-1px) rotate(-45deg); } /* Нижняя панель */ .mobile-filter-btns { flex-shrink: 0; background: var(--White500, #FFF); box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.25); padding: 8px 16px; /* * Главное для iPhone. * Поднимает кнопки над home indicator / нижней областью Safari. */ padding-bottom: calc(8px + env(safe-area-inset-bottom)); display: flex; gap: 12px; box-sizing: border-box; } .mobile-filter-btn { width: calc(50% - 6px); padding: 12px 20px; border-radius: 8px; border: none; outline: none; font-size: 14px; font-style: normal; font-weight: 500; line-height: 20px; cursor: pointer; } .mobile-filter-btn-reset { color: var(--Dark500, #313A46); background: var(--Gray400, #EEF0F5); } .mobile-filter-btn-submit { background: var(--Dark500, #313A46); color: #FFF; } /* Пока фильтр открыт */ body.mobile-filter-open { overflow: hidden; } .palitra-colored-item{ display: flex; flex-direction: column; gap: 20px; } .palitra-colored-item-bg{ display: inline-block; width: 100%; height: 310px; position: relative; } .palitra-colored-item-bg img{ width: 154px; height: 113px; object-fit: contain; position: absolute; bottom: 8px; left: 8px; } .palitra-colored-item-title{ color: var(--Dark500, #313A46); text-align: center; font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; /* 150% */ } .palitra-colored-item-price{ color: var(--Dark500, #313A46); text-align: center; font-size: 22px; font-style: normal; font-weight: 500; line-height: 32px; /* 145.455% */ } .palitra-colored-item-desc{ display: flex; flex-direction: column; gap: 12px; } .palitra-btn{ display: flex; justify-content: center; } .catalog-palitra-container .catalog-brand-swiper-arrow{ top: 155px } .catalog-filter-menu.big-margin{ margin-top: 100px; } .mobile-open-filter-btn{ width: 100%; align-items: center; justify-content: center; border-radius: 8px; background: var(--Gray400, #EEF0F5); gap: 8px; padding: 12px 16px; margin: 64px 0 20px; display: none; box-sizing: border-box; cursor: pointer; border: 0; color: var(--Dark500, #313A46); font: inherit; } .mobile-open-filter-btn-count { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 999px; box-sizing: border-box; color: #FFF; background: #BE707D; font-size: 11px; font-weight: 500; line-height: 20px; } @media (max-width: 768px) { .product-detail-desc-text{ margin-top: 16px; } .catalog-filter-menu.big-margin{ display: none; } .mobile-open-filter-btn{ display: flex; } .palitra-colored-item-bg{ height: 148px; } .palitra-colored-item-bg img{ width: 75px; height: 55px; } .palitra-colored-item{ gap: 16px; } .palitra-colored-item-title{ font-size: 14px; font-style: normal; font-weight: 500; line-height: 20px; /* 142.857% */ } .palitra-colored-item-price{ font-size: 18px; font-style: normal; font-weight: 500; line-height: 24px; /* 133.333% */ } .palitra-colored-item-desc{ gap: 8px; } .catalog-palitra-container{ margin-bottom: 20px; } } /* Каталожный фильтр: на десктопе контейнер является прозрачной оберткой. */ @media (min-width: 769px) { .mobile-filter-container { position: static; z-index: auto; width: auto; height: auto; background: transparent; box-shadow: none; opacity: 1; visibility: visible; pointer-events: auto; transform: none; } .mobile-filter-inside { display: block; height: auto; overflow: visible; } .mobile-filter-head, .mobile-filter-btns { display: none; } .mobile-filter-body { padding: 0; overflow: visible; } .mobile-filter-container .catalog-filter-menu.desktop-mode { margin-top: 20px; } } .catalog-palette-preview { margin-top: 28px; } /* * Swiper загружается с CDN. До его инициализации держим ту же геометрию, * чтобы первая карточка не растягивалась на всю ширину страницы. */ [data-catalog-palitra-swiper] .swiper:not(.swiper-initialized) { overflow: hidden; } [data-catalog-palitra-swiper] .swiper:not(.swiper-initialized) .swiper-wrapper { display: flex; align-items: flex-start; gap: 24px; width: 100%; } [data-catalog-palitra-swiper] .swiper:not(.swiper-initialized) .swiper-slide { flex: 0 0 calc((100% - 120px) / 6); width: calc((100% - 120px) / 6); min-width: 0; } @media (max-width: 1439.98px) { [data-catalog-palitra-swiper] .swiper:not(.swiper-initialized) .swiper-slide { flex-basis: calc((100% - 72px) / 4); width: calc((100% - 72px) / 4); } } @media (max-width: 767.98px) { [data-catalog-palitra-swiper] .swiper:not(.swiper-initialized) .swiper-wrapper { gap: 12px; } [data-catalog-palitra-swiper] .swiper:not(.swiper-initialized) .swiper-slide { flex-basis: calc((100% - 12px) / 2); width: calc((100% - 12px) / 2); } } .catalog-palette-preview .catalog-brand-swiper-arrow { border: 0; padding: 0; } .catalog-palette-preview + .bx-filter .catalog-filter-menu { margin-top: 100px; } .section-catalog-page-palette h1 { margin-bottom: 0; } .section-catalog-page-palette .palette-color-filter { margin-top: 24px; scrollbar-width: none; } .section-catalog-page-palette .palette-color-filter::-webkit-scrollbar { display: none; } .palette-page-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 32px 24px; margin-top: 24px; } .palette-page-grid-item { min-width: 0; } .palette-color-filter .pseudo-checkbox-control { color: var(--Dark500, #313A46); font-size: 16px; line-height: 24px; text-decoration: none; } .palette-color-filter .style-2 { font: inherit; } .palette-color-filter .pseudo-checkbox-control[aria-current="true"] .checkbox-color-sphere:before { content: ""; position: absolute; width: 8px; height: 8px; border-radius: 50%; background: #FFF; left: 50%; top: 50%; transform: translate(-50%, -50%); } .palette-promo-card { padding: 15px 15px 11px; border: 1px solid #EEF0F5; border-radius: 8px; background: #FFF; box-shadow: 0 4px 14px rgba(49, 58, 70, 0.08); } .palette-promo-media { display: block; } .palette-promo-picture { display: block; width: 100%; height: 294px; border-radius: 8px; object-fit: cover; } .palette-promo-content { display: flex; flex-direction: column; gap: 12px; margin-top: 16px; } .palette-promo-card .palette-promo-text { margin: 0; min-width: 0; font-size: 16px; font-weight: 400; line-height: 24px; color: var(--Dark500, #313A46); } .palette-promo-card .palette-promo-button { display: flex; align-items: center; justify-content: center; width: 100%; box-sizing: border-box; min-height: 48px; padding: 12px 8px; font-size: 16px; line-height: 24px; } .palette-page-navigation { margin-top: 24px; } .palette-show-more { display: block; width: 100%; text-align: center; } .palette-show-more[aria-disabled="true"] { opacity: 0.6; cursor: wait; } .palette-pagination { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 12px; margin-top: 32px; } .palette-pagination a, .palette-pagination span { display: inline-flex; align-items: center; justify-content: center; min-width: 48px; height: 48px; padding: 0 12px; border-radius: 50%; font-size: 16px; line-height: 24px; box-sizing: border-box; } .palette-pagination a, .palette-pagination span { color: var(--Dark500, #313A46); background: var(--Gray400, #EEF0F5); } .palette-pagination a.active { color: #FFF; background: var(--Dark500, #313A46); } @media (max-width: 1919.98px) { .section-catalog-page-palette > .wrapper-inside { width: calc(100% - 80px); } .palette-page-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } } @media (max-width: 1279.98px) { .section-catalog-page-palette > .wrapper-inside { width: calc(100% - 30px); } .section-catalog-page-palette h1 { font-size: 22px; line-height: 32px; } .palette-page-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 20px; margin-top: 20px; } .section-catalog-page-palette .palette-color-filter { margin-top: 20px; } .palette-color-filter .pseudo-checkbox-control { font-size: 14px; line-height: 20px; } .palette-page-grid .palitra-colored-item { gap: 16px; } .palette-page-grid .palitra-colored-item-bg { height: 310px; } .palette-page-grid .palitra-colored-item-bg img { width: 154px; height: 113px; } .palette-page-grid .palitra-colored-item-title { font-size: 14px; line-height: 20px; } .palette-page-grid .palitra-colored-item-price { font-size: 18px; line-height: 24px; } .palette-page-grid .palitra-colored-item-desc { gap: 8px; } .palette-promo-content { flex-direction: row; align-items: center; gap: 24px; margin-top: 12px; } .palette-promo-card .palette-promo-text { flex: 1; font-size: 14px; line-height: 20px; } .palette-promo-card .palette-promo-button { flex: 0 0 42.5%; min-height: 44px; font-size: 14px; line-height: 20px; } .palette-show-more { font-size: 14px; line-height: 20px; } .palette-pagination { margin-top: 24px; } .palette-pagination a, .palette-pagination span { min-width: 32px; height: 32px; padding: 0 8px; font-size: 14px; line-height: 20px; } } @media (max-width: 767.98px) { .palette-page-grid { column-gap: 12px; } .palette-page-grid .palitra-colored-item-bg { height: 148px; } .palette-page-grid .palitra-colored-item-bg img { width: 75px; height: 55px; } .palette-page-grid-promo { grid-column: 1 / -1; grid-row: 2; } .palette-promo-card { padding-bottom: 15px; } .palette-promo-picture { height: 234px; } .palette-promo-content { gap: 12px; margin-top: 16px; } .palette-promo-card .palette-promo-button { flex-basis: 39%; } } @media (max-width: 768px) { .mobile-filter-container .mobile-filter-btn-close { padding: 0; border: 0; background: transparent; } .mobile-filter-container .catalog-filter-menu.desktop-mode { display: flex; flex-direction: column; flex-wrap: nowrap; gap: 0; width: 100%; margin: 0; } .mobile-filter-container .catalog-filter-menu.desktop-mode .catalog-filter-menu-item { position: relative; width: 100%; padding: 20px 0; border-bottom: 1px solid #EEF0F5; box-sizing: border-box; } .mobile-filter-container .catalog-filter-menu.desktop-mode .catalog-filter-menu-item:first-child { padding-top: 0; } .mobile-filter-container .catalog-filter-menu.desktop-mode .catalog-filter-menu-item a.btn.controllerFilterBlock { display: flex; width: 100%; min-height: 20px; padding: 0; border: 0; background: transparent; box-shadow: none; pointer-events: none; } .mobile-filter-container .controllerFilterBlock .btn-with-icon > .icon { display: none; } .mobile-filter-container .controllerFilterBlock .text { color: var(--Dark500, #313A46); font-size: 14px; font-weight: 500; line-height: 20px; } .mobile-filter-container .filter-menu-item-block, .mobile-filter-container .filter-menu-item-block.first-item, .mobile-filter-container .filter-menu-item-block.last-item { position: static; display: block !important; width: 100%; margin-top: 12px; padding: 0; border-radius: 0; background: transparent; box-shadow: none; transform: none; } .mobile-filter-container .filter-menu-item-block::after { display: none; } .mobile-filter-container .filter-menu-item-block-list { display: flex; flex-direction: column; gap: 12px; max-height: none !important; overflow: visible !important; } .mobile-filter-container .filter-menu-item-block-list .mCustomScrollBox, .mobile-filter-container .filter-menu-item-block-list .mCSB_container { max-height: none !important; overflow: visible !important; } .mobile-filter-container .filter-menu-item-block-list .mCSB_container { display: flex; flex-direction: column; gap: 12px; } .mobile-filter-container .filter-menu-item-block-list .mCSB_scrollTools { display: none !important; } .mobile-filter-container .filter-menu-item-block-btn, .mobile-filter-container .bx_filter_container_modef { display: none; } .mobile-filter-container .normal-checkbox-control, .mobile-filter-container .selected-pseudo-item { margin: 0; } .mobile-filter-container .normal-checkbox-control label { display: flex; align-items: center; gap: 8px; min-height: 24px; } .mobile-filter-container .normal-checkbox-control .pseudo-checkbox { width: 24px; height: 24px; flex: 0 0 24px; border-radius: 4px; box-sizing: border-box; } .mobile-filter-container .selected-pseudo-item a, .mobile-filter-container .selected-pseudo-item p, .mobile-filter-container .normal-checkbox-control .name { color: var(--Dark500, #313A46); font-size: 14px; line-height: 20px; } .mobile-filter-btn { display: inline-flex; align-items: center; justify-content: center; text-align: center; text-decoration: none; } .currentsFiltersList { display: none !important; } .catalog-palette-preview { margin-top: 20px; } .catalog-palette-preview + .bx-filter .mobile-open-filter-btn { margin-top: 64px; } } .tabs-line-switch-items { position: relative; display: flex; gap: 32px; border-bottom: 1px solid #d9d9d9; } .tabs-line-switch-item { color: var(--Dark500, #313A46); font-size: 22px; font-style: normal; font-weight: 500; line-height: 32px; padding-bottom: 12px; cursor: pointer; transition: color 0.3s ease; } .tabs-line-switch-item.active { color: #000; } .tabs-line-switch-indicator { position: absolute; bottom: -1px; left: 0; height: 1px; background: #000; transition: left 0.3s ease, width 0.3s ease; } .service-link-item{ display: flex; padding: 16px; box-sizing: border-box; border-radius: 8px; border: 1px solid var(--Gray400, #EEF0F5); background: #FFF; box-shadow: 0 4px 16px 0 rgba(49, 58, 70, 0.10); width: calc(33.333% - 16px); gap: 24px; } .service-link-items{ display: flex; flex-wrap: wrap; gap: 24px; } .service-link-item-img{ display: inline-block; width: 228px; height: 228px; border-radius: 8px; overflow: hidden; } .service-link-item-img img{ object-fit: cover; width: 100%; height: 100%; } .service-link-item-desc{ display: flex; flex-direction: column; justify-content: space-between; width: calc(100% - 252px); align-items: flex-start; } .service-link-item-title{ color: var(--Dark500, #313A46); font-size: 22px; font-style: normal; font-weight: 500; line-height: 32px; /* 145.455% */ } .service-link-item-text{ display: -webkit-box; -webkit-line-clamp: 3; overflow: hidden; -webkit-box-orient: vertical; color: var(--Dark500, #313A46); font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; /* 150% */ } .service-link-item-desc-inside{ display: flex; flex-direction: column; gap: 12px; } .service-link-item-btn{ padding: 12px 24px; border-radius: 8px; background: var(--Gray400, #EEF0F5); color: var(--Dark500, #313A46); font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; /* 150% */ display: inline-block; margin-top: 12px; } .service-main-container{ display: flex; flex-direction: column; gap: 32px; } @media (max-width: 1560px) { .service-link-item{ width: calc(50% - 12px); } } @media (max-width: 1080px) { .service-link-item{ width: 100%; } } @media (max-width: 768px) { .service-link-item{ flex-direction: column; } .service-link-item-img{ width: 100%; height: auto; aspect-ratio: 1 / 1; } .service-link-item-desc{ width: 100%; flex-grow: 1; } .tabs-line-switch-item{ font-size: 16px; line-height: 20px; } .tabs-line-switch-items{ gap: 16px; } .service-main-container{ gap: 24px; } .service-link-item-title{ font-size: 18px; font-style: normal; font-weight: 500; line-height: 24px; /* 133.333% */ } .service-link-item-text{ font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; /* 142.857% */ } .service-link-item-btn{ font-size: 14px; line-height: 18px; } .service-link-items{ gap: 16px; } } .pd-top-32{ padding-top: 32px; } .arrow-item{ width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; background: #ffffff; opacity: 0.8; border-radius: 9999px; cursor: pointer; } .slider-main .arrow-item{ position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; } .slider-main .arrow-item.left{ left: calc(14.2% + 20px); } .slider-main .arrow-item.right{ right: calc(14.2% + 20px); } .slide-main{ display: block; width: 100%; height: auto; aspect-ratio: 1290 / 609; } .slide-main img{ width: 100%; height: 100%; object-fit: cover; } .slider-main .swiper{ /*overflow: visible;*/ /*padding: 0 14.2%;*/ } .pd-top-120{ padding-top: 120px; } .head-with-arrow{ position: relative; } .arrow-item-container{ display: flex; align-items: center; gap: 16px; } .arrow-item-container .arrow-item{ background: #EEF0F5; } .head-with-arrow .arrow-item-container{ position: absolute; right: 0; top: 50%; transform: translateY(-50%); } .head-with-arrow{ box-sizing: border-box; padding: 0 60px; margin-bottom: 32px; } .head-with-arrow .h2{ text-align: center; } .pd-bottom-120{ padding-bottom: 120px; } .btn-open-detail-page{ display: flex; justify-content: center; margin-top: 32px; } .service-link-items .swiper{ width: 100%; } .wall-item{ display: flex; width: 100%; height: 100%; flex-direction: column; gap: 16px; } .wall-item-img{ display: inline-block; width: 100%; aspect-ratio: 442 / 317; position: relative; } .wall-item-img img{ width: 100%; height: 100%; object-fit: cover; position: absolute; left: 0; top: 0; } .wall-item-title{ color: var(--Dark500, #313A46); text-align: center; font-size: 22px; font-style: normal; font-weight: 500; line-height: 32px; /* 145.455% */ } .wall-item-price{ color: var(--Dark500, #313A46); text-align: center; font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; /* 150% */ } .wall-item-desc{ display: flex; flex-direction: column; gap: 12px; } .idea-item{ display: flex; flex-direction: column; gap: 20px; width: 100%; } .idea-item-img{ display: inline-block; width: 100%; flex-grow: 1; position: relative; border-radius: 8px; overflow: hidden; } .idea-item-img img{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; } .idea-item-desc{ display: flex; gap: 16px; align-items: center; } .idea-item-title{ color: var(--Dark500, #313A46); font-size: 22px; font-style: normal; font-weight: 500; line-height: 32px; /* 145.455% */ flex-grow: 1; } .idea-item-icons{ display: flex; align-items: center; gap: 16px; } .idea-item-icon{ display: flex; align-items: center; gap: 4px; } .idea-item-icon-count{ color: var(--Dark500, #313A46); text-align: center; font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; /* 150% */ } .idea-content-container{ display: flex; flex-wrap: wrap; gap: 24px; } .idea-content-left{ width: calc(33.333% - 12px); } .idea-content-right{ width: calc(66.666% - 12px); display: flex; flex-wrap: wrap; gap: 32px 24px; } .idea-content-right .idea-item{ width: calc(50% - 12px); } .idea-content-left .idea-item{ height: 100%; } .idea-content-right .idea-item-img{ aspect-ratio: 584 / 388; } .section-material-brands .catalog-brands-container{ margin-bottom: 0; } .only-mobile{ display: none; } .idea-tag{ position: absolute; z-index: 2; left: 16px; top: 16px; border-radius: 8px; background: var(--Dark500, #313A46); padding: 4px 8px; color: var(--White500, #FFF); font-size: 14px; font-style: normal; font-weight: 400; line-height: 16px; /* 114.286% */ box-sizing: border-box; } .palitra-colored-container .catalog-brands-swiper .swiper{ overflow: hidden; } .material-brands-container{ overflow: hidden; } @media (max-width: 768px) { .slider-main .arrow-item.right{ right: 12px } .slider-main .arrow-item.left{ left: 12px } .arrow-item{ width: 32px; height: 32px; } .slide-main{ aspect-ratio: 290 / 386; } .pd-top-120{ padding-top: 60px; } .head-with-arrow{ padding: 0; margin-bottom: 20px; } .head-with-arrow .arrow-item-container{ display: none; } .head-with-arrow .h2{ text-align: left; } .catalog-list-items.swiper-wrapper{ gap: 0; flex-wrap: nowrap; } .catalog-list-section-container .swiper{ padding-right: 25%; box-sizing: border-box; overflow: visible; } .btn-open-detail-page .btn{ width: 100%; text-align: center; } .btn-open-detail-page{ margin-top: 20px; } .service-link-items .swiper{ padding-right: 25%; box-sizing: border-box; overflow: visible; } .only-mobile{ display: flex; } .wall-items-container .swiper{ padding-right: 25%; box-sizing: border-box; overflow: visible; } .wall-item-title{ font-size: 14px; font-style: normal; font-weight: 500; line-height: 20px; /* 142.857% */ } .wall-item-price{ font-size: 18px; font-style: normal; font-weight: 500; line-height: 24px; /* 133.333% */ } .wall-item-desc{ gap: 8px; } .idea-content-left{ width: 100%; } .idea-content-right{ width: 100%; } .idea-content-right .idea-item{ width: 100%; } .idea-item-img { aspect-ratio: 584 / 388; } .idea-item-desc{ flex-direction: column; align-items: flex-start; gap: 5px; } .idea-item-title{ color: var(--Dark500, #313A46); font-size: 18px; font-style: normal; font-weight: 500; line-height: 24px; /* 133.333% */ } .idea-item{ gap: 12px; } .idea-tag{ font-size: 12px; line-height: 20px; /* 166.667% */ } .pd-bottom-120{ padding-bottom: 60px; } .catalog-groups-section .catalog-groups-section-item{ width: 100%; } } .catalog-list-section-container .swiper{ overflow: visible; } .reviews-widget-container{ display: flex; gap: 40px; flex-wrap: wrap; } .reviews-widget-content-left{ width: calc(50% - 20px); } .reviews-widget-content-right{ width: calc(50% - 20px); } @media (max-width: 1200px) { .reviews-widget-content-left{ width: 100%; } .reviews-widget-content-right{ width: 100%; } } main.content{ overflow: hidden; } .about-content{ display: flex; gap: 26px; } .about-content-left{ width: calc(50% - 13px); display: flex; flex-direction: column; gap: 26px; } .about-content-right{ width: calc(50% - 13px); display: flex; flex-direction: column; gap: 26px; } .about-text-container{ border-radius: 12px; background: #FFF; box-shadow: 0 4px 16px 0 rgba(49, 58, 70, 0.10); padding: 30px 30px 40px 30px; } .about-text-title{ color: var(--Dark500, #313A46); font-size: 36px; font-style: normal; font-weight: 700; line-height: 48px; /* 133.333% */ margin-bottom: 20px; } .about-text-desc{ display: flex; flex-direction: column; gap: 12px; } .about-text-desc p{ color: var(--Dark500, #313A46); font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; /* 150% */ } .about-img-slider{ width: 100%; height: 532px; position: relative; border-radius: 12px; box-shadow: 0 4px 16px 0 rgba(49, 58, 70, 0.10); overflow: hidden; } .about-img-slider .swiper{ height: 100%; } .about-img-slider .arrow-item{ position: absolute; z-index: 2; top: 50%; transform: translateY(-50%); } .about-img-slider .arrow-item.left{ left: 30px; } .about-img-slider .arrow-item.right{ right: 30px; } .about-advantages-items{ display: flex; gap: 28px; } .about-advantages-item{ width: calc(33.333% - 18.6666667px); min-height: 278px; border-radius: 12px; background: rgba(217, 217, 217, 0.30); box-sizing: border-box; padding: 35px; } .about-advantages-item-title{ color: var(--Dark500, #313A46); font-size: 55px; font-style: normal; font-weight: 700; line-height: 56px; /* 101.818% */ margin-bottom: 2px; } .about-advantages-item-desc{ color: var(--Dark500, #313A46); font-size: 22px; font-style: normal; font-weight: 500; line-height: 32px; /* 145.455% */ } .about-img-right{ width: 100%; flex-grow: 1; position: relative; border-radius: 12px; overflow: hidden; } .about-img-right img{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; } .pop-up-action-img{ width: 100%; height: 408px; } .pop-up-action-img img{ width: 100%; height: 100%; object-fit: cover; } .pop-up-action{ display: flex; flex-direction: column; gap: 24px; } .pop-up-action-title{ color: var(--Dark500, #313A46); text-align: center; font-size: 28px; font-style: normal; font-weight: 700; line-height: 38px; /* 171.429% */ margin-bottom: 12px; } .pop-up-action-text{ color: var(--Dark500, #313A46); text-align: center; font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; /* 150% */ display: flex; flex-direction: column; gap: 8px; } .pop-up-action-desc .btn{ width: 100%; text-align: center; margin-top: 24px; } .pop-up-action-container{ padding: 0; border-radius: 8px; background: #FFF; width: calc(100% - 30px); max-width: 600px; } .pop-up-action-desc{ padding: 0 24px 32px; } .pop-up-action-container .fancybox-close-small{ border-radius: 8px; background: rgba(255, 255, 255, 0.60); padding: 8px; right: 16px; top: 16px; } .pop-up-action-img.small-height{ height: 315px; } .team-item-name{ color: var(--Dark500, #313A46); text-align: center; font-size: 16px; font-style: normal; font-weight: 500; line-height: 15px; /* 93.75% */ } .team-item-post{ color: var(--Dark500, #313A46); text-align: center; font-size: 16px; font-style: normal; font-weight: 400; line-height: 15px; } .team-item-link{ color: var(--Dark500, #313A46); text-align: center; font-size: 16px; font-style: normal; font-weight: 400; line-height: 15px; 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; } .team-item-desc{ display: flex; flex-direction: column; gap: 12px; } @media (max-width: 768px) { .pop-up-action-title{ font-size: 22px; font-style: normal; font-weight: 700; line-height: 32px; /* 145.455% */ } .pop-up-action-text{ font-size: 14px; font-style: normal; font-weight: 500; line-height: 20px; /* 142.857% */ } .pop-up-action-img{ height: 197px; } .pop-up-action-img.small-height{ height: 170px; } .pop-up-action-container .fancybox-close-small{ padding: 4px; top: 12px; right: 12px; } } .about-container { margin-top: 90px; } .section-breadcrumbs.custom-padding{ padding: 52px 0 43px; } .about-img-slider-item img{ width: 100%; height: 100%; object-fit: cover; } .about-img-slider-item{ border-radius: 12px; overflow: hidden; height: 100%; } .section-team{ padding: 50px 30px; box-sizing: border-box; } .head-section{ margin-bottom: 50px; } .mg-top-50{ margin-top: 50px; } .team-items .swiper-wrapper{ display: flex; flex-wrap: wrap; gap: 50px 26px; justify-content: center; box-sizing: border-box; padding: 0 calc((100% / 12) - 26px); } .team-item{ width: calc(20% - 20.8px); display: flex; flex-direction: column; gap: 24px; } .team-item-logo{ aspect-ratio: 1 / 1; width: calc(100% - 58px); margin: 0 auto; height: auto; box-sizing: border-box; position: relative; border-radius: 50%; overflow: hidden; } .team-item-logo img{ width: 100%; height: 100%; object-fit: cover; position: absolute; left: 0; top: 0; } .dilers-items .swiper-wrapper{ display: flex; flex-wrap: wrap; gap: 16px 27px; } .dilers-items .swiper-slide{ width: calc(16.6666667% - 22.5px); } .dilers-container{ box-sizing: border-box; padding: 50px 30px; border-radius: 12px; background: #FFF; box-shadow: 0 4px 16px 0 rgba(49, 58, 70, 0.10); } .diler-item{ width: 100%; height: 100%; box-sizing: border-box; padding: 13px 30px; display: inline-block; } .diler-item img{ width: 100%; } .btn-center{ display: flex; justify-content: center; margin-top: 50px; } .master-class-content { display: flex; gap: 26px; flex-wrap: wrap; align-items: center; } .master-class-content-left{ width: calc((100% / 10) * 7 - 13px); padding: 42px 40px 50px 40px; box-sizing: border-box; border-radius: 12px; background: linear-gradient(188deg, #FFF 13.62%, rgba(255, 255, 255, 0.00) 39.08%), linear-gradient(92deg, rgba(255, 255, 255, 0.67) 40.96%, rgba(255, 255, 255, 0.00) 88.06%), linear-gradient(105deg, rgba(255, 255, 255, 0.67) 57.56%, rgba(255, 255, 255, 0.00) 89.06%), linear-gradient(110deg, #FFF 33.01%, rgba(255, 255, 255, 0.00) 95.68%); box-shadow: 0 4px 16px 0 rgba(49, 58, 70, 0.10); display: flex; flex-direction: column; gap: 20px; align-items: flex-start; position: relative; border-radius: 12px; overflow: hidden; } .master-class-desc{ width: 100%; max-width: 770px; display: flex; flex-direction: column; gap: 12px; } .master-class-desc p { color: var(--Dark500, #313A46); font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; /* 150% */ } .master-class-container{ padding: 0 calc((100% / 12) * 1); box-sizing: border-box; } .master-class-img{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: -1; } .master-class-img img{ width: 100%; height: 100%; object-fit: cover; } .spicker-items{ display: flex; flex-direction: column; gap: 22px; } .spicker-item-img{ width: 87.747px; height: 86.376px; border-radius: 50%; overflow: hidden; flex-shrink: 0; } .spicker-item-img svg, .spicker-item-img img{ width: 100%; height: 100%; object-fit: cover; } .spicker-title{ color: #000; font-size: 22px; font-style: normal; font-weight: 500; line-height: 32px; /* 145.455% */ margin-bottom: 22px; } .spicker-item{ width: 100%; display: flex; gap: 32.906px; align-items: center; } .spicker-item-desc{ width: calc(100% - 32.906px - 87.747px); display: flex; flex-direction: column; gap: 8px; } .master-class-content-right{ width: calc((100% / 10)* 3 - 13px); padding: 10px; box-sizing: border-box; } .spicker-item-name{ color: #000; font-size: 16px; font-style: normal; font-weight: 500; line-height: 12px; /* 75% */ } .spicker-item-post{ color: #000; font-size: 16px; font-style: normal; font-weight: 400; line-height: 12px; } .professional-program-title-desc{ color: var(--Dark500, #313A46); font-size: 22px; font-style: normal; font-weight: 500; line-height: 32px; } .professional-program-desc-text p{ color: var(--Dark500, #313A46); font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; /* 150% */ } .professional-program-container{ padding: 42px 41px 50px 41px; box-sizing: border-box; width: calc((100% / 12) * 10); margin: 0 auto; position: relative; border-radius: 12px; background: linear-gradient(90deg, #F0E4DA 69.23%, rgba(240, 228, 218, 0.00) 81.73%), linear-gradient(90deg, #F0E4DA 65.25%, rgba(240, 228, 218, 0.00) 81.73%), linear-gradient(90deg, #F0E4DA 65.25%, rgba(240, 228, 218, 0.00) 81.73%); overflow: hidden; display: flex; flex-direction: column; gap: 20px; align-items: flex-start; } .professional-program-img{ position: absolute; right: 0; top: 0; width: 550px; height: 100%; z-index: -1; } .professional-program-img img{ width: 100%; height: 100%; object-fit: cover; } .btn.btn-white{ background: #FFFFFF; } .professional-program-title{ line-height: 43px; } .address-content-items{ display: flex; gap: 26px; flex-wrap: wrap; padding: 0 calc((100% / 12) * 1); box-sizing: border-box; } .address-content-item{ padding: 45px 30px; border-radius: 12px; background: #FFF; box-shadow: 0 4px 16px 0 rgba(49, 58, 70, 0.10); width: calc(50% - 13px); box-sizing: border-box; } .address-content-item-title{ color: var(--Dark500, #313A46); font-size: 22px; font-style: normal; font-weight: 500; line-height: 32px; /* 145.455% */ margin-bottom: 20px; } .address-content-item-desc{ display: flex; flex-direction: column; gap: 8px; } .address-content-item-desc-text{ color: var(--Dark500, #313A46); font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; /* 150% */ } .dilers-items .arrow-item{ display: none; } .address-content-item-desc-link{ color: var(--Dark500, #313A46); font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; } .address-content-item-desc-link-inside{ font-weight: 400; } a.address-content-item-desc-link-inside{ 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; } @media (max-width: 1440px) { .about-content{ flex-direction: column; } .about-content-left{ width: 100%; flex-direction: column-reverse; } .about-content-right{ width: 100%; } .about-img-right{ height: 500px; } .team-item{ width: calc(25% - 19.5px); } .dilers-items .swiper-slide{ width: calc(25% - 20.25px); } } @media (max-width: 768px) { .section-breadcrumbs.custom-padding { padding: 20px 0 38px; } .about-container { margin-top: 20px; } .about-content{ flex-direction: column-reverse; gap: 20px; } .about-advantages-item{ width: 100%; min-height: 128px; padding: 14px 25px; } .about-advantages-items{ flex-direction: column; width: calc(100% - 30px); margin: 0 auto; gap: 10px; } .about-img-right{ height: 243px; } .about-advantages-item-title{ font-size: 39px; font-style: normal; font-weight: 700; line-height: 44px; /* 143.59% */ } .about-advantages-item-desc{ font-size: 18px; font-style: normal; font-weight: 500; line-height: 24px; /* 133.333% */ } .about-content-right { gap: 20px; } .about-content-left{ flex-direction: column; gap: 20px; } .about-text-title{ font-size: 22px; font-style: normal; font-weight: 700; line-height: 32px; /* 145.455% */ margin-bottom: 8px; } .about-text-desc p{ font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; /* 142.857% */ } .about-text-container{ padding: 24px 16px; } .about-img-slider{ height: 370px; } .about-img-slider .arrow-item.right{ right: 11px; } .about-img-slider .arrow-item.left{ left: 11px; } .about-img-slider .arrow-item{ background: rgba(233, 233, 233, 0.60); width: 48px; height: 48px; } .team-items .swiper-wrapper{ flex-wrap: nowrap; gap: 0; } .section-team{ padding: 15px 0 56px; } .team-items .swiper{ overflow: visible; padding: 0 15%; } .head-section { text-align: center; } .mg-top-50{ margin-top: 20px; } .team-item-name{ font-size: 14px; font-style: normal; font-weight: 500; line-height: 20px; /* 142.857% */ } .team-item-post{ font-size: 12px; font-style: normal; font-weight: 400; line-height: 20px; } .team-item-link{ font-size: 12px; font-style: normal; font-weight: 400; line-height: 20px; } .team-item{ gap: 20px; } .team-item-desc{ gap: 0; } .dilers-items .swiper { width: 100%; height: 417px; overflow: visible; padding: 0 17%; box-sizing: border-box; } .dilers-items .swiper-wrapper { gap: 0; } .dilers-items .swiper-slide { width: 100%; height: calc((100% - 36px) / 4); } .diler-item { width: 100%; height: 100%; padding: 14px; } .diler-item img { display: block; width: 100%; height: 100%; object-fit: contain; } .dilers-container .btn-center{ display: none; } .dilers-container{ padding: 33px 30px; overflow: hidden; position: relative; } .dilers-items .arrow-item{ position: absolute; top: 50%; transform: translateY(-50%); background: #F4F4F4; width: 48px; height: 48px; z-index: 2; display: flex; } .dilers-items .arrow-item.left{ left: 9px; } .dilers-items .arrow-item.right{ right: 9px; } .master-class-content-left{ width: 100%; border-radius: unset; border: navajowhite; background: transparent; box-shadow: none; padding: 0; position: static; } .master-class-img{ width: 100%; height: 232px; } .master-class-container{ padding: 0; } .master-class-desc p{ font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; /* 142.857% */ } .master-class-content-right{ width: 100%; padding: 0; } .master-class-content{ padding: 181px 15px 20px 15px; border-radius: 8px; border: 1px solid var(--Gray400, #EEF0F5); background: linear-gradient(180deg, rgba(255, 255, 255, 0.00) 7.96%, #FFF 27.85%), linear-gradient(180deg, rgba(255, 255, 255, 0.00) 14.97%, #FFF 22.39%), linear-gradient(180deg, rgba(255, 255, 255, 0.00) 10.88%, #FFF 27.9%); box-shadow: 0 4px 16px 0 rgba(49, 58, 70, 0.10); position: relative; } .master-class-content-left .btn{ display: none; } .master-class-content-right .btn{ width: 100%; text-align: center; margin-top: 40px; } .spicker-title{ font-size: 18px; font-style: normal; font-weight: 500; line-height: 24px; /* 133.333% */ margin-bottom: 26px; } .spicker-item-name{ font-size: 14px; font-style: normal; font-weight: 500; line-height: 20px; /* 142.857% */ } .spicker-item-post{ font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; } .spicker-item{ gap: 15.25px; } .spicker-item-desc { width: calc(100% - 15.25px - 87.747px); gap: 0; } .professional-program-container{ width: 100%; padding: 166px 15px 20px 15px; border-radius: 8px; background: linear-gradient(180deg, rgba(240, 228, 218, 0.00) 20.19%, #F0E4DA 58.35%), linear-gradient(180deg, rgba(240, 228, 218, 0.00) 27.27%, #F0E4DA 58.88%), linear-gradient(180deg, rgba(240, 228, 218, 0.00) 25.69%, #F0E4DA 57.4%); box-shadow: 0 4px 16px 0 rgba(49, 58, 70, 0.10); } .professional-program-img{ width: 100%; height: 286px; } .professional-program-title{ line-height: 32px; /* 145.455% */ } .professional-program-title-desc{ font-size: 14px; font-style: normal; font-weight: 500; line-height: 30px; } .professional-program-desc-text p{ font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; /* 142.857% */ } .professional-program-container .btn{ width: 100%; text-align: center; } .address-content-items{ padding: 0; } .address-content-item{ width: 100%; padding: 24px 15px; } .address-content-item-title{ font-size: 18px; font-style: normal; font-weight: 500; line-height: 24px; /* 133.333% */ margin-bottom: 12px; } .address-content-item-desc-text{ font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; /* 142.857% */ } .address-content-item-desc-link{ font-size: 14px; font-style: normal; font-weight: 500; line-height: 20px; } } @media (max-width: 540px) { .footer-line-top{ flex-direction: column; gap: 26px; padding-bottom: 19px; } .footer-line-top-left, .footer-contacts{ flex-direction: column; align-items: flex-start; gap: 21px; } .footer-menu-container{ flex-direction: column; gap: 26px; } .footer-menu-item{ width: 100%; } .footer-social{ padding-left: 0; } .footer-social:before{ opacity: 0; } .footer-line-top-right{ align-items: flex-start; } } .error-product-item.lg-view{ display: flex; } .error-product-item.xs-view{ display: none; } .error-product-item{ display: flex; align-items: center; width: 100%; padding: 8px 16px; color: #C00; font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; /* 150% */ gap: 8px; justify-content: center; background: rgba(204, 0, 0, 0.10); box-sizing: border-box; } .chars-table .error-product-item{ width: calc(100% + 32px); margin-left: -16px; } .error-product-item-icon svg{ display: flex; } @media (max-width: 768px) { .error-product-item.lg-view{ display: none; } .error-product-item.xs-view{ display: flex; } .error-product-item{ font-size: 14px; font-style: normal; font-weight: 500; line-height: 20px; /* 142.857% */ } } .error-product-item[data-quantity-error][hidden]{ display: none; } /* End */ /* Start:/local/templates/kraska/design/css/pages.css?178996308512961*/ /*блок дилер*/ .desktop.manager-block{ display: block; } .mobile.manager-block{ display: none; } .about-page-dealer-right{ margin-top: 64px; } .dealer{ display: flex; gap: 24px; padding: 24px; background: #fff; border: 1px solid rgba(238, 240, 245, 1); box-shadow: 0px 4px 16px 0px rgba(49, 58, 70, 0.1); border-radius: 8px; margin-top: 24px; } .dealer__info { font-weight: 500; font-size: 22px; line-height: 32px; margin-top: 20px; } .dealer__info-name{ font-weight: 500; font-size: 22px; line-height: 32px; } .dealer__info a{ font-weight: 500; font-size: 15px; line-height: 32px; } .dealer__info-name { margin-bottom: -8px; } .dealer__info-social a{ font-weight: 500; font-size: 16px; line-height: 24px; text-decoration: underline; } .products-dilers{ margin-top: 28px; } .dealer__img{ border-radius: 50%; max-width: 120px; box-sizing: border-box; max-height: 120px; } .dealer__img img{ object-fit: cover; object-position: center; width: 100%; height: 100%; } .section-dealer .about-page-detail{ margin-top: 18px; } .section-dealer .wrapper-inside{ padding-left: 14px; } /*блок дилер*/ .events-social ul { display: flex; align-items: flex-start; gap: 16px; list-style: none; } .content-mode.detail-text .events-social ul li{ padding-left: 5px; } .content-mode.detail-text .events-social ul li:before{ content: none; } section.section-breadcrumbs{ padding: 19px 0; } section.section-brands{ padding: 1.25rem 0 0; margin-bottom: -3px; } .section-brands .brands-list{ display: flex; flex-wrap: wrap; margin: 15px -12px 0; } .section-brands .brands-list .brand-item{ width: 25%; box-sizing: border-box; padding: 12px; } .section-brands .brands-list .brand-item:nth-child(4n){ margin-right: 0; } .section-brands .brand-list-item .brand-list-item-pic img{ max-width: 100%; object-fit: contain; } .author-text-left .style-2 a{ text-decoration: underline; } .shtory-assortiment{ } .shtory-assortiment h2{ font-size: 28px; font-weight: bold; letter-spacing: -0.66px; margin-bottom: 17px; } .shtory-banner{ position: relative; margin-bottom: 98px; } .shtory-banner img{ vertical-align: top; } .shtory-banner .shtory-banner-content{ background-color: rgba(255, 255, 255, 0.7); position: absolute; padding: 29px 23px 36px; top: 148px; left: 36px; width: 620px; box-sizing: border-box; } .shtory-banner .shtory-banner-title{ font-size: 36px; font-weight: bold; font-stretch: normal; font-style: normal; line-height: normal; letter-spacing: -0.66px; line-height: 40px; color: #313a46; font-family: Room; margin-bottom: 23px; } .shtory-banner .shtory-banner-title.mobile{ display: none; } .shtory-banner .shtory-banner-btn{ } .shtory-banner .shtory-banner-btn.mobile{ display: none; } .shtory-banner .shtory-banner-btn a{ font-size: 15px; letter-spacing: -0.19px; color: #ffffff; display: inline-block; width: 316px; text-decoration: none; background-color: #6c7890; text-align: center; margin-left: 1px; padding: 14px 14px 15px; box-sizing: border-box; } .shtory-banner .shtory-banner-btn a:hover{ } .shtory-assortiment-groups{ display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .shtory-assortiment-groups .shtory-groups-item{ } .shtory-assortiment-groups .shtory-groups-item table{ width: 100%; height: 100%; } .shtory-assortiment-groups .shtory-groups-item table td{ vertical-align: middle; } .shtory-assortiment-groups .shtory-groups-item table a{ display: inline-block; } .shtory-assortiment-groups .shtory-groups-item table a img{ vertical-align: top; } .shtory-groups-listitems{ margin-top: 20px; } .shtory-groups-listitems img{ vertical-align: top; } .shtory-zakaz { margin-top: 97px; } .shtory-zakaz h2{ font-family: Room; font-size: 28px; font-weight: bold; font-stretch: normal; font-style: normal; line-height: normal; letter-spacing: -0.66px; text-align: center; color: #313a46; margin-bottom: 16px; } .shtory-zakaz p{ font-size: 15px; font-weight: 100; font-stretch: normal; font-style: normal; line-height: 1.73; letter-spacing: -0.28px; text-align: center; color: #313a46; margin-bottom: 24px; } .shtory-zakaz-list .shtory-zakaz-list-item{ } .shtory-zakaz-list .shtory-zakaz-list-item img{ vertical-align: top; } .shtory-zakaz-list .shtory-zakaz-list-item .shtory-zakaz-list-item-pic{ margin-bottom: 25px; } .shtory-zakaz-list .shtory-zakaz-list-item .shtory-zakaz-list-item-name{ text-align: center; } .shtory-zakaz-list .shtory-zakaz-list-item .shtory-zakaz-list-item-name a{ font-size: 15px; font-weight: 100; font-stretch: normal; font-style: normal; line-height: 1.73; letter-spacing: -0.28px; text-align: center; color: #313a46; text-decoration: none; } .shtory-steps{ margin-top: 96px; } .shtory-steps-container{ } .shtory-steps-container .shtory-steps-pic{ float: left; margin-right: 36px; display: inline-block; width: 480px; } .shtory-steps-container .shtory-steps-text{ text-align: left; display: inline-block; width: 680px; } .shtory-steps-container .shtory-steps-text h2{ text-align: left; font-size: 28px; font-weight: bold; font-stretch: normal; font-style: normal; line-height: normal; letter-spacing: -0.66px; color: #313a46; margin-bottom: 24px; } .shtory-steps-container .shtory-steps-text ul{ } .shtory-steps-container .shtory-steps-text ul li{ padding-left: 48px; position: relative; font-size: 15px; font-weight: 100; font-stretch: normal; font-style: normal; line-height: 1.73; letter-spacing: -0.28px; color: #313a46; margin-bottom: 30px; } .shtory-steps-container .shtory-steps-text ul li .number{ position: absolute; font-size: 15px; font-weight: 100; font-stretch: normal; font-style: normal; line-height: normal; letter-spacing: -0.28px; color: #313a46; display: inline-block; width: 32px; height: 32px; object-fit: contain; background-color: #eef0f5; border-radius: 50%; text-align: center; left: 0px; top: 0px; line-height: 32px; } .shtory-steps-container .shtory-steps-text ul li .shtory-steps-item-name{ font-weight: bold; } .shtory-adresa{ margin-top: 68px; } .shtory-adresa h2{ text-align: left; font-size: 28px; font-weight: bold; font-stretch: normal; font-style: normal; line-height: normal; letter-spacing: -0.66px; color: #313a46; margin-bottom: 28px; } .shtory-adresa-container{ display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .shtory-adresa-container-desc{ width: 685px; display: inline-block; float: left; margin-right: 35px; } .shtory-adresa-container-desc p{ margin-bottom: 33px; } .shtory-adresa-container-form{ display: inline-block; width: 480px; } .shtory-adresa-container-form .ch_form{ padding: 24px 24px 36px; } .shtory-adresa-container-form .chf_title{ font-size: 18px; font-weight: normal; font-stretch: normal; font-style: normal; line-height: 1.44; letter-spacing: -0.33px; color: #313a46; margin-bottom: 34px; } .shtory-adresa-container-form .form_label{ margin-bottom: 13px; } .shtory-adresa-container-form .chf_group{ margin-bottom: 24px; } .shtory-map{ margin-top: 64px; margin-bottom: 64px; } .shtory-map #ymap{ height: 510px; } .shtory-steps-container .mobile{ display: none; } .shtory-adresa-container-desc.mobile{ display: none; } .wrapper-inside .footer-line-bottom-second .dir-text{ line-height: 16px; font-size: 14px; } @media (max-width: 1279px) { .wrapper-inside .footer-line-bottom-second .dir-text { font-weight: 400; font-size: 12px; line-height: 20px; } } .wrapper-inside .footer-line-bottom-second .dir-text .dir-watsapp{ text-decoration: underline; } .footer.bg-dark-500{ height: fit-content; } .services-list-container .services-list-item .no-vacancies{ margin-left: 12px; margin-top: 32px; } @media (max-width: 1919px){ } @media (max-width: 1023px){ .wrapper-inside .footer-line-bottom-second .dir-text{ line-height: 28px; } .service-detail-text .service-detail-text-block img{ width: 100%; height: 100%; } } @media (max-width: 767px){ .section-brands .brands-list .brand-item{ width: 100%; } .desktop.manager-block{ display: none; } .mobile.manager-block{ display: block; } .mobile.manager-block .dealer{ gap: 12px; padding: 12px; } .mobile.manager-block .dealer__img{ width: 50%; height: 50%; margin-top: 5px; } .mobile.manager-block .dealer__info .dealer__info-name{ margin-bottom: 0; } .service-page-detail { margin-top: 10px; } .service-page-detail .service-page-detail-left { margin-top: 0; } .dealer__info{ margin-top: 0; } .content-mode .dealer__info h2{ margin-top: 0; } .shtory-banner .shtory-banner-title.mobile{ display: inline-block; font-size: 32px; font-weight: bold; font-stretch: normal; font-style: normal; line-height: 1.06; letter-spacing: -0.62px; color: #313a46; } .shtory-banner{ margin-bottom: 67px; } .shtory-banner .shtory-banner-content{ display: none; } .shtory-banner .shtory-banner-btn.mobile{ display: inline-block; width: 100%; margin-top: 20px; } .shtory-banner .shtory-banner-btn.mobile a{ width: 100%; margin-left: 0px; } .shtory-assortiment h2{ font-size: 24px; letter-spacing: -0.46px; } .shtory-assortiment-groups.column_6 > * { width: calc((100% - 36px) / 2); } .shtory-zakaz-list.column_6 > * { width: calc((100% - 36px) / 2); } .shtory-assortiment-groups.column_6 > *:nth-child(2n+1) { margin-left: 0; } .shtory-assortiment-groups.column_6 > *:nth-child(3n+1) { margin-left: 18px; } .shtory-zakaz-list.column_6 > *:nth-child(2n+1) { margin-left: 0; } .shtory-zakaz-list.column_6 > *:nth-child(3n+1) { margin-left: 18px; } .shtory-zakaz-list.column_6 > *:nth-child(1) { margin-left: 0; } .shtory-zakaz { margin-top: 57px; } .shtory-zakaz h2{ font-size: 24px; } .shtory-steps-container .shtory-steps-pic{ width: 100%; margin-bottom: 30px; } .shtory-steps-container .mobile{ display: inline-block; } .shtory-steps-text h2{ display: none; } .shtory-steps-container .shtory-steps-text{ width: 100%; } .shtory-adresa-container-desc{ display: none; } .shtory-adresa-container-desc.mobile{ display: inline-block; width: 100%; } .shtory-adresa-container-form{ width: 100%; } .shtory-adresa-container-form .ch_form { background-color: #f6f7f9; } .shtory-adresa-container-form .chf_title{ font-size: 18px; margin-bottom: 20px; } .shtory-adresa-container-form .form_button{ width: 100%; } .shtory-adresa-container-form .form_button button{ width: 100%; } .shtory-adresa-container-desc.mobile{ width: 100%; margin-right: 0px; margin-top: 40px; } .shtory-adresa h2{ font-size: 24px; } .shtory-map { margin-top: 40px; margin-bottom: 40px; } .shtory-map #ymap{ height: 230px; } .shtory-groups-listitems img{ width: 100%; } } /* End */ /* Start:/local/templates/kraska/design/css/orangato.css?178996308578123*/ /*MONKEYHACKS*/ .header-actions-group { display: flex; gap: 12px; } /*Empty Basket*/ .basket-page .empty-basket { display: inline-block; width: 100%; margin: 0 0 20px; } .basket-page .empty-basket .empty-basket-holder { display: inline-block; width: 100%; border: 1px solid #EEF0F5; box-shadow: 0px 4px 16px 0px #313A461A; box-sizing: border-box; padding: 52px 0 90px; } .basket-page .empty-basket .empty-basket-holder .message { width: 496px; margin: 0 auto; } .basket-page .empty-basket .empty-basket-holder .message .icon { display: inline-block; width: 100%; text-align: center; margin: 0 0 19px; } .basket-page .empty-basket .empty-basket-holder .message .icon svg { } .basket-page .empty-basket .empty-basket-holder .message .text { display: inline-block; width: 100%; text-align: center; font-size: 22px; font-weight: 500; line-height: 32px; } /*About Company*/ .about-page-detail { display: inline-block; width: 100%; margin: 27px 0 0; } .about-page-detail .about-page-detail-container { } .about-page-detail .about-page-detail-container .about-page-detail-left { } .about-page-detail .about-page-detail-container .about-page-detail-right { } .about-page-detail .about-text { display: inline-block; width: 88.8%; } .about-page-detail .about-text img { } .about-page-detail .about-text img.full { width: 100%; margin: 0 0 23px; } .about-page-detail .about-text p { } .about-page-detail .about-text p:not(:last-of-type) { margin: 0 0 12px; } .company-info { display: inline-block; width: 100%; margin: 24px 0 0; } .company-info .company-info-holder { display: inline-block; width: 100%; box-sizing: border-box; border: 1px solid #EEF0F5; box-shadow: 0px 4px 16px 0px #313A461A; background: #FFFFFF; padding: 24px; } .company-info .company-info-holder .info-block { display: inline-block; width: 100%; } .company-info .company-info-holder .info-block:not(:last-of-type) { margin: 0 0 23px; } .company-info .company-info-holder .info-block .info-line { display: inline-block; width: 100%; font-size: 16px; font-weight: 400; line-height: 24px; } /*Personal Data*/ .personal-data-block { display: inline-block; width: 100%; margin: 29px 0 0; } .personal-data-block .personal-data-block-holder { display: inline-block; width: 100%; box-sizing: border-box; background: #FFFFFF; border: 1px solid #EEF0F5; box-shadow: 0px 4px 16px 0px #313A461A; padding: 30px 24px 17px; } .personal-data-block .personal-data-block-holder .personal-data-container { width: 35%; } .personal-data-block .personal-data-block-holder .personal-data-container .data-info { display: inline-block; width: 100%; margin: 0 0 25px; } .personal-data-block .personal-data-block-holder .personal-data-container .data-info .data-line { display: inline-block; width: 100%; font-size: 22px; font-weight: 500; line-height: 32px; } .personal-data-block .personal-data-block-holder .personal-data-container .data-info .data-line:not(:last-of-type) { margin: 0 0 16px; } .personal-data-block .personal-data-block-holder .personal-data-container .data-form { width: 78%; } .personal-data-block .personal-data-block-holder .personal-data-container .data-form .data-form-holder { display: inline-block; width: 100%; } .personal-data-block .personal-data-block-holder .personal-data-container .data-form .data-form-holder form { } .personal-data-block .personal-data-block-holder .personal-data-container .data-form .data-form-holder form .form-inner-heading { display: inline-block; width: 100%; margin: 14px 0 25px; font-size: 22px; font-weight: 500; line-height: 32px; } .personal-data-block .personal-data-block-holder .personal-data-container .data-form .data-form-holder form .form-field-one-line { margin: 0 0 16px; } .personal-data-block .personal-data-block-holder .personal-data-container .data-form .data-form-holder form .form-field-one-line .form-field-line-item { } .personal-data-block .personal-data-block-holder .personal-data-container .data-form .data-form-holder form .form-field-one-line .form-field-line-item .line-label { } .personal-data-block .personal-data-block-holder .personal-data-container .data-form .data-form-holder form .form-field-one-line .form-field-line-item .line-label p { } .personal-data-block .personal-data-block-holder .personal-data-container .data-form .data-form-holder form .form-field-one-line .form-field-line-item .form-input { } .personal-data-block .personal-data-block-holder .personal-data-container .data-form .data-form-holder form .form-field-one-line .form-field-line-item .form-input input { } /*NEW ORDER PAGE*/ .btn-green { background-color: #21B527; border-color: #21B527; color: white; } @media (hover: hover) { .btn-green:hover { background-color: #44d448; } } .btn-green.disabled { pointer-events: none; background-color: #44d44880; } .order-page-block { width: calc(100% - 24px); } @media (max-width: 1260px){ .order-page-block { width: 100%; } } .order-page-block:not(:last-of-type) { margin-bottom: 20px; } .order-page-block .order-page-block-item .order-page-block-title h3, .order-page-block .order-page-block-item .order-page-block-title .h3 { font-size: 24px; line-height: 32px; font-weight: 500; } @media (max-width: 767px){ .order-page-block .order-page-block-item .order-page-block-title h3, .order-page-block .order-page-block-item .order-page-block-title .h3 { font-size: 18px; line-height: 24px; } } .order-page-block-container { padding: 24px 24px 24px; } @media (max-width: 767px){ .order-page-block-container { padding: 15px 15px 23px; } } .order-page-block-content { width: 100%; } .form-field-two-line { margin: 0 -8px 8px; } @media (max-width: 1260px) { .form-field-two-line { margin: 0; } } .form-field-two-line .form-field-line-item { padding: 0 8px; } @media (max-width: 1260px) { .form-field-two-line .form-field-line-item { padding: 0; } } .order-page-block-item { margin: 0; } .order-page-block-item:not(:last-of-type) { margin: 0 0 24px; } .basket-summary-container { padding: 20px 20px; } @media (max-width: 767px) { .basket-summary-container { padding: 16px 16px; } } .basket-summery-line { padding-bottom: 10px; border-bottom: 1px solid #313A461A; margin-bottom: 14px; } .basket-summery-line-item { align-items: center; margin: 0 0 8px; } @media (max-width: 767px) { .basket-summery-line-item { margin: 0 0 11px; } } .basket-summery-line-item-name { border: none; } .basket-summery-line-item-value p.large { font-size: 24px; line-height: 32px; } @media (max-width: 767px) { .basket-summery-line-item-value p.large { font-size: 18px; line-height: 24px; } } .basket-summery-line-note { margin: 17px 0 5px; } .basket-summery-line-note p { font-size: 15px; line-height: 24px; } @media (max-width: 767px) { .basket-summery-line-note p { font-size: 14px; line-height: 20px; } } .basket-summery-btn { } @media (max-width: 1260px) { .basket-summery-btn { margin-top: 11px; } } .basket-page .order-fields .normal-checkbox-control { } @media (max-width: 767px) { .basket-page .order-fields .normal-checkbox-control { margin-left: 4px; } } .basket-page .order-fields .radio-button-item { } @media (max-width: 1260px) { .basket-page .order-fields .radio-button-item { margin-bottom: 18px; } } .basket-page .order-fields .radio-button-item label { } @media (max-width: 1260px) { .basket-page .order-fields .radio-button-item label { align-items: start; margin-left: 4px; gap: 8px; } } .radio-button-item label .pseudo-radio { } @media (max-width: 1260px) { .radio-button-item label .pseudo-radio { width: 16px; height: 16px; margin-top: 0; } } .order-fields .form-field-one-line { } @media (max-width: 767px) { .order-fields .form-field-one-line { margin-bottom: 13px; } } .order-page-block-item hr { border-color: #313A461A; margin: 19px 0 16px; } @media (max-width: 767px) { .order-page-block-item hr { margin: 12px 0 12px; } } /*ORDER NOTICE*/ .order-notice { border: 1px solid #21B527; background-color: #21B5270D; border-radius: 12px; width: calc(100% - 24px); box-sizing: border-box; padding: 20px; margin: 3px 0 19px; } @media (max-width: 1260px) { .order-notice { width: 100%; } } @media (max-width: 767px) { .order-notice { padding: 19px 16px; margin: 0 0 24px; } } .order-notice .order-notice-holder { color: #21B527; font-size: 16px; line-height: 24px; font-weight: 500; } @media (max-width: 767px) { .order-notice .order-notice-holder { font-size: 14px; line-height: 20px; } } /*INFO DETAILS*/ .info-details { display: flex; flex-direction: column; gap: 9px; } @media (max-width: 767px) { .info-details { margin: 13px 0 0; gap: 14px; } } .info-details .info-detail { } .info-details .info-detail p { } .info-details .info-detail p b { margin-left: 5px; } @media (max-width: 1260px) { .info-details .info-detail p b { margin: 0; } } /*NEW CART ITEMS*/ .cart-items-list { display: flex; flex-direction: column; gap: 0px; margin-top: -12px; } @media (max-width: 767px) { .cart-items-list { margin-top: -9px; margin-bottom: -14px; } } .cart-items-list .cart-item { width: 100%; padding: 12px 0 11px; border-bottom: 1px solid #313A461A; } @media (max-width: 767px) { .cart-items-list .cart-item { padding: 9px 0 8px; } } .cart-items-list .cart-item:last-of-type { border: none; } .cart-items-list .cart-item .cart-item-holder { display: flex; gap: 16px; align-items: center; justify-content: space-between; } @media (max-width: 1023px) { .cart-items-list .cart-item .cart-item-holder { flex-direction: column; align-items: start; justify-content: start; } } @media (max-width: 767px) { .cart-items-list .cart-item .cart-item-holder { gap: 9px; } } .cart-items-list .cart-item .cart-item-holder .item { } @media (max-width: 1023px) { .cart-items-list .cart-item .cart-item-holder .item { width: 100%; } } .cart-items-list .cart-item .cart-item-holder .item .item-holder { display: flex; gap: 16px; align-items: center; } @media (max-width: 767px) { .cart-items-list .cart-item .cart-item-holder .item .item-holder { gap: 12px; } } .cart-items-list .cart-item .cart-item-holder .item .item-holder .image { width: 80px; height: 80px; position: relative; } @media (max-width: 767px) { .cart-items-list .cart-item .cart-item-holder .item .item-holder .image { width: 64px; height: 64px; } } .cart-items-list .cart-item .cart-item-holder .item .item-holder .image .deleted-text { width: 100%; text-align: center; position: absolute; top: 50%; left: 0; transform: translateY(-50%); font-size: 14px; line-height: 16px; font-weight: 500; color: #EA3535; opacity: 0; pointer-events: none; transition: all 300ms; } .cart-items-list .cart-item.deleted-item .cart-item-holder .item .item-holder .image .deleted-text { opacity: 1; transition: all 300ms; } .cart-items-list .cart-item .cart-item-holder .item .item-holder .image a { display: block; width: 100%; height: 100%; border-radius: 4px; overflow: hidden; transition: all 300ms; } .cart-items-list .cart-item.deleted-item .cart-item-holder .item .item-holder .image a { opacity: 0; transition: all 300ms; pointer-events: none; } .cart-items-list .cart-item .cart-item-holder .item .item-holder .image a img { width: 100%; height: 100%; transition: all 300ms; } @media (hover: hover) { .cart-items-list .cart-item .cart-item-holder .item .item-holder .image a:hover img { opacity: 0.6; transition: all 300ms; } } .cart-items-list .cart-item .cart-item-holder .item .item-holder .desc { max-width: 768px; } @media (max-width: 1260px) { .cart-items-list .cart-item .cart-item-holder .item .item-holder .desc { max-width: none; max-width: 450px; } } @media (max-width: 1023px) { .cart-items-list .cart-item .cart-item-holder .item .item-holder .desc { max-width: none; width: calc(100% - 80px - 16px); } } @media (max-width: 767px) { .cart-items-list .cart-item .cart-item-holder .item .item-holder .desc { width: calc(100% - 64px - 12px); } } .cart-items-list .cart-item .cart-item-holder .item .item-holder .desc .name { font-weight: 500; font-style: normal; font-size: 16px; line-height: 24px; color: #313A46; } @media (max-width: 767px) { .cart-items-list .cart-item .cart-item-holder .item .item-holder .desc .name { font-size: 14px; line-height: 20px; } } .cart-items-list .cart-item .cart-item-holder .item .item-holder .desc .name a { color: #313A46; text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 4px; transition: all 300ms; } @media (hover: hover) { .cart-items-list .cart-item .cart-item-holder .item .item-holder .desc .name a:hover { text-decoration-color: currentColor; transition: all 300ms; } } .cart-items-list .cart-item.deleted-item .cart-item-holder .item .item-holder .desc .name a { color: #989CA2; transition: all 300ms; } .cart-items-list .cart-item .cart-item-holder .order-details { } @media (max-width: 1023px) { .cart-items-list .cart-item .cart-item-holder .order-details { width: 100%; } } .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder { display: flex; align-items: center; gap: 24px; position: relative; } @media (max-width: 767px) { .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder { gap: 20px; } } .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .restotre-action { position: absolute; right: 0; top: 50%; transform: translateY(-50%); opacity: 0; pointer-events: none; transition: all 300ms; } @media (max-width: 1023px) { .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .restotre-action { right: auto; left: 0; } } .cart-items-list .cart-item.deleted-item .cart-item-holder .order-details .order-details-holder .restotre-action { opacity: 1; pointer-events: all; transition: all 300ms; } .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .restotre-action a { display: flex; gap: 4px; align-items: center; padding: 12px; border: 1px solid #D2DAED; border-radius: 8px; background-color: transparent; color: #313A46; text-decoration: none; transition: all 300ms; font-size: 16px; line-height: 24px; font-weight: 500; } @media (hover: hover) { .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .restotre-action a:hover { background-color: #D2DAED; transition: all 300ms; } } @media (max-width: 1023px) { .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .restotre-action a { font-size: 14px; line-height: 20px; padding: 8px 12px; } } .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .restotre-action a .icon { width: 28px; height: 28px; } @media (max-width: 1023px) { .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .restotre-action a .icon { width: 24px; height: 24px; } } .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .restotre-action a .icon svg { width: 100%; height: 100%; } .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .restotre-action a .text { } .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .amount { transition: all 300ms; } .cart-items-list .cart-item.deleted-item .cart-item-holder .order-details .order-details-holder .amount { opacity: 0; pointer-events: none; transition: all 300ms; } .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .amount .quantity-control { } .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .amount .quantity-control .quantity-control-container { } .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .amount .quantity-control .quantity-control-container .quantity-link { } .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .amount .quantity-control .quantity-control-container .quantity-link .minus { } .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .amount .quantity-control .quantity-control-container .quantity-link .minus svg { } .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .amount .quantity-control .quantity-control-container .quantity-link .minus svg path { } .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .amount .quantity-control .quantity-control-container .quantity-input { } .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .amount .quantity-control .quantity-control-container .quantity-input input { } .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .price { transition: all 300ms; } @media (max-width: 1023px) { .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .price { flex-grow: 1; } } .cart-items-list .cart-item.deleted-item .cart-item-holder .order-details .order-details-holder .price { opacity: 0; pointer-events: none; transition: all 300ms; } .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .price .price-value { min-width: 135px; } @media (max-width: 767px) { .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .price .price-value { min-width: 99px; } } .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .price .price-value .total { width: 100%; font-weight: 500; font-style: normal; font-size: 22px; line-height: 32px; text-align: right; } @media (max-width: 767px) { .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .price .price-value .total { font-size: 18px; line-height: 24px; } } .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .price .price-value .per-item { width: 100%; font-weight: 400; font-style: normal; font-size: 14px; line-height: 16px; text-align: right; color: #7F8286; margin-top: 2px; } @media (max-width: 767px) { .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .price .price-value .per-item { margin-top: 1px; font-size: 12px; line-height: 20px; } } .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .action { display: flex; gap: 16px; margin-left: 23px; transition: all 300ms; } @media (max-width: 767px) { .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .action { margin-left: 0; margin-right: 1px; } } .cart-items-list .cart-item.deleted-item .cart-item-holder .order-details .order-details-holder .action { opacity: 0; pointer-events: none; transition: all 300ms; } .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .action a { display: block; border: 1px solid #D2DAED; border-radius: 8px; padding: 12px; transition: all 300ms; } @media (hover: hover) { .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .action a:hover { background-color: #D2DAED; transition: all 300ms; } } @media (max-width: 767px) { .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .action a { padding: 7px; } } .cart-items-list .cart-item .cart-item-holder .order-details .order-details-holder .action a svg { width: 24px; height: 24px; } /*CONNECTED INPUTS AND BLOCKS*/ .connected-blocks { width: 100%; display: flex; flex-direction: column; gap: 0; } .connected-blocks .connected-block { width: 100%; max-height: 0; overflow: hidden; transition: all 600ms; } .connected-blocks .connected-block.active { max-height: 1000px; transition: all 1200ms; } .connected-blocks .connected-block .connected-block-holder { width: 100%; } .connected-blocks .connected-block .connected-block-holder .connected-block-title { font-size: 24px; line-height: 32px; font-weight: 500; margin-bottom: 16px; } @media (max-width: 767px) { .connected-blocks .connected-block .connected-block-holder .connected-block-title { font-size: 18px; line-height: 24px; margin-bottom: 13px; } } .connected-blocks .connected-block .connected-block-holder .connected-block-data { } .connected-blocks .connected-block .connected-block-holder .connected-block-data .order-fields { margin: 0; } /*CART TABLE*/ .cart-table { width: 100%; } @media (max-width: 767px) { .cart-table { margin: 13px 0 0; } } .cart-table table { width: 100%; border-collapse: collapse; border-spacing: 0px; border: 1px solid #313A461A; border-right: none; border-bottom: none; } @media (max-width: 767px) { .cart-table table { display: block; border: 1px solid #313A461A; } } .cart-table table thead { } @media (max-width: 767px) { .cart-table table thead { display: none; } } .cart-table table thead tr { } .cart-table table thead tr th { border-bottom: 1px solid #313A461A; border-right: 1px solid #313A461A; text-align: left; background-color: #313A461A; font-size: 16px; line-height: 24px; font-weight: 500; box-sizing: border-box; padding: 12px; text-align: left; } @media (max-width: 1260px) { .cart-table table thead tr th { font-size: 14px; line-height: 20px; padding: 6px; } } .cart-table table thead tr .num { width: 53px; } .cart-table table thead tr .item { width: auto; } .cart-table table thead tr .price { width: 199px; } @media (max-width: 1799px) { .cart-table table thead tr .price { width: 13%; } } .cart-table table thead tr .amount { width: 179px; } @media (max-width: 1799px) { .cart-table table thead tr .amount{ width: 11%; } } @media (max-width: 1023px) { .cart-table table thead tr .amount{ width: 7%; } } .cart-table table thead tr .total { width: 199px; } @media (max-width: 1799px) { .cart-table table thead tr .total { width: 13%; } } .cart-table table tbody { } @media (max-width: 767px) { .cart-table table tbody { display: block; border-bottom: 1px solid #313A461A; } } .cart-table table tbody tr { } @media (max-width: 767px) { .cart-table table tbody tr { display: block; padding-top: 5px; padding-bottom: 10px; border-bottom: 1px solid #313A461A; } } .cart-table table tbody tr td { border-bottom: 1px solid #313A461A; border-right: 1px solid #313A461A; box-sizing: border-box; padding: 12px; text-align: left; font-size: 16px; line-height: 24px; font-weight: 500; } @media (max-width: 1260px) { .cart-table table tbody tr td { font-size: 14px; line-height: 20px; padding: 6px; } } @media (max-width: 767px) { .cart-table table tbody tr td { display: block; width: 100%; border: none; padding: 4px 11px; } } .cart-table table tbody tr td a { color: #313A46; text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 4px; transition: all 300ms; } @media (hover: hover) { .cart-table table tbody tr td a:hover { text-decoration-color: currentColor; transition: all 300ms; } } .cart-table table tbody tr td .xs-view { display: none; } @media (max-width: 767px) { .cart-table table tbody tr td .xs-view { display: inline; } } .cart-table table tbody tr td span { font-weight: 400; } /*DOUBLE CHECK LIST*/ ul.double-check-list { padding: 0; list-style: none; margin-bottom: 24px; } @media (max-width: 1260px) { ul.double-check-list { margin-bottom: 16px; } } @media (max-width: 767px) { ul.double-check-list { margin-bottom: 20px; } } ul.double-check-list li { position: relative; padding-left: 32px; font-size: 16px; line-height: 24px; font-weight: 500; margin-bottom: 12px; } @media (max-width: 1260px) { ul.double-check-list li { font-size: 14px; line-height: 20px; } } @media (max-width: 767px) { ul.double-check-list li { margin-bottom: 15px; } } ul.double-check-list li::before { content: ""; display: block; background-image: url(/local/templates/kraska/design/css/../img/doubel-checkmark-icon.svg); background-position: center center; background-size: 100%; width: 24px; height: 24px; position: absolute; left: 0; top: 0; } /*CALLING CARDS INTRO*/ section.section-calling-caards-intro { padding-top: 24px; padding-bottom: 100px; } @media (max-width: 1260px) { section.section-calling-caards-intro { padding-top: 16px; padding-bottom: 64px; } } @media (max-width: 767px) { section.section-calling-caards-intro { padding-top: 0; } } .calling-cards-intro { width: 100%; max-width: 1192px; margin: 0 auto; } .calling-cards-intro .calling-cards-intro-holder { display: flex; align-items: center; gap: 24px; width: calc(100% + 24px); margin-left: -12px; } @media (max-width: 1260px) { .calling-cards-intro .calling-cards-intro-holder { gap: 16px; width: calc(100% + 16px); margin-left: -8px; } } @media (max-width: 767px) { .calling-cards-intro .calling-cards-intro-holder { flex-direction: column; } } .calling-cards-intro .calling-cards-intro-holder .desc { width: 49%; box-sizing: border-box; padding: 0 12px; } @media (max-width: 1260px) { .calling-cards-intro .calling-cards-intro-holder .desc { padding: 0 8px; } } @media (max-width: 767px) { .calling-cards-intro .calling-cards-intro-holder .desc { width: 100%; } } .calling-cards-intro .calling-cards-intro-holder .desc .desc-holder { width: 100%; } .calling-cards-intro .calling-cards-intro-holder .desc .desc-holder h1, .calling-cards-intro .calling-cards-intro-holder .desc .desc-holder .h1 { margin-bottom: 24px; } @media (max-width: 1260px) { .calling-cards-intro .calling-cards-intro-holder .desc .desc-holder h1, .calling-cards-intro .calling-cards-intro-holder .desc .desc-holder .h1 { margin-bottom: 16px; } } .calling-cards-intro .calling-cards-intro-holder .desc .desc-holder .image { display: none; } @media (max-width: 767px) { .calling-cards-intro .calling-cards-intro-holder .desc .desc-holder .image { display: block; width: 100%; padding: 0; margin-bottom: 15px; } } .calling-cards-intro .calling-cards-intro-holder .desc .desc-holder p { font-size: 22px; line-height: 32px; font-weight: 500; margin-bottom: 24px; } @media (max-width: 1260px) { .calling-cards-intro .calling-cards-intro-holder .desc .desc-holder p { font-size: 18px; line-height: 24px; margin-bottom: 16px; } } .calling-cards-intro .calling-cards-intro-holder .desc .desc-holder .action { width: 100%; margin-top: 24px; } @media (max-width: 1260px) { .calling-cards-intro .calling-cards-intro-holder .desc .desc-holder .action { margin-top: 16px; } } @media (max-width: 767px) { .calling-cards-intro .calling-cards-intro-holder .desc .desc-holder .action { margin-top: 20px; } } .calling-cards-intro .calling-cards-intro-holder .desc .desc-holder .action .btn { } @media (max-width: 767px) { .calling-cards-intro .calling-cards-intro-holder .desc .desc-holder .action .btn { width: 100%; text-align: center; } } .calling-cards-intro .calling-cards-intro-holder .image { width: 51%; box-sizing: border-box; padding: 0 12px; } @media (max-width: 1260px) { .calling-cards-intro .calling-cards-intro-holder .image { padding: 0 8px; } } @media (max-width: 767px) { .calling-cards-intro .calling-cards-intro-holder .image { display: none; } } .calling-cards-intro .calling-cards-intro-holder .image .image-holder { width: 100%; } .calling-cards-intro .calling-cards-intro-holder .image .image-holder img { width: 100%; border-radius: 8px; } /*CALLING CARDS FITS*/ section.calling-cards-fits-section { background-color: #EEF0F5; padding: 100px 0; } @media (max-width: 1260px) { section.calling-cards-fits-section { padding: 64px 0; } } .calling-cards-fits { width: 100%; max-width: 1192px; margin: 0 auto; } .calling-cards-fits .heading { width: 100%; margin-bottom: 36px; text-align: center; } @media (max-width: 767px) { .calling-cards-fits .heading { margin-bottom: 20px; } } .calling-cards-fits .heading h2, .calling-cards-fits .heading .h2 { margin-bottom: 16px; } @media (max-width: 767px) { .calling-cards-fits .heading h2, .calling-cards-fits .heading .h2 { margin-bottom: 12px; } } .calling-cards-fits .heading p { font-size: 22px; line-height: 32px; font-weight: 500; color: #7F8286; } @media (max-width: 1260px) { .calling-cards-fits .heading p { font-size: 18px; line-height: 24px; } } .calling-cards-fits .calling-cards-fits-holder { display: flex; width: calc(100% + 24px); margin-left: -12px; row-gap: 24px; } @media (max-width: 1260px) { .calling-cards-fits .calling-cards-fits-holder { width: calc(100% + 16px); margin-left: -8px; row-gap: 16px; flex-wrap: wrap; } } @media (max-width: 767px) { .calling-cards-fits .calling-cards-fits-holder { row-gap: 24px; } } .calling-cards-fits .calling-cards-fits-holder .calling-cards-fit { width: 100%; height: auto; box-sizing: border-box; padding: 0 12px; } @media (max-width: 1260px) { .calling-cards-fits .calling-cards-fits-holder .calling-cards-fit { width: 50%; padding: 0 8px; } } @media (max-width: 767px) { .calling-cards-fits .calling-cards-fits-holder .calling-cards-fit { width: 100%; } } .calling-cards-fits .calling-cards-fits-holder .calling-cards-fit .calling-cards-fit-holder { width: 100%; height: 100%; background-color: white; border-radius: 8px; box-sizing: border-box; padding: 20px; } @media (max-width: 767px) { .calling-cards-fits .calling-cards-fits-holder .calling-cards-fit .calling-cards-fit-holder { padding: 20px 16px; } } .calling-cards-fits .calling-cards-fits-holder .calling-cards-fit .calling-cards-fit-holder h3, .calling-cards-fits .calling-cards-fits-holder .calling-cards-fit .calling-cards-fit-holder .h3 { font-size: 22px; line-height: 32px; font-weight: 500; margin-bottom: 12px; } @media (max-width: 1260px) { .calling-cards-fits .calling-cards-fits-holder .calling-cards-fit .calling-cards-fit-holder h3, .calling-cards-fits .calling-cards-fits-holder .calling-cards-fit .calling-cards-fit-holder .h3 { font-size: 18px; line-height: 24px; margin-bottom: 8px; } } .calling-cards-fits .calling-cards-fits-holder .calling-cards-fit .calling-cards-fit-holder p { font-size: 16px; line-height: 24px; margin-bottom: 12px; } @media (max-width: 1260px) { .calling-cards-fits .calling-cards-fits-holder .calling-cards-fit .calling-cards-fit-holder p { font-size: 14px; line-height: 20px; margin-bottom: 8px; } } .calling-cards-fits .calling-cards-fits-holder .calling-cards-fit .calling-cards-fit-holder .double-check-list { margin-bottom: -12px; } .calling-cards-fits .calling-cards-fits-holder .calling-cards-fit .calling-cards-fit-holder .double-check-list li { } /*CALLING CARDS FEATURES*/ section.caller-cards-features-section { width: 100%; padding: 100px 0; } @media (max-width: 1260px) { section.caller-cards-features-section { width: 100%; padding: 64px 0; } } .caller-cards-features { width: 100%; max-width: 1192px; margin: 0 auto; } .caller-cards-features .heading { width: 100%; margin-bottom: 36px; text-align: center; } .caller-cards-features .heading h2, .caller-cards-features .heading .h2 { margin-bottom: 16px; } @media (max-width: 1260px) { .caller-cards-features .heading h2, .caller-cards-features .heading .h2 { margin-bottom: 12px; } } .caller-cards-features .heading p { font-size: 22px; line-height: 32px; font-weight: 500; color: #7F8286; } @media (max-width: 1260px) { .caller-cards-features .heading p { font-size: 18px; line-height: 24px; } } .caller-cards-features .caller-cards-features-holder { display: flex; flex-wrap: wrap; width: calc(100% + 24px); margin-left: -12px; row-gap: 24px; } @media (max-width: 1260px) { .caller-cards-features .caller-cards-features-holder { width: calc(100% + 16px); margin-left: -8px; row-gap: 16px; } } @media (max-width: 767px) { .caller-cards-features .caller-cards-features-holder { row-gap: 24px; } } .caller-cards-features .caller-cards-features-holder .caller-cards-feature { width: 50%; height: auto; box-sizing: border-box; padding: 0 12px; } @media (max-width: 1260px) { .caller-cards-features .caller-cards-features-holder .caller-cards-feature { padding: 0 8px; } } @media (max-width: 767px) { .caller-cards-features .caller-cards-features-holder .caller-cards-feature { width: 100%; } } .caller-cards-features .caller-cards-features-holder .caller-cards-feature .caller-cards-feature-holder { width: 100%; height: 100%; display: flex; align-items: center; gap: 12px; background-color: white; box-sizing: border-box; padding: 20px; box-shadow: 0px 4px 16px 0px #313A461A; } @media (max-width: 1260px) { .caller-cards-features .caller-cards-features-holder .caller-cards-feature .caller-cards-feature-holder { flex-direction: column; align-items: start; padding: 20px 16px; } } .caller-cards-features .caller-cards-features-holder .caller-cards-feature .caller-cards-feature-holder .image { width: 140px; height: 140px; } .caller-cards-features .caller-cards-features-holder .caller-cards-feature .caller-cards-feature-holder .image .image-holder { width: 100%; height: 100%; } .caller-cards-features .caller-cards-features-holder .caller-cards-feature .caller-cards-feature-holder .image .image-holder img { width: 100%; height: 100%; object-fit: cover; border-radius: 4px; } .caller-cards-features .caller-cards-features-holder .caller-cards-feature .caller-cards-feature-holder .desc { width: calc(100% - 140px - 12px); } @media (max-width: 1260px) { .caller-cards-features .caller-cards-features-holder .caller-cards-feature .caller-cards-feature-holder .desc { width: 100%; } } .caller-cards-features .caller-cards-features-holder .caller-cards-feature .caller-cards-feature-holder .desc .desc-holder { width: 100%; } .caller-cards-features .caller-cards-features-holder .caller-cards-feature .caller-cards-feature-holder .desc .desc-holder h3, .caller-cards-features .caller-cards-features-holder .caller-cards-feature .caller-cards-feature-holder .desc .desc-holder .h3 { font-size: 22px; line-height: 32px; font-weight: 500; margin-bottom: 12px; } @media (max-width: 1260px) { .caller-cards-features .caller-cards-features-holder .caller-cards-feature .caller-cards-feature-holder .desc .desc-holder h3, .caller-cards-features .caller-cards-features-holder .caller-cards-feature .caller-cards-feature-holder .desc .desc-holder .h3 { font-size: 18px; line-height: 24px; margin-bottom: 8px; } } .caller-cards-features .caller-cards-features-holder .caller-cards-feature .caller-cards-feature-holder .desc .desc-holder p { font-size: 16px; line-height: 24px; font-weight: 400; } @media (max-width: 1260px) { .caller-cards-features .caller-cards-features-holder .caller-cards-feature .caller-cards-feature-holder .desc .desc-holder p { font-size: 14px; line-height: 20px; } } /*FAQ BLOCK NEW DESIGN*/ section.faq-section-new-style { width: 100%; padding-top: 40px; padding-bottom: 100px; } @media (max-width: 1260px) { section.faq-section-new-style { width: 100%; padding-top: 32px; padding-bottom: 64px; } } .faq-block { width: 100%; max-width: 1192px; margin: 0 auto; } .faq-block .heading { width: 100%; text-align: center; margin-bottom: 36px; } @media (max-width: 1260px) { .faq-block .heading { margin-bottom: 16px; } } .faq-block .heading h2, .faq-block .heading .h2 { } .faq-block .faq-block-holder { width: 100%; border: 1px solid #EEF0F5; border-bottom: none; } .faq-block .faq-block-holder .faq-list { } .faq-block .faq-block-holder .faq-list .faq-item { } .faq-block .faq-block-holder .faq-list .faq-item .faq-item-header { } .faq-block .faq-block-holder .faq-list .faq-item .faq-item-header a { padding: 22px 24px; } @media (max-width: 767px) { .faq-block .faq-block-holder .faq-list .faq-item .faq-item-header a { padding: 19px 15px; align-items: start; } } .faq-block .faq-block-holder .faq-list .faq-item .faq-item-header a .faq-item-name { } .faq-block .faq-block-holder .faq-list .faq-item .faq-item-header a .faq-item-name p.large { } @media (max-width: 767px) { .faq-block .faq-block-holder .faq-list .faq-item .faq-item-header a .faq-item-name p.large { font-size: 14px; line-height: 20px; } } .faq-block .faq-block-holder .faq-list .faq-item .faq-item-header a .faq-item-icon { transform: none !important; } .faq-block .faq-block-holder .faq-list .faq-item .faq-item-header a .faq-item-icon svg { } @media (max-width: 767px) { .faq-block .faq-block-holder .faq-list .faq-item .faq-item-header a .faq-item-icon svg { width: 24px; height: 24px; } } .faq-block .faq-block-holder .faq-list .faq-item .faq-item-header a .faq-item-icon svg path:first-of-type { opacity: 1; transition: all 300ms; } .faq-block .faq-block-holder .faq-list .faq-item.open .faq-item-header a .faq-item-icon svg path:first-of-type { opacity: 0; transition: all 300ms; } .faq-block .faq-block-holder .faq-list .faq-item .faq-item-body { padding: 0px 22px 25px; margin: -10px 0 0; } @media (max-width: 767px) { .faq-block .faq-block-holder .faq-list .faq-item .faq-item-body { padding: 0px 45px 21px 15px; margin: -7px 0 0; } } .faq-block .faq-block-holder .faq-list .faq-item .faq-item-body .content-mode { } .faq-block .faq-block-holder .faq-list .faq-item .faq-item-body .content-mode .style-2 { } /*FORM BKF BLOCK*/ section.form-bkg-block-section { background-color: #EEF0F5; padding: 100px 0; } @media (max-width: 1260px) { section.form-bkg-block-section { background-color: #EEF0F5; padding: 64px 0; } } .form-bkg-block { width: 100%; max-width: 840px; margin: 0 auto; } .form-bkg-block .heading { width: 100%; margin-bottom: 36px; text-align: center; } @media (max-width: 1260px) { .form-bkg-block .heading { margin-bottom: 20px; } } .form-bkg-block .heading h2, .form-bkg-block .heading .h2 { } .form-bkg-block .form-bkg-block-holder { } .form-bkg-block .form-bkg-block-holder .form-on-page { min-width: 100%; padding: 23px 23px 18px; } @media (max-width: 767px) { .form-bkg-block .form-bkg-block-holder .form-on-page { padding: 19px 15px 21px; } } .form-bkg-block .form-bkg-block-holder .form-on-page form { } /*CALCULATORS MONKEYHACKS*/ .calculator-form-result.alt-design { padding: 24px 20px; } @media (max-width: 1260px) { .calculator-form-result.alt-design { padding: 20px 16px; } } .calculator-form-result.alt-design .empty-calc-result { align-items: start; justify-content: start; } .calculator-form-result.alt-design .calc-text { text-align: left; } .calculator-form-result.alt-design .calc-text h4, .calculator-form-result.alt-design .calc-text .h4 { font-size: 26px; line-height: 36px; font-weight: 500; margin: 0 0 12px; } @media (max-width: 1260px) { .calculator-form-result.alt-design .calc-text h4, .calculator-form-result.alt-design .calc-text .h4 { font-size: 18px; line-height: 24px; margin: 0 0 7px; } } .calculator-form-result.alt-design .calc-text p { font-size: 16px; line-height: 24px; font-weight: 400; } @media (max-width: 1260px) { .calculator-form-result.alt-design .calc-text p { font-size: 14px; line-height: 20px; } } .calculator-steps-body-title h4, .calculator-steps-body-title .h4 { font-size: 26px; line-height: 36px; font-weight: 500; margin: 0 0 5px; } @media (max-width: 1260px) { .calculator-steps-body-title h4, .calculator-steps-body-title .h4 { font-size: 18px; line-height: 24px; } } .calculator-steps-body-title .accent { color: #7F8286; } .calculator-steps-body-title.extra-margin { margin-bottom: 20px; } @media (max-width: 1260px) { .calculator-steps-body-title.extra-margin { margin-bottom: 16px; } } .calculator-step-item-name span.hidden-xs { display: inline; } @media (max-width: 767px) { .calculator-step-item-name span.hidden-xs { display: none; } } .calculator-steps-list.in-2-line .calculator-step-item:not(.active) { } @media (max-width: 767px) { .calculator-steps-list.in-2-line .calculator-step-item:not(.active) { width: 16.666%; } } .calculator-steps-list.in-2-line .calculator-step-item.active { } @media (max-width: 767px) { .calculator-steps-list.in-2-line .calculator-step-item { width: 50%; } } /*PAINT SURFACE ITEMS*/ .calculator-paint-surface-selector { display: flex; flex-wrap: wrap; width: calc(100% + 16px); margin-left: -8px; row-gap: 16px; } .calculator-paint-surface-selector .calculator-paint-surface-selector-item { width: 25%; height: auto; box-sizing: border-box; padding: 0 8px; } @media (max-width: 1599px) { .calculator-paint-surface-selector .calculator-paint-surface-selector-item { width: 33.333%; } } @media (max-width: 1260px) { .calculator-paint-surface-selector .calculator-paint-surface-selector-item { width:25%; } } @media (max-width: 1023px) { .calculator-paint-surface-selector .calculator-paint-surface-selector-item { width: 33.333%; } } @media (max-width: 767px) { .calculator-paint-surface-selector .calculator-paint-surface-selector-item { width: 100%; } } .calculator-paint-surface-selector .calculator-paint-surface-selector-item .calculator-paint-surface-selector-item-holder { width: 100%; height: 100%; } .calculator-paint-surface-selector .calculator-paint-surface-selector-item .calculator-paint-surface-selector-item-holder label { width: 100%; height: 100%; } .calculator-paint-surface-selector .calculator-paint-surface-selector-item .calculator-paint-surface-selector-item-holder label input { } .calculator-paint-surface-selector .calculator-paint-surface-selector-item .calculator-paint-surface-selector-item-holder label input:checked+.calculator-paint-surface-item { background-color: #EEF0F5; transition: all 300ms; } .calculator-paint-surface-selector .calculator-paint-surface-selector-item .calculator-paint-surface-selector-item-holder label input:checked+.calculator-paint-surface-item::before { opacity: 1; transition: all 300ms; } .calculator-paint-surface-selector .calculator-paint-surface-selector-item .calculator-paint-surface-selector-item-holder label input:checked+.calculator-paint-surface-item .calculator-paint-surface-item-name .pseudo-checkbox, .calculator-paint-surface-selector .calculator-paint-surface-selector-item .calculator-paint-surface-selector-item-holder label input:checked+.calculator-paint-surface-item .calculator-paint-surface-item-name .pseudo-radio { background-color: #313A46; border-color: #313A46; } .calculator-paint-surface-selector .calculator-paint-surface-selector-item .calculator-paint-surface-selector-item-holder label input:checked+.calculator-paint-surface-item .calculator-paint-surface-item-name .pseudo-checkbox::before { opacity: 1; } .calculator-paint-surface-item { width: 100%; height: 100%; background-color: white; border: 1px solid #D2DAED; border-radius: 8px; box-sizing: border-box; padding: 11px 15px; position: relative; transition: all 300ms; } @media (max-width: 1260px) { .calculator-paint-surface-item { padding: 15px 11px 21px; } .calculator-paint-surface-item.alt-padding { padding: 15px 11px 8px; } } .calculator-paint-surface-item::before { content: ""; display: block; width: calc(100% - 1px); height: calc(100% - 1px); position: absolute; left: -1px; top: -1px; border: 2px solid #313A46; border-radius: 8px; background-color: transparent; opacity: 0; transition: all 300ms; } .calculator-paint-surface-item .calculator-paint-surface-item-pic { width: 100%; height: 136px; margin-bottom: 10px; } @media (max-width: 1260px) { .calculator-paint-surface-item .calculator-paint-surface-item-pic { margin-bottom: 13px; } } .calculator-paint-surface-item .calculator-paint-surface-item-pic.long { height: 150px; } .calculator-paint-surface-item .calculator-paint-surface-item-pic img { width: 100%; height: 100%; object-fit: cover; border-radius: 4px; } .calculator-paint-surface-item .calculator-paint-surface-item-name { display: flex; width: 101%; gap: 10px; margin: 0 0 -3px; } .calculator-paint-surface-item .calculator-paint-surface-item-name .pseudo-checkbox { margin-left: 2px; margin-top: 2px; } @media (max-width: 1260px) { .calculator-paint-surface-item .calculator-paint-surface-item-name .pseudo-checkbox { margin-left: 3px; margin-top: 2px; } } .calculator-paint-surface-item .calculator-paint-surface-item-name .name { width: calc(100% - 10px - 22px); min-height: 48px; } @media (max-width: 1260px) { .calculator-paint-surface-item .calculator-paint-surface-item-name .name { min-height: auto; } } .calculator-paint-surface-item .calculator-paint-surface-item-name .name.no-min-height { min-height: auto; } .calculator-paint-surface-item .calculator-paint-surface-item-name .name p { font-size: 16px; line-height: 24px; font-weight: 500; } @media (max-width: 1260px) { .calculator-paint-surface-item .calculator-paint-surface-item-name .name p { font-size: 14px; line-height: 20px; font-weight: 400; } } .calculator-paint-surface-action { width: 100%; margin: 14px 0 0; } .calculator-paint-surface-action .btn { width: 100%; text-align: center; } @media (max-width: 1260px) { .calculator-paint-surface-action .btn { padding: 8px; } } .slide-basket-element { } .slide-basket-element .slide-basket-element-container { } .slide-basket-element .slide-basket-element-container .calculator-results { display: flex; flex-direction: column; gap: 0; } .slide-basket-element .slide-basket-element-container .calculator-results .name { font-size: 14px; line-height: 20px; font-weight: 500; } .slide-basket-element .slide-basket-element-container .calculator-results .result { font-size: 14px; line-height: 20px; font-weight: 400; } /*CALCULATOR FORM*/ .calculator-form { margin-top: 19px; } @media (max-width: 1260px) { .calculator-form { margin-top: 15px; } } .calculator-form .calculator-steps-body-title { margin-bottom: 5px; } .calculator-form .form-input input[type=number], .calculator-form .form-input input[type=text], .calculator-form .form-input input[type=password], .calculator-form .form-input textarea { padding-left: 15px; } /*GET CONSULTATIOn BLOCK*/ .get-consultation-block { width: 100%; background-color: white; box-shadow: 0px 4px 16px 0px #313A461A; box-sizing: border-box; padding: 24px; border-radius: 8px; margin-top: 25px; } @media (max-width: 1260px) { .get-consultation-block { padding: 17px 17px 23px; } } .get-consultation-block .get-consultation-block-holder { } .get-consultation-block .get-consultation-block-holder .persons { display: flex; flex-direction: row-reverse; justify-content: center; transform: translateX(-5px); margin-bottom: 23px; } @media (max-width: 1260px) { .get-consultation-block .get-consultation-block-holder .persons { transform: translateX(-9px); } } .get-consultation-block .get-consultation-block-holder .persons .person { width: 56px; height: 64px; position: relative; } @media (max-width: 1260px) { .get-consultation-block .get-consultation-block-holder .persons .person { width: 35px; height: 48px; } } .get-consultation-block .get-consultation-block-holder .persons .person img { width: 64px; height: 64px; overflow: hidden; border-radius: 50%; position: absolute; left: 0; top: 0; border: 2px solid white; box-sizing: content-box; } @media (max-width: 1260px) { .get-consultation-block .get-consultation-block-holder .persons .person img { width: 48px; height: 48px; } } .get-consultation-block .get-consultation-block-holder .text { text-align: center; } .get-consultation-block .get-consultation-block-holder .text h4, .get-consultation-block .get-consultation-block-holder .text .h4 { font-size: 26px; line-height: 36px; font-weight: 500; margin-bottom: 4px; } @media (max-width: 1260px) { .get-consultation-block .get-consultation-block-holder .text h4, .get-consultation-block .get-consultation-block-holder .text .h4 { font-size: 18px; line-height: 24px; margin-bottom: 3px; } } .get-consultation-block .get-consultation-block-holder .text p { } .get-consultation-block .get-consultation-block-holder .action { text-align: center; margin-top: 25px; } @media (max-width: 1260px) { .get-consultation-block .get-consultation-block-holder .action { margin-top: 23px; } } .get-consultation-block .get-consultation-block-holder .action .btn { max-width: 430px; width: 100%; padding: 12px 12px; } @media (max-width: 1260px) { .get-consultation-block .get-consultation-block-holder .action .btn { padding: 8px; } } /*CALCULATOR CATALOG*/ .calculator-catalog-lists-group { display: flex; flex-direction: column; gap: 24px; margin-top: 30px; } @media (max-width: 767px) { .calculator-catalog-lists-group { margin-top: 16px; gap: 32px; } } .calculator-catalog-lists-group .calculator-catalog-list-block { border-bottom: 1px solid #D2DAED; padding-bottom: 23px; } @media (max-width: 767px) { .calculator-catalog-lists-group .calculator-catalog-list-block { border-bottom: none; padding-bottom: 0; } } .calculator-catalog-lists-group .calculator-catalog-list-block:last-of-type { padding-bottom: 0; border: none; } .calculator-catalog-list-block { width: 100%; } .calculator-catalog-list-block .heading { width: 100%; margin-bottom: 12px; } @media (max-width: 1260px) { .calculator-catalog-list-block .heading { margin-bottom: 15px; } } .calculator-catalog-list-block .heading h5, .calculator-catalog-list-block .heading .h5 { font-size: 22px; line-height: 32px; font-weight: 500; } @media (max-width: 1260px) { .calculator-catalog-list-block .heading h5, .calculator-catalog-list-block .heading .h5 { font-size: 18px; line-height: 24px; } } @media (max-width: 767px) { .calculator-catalog-list-block .heading h5, .calculator-catalog-list-block .heading .h5 { width: calc(100% + 30px); /*30px from padding of "calculator-form-content"*/ margin-left: -15px; background-color: #21B5274D; box-sizing: border-box; padding: 12px 15px; } } .calculator-catalog-list-block .calculator-catalog-list { display: flex; flex-wrap: wrap; width: calc(100% + 16px); margin-left: -8px; row-gap: 10px; } @media (max-width: 1260px) { .calculator-catalog-list-block .calculator-catalog-list { row-gap: 16px; } } .calculator-catalog-list-block .calculator-catalog-list .calculator-catalog-item { width: 25%; height: auto; box-sizing: border-box; padding: 0 8px; } @media (max-width: 1599px) { .calculator-catalog-list-block .calculator-catalog-list .calculator-catalog-item { width: 33.333%; } } @media (max-width: 1260px) { .calculator-catalog-list-block .calculator-catalog-list .calculator-catalog-item { width:25%; } } @media (max-width: 1023px) { .calculator-catalog-list-block .calculator-catalog-list .calculator-catalog-item { width: 33.333%; } } @media (max-width: 767px) { .calculator-catalog-list-block .calculator-catalog-list .calculator-catalog-item { width: 100%; } } .calculator-catalog-item { width: 100%; height: 100%; } .calculator-catalog-item .calculator-catalog-item-holder { width: 100%; height: 100%; margin: 0; } .calculator-catalog-item .calculator-catalog-item-holder label { width: 100%; height: 100%; } .calculator-catalog-item .calculator-catalog-item-holder label input:checked + .calculator-catalog-item-block { background-color: #EEF0F5; transition: all 300ms; } .calculator-catalog-item .calculator-catalog-item-holder label input:checked + .calculator-catalog-item-block::before { opacity: 1; transition: all 300ms; } .calculator-catalog-item .calculator-catalog-item-holder label input:checked + .calculator-catalog-item-block .pseudo-radio, .calculator-catalog-item .calculator-catalog-item-holder label input:checked + .calculator-catalog-item-block .pseudo-checkbox { background-color: #313A46; transition: all 300ms; } .calculator-catalog-item .calculator-catalog-item-holder label input:checked + .calculator-catalog-item-block .desc .action .checked { opacity: 1; transition: all 300ms; } .calculator-catalog-item .calculator-catalog-item-holder label input:checked + .calculator-catalog-item-block .desc .action .unchecked { opacity: 0; transition: all 300ms; } .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block { display: flex; flex-direction: column; width: 100%; height: 100%; background-color: white; border: 1px solid #D2DAED; border-radius: 8px; box-sizing: border-box; padding: 12px 16px; position: relative; transition: all 300ms; } @media (max-width: 1260px) { .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block { padding: 15px 11px; } } .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block::before { content: ""; display: block; width: calc(100% - 1px); height: calc(100% - 1px); border: 2px solid #313A46; border-radius: 8px; position: absolute; z-index: 2; left: -1px; top: -1px; pointer-events: none; opacity: 0; transition: all 300ms; } .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block .pseudo-radio, .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block .pseudo-checkbox { position: absolute; left: 13px; top: 13px; z-index: 3; margin: 0; transition: all 300ms; } .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block .pseudo-radio { width: 21px; height: 21px; } .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block .pseudo-radio::before { content: ""; position: absolute; display: inline-block; width: 12px; height: 9px; background: url(/local/templates/kraska/design/css/../img/check-active.svg) no-repeat center center; left: 50%; top: 50%; transform: translate(-50%, -50%); } .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block .image { width: 100%; text-align: center; margin-bottom: 8px; } .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block .image .image-holder { width: 136px; height: 136px; margin: 0 auto; } @media (max-width: 1260px) { .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block .image .image-holder { width: 88px; height: 88px; } } .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block .image .image-holder a { display: block; width: 100%; height: 100%; background-color: white; } .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block .image .image-holder a img { width: 100%; height: 100%; object-fit: contain; } .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block .desc { width: 100%; flex-grow: 1; display: flex; flex-direction: column; } .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block .desc .name { width: 100%; font-size: 16px; line-height: 24px; font-weight: 500; margin-bottom: 6px; } @media (max-width: 1260px) { .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block .desc .name { font-size: 14px; line-height: 20px; margin-bottom: 4px; } } .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block .desc .name a { color: #313A46; } .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block .desc .stats { display: flex; flex-direction: column; flex-grow: 1; } .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block .desc .stats .stat { width: 100%; font-size: 12px; line-height: 20px; font-weight: 400; } .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block .desc .price { font-size: 22px; line-height: 32px; font-weight: 500; margin: 8px 0 0; } @media (max-width: 1260px) { .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block .desc .price { font-size: 18px; line-height: 24px; } } .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block .desc .action { width: 100%; height: 48px; position: relative; margin: 12px 0 0; } @media (max-width: 1260px) { .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block .desc .action { height: 40px; } } .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block .desc .action .unchecked, .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block .desc .action .checked { position: absolute; left: 0; top: 0; z-index: 2; width: 100%; height: 100%; transition: all 300ms; } .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block .desc .action .unchecked .btn, .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block .desc .action .checked .btn { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; gap: 8px; } .calculator-catalog-item .calculator-catalog-item-holder label .calculator-catalog-item-block .desc .action .checked { opacity: 0; transition: all 300ms; } /*CALCULATOR RESULT PROMO*/ .calculator-form-result .promo { background-color: #BDE9BE; border-radius: 8px; box-sizing: border-box; padding: 12px 27px; margin: 3px 0 16px; } @media (max-width: 1260px) { .calculator-form-result .promo { padding: 12px 21px; margin: 3px 0 13px; } } .calculator-form-result .promo .promo-holder { display: flex; gap: 8px; align-items: center; } @media (max-width: 1260px) { .calculator-form-result .promo .promo-holder { gap: 12px; } } .calculator-form-result .promo .promo-holder .image { width: 32px; height: 32px; } .calculator-form-result .promo .promo-holder .image img { width: 100%; height: 100%; object-fit: contain; } .calculator-form-result .promo .promo-holder .text { width: calc(100% - 32px - 8px); font-size: 16px; line-height: 24px; font-weight: 500; } @media (max-width: 1260px) { .calculator-form-result .promo .promo-holder .text { font-size: 14px; line-height: 20px; width: calc(100% - 32px - 12px); } } /*CALCULATOR RESULT PRICING TOTAL*/ .calculator-form-result .pricing-total { display: flex; align-items: center; justify-content: space-between; margin: 10px 0 15px; } @media (max-width: 1260px) { .calculator-form-result .pricing-total { margin: 15px 0 10px; } } .calculator-form-result .pricing-total .name { max-width: 49%; font-size: 16px; line-height: 24px; font-weight: 500; } @media (max-width: 1260px) { .calculator-form-result .pricing-total .name { font-size: 14px; line-height: 20px; } } .calculator-form-result .pricing-total .value { max-width: 49%; text-align: right; font-size: 22px; line-height: 32px; font-weight: 500; padding-top: 9px; } @media (max-width: 1260px) { .calculator-form-result .pricing-total .value { font-size: 18px; line-height: 24px; padding-top: 8px; } } /*CALCULATOR RESULT ACTION*/ .calculator-form-result .action { width: 100%; } .calculator-form-result .action .btn { width: 100%; text-align: center; padding: 12px 12px; } @media (max-width: 1260px) { .calculator-form-result .action .btn { padding: 8px; } } /*CALCULATOR CATALOG LIST TOTAL*/ .calculator-catalog-list-total-group { display: flex; flex-direction: column; gap: 12px; } .calculator-catalog-list-total-block { width: 100%; border-bottom: 1px solid #313A461A; padding-bottom: 15px; } @media (max-width: 1260px) { .calculator-catalog-list-total-block { padding-bottom: 10px; } } .calculator-catalog-list-total-block .heading { width: 100%; font-size: 16px; line-height: 24px; font-weight: 500; margin-bottom: 12px; } @media (max-width: 1260px) { .calculator-catalog-list-total-block .heading { font-size: 14px; line-height: 20px; } } .calculator-catalog-list-total-block .note { font-size: 16px; line-height: 24px; font-weight: 400; margin: -9px 0 0; } @media (max-width: 1260px) { .calculator-catalog-list-total-block .note { font-size: 14px; line-height: 20px; } } .calculator-catalog-list-total-block .calculator-catalog-list-total { display: flex; flex-direction: column; gap: 12px; } .calculator-catalog-item-total { width: 100%; } .calculator-catalog-item-total .calculator-catalog-item-total-holder { display: flex; gap: 8px; flex-wrap: nowrap; } .calculator-catalog-item-total .calculator-catalog-item-total-holder .image { width: 88px; height: 88px; } @media (max-width: 1260px) { .calculator-catalog-item-total .calculator-catalog-item-total-holder .image { width: 64px; height: 64px; } } .calculator-catalog-item-total .calculator-catalog-item-total-holder .image .image-holder { width: 100%; height: 100%; } .calculator-catalog-item-total .calculator-catalog-item-total-holder .image .image-holder a { display: block; width: 100%; height: 100%; background-color: white; border-radius: 4px; overflow: hidden; } .calculator-catalog-item-total .calculator-catalog-item-total-holder .image .image-holder a img { width: 100%; height: 100%; object-fit: contain; } .calculator-catalog-item-total .calculator-catalog-item-total-holder .desc { width: calc(100% - 88px - 8px); } @media (max-width: 1260px) { .calculator-catalog-item-total .calculator-catalog-item-total-holder .desc { width: calc(100% - 64px - 8px); } } .calculator-catalog-item-total .calculator-catalog-item-total-holder .desc .desc-holder { width: 100%; display: flex; gap: 8px; } @media (max-width: 767px) { .calculator-catalog-item-total .calculator-catalog-item-total-holder .desc .desc-holder { flex-direction: column; gap: 4px; } } .calculator-catalog-item-total .calculator-catalog-item-total-holder .desc .desc-holder .item { width: calc(100% - 8px - 130px); } @media (max-width: 767px) { .calculator-catalog-item-total .calculator-catalog-item-total-holder .desc .desc-holder .item { width: 100%; } } .calculator-catalog-item-total .calculator-catalog-item-total-holder .desc .desc-holder .item .name { width: 100%; font-size: 16px; line-height: 24px; font-weight: 500; margin: 0 0 5px; } @media (max-width: 1260px) { .calculator-catalog-item-total .calculator-catalog-item-total-holder .desc .desc-holder .item .name { font-size: 14px; line-height: 20px; } } .calculator-catalog-item-total .calculator-catalog-item-total-holder .desc .desc-holder .item .name a { } .calculator-catalog-item-total .calculator-catalog-item-total-holder .desc .desc-holder .item .stats { width: 100%; } .calculator-catalog-item-total .calculator-catalog-item-total-holder .desc .desc-holder .item .stats .stat { width: 100%; font-size: 12px; line-height: 20px; font-weight: 400; } .calculator-catalog-item-total .calculator-catalog-item-total-holder .desc .desc-holder .order { width: 130px; } @media (max-width: 767px) { .calculator-catalog-item-total .calculator-catalog-item-total-holder .desc .desc-holder .order { width: 100%; } } .calculator-catalog-item-total .calculator-catalog-item-total-holder .desc .desc-holder .order .price { width: 100%; text-align: right; font-size: 22px; line-height: 32px; font-weight: 500; } @media (max-width: 1260px) { .calculator-catalog-item-total .calculator-catalog-item-total-holder .desc .desc-holder .order .price { font-size: 18px; line-height: 24px; } } @media (max-width: 767px) { .calculator-catalog-item-total .calculator-catalog-item-total-holder .desc .desc-holder .order .price { text-align: left; } } /*CALCULATOR CONFIRMATION POPUP*/ .calculator-order-confiramtion { max-width: 416px; width: calc(100% - 32px); padding: 46px 16px 20px; box-sizing: border-box; border-radius: 8px; } @media (max-width: 1260px) { .calculator-order-confiramtion { padding: 36px 12px 15px; } } .calculator-order-confiramtion .calculator-order-confiramtion-holder { width: 100%; position: relative; } .calculator-order-confiramtion .calculator-order-confiramtion-holder .closeFancy { position: absolute; right: 4px; top: -25px; cursor: pointer; } .calculator-order-confiramtion .calculator-order-confiramtion-holder .heading { width: 100%; margin-bottom: 24px; text-align: center; } @media (max-width: 1260px) { .calculator-order-confiramtion .calculator-order-confiramtion-holder .heading { margin-bottom: 12px; } } .calculator-order-confiramtion .calculator-order-confiramtion-holder .heading h3, .calculator-order-confiramtion .calculator-order-confiramtion-holder .heading .h3 { font-size: 22px; line-height: 32px; font-weight: 500; margin-bottom: 8px; } @media (max-width: 1260px) { .calculator-order-confiramtion .calculator-order-confiramtion-holder .heading h3, .calculator-order-confiramtion .calculator-order-confiramtion-holder .heading .h3 { font-size: 18px; line-height: 24px; } } .calculator-order-confiramtion .calculator-order-confiramtion-holder .heading p { font-size: 16px; line-height: 24px; font-weight: 400; } @media (max-width: 1260px) { .calculator-order-confiramtion .calculator-order-confiramtion-holder .heading p { font-size: 14px; line-height: 20px; } } .calculator-order-confiramtion .calculator-order-confiramtion-holder .confiramtion-form { width: 100%; } .calculator-order-confiramtion .calculator-order-confiramtion-holder .confiramtion-form form { } .calculator-order-confiramtion .calculator-order-confiramtion-holder .confiramtion-form form .form-field-one-line { margin-bottom: 24px; } @media (max-width: 1260px) { .calculator-order-confiramtion .calculator-order-confiramtion-holder .confiramtion-form form .form-field-one-line { margin-bottom: 12px; } } .calculator-order-confiramtion .calculator-order-confiramtion-holder .confiramtion-form form .form-field-one-line .form-field-line-item { } .calculator-order-confiramtion .calculator-order-confiramtion-holder .confiramtion-form form .form-field-one-line .form-field-line-item .line-label { } .calculator-order-confiramtion .calculator-order-confiramtion-holder .confiramtion-form form .form-field-one-line .form-field-line-item .line-label p { } .calculator-order-confiramtion .calculator-order-confiramtion-holder .confiramtion-form form .form-field-one-line .form-field-line-item .form-input { } .calculator-order-confiramtion .calculator-order-confiramtion-holder .confiramtion-form form .form-field-one-line .form-field-line-item .form-input input { } .calculator-order-confiramtion .calculator-order-confiramtion-holder .confiramtion-form form .form-field-one-line .form-field-line-item .form-input textarea { height: 72px; } .calculator-order-confiramtion .calculator-order-confiramtion-holder .confiramtion-form form .action { width: 100%; } .calculator-order-confiramtion .calculator-order-confiramtion-holder .confiramtion-form form .action .btn { width: 100%; text-align: center; padding: 16px; } /*CALCULATOR FILTER GROUP*/ .calculator-filter-group { width: 100%; margin: 14px 0 11px 2px; } @media (max-width: 767px) { .calculator-filter-group { margin: 10px 0 5px 4px; width: calc(100% + 14px); overflow: auto; -ms-overflow-style: none; scrollbar-width: none; } .calculator-filter-group::-webkit-scrollbar { display: none; } } .calculator-filter-group .calculator-filter-group-holder { display: flex; flex-wrap: wrap; gap: 21px; row-gap: 1px; } @media (max-width: 1599px) { .calculator-filter-group .calculator-filter-group-holder { gap: 5px; } } @media (max-width: 767px) { .calculator-filter-group .calculator-filter-group-holder { flex-wrap: nowrap; gap: 23px; } } .calculator-filter-group .calculator-filter-group-holder .calculator-filter-item { } @media (max-width: 767px) { .calculator-filter-group .calculator-filter-group-holder .calculator-filter-item:last-of-type { padding-right: 30px; } } .calculator-filter-group .calculator-filter-group-holder .calculator-filter-item div>label { gap: 8px; } @media (max-width: 767px) { .calculator-filter-group .calculator-filter-group-holder .calculator-filter-item div>label { gap: 10px; } } .calculator-filter-group .calculator-filter-group-holder .calculator-filter-item div>label .name { max-width: calc(100% - 20px - 8px); } @media (max-width: 1260px) { .calculator-filter-group .calculator-filter-group-holder .calculator-filter-item div>label .name { max-width: calc(100% - 16px - 8px); font-size: 14px; line-height: 20px; } } @media (max-width: 767px) { .calculator-filter-group .calculator-filter-group-holder .calculator-filter-item div>label .name { white-space: nowrap; max-width: calc(100% - 16px - 10px); } } /*connected checbox area*/ .connected-checbox-area { transition: all 500ms; } .connected-checbox-area.hidden { display: none; } .connected-checbox-area.opaque { opacity: 0; transition: all 500ms; } /* End */ /* Start:/local/templates/kraska/design/css/correctirovka.css?178996308523027*/ .row-line{ display: flex; margin: 0 -12px; } .row-line .col-item{ box-sizing: border-box; padding: 0 12px; } .col-1{ width: calc((100% / 12) * 1); } .col-2{ width: calc((100% / 12) * 2); } .col-3{ width: calc((100% / 12) * 3); } .col-4{ width: calc((100% / 12) * 4); } .col-5{ width: calc((100% / 12) * 5); } .col-6{ width: calc((100% / 12) * 6); } .col-7{ width: calc((100% / 12) * 7); } .col-8{ width: calc((100% / 12) * 8); } .col-9{ width: calc((100% / 12) * 9); } .col-10{ width: calc((100% / 12) * 10); } .col-11{ width: calc((100% / 12) * 11); } .col-12{ width: calc((100% / 12) * 12); } .articles-list-item-desc .articles-list-item-text { display: -webkit-box; -webkit-line-clamp: 2; overflow: hidden; -webkit-box-orient: vertical; } .project-item a .project-item-desc .project-item-desc-name{ display: -webkit-box; -webkit-line-clamp: 1; overflow: hidden; -webkit-box-orient: vertical; } .articles-list-item .project-item a .project-item-desc .project-item-desc-name{ display: -webkit-box; -webkit-line-clamp: 3; overflow: hidden; -webkit-box-orient: vertical; } .photo-report{ margin-top: 20px; } .form-input-captcha{ display: flex; margin: 0 -12px; } .form-input-captcha div{ width: 50%; box-sizing: border-box; padding: 0 12px; } .form-input-captcha-img img{ height: 100%; } .filter-menu-item-block-list .normal-checkbox-control:last-of-type{ margin-bottom: 0px; } .photo-report{ margin-top: 20px; } .detail-page-gallery .slick-list{ height: 100%; } .detail-page-gallery .slick-list .slick-track{ display: flex; } .detail-page-picture.one-picture.decor-mode .detail-page-gallery .detail-page-gallery-item a{ align-items: center; } .author-work-one-item-pic img{ max-height: 200px; max-width: 100%; } .detail-page-picture.paint-mode{ } .detail-page-picture.paint-mode img{ width: 100%; height: 100%; object-fit: cover; margin: 0px; } .bx_filter_container_modef{ /*display: none;*/ } .filter-menu-item-block-list .normal-checkbox-control.disabled{ position: relative; } .filter-menu-item-block-list .normal-checkbox-control.disabled:before{ content: ""; position: absolute; display: inline-block; width: 100%; height: 100%; left: 0px; top: 0px; z-index: 1; background: rgba(255,255,255,0.5); } main.content.loading{ position: relative; } main.content.loading:before{ content: ""; position: absolute; display: inline-block; width: 100%; height: 100%; left: 0px; top: 0px; z-index: 1; background: rgba(255,255,255,0.5); } .bx-filter-popup-result{ width: 100%; } /* .calculator-form-result.hide{ display: none; } .calculator-form-result-numbers.hide{ display: none; } .calculator-form-result.show{ display: inline-block; } .calculator-form-result-numbers.show{ display: inline-block; } */ .calculator-page-result-container{ width: 100%; } .calculator-form-content.loader{ position: relative; } .calculator-form-content.loader:before{ content: ""; position: absolute; display: inline-block; width: 100%; height: 100%; left: 0px; top: 0px; z-index: 1; background: rgba(255,255,255,0.5); } .compensate-for-scrollbar{ margin-right: 0 !important; } /* img-video */ .img-video{ display: grid; gap: 30px; grid-template-columns: 1fr 2fr; } .img-video img{max-width: 100%;} .img-video .video__content{padding-bottom: 66.5%;} .video{width: 100%;} .video__content{ padding-bottom: 56.25%; position: relative; } .video iframe{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; } @media (max-width: 767px) { .img-video{gap: 10px;} } .cn_map{ position: relative; height: 480px; } .cn_map #ymap{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .contacts-column-text{ display: flex; margin-top: 40px; } .contacts-column-text .cn_list{ width: 60%; box-sizing: border-box; padding-right: 40px; } .contacts-column-text .cn_map{ width: 40%; } .contact-list-info{ margin-bottom: 20px; } .contact-list-info li{ position: relative; padding-left: 40px; margin-bottom: 20px; } .contact-list-info li:last-of-type{ margin-bottom: 0px; } .ico_marker:before{ content: ""; display: inline-block; position: absolute; left: 0px; top: -4px; width: 23px; height: 32px; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMjNweCIgaGVpZ2h0PSIzMnB4IiB2aWV3Qm94PSIwIDAgMjMgMzIiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8ZyBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgICAgICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMTIwLjAwMDAwMCwgLTI1Mi4wMDAwMDApIiBmaWxsPSIjMzEzQTQ2IiBmaWxsLXJ1bGU9Im5vbnplcm8iPgogICAgICAgICAgICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMjAuMDAwMDAwLCAyNTIuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8cGF0aCBkPSJNMTEuNTMzNjE1NCw2Ljk4MTgxODE4IEM5LjI1Nzc5NDg3LDYuOTgxODE4MTggNy40MDU0MTAyNiw4LjgwOTMwOTA5IDcuNDA1NDEwMjYsMTEuMDU0NTQ1NSBDNy40MDU0MTAyNiwxMy4yOTk3ODE4IDkuMjU3Nzk0ODcsMTUuMTI3MjcyNyAxMS41MzM2MTU0LDE1LjEyNzI3MjcgQzEzLjgwOTQzNTksMTUuMTI3MjcyNyAxNS42NjE4MjA1LDEzLjI5OTc4MTggMTUuNjYxODIwNSwxMS4wNTQ1NDU1IEMxNS42NjE4MjA1LDguODA5MzA5MDkgMTMuODA5NDM1OSw2Ljk4MTgxODE4IDExLjUzMzYxNTQsNi45ODE4MTgxOCBaIE0xMS41MzM2MTU0LDEzLjk2MzYzNjQgQzkuOTA3NjkyMzEsMTMuOTYzNjM2NCA4LjU4NDg5NzQ0LDEyLjY1ODYxODIgOC41ODQ4OTc0NCwxMS4wNTQ1NDU1IEM4LjU4NDg5NzQ0LDkuNDUwNDcyNzMgOS45MDc2OTIzMSw4LjE0NTQ1NDU1IDExLjUzMzYxNTQsOC4xNDU0NTQ1NSBDMTMuMTU5NTM4NSw4LjE0NTQ1NDU1IDE0LjQ4MjMzMzMsOS40NTA0NzI3MyAxNC40ODIzMzMzLDExLjA1NDU0NTUgQzE0LjQ4MjMzMzMsMTIuNjU4NjE4MiAxMy4xNTk1Mzg1LDEzLjk2MzYzNjQgMTEuNTMzNjE1NCwxMy45NjM2MzY0IFoiPjwvcGF0aD4KICAgICAgICAgICAgICAgIDxwYXRoIGQ9Ik0xOS40MjYxNTM4LDMuMjY4MDcyNzMgQzE3LjI5MDEwMjYsMS4xNjA3MjcyNyAxNC40NDk4OTc0LDAgMTEuNDI5MjMwOCwwIEM4LjQwNzk3NDM2LDAgNS41NjgzNTg5NywxLjE2MDcyNzI3IDMuNDMyMzA3NjksMy4yNjgwNzI3MyBDLTAuNTIwNzQzNTksNy4xNjc0MTgxOCAtMS4wMTIsMTQuNTA0MTQ1NSAyLjM2ODQxMDI2LDE4Ljk0OTIzNjQgTDExLjQyOTIzMDgsMzEuODU4NjE4MiBMMjAuNDc2NDg3MiwxOC45NjcyNzI3IEMyMy44NzA0NjE1LDE0LjUwNDE0NTUgMjMuMzc5MjA1MSw3LjE2NzQxODE4IDE5LjQyNjE1MzgsMy4yNjgwNzI3MyBaIE0xOS41MTk5MjMxLDE4LjI4NzEyNzMgTDExLjQyOTIzMDgsMjkuODE0MTA5MSBMMy4zMjU1NjQxLDE4LjI2OTA5MDkgQzAuMjU5NDg3MTc5LDE0LjIzNTkyNzMgMC42OTg4NDYxNTQsNy42MTAxODE4MiA0LjI2Njc5NDg3LDQuMDkwNzYzNjQgQzYuMTc5OTIzMDgsMi4yMDMzNDU0NSA4LjcyMzQ4NzE4LDEuMTYzNjM2MzYgMTEuNDI5MjMwOCwxLjE2MzYzNjM2IEMxNC4xMzQ5NzQ0LDEuMTYzNjM2MzYgMTYuNjc4NTM4NSwyLjIwMzM0NTQ1IDE4LjU5MjI1NjQsNC4wOTA3NjM2NCBDMjIuMTYwMjA1MSw3LjYxMDE4MTgyIDIyLjU5OTU2NDEsMTQuMjM1OTI3MyAxOS41MTk5MjMxLDE4LjI4NzEyNzMgWiI+PC9wYXRoPgogICAgICAgICAgICA8L2c+CiAgICAgICAgPC9nPgogICAgPC9nPgo8L3N2Zz4='); } .ico_mail:before{ content: ""; display: inline-block; position: absolute; left: 0; top: 3px; width: 24px; height: 17px; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMjRweCIgaGVpZ2h0PSIxN3B4IiB2aWV3Qm94PSIwIDAgMjQgMTciIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8ZyBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgICAgICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMTIwLjAwMDAwMCwgLTQ2Ni4wMDAwMDApIiBmaWxsPSIjMzEzQTQ2IiBmaWxsLXJ1bGU9Im5vbnplcm8iPgogICAgICAgICAgICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMjAuMDAwMDAwLCA0NjYuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8cGF0aCBkPSJNMjEuMzg0LDE2LjY1MTg2OTYgTDEuODc1LDE2LjY1MTg2OTYgQzAuODQxNSwxNi42NTE4Njk2IDAsMTUuODIzMzA0MyAwLDE0LjgwNDA0MzUgTDAsMi4yMDQwODY5NiBDMCwxLjE4NDgyNjA5IDAuODQxNSwwLjM1NjI2MDg3IDEuODc1LDAuMzU2MjYwODcgTDIxLjM4NCwwLjM1NjI2MDg3IEMyMi40MTc1LDAuMzU2MjYwODcgMjMuMjU5LDEuMTg0ODI2MDkgMjMuMjU5LDIuMjA0MDg2OTYgTDIzLjI1OSwxNC44MDQwNDM1IEMyMy4yNTksMTUuODIzMzA0MyAyMi40MTc1LDE2LjY1MTg2OTYgMjEuMzg0LDE2LjY1MTg2OTYgWiBNMS44NzUsMS4wOTUzOTEzIEMxLjI1NDc1LDEuMDk1MzkxMyAwLjc1LDEuNTkyODI2MDkgMC43NSwyLjIwNDA4Njk2IEwwLjc1LDE0LjgwNDA0MzUgQzAuNzUsMTUuNDE1MzA0MyAxLjI1NDc1LDE1LjkxMjczOTEgMS44NzUsMTUuOTEyNzM5MSBMMjEuMzg0LDE1LjkxMjczOTEgQzIyLjAwNDI1LDE1LjkxMjczOTEgMjIuNTA5LDE1LjQxNTMwNDMgMjIuNTA5LDE0LjgwNDA0MzUgTDIyLjUwOSwyLjIwNDA4Njk2IEMyMi41MDksMS41OTI4MjYwOSAyMi4wMDQyNSwxLjA5NTM5MTMgMjEuMzg0LDEuMDk1MzkxMyBMMS44NzUsMS4wOTUzOTEzIFoiPjwvcGF0aD4KICAgICAgICAgICAgICAgIDxwYXRoIGQ9Ik0xMS42Mjk1LDEwLjM2MTEzMDQgQzExLjEzMDc1LDEwLjM2MTEzMDQgMTAuNjMyLDEwLjE5Nzc4MjYgMTAuMjUyNSw5Ljg3MTgyNjA5IEwwLjY2ODI1LDEuNjQwMTMwNDMgQzAuNTEyMjUsMS41MDU2MDg3IDAuNDk1NzUsMS4yNzI3ODI2MSAwLjYzMjI1LDEuMTE5MDQzNDggQzAuNzY4NzUsMC45NjM4MjYwODcgMS4wMDU3NSwwLjk0OTA0MzQ3OCAxLjE2MTc1LDEuMDgyODI2MDkgTDEwLjc0NTI1LDkuMzE0NTIxNzQgQzExLjIyNTI1LDkuNzI2MjE3MzkgMTIuMDM1MjUsOS43MjU0NzgyNiAxMi41MTM3NSw5LjMxNDUyMTc0IEwyMi4wOTUsMS4wODM1NjUyMiBDMjIuMjUwMjUsMC45NDgzMDQzNDggMjIuNDg2NSwwLjk2MzgyNjA4NyAyMi42MjQ1LDEuMTE5NzgyNjEgQzIyLjc2MSwxLjI3MzUyMTc0IDIyLjc0NDUsMS41MDYzNDc4MyAyMi41ODg1LDEuNjQwODY5NTcgTDEzLjAwNjUsOS44NzEwODY5NiBDMTIuNjI3LDEwLjE5Nzc4MjYgMTIuMTI4MjUsMTAuMzYxMTMwNCAxMS42Mjk1LDEwLjM2MTEzMDQgWiI+PC9wYXRoPgogICAgICAgICAgICA8L2c+CiAgICAgICAgPC9nPgogICAgPC9nPgo8L3N2Zz4='); } .ico_phone:before{ content: ""; display: inline-block; position: absolute; left: 0px; width: 25px; height: 25px; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMjVweCIgaGVpZ2h0PSIyNXB4IiB2aWV3Qm94PSIwIDAgMjUgMjUiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8cGF0aCBzdHJva2U9IiMzMTNBNDYiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMjIuOTQyMjExOSwxOC4yMTIzOTE3IEwxOS4zODMyNjAzLDE0LjY1MzA0MjggQzE4LjY3NDM4MywxMy45NDcwMTI0IDE3LjUwMDQ2ODUsMTMuOTY4NDYzNSAxNi43NjY4OTYxLDE0LjcwMjMwMDcgTDE0Ljk3Mzg4MDksMTYuNDk0OTE4NiBDMTQuODYwNjAwOSwxNi40MzI0ODU1IDE0Ljc0MzM0ODUsMTYuMzY3MjcxNyAxNC42MjAwNzEzLDE2LjI5ODA4NTUgQzEzLjQ4NzgwMDksMTUuNjcwNzA5IDExLjkzODA5NjEsMTQuODEwODEzOCAxMC4zMDczNTQsMTMuMTc4ODggQzguNjcxNzc4ODUsMTEuNTQzNTAzNSA3LjgxMTA4OTE5LDkuOTkxNDE1MTQgNy4xODE3OTI2NCw4Ljg1ODQxNjU1IEM3LjExNTM4NzEzLDguNzM4MzgzNDUgNy4wNTE3NjIyOSw4LjYyMjY1Mzc5IDYuOTg4OTMxOTUsOC41MTI3NTAzNSBMOC4xOTIzMDg1LDcuMzExMTYxMzggTDguNzgzOTMzMzMsNi43MTg4MDgyOCBDOS41MTg2MzEyNiw1Ljk4MzkxMTcyIDkuNTM4ODkwNTcsNC44MTAzMjgyOCA4LjgzMTY2ODUsNC4xMDIyNDU1MSBMNS4yNzI3MTY3OCwwLjU0MjQ5OTMxIEM0LjU2NTQ5NDcxLC0wLjE2NDU5MDM0NSAzLjM5MTA1MDU3LC0wLjE0MzEzOTMxIDIuNjU2MzUyNjQsMC41OTE3NTcyNDEgQzEuNTk0MzQ5ODgsMS44OTg1MDQ4MyAwLjk5MzYzMjY0LDIuNzI5Nzk4NjIgMC44NTQyMDA5MTYsMy4wODU2Mzg2MiBDMC42NjE0MDY0MzMsMy41OTM3MTAzNSAwLjU0MTM3MzMzLDQuMDc4NTQzNDUgMC40ODY0ODc4MTIsNC41NjQzNjk2NSBDMC4wMTY1NTEyNjExLDguNDYwMjQ4MjggMS43OTY4NTQ3MSwxMi4wMjA3ODkgNi42MjgzNjkxOSwxNi44NTIzNjk2IEMxMy4zMDY5ODk5LDIzLjUzMDUyNjkgMTguNjg5MDgwOSwyMy4wMjYwMzA0IDE4LjkyMTI2ODUsMjMuMDAxNDAxNCBDMTkuNDI2OTU2OCwyMi45NDA5NTQ1IDE5LjkxMTU5MTMsMjIuODIwMTI2OSAyMC40MDQxMDQ0LDIyLjYyODg1NTEgQzIwLjc1Njg1NDgsMjIuNDkxMDU2NSAyMS41ODcwODkyLDIxLjg5MTU1MzIgMjIuODk0ODA3OCwyMC44MzAzNDQ5IEMyMy42Mjc5ODMsMjAuMDk1NTgwNyAyMy42NDkxMDMsMTguOTIxNiAyMi45NDIyMTE5LDE4LjIxMjM5MTcgWiI+PC9wYXRoPgo8L3N2Zz4='); } .content-mode.detail-text h3{ margin-bottom: 20px; } .style-table{ margin-bottom: 10px; } .style-table table{ border-collapse: collapse; } .style-table table td{ border: 1px solid black; padding: 5px; } .style-table{ } #pp_selectColorSet{ width: 1024px; } #pp_callback{ max-width: 400px; } #pp_calculatorConsultation{ max-width: 400px; } .form-field-three-line{ display: flex; margin: 0 -4px; } .form-field-three-line .form-field-line-item{ width: 33.33%; box-sizing: border-box; padding: 0 8px; } .popup .h3{ margin-bottom: 20px; } .pp_container{ } .pp_container .pp_title{ text-align: center; font-size: 22px; font-style: normal; font-weight: 500; line-height: 32px; } .pp_container .pp_subtitle{ text-align: center; font-size: 18px; font-style: normal; font-weight: 500; line-height: 24px; } .chars-table-block-item p.large{ display: flex; justify-content: space-between; align-items: center; gap: 20px; text-align: right; } .chars-table-block-item p.large .chars-table-span{ float: right; font-size: 16px; line-height: 24px; } .unsure-table-line{ border-top: 1px solid #D2DAED; margin-top: 16px; padding-top: 12px; } .unsure-table-line .chars-table-footer-container{ align-items: center; } /*About Company*/ .about-page-detail { display: inline-block; width: 100%; margin: 27px 0 0; } .about-page-detail .about-page-detail-container { } .about-page-detail .about-page-detail-container .about-page-detail-left { } .about-page-detail .about-page-detail-container .about-page-detail-right { } .about-page-detail .about-text { display: inline-block; width: 88.8%; } .about-page-detail .about-text img { } .about-page-detail .about-text img.full { width: 100%; margin: 0 0 23px; } .about-page-detail .about-text p { } .about-page-detail .about-text p:not(:last-of-type) { margin: 0 0 12px; } .company-info { display: inline-block; width: 100%; margin: 24px 0 0; } .company-info .company-info-holder { display: inline-block; width: 100%; box-sizing: border-box; border: 1px solid #EEF0F5; box-shadow: 0px 4px 16px 0px #313A461A; background: #FFFFFF; padding: 24px; } .company-info .company-info-holder .info-block { display: inline-block; width: 100%; } .company-info .company-info-holder .info-block:not(:last-of-type) { margin: 0 0 23px; } .company-info .company-info-holder .info-block .info-line { display: inline-block; width: 100%; font-size: 16px; font-weight: 400; line-height: 24px; } .personal-form-content.faq-form{ max-width: 400px; } @media (max-width: 1919px){ } @media (max-width: 1279px){ .row-line{ flex-direction: column; } .col-xs-1{ width: 100%; } .form-field-three-line .form-field-line-item{ width: 100%; } .about-page-detail .about-page-detail-container .about-page-detail-left{ margin-bottom: 30px; } } .btn-product-offer{ display: flex; align-items: center; justify-content: center; gap: 8px; padding: 16px 24px; box-sizing: border-box; color: var(--Dark500, #313A46); font-size: 14px; font-style: normal; font-weight: 500; line-height: 24px; border-radius: 8px; border: 1px solid var(--Gray400, #EEF0F5); margin-top: 12px; text-decoration: none; transition: all 0.3s ease; } .btn-product-offer:hover{ text-decoration: none; background: #EEF0F5; } .product-card-desc{ display: flex; flex-direction: column; align-items: center; } .chars-table-footer-btn .btn-product-offer{ background: var(--White500, #FFF); border: none; margin: 0; } .form-offer-container{ width: 100%; max-width: 384px; border-radius: 8px; background: #FFF; box-sizing: border-box; padding: 24px 16px; display: none; } .form-offer-container .title{ text-align: center; font-size: 22px; font-style: normal; font-weight: 500; line-height: 32px; } .form-offer-container .offer-detali .img{ width: 60px; height: 60px; } .form-offer-container .offer-detali .img img{ width: 100%; height: 100%; } .form-offer-container .offer-detali .name{ font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; } .form-offer-container .offer-detali{ display: flex; justify-content: space-between; gap: 24px; align-items: center; } .btn-add{ width: 100%; padding: 12px 24px; border-radius: 8px; border: 1px solid var(--Gray400, #EEF0F5); background: var(--Gray400, #EEF0F5); display: flex; justify-content: center; align-items: center; gap: 8px; color: var(--Dark500, #313A46); font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; box-sizing: border-box; } .btn-add:hover{ text-decoration: none; } .form-offer-container .form-section{ display: flex; flex-direction: column; gap: 4px; } .form-offer-container .form-section .name-input{ font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; } .form-offer-container .form-section input, .form-offer-container .form-section textarea{ padding: 12px 12px 12px 16px; border-radius: 8px; border: 1px solid var(--Gray500, #D2DAED); background: #FFF; color: var(--Dark500, #313A46); font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; resize: none; } .form-offer-container .form-section textarea{ min-height: 72px; } .form-offer-container .button-form{ border-radius: 8px; background: var(--Dark500, #313A46); color: #FFF; font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; padding: 16px 24px; box-sizing: border-box; width: 100%; display: inline-block; text-align: center; } .form-offer-container .text-bottom{ color: var(--Dark400, #7F8286); text-align: center; font-size: 12px; font-style: normal; font-weight: 400; line-height: normal; } .form-offer-container .pp_container, .form-offer-container form{ display: flex; flex-direction: column; gap: 24px; } .form-offer-container form{ gap: 10px; } .offer-detali-container{ display: flex; flex-direction: column; gap: 8px; } @media (max-width: 1279px) { .btn-product-offer{ font-size: 12px; line-height: 24px; padding: 8px 20px; } } .form-products__msg{ text-align: center; /*margin-top: 10px;*/ margin-bottom: 20px; color: red; display: none; } .form-products__msg.active{ display: inline-block; width: 100%; } .btn-product-offer-container-content{ text-align: center; } .btn-product-offer-container{ display: inline-block; } .btn-product-offer-container .btn-product-offer{ } .calculator-form-dop{ box-sizing: border-box; padding: 23px 40px 24px; display: flex; justify-content: center; text-align: center; } .calculator-form-dop-text{ margin-bottom: 25px; } @media (max-width: 1279px) { .calculator-form-dop { margin-top: 15px; padding: 23px 15px 24px; } .calculator-form-dop-text{ margin-bottom: 20px; } .calculator-form-dop .btn{ width: 100%; } } .audio-file{ } .audio-file audio{ width: 100%; } .checkbox-politica{ text-align: left; /*padding-left: 30px;*/ box-sizing: border-box; } .checkbox-politica + .checkbox-politica{ margin-top: 10px; } .checkbox-politica label{ position: relative; } .checkbox-politica label input{ position: absolute; width: 20px; height: 20px; left: -30px; top: 0px; padding: 0px; margin: 0px; } .footer-line-bottom-second{ display: inline-block; width: 100%; margin-top: 32px; padding-top: 32px; box-sizing: border-box; border-top: 1px solid rgba(255, 255, 255, 0.1); } .politica-list-line{ display: flex; gap: 40px; } @media (max-width: 1279px){ .politica-list-line{ gap: 12px 32px; flex-wrap: wrap; } .politica-list-line a{ font-weight: 400; font-size: 12px; line-height: 20px; } .footer-line-bottom-second{ padding-top: 20px; margin-top: 20px; } } .form-input-line.section-email{ margin-bottom: 10px; } .service-page-detail .action-data{ display: flex; gap: 8px; margin-bottom: 15px; } .form-send-gap-block{ gap: 12px; display: flex; flex-direction: column; } .basket-summary-container .form-field-one-line.form-field-after-line{ margin-top: 20px; } .vacancy-item .articles-list-item-desc{ padding-left: 0px; width: 100%; } .rutubeVideo.fancybox-content{ padding: 0px; } .rutubeVideo.fancybox-content iframe{ vertical-align: top; } .products-dilers{ width: 100%; display: flex; flex-wrap: wrap; gap: 24px; } .product-diler{ width: 280px; box-sizing: border-box; min-height: 324px; display: flex; flex-direction: column; align-items: center; gap: 12px; border-radius: 8px; border: 1px solid var(--Gray400, #EEF0F5); background: #FFF; box-shadow: 0px 4px 16px 0px rgba(49, 58, 70, 0.10); padding: 16px; } .product-diler:hover{ text-decoration: none; } .product-diler-img{ width: 100%; padding: 16px; height: 232px; } .product-diler-img img{ object-fit: contain; width: 100%; height: 100%; } .product-diler-title{ font-weight: 500; font-style: Medium; font-size: 16px; line-height: 24px; letter-spacing: 0%; text-align: center; } @media (max-width: 1279px) { .product-diler{ width: calc(50% - 12px); } } @media (max-width: 756px) { .product-diler{ width: 100%; } } .checkbox-politica { text-align: left; box-sizing: border-box; } .checkbox-politica + .checkbox-politica { margin-top: 10px; } .checkbox-politica label { display: flex; align-items: flex-start; gap: 10px; cursor: pointer; position: relative; } .checkbox-politica label input[type="checkbox"] { flex-shrink: 0; width: 20px; height: 20px; margin: 0; padding: 0; cursor: pointer; position: static; transform: none; } .checkbox-politica label span { display: none; } .checkbox-politica label p { margin: 0; flex: 1; } @media (max-width: 768px) { .politica-list-line{ flex-direction: column; gap: 14px; font-size: 14px; } } /* End */ /* Start:/local/templates/kraska/design/css/kirill.css?17899630853035*/ .section-main-actions{ display: flex; flex-direction: column; } .section-main-actions-desc{ position: relative; padding: 20px 0 0 ; } .section-main-actions-desc .large{ font-size: clamp(1.125rem, 0.601rem + 0.645vw, 1.375rem); line-height: clamp(1.25rem, -0.323rem + 1.935vw, 2rem); } .section-main-actions .section-main-actions-pic img{ object-fit: cover; } .section-main-actions-desc .sub-title{ font-weight: 400; font-size: clamp(0.875rem, 0.613rem + 0.323vw, 1rem); line-height: clamp(1.125rem, 0.339rem + 0.968vw, 1.5rem); } .section-main-actions-pic img { max-height: clamp(12.5rem, -13.71rem + 32.258vw, 25rem); } .section-main-actions{ padding: 16px 16px 20px ; box-shadow: 0 4px 16px 0 #313A461A; box-sizing: border-box; } .section-main-actions-desc h2 + p{ max-height: clamp(12.5rem, -13.71rem + 32.258vw, 25rem); } .section-main-actions-btn a{ width: 100%; text-align: center; } .section-main-actions-desc .section-main-actions-btn{ margin-top: clamp(0.625rem, -1.21rem + 2.258vw, 1.5rem); } .footer.order-page.bg-dark-500{ height: 176px; } .contact__social img.max{ height: 19px; } @media (max-width: 1279px) { .slide-basket-element-container{ flex-direction: column; } .slide-basket-element-numbers{ margin-bottom: 5px; } .slide-basket-element-btn{ margin-bottom: 10px; } /* .form-field-one-line.form-field-after-line .politica-text{ display: none; }*/ /* .slide-basket-element.xs-view{ display: none; }*/ .slide-basket-element-container .slide-basket-element-btn, .slide-basket-element-container .form-field-one-line.form-field-after-line { display: none; } .slide-basket-element.xs-view { transition: opacity 0.3s ease, transform 0.3s ease; opacity: 1; transform: translateY(0); } .slide-basket-element.xs-view.hidden { opacity: 0; transform: translateY(20px); pointer-events: none; } } @media (max-width: 768px) { #pp_selectColorSet.is-detail-color-picker .calculator-steps-conroller.color { display: none; } .section-main-actions-pic img { max-height: none; } .popup.fancybox-content .pp_container{ text-align: center; } .popup.fancybox-content .pp_container .btn.btn-primary{ width: 60%; margin-bottom: 15px; text-align: center; } .popup.fancybox-content .pp_container .btn.btn-secondary{ width: 60%; margin-bottom: 15px; text-align: center; } .footer.order-page.bg-dark-500 { height: 308px; } .popup.fancybox-content .pp_container .btn.btn-secondary.btn-small.changeDetailPageSetting, .popup.fancybox-content .pp_container .btn.btn-small.changeDetailPageSetting.btn-primary{ width: 100%; } } /* End */ /* Start:/local/templates/kraska/design/css/barsik.css?179065596419772*/ /*блок с квизом в каталоге*/ .promo-card{ border-radius: 5%; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,0.05); } .promo-image img{ width: 100%; height: 180px; object-fit: cover; display: block; } .item-banka .product-card-picture.promo-image .product-card-picture-bg img{ width: 100%; /*height: 180px;*/ object-fit: cover; display: block; border-radius: 5%; object-position: 50% 30%; } .product-card-desc.promo-content{ padding-left: 24px; padding-bottom: 24px; margin-top: 0; flex-direction: row; } .product-card-desc.promo-content .product-card-name.promo-text{ text-align: justify; font-weight: 500; font-size: 22px; line-height: 32px; letter-spacing: 0%; } .product-card-desc.promo-content .product-card-price.promo-button{ margin-left: auto; margin-right: 24px; } .promo-text{ font-size: 18px; font-weight: 500; } .promo-button{ padding: 10px 16px; background: #e6e6e6; border: none; border-radius: 10px; transition: 0.2s; } .promo-button:hover{ background: #dcdcdc; } .main-quiz-inline{ width: 100%; } .main-quiz-inline .marquiz__inline-frame{ width: 100% !important; min-height: 655px; } .section-main-quiz + .section-projects{ margin-top: 40px; } .reviews-widget{ position: relative; width: 100%; max-width: 760px; height: 800px; margin: 0 auto; overflow: hidden; } .reviews-widget__frame{ width: 100%; height: 100%; border: 1px solid #e6e6e6; border-radius: 8px; box-sizing: border-box; } .reviews-widget__link{ position: absolute; left: 0; bottom: 8px; display: block; width: 100%; max-height: 14px; padding: 0 16px; box-sizing: border-box; overflow: hidden; color: #b3b3b3; font-family: "YS Text", sans-serif; font-size: 10px; text-align: center; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; } @media (max-width: 835px) { .item-banka .product-card-picture.promo-image .product-card-picture-bg img{ object-position: 50% 20%; } .section-main-quiz + .section-projects{ margin-top: 32px; } .reviews-widget{ width: 100%; height: 720px; } .service-detail-text-block .articles-table th{ padding: 10px 7px 10px 7px; } .service-detail-text-block .articles-table td{ padding: 10px 7px 10px 7px; } } /*блок с квизом в каталоге*/ .events-sub { margin-top: 40px; margin-bottom: 100px; margin-bottom: 100px; } .events-sub__header { margin-bottom: 40px; } .events-sub__title { font-size: 40px; font-weight: 700; line-height: 56px; color: #313A46; margin-bottom: 8px; } .events-sub__subtitle { font-size: 16px; font-weight: 400; line-height: 24px; color: #7F8286; } .events-sub__card { background: #EEF0F5; border-radius: 8px; padding: 40px; max-width: 760px; } @media (max-width: 835px) { .events-sub__card { padding: 24px 20px; } .events-sub__title { font-size: 28px; line-height: 36px; } } .events-sub__error { background: #fff0f0; border: 1px solid #e8c0c0; border-radius: 8px; color: #C00; font-size: 14px; font-weight: 400; line-height: 20px; padding: 12px 16px; margin-bottom: 24px; } .events-sub__fields { display: flex; flex-wrap: wrap; gap: 16px; margin-bottom: 32px; } .events-sub__field { display: flex; flex-direction: column; width: calc(50% - 8px); } .events-sub__field--full { width: 100%; } @media (max-width: 600px) { .events-sub__field { width: 100%; } } .events-sub__field .line-label { font-size: 14px; font-weight: 400; line-height: 16px; color: #7F8286; margin-bottom: 4px; display: inline-block; } .events-sub__field .line-label .req { color: #C00; margin-left: 2px; } .events-sub__divider { height: 1px; background: #D2DAED; margin-bottom: 28px; } .events-sub__section-title { font-size: 22px; font-weight: 500; line-height: 32px; color: #313A46; margin-bottom: 16px; } .events-sub__checks { display: flex; flex-wrap: wrap; gap: 12px 32px; margin-bottom: 8px; } .events-sub__check { display: flex; align-items: center; gap: 8px; cursor: pointer; position: relative; padding-left: 30px; font-size: 16px; font-weight: 400; line-height: 24px; color: #313A46; user-select: none; min-width: 160px; } .events-sub__check input[type="checkbox"] { position: absolute; left: 2px; top: 50%; transform: translateY(-50%); width: 20px; height: 20px; margin: 0; border: 1px solid #D2DAED; border-radius: 3px; cursor: pointer; appearance: none; -webkit-appearance: none; background: #fff; transition: background 0.2s, border-color 0.2s; } .events-sub__check input[type="checkbox"]:checked { background: #313A46; border-color: #313A46; } .events-sub__check input[type="checkbox"]:checked::after { content: ''; position: absolute; left: 5px; top: 2px; width: 6px; height: 10px; border: 2px solid #fff; border-top: none; border-left: none; transform: rotate(45deg); } .events-sub__hint { font-size: 14px; font-weight: 400; line-height: 16px; color: #7F8286; margin-top: 4px; margin-bottom: 28px; } .events-sub__format { margin-bottom: 28px; } .events-sub__format .line-label { font-size: 14px; font-weight: 400; line-height: 16px; color: #7F8286; margin-bottom: 4px; display: inline-block; } .events-sub__format textarea { border-radius: 8px; border: 1px solid #D2DAED; background: #FFF; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; color: #313A46; padding: 10px 12px 12px; font-family: 'Cera Pro', sans-serif; width: 100%; box-sizing: border-box; transition: all 0.3s ease; outline: none; resize: vertical; min-height: 120px; } .events-sub__format textarea:focus { border: 1px solid #313A46; } .events-sub__format textarea::placeholder { color: #B0B5BE; } .events-sub__agree { margin-bottom: 28px; } .events-sub__agree label { width: 100%; font-weight: 400; font-size: 14px; line-height: 20px; padding: 2px 0 2px 30px; cursor: pointer; position: relative; color: #7F8286; display: block; } .events-sub__agree input[type="checkbox"] { position: absolute; left: 2px; top: 50%; transform: translateY(-50%); width: 20px; height: 20px; margin: 0; border: 1px solid #D2DAED; border-radius: 3px; cursor: pointer; appearance: none; -webkit-appearance: none; background: #fff; transition: background 0.2s, border-color 0.2s; } .events-sub__agree input[type="checkbox"]:checked { background: #313A46; border-color: #313A46; } .events-sub__agree input[type="checkbox"]:checked::after { content: ''; position: absolute; left: 5px; top: 2px; width: 6px; height: 10px; border: 2px solid #fff; border-top: none; border-left: none; transform: rotate(45deg); } .events-sub__agree label a { color: #313A46; border-bottom: 1px solid #313A46; font-weight: 400; font-size: 14px; line-height: 20px; } .events-sub__agree label a:hover { text-decoration: none; border-bottom-color: transparent; } @media (max-width: 835px) { .events-sub__agree label { padding: 0 0 2px 32px; font-size: 12px; line-height: 130%; max-width: 90%; } .events-sub__agree input[type="checkbox"] { top: 8px; transform: translateY(0); } } .events-sub__success { text-align: center; padding: 20px 0; } .events-sub__success-title { font-size: 32px; font-weight: 700; line-height: 40px; color: #313A46; margin-bottom: 16px; } .events-sub__success-text { font-size: 16px; font-weight: 400; line-height: 24px; color: #7F8286; } .tec-chars-box-item .articles-list-item-desc .articles-list-item-text { -webkit-line-clamp: 8; } .tec-chars-box-item .articles-list-item { max-width: 750px; } /* ===== FAQ Accordion ===== */ .section-faq { padding: 60px 0; } .section-faq .section-content-header { margin-bottom: 40px; } .section-faq .section-content-header h2 { font-size: 36px; font-weight: 700; line-height: 48px; color: #313A46; } .faq-accordion { display: flex; flex-direction: column; border-radius: 8px; border: 1px solid #D2DAED; overflow: hidden; } .faq-item { border-bottom: 1px solid #D2DAED; } /*.faq-item:last-child { border-bottom: none; }*/ .faq-question { display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 24px 28px; background: #fff; border: none; cursor: pointer; text-align: left; font-family: 'Cera Pro', sans-serif; box-sizing: border-box; transition: background 0.3s ease; } .faq-question .h3, .faq-question h3 { font-size: 16px; font-weight: 500; line-height: 24px; color: #313A46; transition: color 0.3s ease; margin: 0; } .faq-question:hover { background: #EEF0F5; } .faq-question[aria-expanded="true"] { background: #EEF0F5; border-bottom: 1px solid #D2DAED; } .faq-question[aria-expanded="true"] .h3 { color: #BE707D; } .faq-icon { flex-shrink: 0; width: 20px; height: 20px; margin-left: 24px; position: relative; border-radius: 50%; background: #EEF0F5; transition: background 0.3s ease; } .faq-question:hover .faq-icon, .faq-question[aria-expanded="true"] .faq-icon { background: #D2DAED; } .faq-icon::before, .faq-icon::after { content: ''; position: absolute; background-color: #313A46; border-radius: 2px; transition: transform 0.3s ease, opacity 0.3s ease; } .faq-icon::before { width: 10px; height: 1.5px; top: 50%; left: 50%; transform: translate(-50%, -50%); } .faq-icon::after { width: 1.5px; height: 10px; top: 50%; left: 50%; transform: translate(-50%, -50%); } .faq-question[aria-expanded="true"] .faq-icon::after { opacity: 0; } .faq-answer { max-height: 0; overflow: hidden; transition: max-height 0.4s cubic-bezier(.645,.045,.355,1); background: #fff; } .faq-answer.is-open { max-height: 1000px; } .faq-answer-inner { padding: 28px 24px; color: #7F8286; font-family: 'Cera Pro', sans-serif; font-size: 16px; font-weight: 400; line-height: 24px; } .faq-answer-inner p { color: #7F8286; font-size: 16px; font-weight: 400; line-height: 24px; margin-bottom: 8px; } .faq-answer-inner p:last-child { margin-bottom: 0; } .faq-answer-inner ul { padding-left: 0; margin: 8px 0; } .faq-answer-inner ul li { position: relative; padding-left: 16px; margin-bottom: 6px; color: #7F8286; font-size: 16px; line-height: 24px; } .faq-answer-inner ul li:before { content: ""; position: absolute; width: 4px; height: 4px; background: #7F8286; border-radius: 50%; left: 2px; top: 10px; } .faq-footer-cta { margin-top: 24px; text-align: center; font-size: 16px; font-weight: 400; line-height: 24px; color: #7F8286; } .faq-footer-cta a { color: #313A46; text-decoration: none; border-bottom: 1px solid #313A46; transition: opacity 0.3s ease; } .faq-footer-cta a:hover { opacity: 0.6; text-decoration: none; } @media (max-width: 1024px) { .faq-question { padding: 20px; } .faq-answer-inner { padding: 20px 20px; } } @media (max-width: 768px) { .section-faq { padding: 40px 0; } .faq-question { padding: 16px; } .faq-question h3 { font-size: 14px; line-height: 20px; } .faq-icon { width: 18px; height: 18px; margin-left: 12px; } .faq-answer-inner { padding: 16px 16px; font-size: 14px; } } .faq-answer-inner ul li:before { content: ""; position: absolute; width: 4px; height: 4px; min-width: 4px; min-height: 4px; box-sizing: content-box; background: #7F8286; border-radius: 50%; left: 2px; top: 10px; } .service-page-detail .item-banka .product-card-picture .product-card-picture-bg.kartina-pic { height: 240px; display: flex; align-items: center; justify-content: center; overflow: hidden; } .service-page-detail .item-banka .product-card-picture .product-card-picture-bg.kartina-pic .product-card-picture-bg img { width: 100%; height: 100%; object-fit: contain; } .contact-btn { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; padding: 10px 18px; border-radius: 6px; font-size: 14px; font-weight: 600; margin-top: 10px; margin-right: 8px; transition: background-color 0.2s ease; color: #fff; } .product-card-price { display: flex; flex-direction: row; flex-wrap: wrap; gap: 10px; } /*.product-card-price .btn-small.with-2-icons { width: 33%; }*/ .product-card-price .btn-small.with-2-icons .btn-with-icon { justify-content: center; } .oc-field .form-input input[type=email] { border-radius: 8px; border: 1px solid #D2DAED; background: #FFF; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; color: #313A46; padding: 10px 12px 12px; font-family: "Cera Pro"; width: 100%; box-sizing: border-box; transition: all 0.3s ease; outline: none; } .oc-field .form-input input[type=email]:focus { border: 1px solid #313A46; } .oc-overlay { display: none; position: fixed; inset: 0; background: rgba(49, 58, 70, 0.5); z-index: 9999; align-items: center; justify-content: center; padding: 16px; box-sizing: border-box; } .oc-overlay.is-open { display: flex; } .oc-modal { position: relative; background: #fff; width: 560px; max-width: 100%; border-radius: 8px; box-shadow: 0px 4px 16px 0px rgba(49, 58, 70, 0.10); border: 1px solid #EEF0F5; padding: 40px; box-sizing: border-box; animation: ocFadeIn .2s ease; } @keyframes ocFadeIn { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: translateY(0); } } .oc-close { position: absolute; top: 16px; right: 16px; background: none; border: none; cursor: pointer; padding: 4px; opacity: .45; transition: opacity .2s; line-height: 1; } .oc-close:hover { opacity: 1; } .oc-title { font-family: 'Cera Pro', sans-serif; font-size: 28px; font-weight: 700; line-height: 36px; color: #313A46; margin: 0 0 8px; } .oc-subtitle { color: #7F8286; margin: 0 0 28px; display: block; } .oc-field { margin-bottom: 16px; } .oc-label { font-family: 'Cera Pro', sans-serif; font-size: 14px; font-weight: 400; color: #313A46; margin-bottom: 4px !important; } /* Поле с ошибкой */ .oc-field .form-input input.has-error { border-color: #C00; } .oc-error { display: block; min-height: 18px; margin-top: 4px; font-size: 12px; font-weight: 400; line-height: 16px; } /* Кнопка */ .oc-submit { margin-top: 24px; display: flex; align-items: center; justify-content: center; gap: 8px; font-family: 'Cera Pro', sans-serif; } .oc-submit:disabled { opacity: .65; pointer-events: none; } /* Лоадер */ .oc-loader { display: inline-block; width: 16px; height: 16px; border: 2px solid rgba(255,255,255,.3); border-top-color: #fff; border-radius: 50%; animation: ocSpin .7s linear infinite; flex-shrink: 0; } @keyframes ocSpin { to { transform: rotate(360deg); } } /* Ошибка формы */ .oc-form-error { margin-top: 12px; font-size: 14px; } /* Успех */ .oc-success-icon { margin-bottom: 4px; } @media (max-width: 1279px) { .oc-modal { padding: 28px 20px; } .oc-title { font-size: 22px; line-height: 32px; } } @media (max-width: 600px) { .oc-modal { padding: 24px 16px; } } .service-detail-text-block table { width: 100%; border-collapse: collapse; font-size: 14px; border: none; } .service-detail-text-block thead tr, .service-detail-text-block tbody tr:first-child { background-color: #f5f5f0; } .service-detail-text-block th { padding: 10px 14px; text-align: left; font-weight: 600; font-size: 11px; text-transform: uppercase; letter-spacing: 0.05em; color: #555; border-bottom: 2px solid #ddd; } .service-detail-text-block td { padding: 10px 14px; vertical-align: top; line-height: 1.5; border-bottom: 1px solid #e8e8e8; color: #222; } .service-detail-text-block tr:last-child td { border-bottom: none; } .service-detail-text-block .style-table tr:last-child td { border-bottom: 1px solid black; } .search-results-combined { display: flex; flex-wrap: wrap; margin: 16px -12px; } .search-results-combined > .searchItemContent.active, .search-results-combined .catalog-list-section-container, .search-results-combined .catalog-list-section-products-container, .search-results-combined .catalog-list-section-products { display: contents; } .search-results-combined .ix-nav-block { flex-basis: 100%; } @media (max-width: 767px) { .search-results-combined { margin: 0 0 12px; } } .service-detail-text-block tr:hover td { background-color: #fafaf8; } .calc-warning { display: inline-block; margin-right: 12px; padding: 6px 12px; background: #fff3cd; border: 1px solid #ffc107; border-radius: 4px; color: #856404; font-size: 14px; vertical-align: middle; animation: fadeInWarning 0.3s ease; } @keyframes fadeInWarning { from { opacity: 0; transform: translateX(6px); } to { opacity: 1; transform: translateX(0); } } @media (max-width: 1468px) { .header-top-menu ul li:last-child { display: none; } } @media (max-width: 1023px) { .service-detail-text .service-detail-text-block .contact__social img { width: auto; } } .dealer__info .contact__social { width: auto; row-gap: 0; } caption { line-height: 200%; } .content-mode.detail-text ol li { margin-bottom: 8px; line-height: 24px; } .article-table-wrap { overflow-x: auto; } .div1 .project-item a { width: 100%; } .div1 .project-item a .project-item-picture { height: 100%; } .div1 .project-item a .project-item-picture img { height: 100%; max-height: none; } .main-slider-item-pic.lg-view.lg-md-view.md-view.xs-md-view { width: 100%; } /* End */ /* Start:/local/templates/kraska/components/bitrix/menu/menu-top-information-mobile.new/style.css?1733178596581*/ /* Left menu*/ ul.left-menu { list-style:none; margin:0; padding:0; margin-bottom:8px; position: relative; /*IE bug*/ } ul.left-menu li { padding: 10px 16px; background:#F5F5F5 url(/local/templates/kraska/components/bitrix/menu/menu-top-information-mobile.new/images/left_menu_bg.gif) top repeat-x; } ul.left-menu li a { font-size:100%; color:#BC262C; font-weight:bold; text-decoration:none; } ul.left-menu li a:visited { color:#BC262C; } ul.left-menu li a:hover { color:#BC262C; } ul.left-menu li a.selected:link, ul.left-menu li a.selected:visited, ul.left-menu li a.selected:active, ul.left-menu li a.selected:hover { color:#FC8D3D; } /* End */ /* Start:/local/templates/kraska/components/bitrix/menu/header-menu-mobile.new/style.css?1733178596581*/ /* Left menu*/ ul.left-menu { list-style:none; margin:0; padding:0; margin-bottom:8px; position: relative; /*IE bug*/ } ul.left-menu li { padding: 10px 16px; background:#F5F5F5 url(/local/templates/kraska/components/bitrix/menu/header-menu-mobile.new/images/left_menu_bg.gif) top repeat-x; } ul.left-menu li a { font-size:100%; color:#BC262C; font-weight:bold; text-decoration:none; } ul.left-menu li a:visited { color:#BC262C; } ul.left-menu li a:hover { color:#BC262C; } ul.left-menu li a.selected:link, ul.left-menu li a.selected:visited, ul.left-menu li a.selected:active, ul.left-menu li a.selected:hover { color:#FC8D3D; } /* End */ /* Start:/local/templates/kraska/components/bitrix/menu/menu-top-information.new/style.css?1727892980581*/ /* Left menu*/ ul.left-menu { list-style:none; margin:0; padding:0; margin-bottom:8px; position: relative; /*IE bug*/ } ul.left-menu li { padding: 10px 16px; background:#F5F5F5 url(/local/templates/kraska/components/bitrix/menu/menu-top-information.new/images/left_menu_bg.gif) top repeat-x; } ul.left-menu li a { font-size:100%; color:#BC262C; font-weight:bold; text-decoration:none; } ul.left-menu li a:visited { color:#BC262C; } ul.left-menu li a:hover { color:#BC262C; } ul.left-menu li a.selected:link, ul.left-menu li a.selected:visited, ul.left-menu li a.selected:active, ul.left-menu li a.selected:hover { color:#FC8D3D; } /* End */ /* Start:/local/templates/kraska/components/bitrix/breadcrumb/breadcrumbs/style.css?1727892980610*/ .bx-breadcrumb { margin: 10px 0; } .bx-breadcrumb i { color: #b5bdc2; line-height: 13px; font-size: 12px; vertical-align: middle; margin-right: 5px; } .bx-breadcrumb .bx-breadcrumb-item { float: left; margin-bottom: 10px; white-space: nowrap; line-height: 13px; vertical-align: middle; margin-right: 10px; } .bx-breadcrumb .bx-breadcrumb-item span { font-family: "Open Sans", Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 13px; white-space: normal; } .bx-breadcrumb .bx-breadcrumb-item a {border-bottom: none;} .bx-breadcrumb .bx-breadcrumb-item a:hover {} /* End */ /* Start:/local/templates/kraska/components/bitrix/sender.subscribe/footer-subscribe/style.css?17278929814924*/ .bx-subscribe { margin: 10px 0; } .bx-subscribe div.bx-block-title { font-family: "Open Sans", Arial, "Helvetica Neue", Helvetica, sans-serif; color: #343434; text-transform: uppercase; font-size: 12px; margin-bottom: 9px; font-weight: 600; } .bx-subscribe-desc { color: #aaa; font-size: 12px; position: relative; margin-top: -5px; margin-bottom: 3px; } .bx-subscribe .bx-input-group .bx-form-control { position: relative; margin-bottom: 15px; display: block; width: 100%; height: 34px; padding: 6px 12px; font-size: 14px; line-height: 1.42857143; color: #555; background-color: #F8FAFC; border: 1px solid #D5DADC; border-radius: 2px; outline: none; box-shadow: none !important; -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; } .bx-ios .bx-subscribe .bx-input-group .bx-form-control { /* Fix of input shadow for IOS browsers. */ background-image: -webkit-linear-gradient(#f8fafc 0%, #f8fafc 100%); background-image: linear-gradient(#f8fafc 0%, #f8fafc 100%); } .btn-subscribe { cursor: pointer; text-align: center; background: #70bb18; border: none; color: #fff; font-size: 13px; position: relative; text-transform: uppercase; border-radius: 2px; line-height: 30px; height: 40px; padding: 5px 60px 5px 20px; vertical-align: middle; outline: none; -webkit-transition: width 5s linear; -moz-transition: width 5s linear; -ms-transition: width 5s linear; -o-transition: width 5s linear; transition: width 5s linear; } .btn-subscribe:hover { background: #7ec629; } .btn-subscribe:before { content: " "; position: absolute; top: 0; bottom: 0; right: 0; width: 40px; background-color: #5b9f0b; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAKCAYAAACE2W/HAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MkYyNDcxQTFERjZGMTFFNDk5NTY5MzQ3QzQxRkMzMEIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MkYyNDcxQTJERjZGMTFFNDk5NTY5MzQ3QzQxRkMzMEIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDoyRjI0NzE5RkRGNkYxMUU0OTk1NjkzNDdDNDFGQzMwQiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDoyRjI0NzFBMERGNkYxMUU0OTk1NjkzNDdDNDFGQzMwQiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Plv+rHwAAADiSURBVHjajNK9asJQFMDxG42KUqFx9kEcRO1UcBCHjh3q3NXHcBEcdHQQPxY7+AaS0a1v0UEhSlu/rv+jhxIlBQ/84OTmnHuSmzjW2qExpoK9ekDcXMcRAVw1d2hckjxqwQxTJJXEDj+ooa5rK+neoocMnvGB7s3EVxQwwhdeDBMDvEPylr3EBB6yGOhaGzE0cJ5o4enOTSzQgY8D8nhDX2ty0hPTCxt6LDmsMtb6fk+hpr9a10THJ4pw8BtVII0ydRNxb/vPplLrSGNKT/Pb3BdVpOU7jklKSNzZKD+JfxJgAAV0YSAU8mZTAAAAAElFTkSuQmCC"); background-position: 50%; background-repeat: no-repeat; border-radius: 0 2px 2px 0; } .btn-subscribe span { display: block; } .btn-subscribe.send { padding: 5px 40px; -webkit-animation-name: MeilSend; animation-name: MeilSend; -webkit-animation-duration: .5s; animation-duration: .5s; outline: none; color: #fff; } .btn-subscribe:hover, .btn-subscribe:active{color: #fff;} .btn-subscribe.send:before { width: 0; background-position: 100px 50%; -webkit-animation-name: MeilSendButton; animation-name: MeilSendButton; -webkit-animation-duration: .5s; animation-duration: .5s; } @keyframes MeilSend {0%{padding:5px 60px 5px 20px}100%{padding:5px 40px}} @-webkit-keyframes MeilSend {0%{padding:5px 60px 5px 20px}100%{padding:5px 40px}} @keyframes MeilSendSpan {0%{color:transparent;}100%{color:#fff;}} @-webkit-keyframes MeilSendSpan {0%{color:transparent;}100%{color:#fff;}} @keyframes MeilSendButton {0%{width:40px;background-position:50%}100%{width:0;background-position:100px 50%}} @-webkit-keyframes MeilSendButton {0%{width:40px;background-position:50%}100%{width:0;background-position:100px 50%}} .bx_subscribe_response_container { padding: 40px; color: #35414E; } .bx_subscribe_checkbox_container { line-height: 16px; font-size: 13px; margin-bottom: 3px; vertical-align: middle; color: #aaa; } .bx-sender-subscribe-agreement .main-user-consent-request a { font-weight: 100; font: 11px/10px "Open Sans", Arial, "Helvetica Neue", Helvetica, sans-serif; } /* End */ /* Start:/local/templates/kraska/components/bitrix/menu/footer-menu-static/style.css?1727892980625*/ /* Left menu*/ ul.left-menu { list-style:none; margin:0; padding:0; margin-bottom:8px; position: relative; /*IE bug*/ } ul.left-menu li { padding: 10px 16px; background:#F5F5F5 url(/local/templates/kraska/components/bitrix/menu/footer-menu-static/images/left_menu_bg.gif) top repeat-x; } ul.left-menu li a { font-size:100%; color:#BC262C; font-weight:bold; text-decoration:none; } ul.left-menu li a:visited { color:#BC262C; } ul.left-menu li a:hover { color:#BC262C; } ul.left-menu li a.selected:link, ul.left-menu li a.selected:visited, ul.left-menu li a.selected:active, ul.left-menu li a.selected:hover { color:#FC8D3D; } /* End */ /* Start:/local/templates/kraska/styles.css?1727892981769*/ .main-user-consent-request-popup {z-index: 99993;} .simpleforms-form .form-content .form-field .form-button {background-color: #69728c; min-width: 230px;} .simpleforms-form .form-container {padding: 0 !important;} iframe.cmn-frame{ right: auto !important; } input.error, textarea.error { border: 1px solid #A13944 !important; } input.valid, textarea.valid { border: 1px solid #32BEA6 !important; } label.error { background: url('/local/templates/kraska/./images/error.png') no-repeat; padding-left: 18px; margin-left: .3em; margin-top: .3em; } label.valid { background: url('/local/templates/kraska/./images/check.png') no-repeat; display: block; width: 16px; height: 16px; } /* соцсети */ .ya-share2__list.ya-share2__list_direction_horizontal { padding-left: 0; } /* End */ /* /local/templates/kraska/design/fonts/CeraPro/stylesheet.css?17278929814603 */ /* /local/templates/kraska/design/js/fancybox/jquery.fancybox.min.css?172789298112799 */ /* /local/templates/kraska/design/js/scroll/jquery.mCustomScrollbar.css?172789298154850 */ /* /local/templates/kraska/design/css/selectric.css?17278929814543 */ /* /local/templates/kraska/design/css/slick.css?17278929811807 */ /* /local/templates/kraska/design/css/style.css?1791537448185195 */ /* /local/templates/kraska/design/css/pages.css?178996308512961 */ /* /local/templates/kraska/design/css/orangato.css?178996308578123 */ /* /local/templates/kraska/design/css/correctirovka.css?178996308523027 */ /* /local/templates/kraska/design/css/kirill.css?17899630853035 */ /* /local/templates/kraska/design/css/barsik.css?179065596419772 */ /* /local/templates/kraska/components/bitrix/menu/menu-top-information-mobile.new/style.css?1733178596581 */ /* /local/templates/kraska/components/bitrix/menu/header-menu-mobile.new/style.css?1733178596581 */ /* /local/templates/kraska/components/bitrix/menu/menu-top-information.new/style.css?1727892980581 */ /* /local/templates/kraska/components/bitrix/breadcrumb/breadcrumbs/style.css?1727892980610 */ /* /local/templates/kraska/components/bitrix/sender.subscribe/footer-subscribe/style.css?17278929814924 */ /* /local/templates/kraska/components/bitrix/menu/footer-menu-static/style.css?1727892980625 */ /* /local/templates/kraska/styles.css?1727892981769 */