/* Theme Name: SiteRussia Theme URI: siterussia.ru Description: Дизайн сайта разработанный компанией Site Russia Author: Wolf Author URI: siterussia.ru Version: 1.0 */ @font-face { font-family: 'Noto Sans SemiBold'; src: url('fonts/Noto-Sans-SemiBold.woff2') format('woff2'), url('fonts/Noto-Sans-SemiBold.woff') format('woff'), url('fonts/Noto-Sans-SemiBold.ttf') format('truetype'), url('fonts/Noto-Sans-SemiBold.svg#NotoSansSemiBold') format('svg'); font-weight: bold; font-style: normal; } @font-face { font-family: 'Noto Sans'; src: url('fonts/NotoSans.woff') format('woff'), url('fonts/NotoSans.ttf') format('truetype'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Noto Sans Display SemiBold'; src: url('fonts/noto-sans-display-semi-bold.woff2') format('woff2'), url('fonts/noto-sans-display-semi-bold.woff') format('woff'); font-weight: bold; font-style: normal; } *, ::after, ::before {box-sizing: border-box;} .container{width: 100%;padding-right: 15px;padding-left: 15px;margin-right: auto;margin-left: auto;} body {margin: 0;line-height: 1.5;font-family:'Noto Sans', sans-serif!important;background-color: #f5f5f5;} article, aside, figcaption, figure, footer, header, hgroup, main, nav, section {display: block;} a{color: #fff; text-decoration: none;-webkit-tap-highlight-color: rgba(0, 0, 0, 0);outline: none;} img, svg{vertical-align: middle;} label {display: inline-block;margin-bottom: .5rem;} button, input, optgroup, select, textarea {margin: 0;font-family: inherit;font-size: inherit;line-height: inherit;-webkit-appearance: none; background-color: #d8d8d8e6;} button:active, button:focus {outline: none;} /* Убираем обводку у кнопок */ button::-moz-focus-inner {border: 0;} button.close{border: none;} p {margin-top: 0;} h1, h2, h3, h4, h5, h6 {margin-top: 0;font-weight: bold;;line-height: 1.2;} h1{font-size:55px;margin-bottom: 30px;} h2{font-size:32px;margin-bottom: 15px;} h3{font-size: 26px;margin-bottom: 15px;} /* iPad */ @media (min-width: 768px){ .col-pl-2{grid-template-columns: repeat(2, 1fr);} #slide .flex{justify-content:center;} } @media (max-width: 1200px) { .modal .modal-dialog{width: 100%;padding: 15px 20px;} .block{padding: 40px 0px;} .block h2, .block h3{font-size: 25px;line-height: 33px;} .grid{gap: 20px;} .col-m-2{grid-template-columns: repeat(2, 1fr);} .col-m-3{grid-template-columns: repeat(3, 1fr);} .o1{order: 1;} .o2{order: 2;} .form img{margin: 0px auto;} .form, .form4{padding: 20px 20px 0px 20px!important;} .form .wpcf7-form, .form2 .wpcf7-form{display: grid!important;gap: 5px;} .form .wpcf7-submit, .form2 .wpcf7-submit{margin: 0px!important;padding: 15px 20px!important;border-radius: 12px!important;} #block7 h3, .form2 h2{font-size: 25px;} #tabs{padding: 20px!important;} } @media (max-width: 992px) { #mobile .container{display: grid;grid-auto-flow: column;align-items: center;justify-content: space-between;padding-top: 15px;padding-bottom: 15px; } #mobile .container{display: flex;align-items: center;justify-content: space-between;} #mobile .logo{display: flex;align-items: center;gap: 10px;line-height: 18px;} #mobile .text {max-width: 170px; font-size: 14px; color: #707070;} #mobile .nav a {font-size: 15px; font-weight: 600; justify-content: center; display: flex; align-items: center;} #mobile.mobr .container {display: flex; flex-direction: column; gap: 10px;} .mobd {display: flex; flex-direction: column; align-items: center; gap: 10px; margin: 20px 0px;} .mobd .phone {color:#fff;} #header, #menu, #top{display: none!important;} #za{background-color: #454545 !important;} #za .poly{margin-bottom: 20px;} #mmenu{background-color: #454545;} #mmenu .modal-dialog{background-color: #454545;} #mmenu .nav{display: inline-block;width: 100%;padding-top: 15px;list-style: none;margin-bottom: 10px;} #mmenu .nav>ul{padding: 0px;} #mmenu .nav>li{padding: 10px 0px;list-style: none;} #mmenu .nav>li>a{display: flex; justify-content: center; align-items: flex-end;} #mmenu .nav.mobusl>li>a {font-weight: 600;} #mmenu .nav .sub-menu{padding-top: 10px;} #mmenu .nav .sub-menu>li{padding: 10px 0px;list-style: none;} #mmenu .nav ul.hide {display: none!important;} #mmenu .nav .menu-item-has-children {position: relative;} #mmenu .nav span.menu-closed:after {content: "";width: 50px;max-height: 50px;position: absolute;right: 0;top: 6px;bottom: 6px;background-image: url('images/marrow.svg');background-size: 12px 7px;background-position: center;background-repeat: no-repeat;transform-origin: center;transform: rotate(-90deg);-webkit-transition: transform 0.4s cubic-bezier(0, 0.5, 0.5, 1), opacity 0.3s cubic-bezier(0, 0.5, 0.5, 1);transition: transform 0.4s cubic-bezier(0, 0.5, 0.5, 1), opacity 0.3s cubic-bezier(0, 0.5, 0.5, 1);} #mmenu .nav span.menu-closed:before {content: "";position: absolute;right: 50px;top: 6px;bottom: 6px;border-left: 1px solid #F8F8F8;} #mmenu .nav span.menu-closed.menu-open:after{transform: rotate(0deg);opacity: 0.3;} #mmenu .nav span.menu-closed.menu-open:before{opacity: 0;} #mmenu .cont{display: grid;} #mmenu .cont .phone{font-weight: bold;font-size: 20px;margin: 10px 0px;} #mmenu .cont .ad{margin: 10px 0px;} #mmenu .cont .mail{color: #fd5354;margin-top: 10px;} #mmenu .soc{margin-top: 20px;} #mmenu .kvart{margin-top: 20px;} h1{font-size:30px;} h2{font-size:25px;} h3{font-size: 22px;} } /* iPhone 5 */ @media (max-width: 321px){ .modal .modal-dialog {width: 100%;padding: 20px 15px 20px 0px!important;} .modal .modal-dialog .button{width: 100%;padding: 20px!important;} #mobile .text {font-size: 10px!important;} .block h2, .block h3{font-size: 26px;line-height: 28px;} } @media (min-width: 991px) { .container{max-width: 1260px;} #mobile{display: none!important;} .modal .modal-dialog{max-width: 500px; height: 110%; padding: 30px; position: absolute; right: 0; margin: 0px; background: #454545;} .wpcf7 .wpcf7-form .wpcf7-response-output {display: block!important; padding-top: 20px;} .block{padding: 50px 0px; background: linear-gradient(to bottom, #ffffff, #f7f7f7);} .block h2{font-size: 30px;margin-bottom: 30px;} .grid{gap: 30px;} .col-pc-2{grid-template-columns: repeat(2, 1fr);} .col-pc-3{grid-template-columns: repeat(3, 1fr);} .col-pc-4{grid-template-columns: repeat(4, 1fr);} .col-pc-5{grid-template-columns: repeat(5, 1fr);} .col-pc-6{grid-template-columns: repeat(6, 1fr);} .col-pc-7{grid-template-columns: repeat(7, 1fr);} .col-pc-1-2{grid-template-columns: 1fr 2fr;} .col-pc-07-2{grid-template-columns: 0.7fr 2fr;} .col-pc-2-07{grid-template-columns: 2fr 0.7fr;} .col-pc-2-1 {grid-template-columns: 2fr 1fr;} .col-pc-2-3 {grid-template-columns: 2fr 3fr;} .col-pc-3-7 {grid-template-columns: 3fr 7fr;} .col-pc-15-1 {grid-template-columns: 1.5fr 1fr;} .col-pc-15-25 {grid-template-columns: 1.5fr 2.5fr;} .col-pc-1-01-2{grid-template-columns: 1fr 0.1fr 2fr;} #slide {padding: 40px 0;} } :root{ --main-color: #000; --hover-color: #f5e642; --gray-color: #6C6F71; } /* Дата для мобильного */ input[type="date"]:before {color: lightgrey;content: attr(placeholder) !important;margin-right: 0.5em;} input[type="date"]:focus:before {content: '' !important;} /* Кнопка вверх */ .btn-back-top {opacity: 0;background: #eed14c;border-radius: 2px;cursor: pointer;display: block!important;width: 45px;height: 45px;position: fixed;right: 15px;bottom: 15px;transition: .5s;z-index: 1030;} .btn-back-top:hover{opacity: 1!important;} .btn-back-top:before {border-radius: 4px;border-color: #fff;border-style: solid;border-width: 5px 0 0 5px;content: "";width: 17px;height: 17px;position: absolute;top: 17px;left: 15px;transform: rotate(45deg);} /* Кнопка вотсап */ .whatsapp-button{position: fixed;left: 70px;bottom: 70px;background: #25D366;border-radius: 50%;width: 65px;height: 65px;z-index: 9999;display: flex;align-items: center;justify-content: center;box-shadow: 0px 0px 11px rgb(37 211 102);} .whatsapp-button:before, .whatsapp-button:after {content: " ";display: block;position: absolute;border: 50%;border: 1px solid #25D366;left: -20px;right: -20px;top: -20px;bottom: -20px;border-radius: 50%;animation: animate 1.5s linear infinite;opacity: 0;backface-visibility: hidden; } .whatsapp-button:after{animation-delay: .5s;} @keyframes animate{0%{transform: scale(0.5);opacity: 0;}50%{opacity: 1;}100%{transform: scale(1.2);opacity: 0;}} @media (max-width: 921px) {.whatsapp-button {bottom: 10px!important;left: 10px;}} .img-fluid { max-width: 100%; border-radius: 25px;} .aligncenter{display: block;margin: 5px auto 5px auto;} .alignright{float:right;padding-left: 10px;padding-bottom: 10px;} .table {width: 100%;margin-bottom: 1rem;color: #212529;border-collapse: collapse;} .table td, .table th {padding: 0.75rem;vertical-align: top;border-top: 1px solid #dee2e6;} .table-responsive{display:block;width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch} .table-striped tbody tr:nth-of-type(odd) {background-color: rgba(0,0,0,.05);} .p404{text-align: center;padding: 50px 0px;} .grid{display: grid;} .ac{align-items: center;} /* Табы */ .nav {display: flex;flex-wrap: wrap;padding: 0;margin: 0;list-style: none;outline: none;} .nav-link:focus, .nav-link:hover {text-decoration: none;} .nav-link {display: block;} .tab-content>.tab-pane {display: none;} .tab-content>.active {display: block;} .fade {transition: opacity .15s linear;} .fade:not(.show) {opacity: 0;} /* Пролистывание на мобильном */ .scroll{flex-wrap: nowrap;overflow-x: auto;-webkit-overflow-scrolling: touch;white-space: nowrap;} .scroll::-webkit-scrollbar {height: 2px;-webkit-appearance: none;} .scroll::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);} .scroll::-webkit-scrollbar-thumb {background: #AAC375;} /* Гармошка */ .collapse:not(.show) {display: none;} .collapsing {position: relative;height: 0;overflow: hidden;transition: height .35s ease;} /* Модальное */ .modal {position: fixed; top: 0; left: 0; z-index: 1050; display: none; width: 100%; height: 100%; overflow: hidden; outline: 0;} .modal-body {padding: 0!important;} .modal-content {background-color: #454545!important; border: none!important; } .modal-scrollbar-measure{position:absolute;top:-9999px;width:50px;height:50px;overflow:scroll} /*Нужно что бы не прыгало */ .modal-open {overflow: hidden;} .modal-open .modal {overflow-x: hidden;overflow-y: auto;} .full {background-color: #f3f3f3; max-width: 100%!important;} .modal .close{cursor: pointer;position: absolute;top: -10px; right: 5px;border: none; background-color: #454545;} .modal .grid{gap: 20px;} .modal .title{color:#fff;font-size: 30px;line-height: 55px;font-weight: bold;} .modal .text{color: #e9e9e9;font-size: 20px;line-height: 35px;} .modal .uk {background-color: #252525; padding: 10px 30px 10px 185px; font-weight: 600; margin-left: -155px; border-radius: 0 30px 30px 0; color: #fff;} .modal p {font-weight: 600; padding-bottom: 10px;} .modal div.st {padding: 10px 0;} .modal-dialog.h100 {background-color: #f3f3f3;} /* Анимация при наведении на картинку */ .box {overflow:hidden;} .box img {-moz-transition: all 0.25s ease-out;-o-transition: all 0.25s ease-out;-webkit-transition: all 0.25s ease-out;transition: all 0.25s ease-out;} .box img:hover{-webkit-transform: scale(1.1);-moz-transform: scale(1.1);-o-transform: scale(1.1);transform: scale(1.1);} /* Хлебные */ .breadcrumbs {color: var(--main-color);font-size: 14px;padding-bottom: 10px;} .breadcrumbs a{color: var(--main-color);border-bottom: 1px solid;} /* Слайдер */ .owl-nav .disabled{display: none;} .owl-controls{display: flex; justify-content: center; margin-top: 20px;} .owl-controls svg path{opacity: 0.5;} .owl-controls svg:hover path{opacity: 1;} .owl-controls .owl-next, .owl-controls .owl-dots{margin-left: 30px;} .owl-dot span {width: 10px;height: 10px;margin: 0px 5px;background: #D6D6D6;display: block;-webkit-backface-visibility: visible;border-radius: 30px;} .owl-dot.active span, .owl-dots .owl-dot:hover span {background: var(--hover-color);} .owl-nav button {opacity: 0.85;} .owl-nav button:hover {opacity: 1;} /* Форма связи */ .wpcf7{position: relative;} /*.wpcf7 .wpcf7-form{display: grid;gap: 20px;}*/ .wpcf7 .wpcf7-not-valid-tip, .wpcf7 .screen-reader-response, .wpcf7 .wpcf7-form .wpcf7-spinner, .wpcf7 .wpcf7-form .wpcf7-response-output{display: none;} .wpcf7 .wpcf7-form-control.wpcf7-not-valid{border: 1px solid red!important;} .wpcf7 .wpcf7-form.invalid .wpcf7-response-output{display: block;font-size: 14px;color: red;font-weight: 500;} .wpcf7 .wpcf7-form.sent .wpcf7-response-output{display: block;font-size: 14px;color: green;font-weight: 500;border: 2px solid green;padding: 10px;text-align: center;background-color: #00800005;} .wpcf7 .wpcf7-text, .wpcf7 .wpcf7-mask, .wpcf7 .wpcf7-textarea{border: none;border-bottom: 1px solid #54556078;padding: 10px 0px;width: 100%;outline: none;} .wpcf7 .wpcf7-form.submitting .wpcf7-spinner {display: block;background-image: url(images/ajax-loader.gif);width: 24px;height: 24px;position: absolute;bottom: -25px;} .wpcf7 .wpcf7-submit{cursor: pointer;border: none;} .wpcf7 input::placeholder,.wpcf7 textarea::placeholder { color: #fff; opacity: 1; font-size: 14px; font-family: inherit;} /* Другое */ .ppage{min-height: 500px;padding-top: 20px;padding-bottom: 20px;} .phone{white-space: nowrap;} .h100{display: flex;align-items: center;} /* Кнопка */ .grad-button {position: relative; display: inline-flex; align-items: center; text-align: center; width: 222px; margin-right: 15px;} .grad-button__link {width: 210px; padding: 10px 25px; background: linear-gradient(90deg, #e6b800, #f0d65c); border-radius: 30px; color: white; font-weight: 600; } .grad-button__link:hover {background: linear-gradient(90deg, #f0d65c, #e6b800); transform: translateY(-2px);} .grad-button::after {content: "";display: grid;gap: 6px;position: absolute;right: -15px;top: 50%;transform: translateY(-50%);width: 15px;height: 35px;background: url('data:image/svg+xml;utf8,') no-repeat center;} /* Круги */ .green {background-color: #f0d65c;} .d-green {background-color: #b9a100;} .blue {background-color: #e6b800;} .citylist a:hover{color: var(--hover-color);} .citylist ul{gap: 0px 20px;} /* Анимация */ a{-webkit-transition: all 0.25s ease-out;transition: all 0.25s ease-out;text-decoration: none;} /*HOVER*/ #top a:hover, #header .phone:hover, #footer .menu a:hover, #menu .nav a:hover, #cont .con a:hover, a.phone:hover, #form2 a.phone:hover{color: var(--hover-color)!important;} .grad-button, button, #form2 .grad-button__link {transition: all 0.5s;} h1 span, h2 span, h3 span{color: var(--hover-color);display: block;} .prob{height: 40px;} a.phone {color: var(--title-color); font-size: 18px; font-weight: 600; display: flex; align-items: center; gap: 5px;} .time{font-size: 15px;color: #f5f5f5; font-weight: 600;} @media (max-width: 991px) {#mobile .time {color: #000;}} #top{background-color: #454545;font-size: 15px;padding: 15px 0px;} #top .container{display: flex;align-items: center;justify-content: space-between;} #top .nav{gap: 55px;} #top .ad{display: flex;gap: 30px;} #top .ad .city:before, #mmenu .city:before{content: ' ';background-image: url(images/loc.svg);width: 14px;height: 14px;} #header{padding: 20px 0px;} #header .container{display: flex;align-items: center;justify-content: space-between;} #header .logo{display: flex;align-items: center;gap: 30px;line-height: 18px;} .logo img {border-radius: 0;} #header .text {max-width: 250px; font-size: 14px; line-height: 1.1; color: #707070; cursor: pointer;} #header span.uli {color: #f5e642;} #header span.uli:hover {color: var(--main-color);} #header .r{display: flex;align-items: center;gap: 20px;} #header .zvon{color: var(--hover-color);border-bottom: 1px solid #F7E56520;} #header .zvon:hover{color: var(--main-color)!important;} #menu {background-color: #454545;} #menu .container {display: flex; align-items: center; gap: 40px;} #menu .uk {background-color: #252525; border-right: 1px solid; padding: 15px 30px 0 100%; margin-left: -100%; border-radius: 0 30px 30px 0; font-weight: 600; flex-shrink: 0; color: #fff;} #menu div p {font-weight: 600; margin-bottom:13.5px;} #menu .nav {display: flex; flex-grow: 0.8; justify-content: space-between; } #menu .nav li {display: inline; position: relative;} #menu .nav a {font-size: 15px; font-weight: 600; justify-content: center; display: flex; align-items: center; padding: 5px;} #menu ul.sub-menu {display: none;} #menu .nav li:hover > ul.sub-menu { display: flex !important; } #menu ul.sub-menu {position: absolute; top: 30px; z-index: 11; right: -100px; flex-direction: column; align-items: flex-start; background: #f3f3f3; padding: 10px 20px; border: 1px solid #cbcbcb; border-radius: 20px;background: #2c2c2c; padding: 12px 18px; } #menu ul.sub-menu li a { font-size: 14px;font-weight: 500; color: #f1f1f1; padding: 8px 12px; border-radius: 10px; transition: background 0.2s ease, color 0.2s ease; display: block;} #menu ul.sub-menu li a:hover { background: #3a3a3a; color: #e6b800;} .menu-burenie a:before {content: ''; display: inline-block; width: 22px; height: 22px; background: url('images/burenie.svg') no-repeat center; margin-right: 8px;} .menu-kopka a:before {content: ''; display: inline-block; width: 22px; height: 22px; background: url('images/kopka.svg') no-repeat center; margin-right: 8px;} .menu-remont a:before {content: ''; display: inline-block; width: 22px; height: 22px; background: url('images/remont.svg') no-repeat center; margin-right: 8px;} .menu-chistka a:before {content: ''; display: inline-block; width: 22px; height: 22px; background: url('images/chistka.svg') no-repeat center; margin-right: 8px;} .menu-uglublenie a:before {content: ''; display: inline-block; width: 22px; height: 22px; background: url('images/uglublenie.svg') no-repeat center; margin-right: 8px;} .menu-vodosnabzhenie a:before {content: ''; display: inline-block; width: 22px; height: 22px; background: url('images/vodosnabzhenie.svg') no-repeat center; margin-right: 8px;} #block1{position: relative; z-index: 1; color: White;} #block1::after{content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: black; opacity: 0.6;} #block1 .container{ position: relative; z-index: 3; padding: 55px 15px 0;} @media (min-width: 1025px) {#block1 .container {padding: 110px 20px 30px;}} #block1 .item{padding: 30px; margin-top: 15px; background-color: white; color: black !important;} #block1 .title{color: rgba(0,0,0,1);font-size: 20px;font-weight: 600; margin-top: 10px;} #block1 .ptitle{color: #515151; opacity: 0.8;} #block1 .btn1{display: inline-block; color: white; background-color: #076cbf; border-color: transparent;} #block1 .btn1:hover{background-color: black;} #block1 .flex{display: flex; gap: 40px;gap: 20px; justify-content: center; margin-top: 15px; margin-bottom: 40px;} #block1 .flex.mess {display: flex; gap: 20px; justify-content: center; margin-bottom: 60px; margin-top: -35px;} #block1 .flex.mess .phone {font-size: 24px;} #block1 .btn2{color: white; border-color: white;} #block1 .stitle{ color: rgba(255,255,255,0.6);font-size: 24px;font-weight: 400;} @media(max-width:991px) {#block1 .flex{flex-direction: column; align-items: center;} #block1 .flex.mess {flex-direction: row; margin-top: -25px;} #block1 .flex.mess img {width: 40px;} #block1 .flex.mess .phone {font-size: 20px;} #block1 p {font-size: 18px; line-height: normal;}} #block2 {background-color: background: linear-gradient(to bottom, #ffffff, #f7f7f7);; padding: 60px 0;} #block2 .grid {display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 30px; } #block2 .item {padding: 30px; background-color: #ffffff; color: #2b2b2b !important;border: 2px solid #e0e0e0; text-align: center; border-radius: 16px; box-shadow: 0 10px 30px rgba(0,0,0,0.05); transition: transform 0.3s ease, box-shadow 0.3s ease;} #block2 .item:hover {transform: translateY(-6px); box-shadow: 0 15px 35px rgba(0,0,0,0.08);} #block2 img {width: 60px; margin: 0 auto 20px; filter: grayscale(100%) brightness(0.7);} #block2 .title {color: #2b2b2b; font-size: 20px; font-weight: 600; margin-top: 10px;} #block2 .ptitle {color: #888; font-size: 15px; margin-top: 8px; opacity: 0.9;} #block2 .line {width: 40px; height: 4px; background-color: #e6b800; border-radius: 2px; margin: 12px auto 0;} @media (min-width: 1025px) {#block2 {margin-top: -150px; z-index: 5; position: relative;} #block2 .grid {margin-top: -100px;}} #inf .grid {align-items: center;} #inf .col-lg-6 {width: 100%; height: auto; position: relative;} #inf .t-dots {position: relative;} #inf .t-dots svg {position: absolute; top: 20px; left: 20px; z-index: 1;} #inf .i-dots {position: absolute; top: 20px; left: 20px;} #inf .image { width: auto; max-height: 450px; object-fit: cover;} #inf .t-dots {margin: 30px 0} #inf h3 {font-size: 16px;} @media (max-width: 991px) {#inf .t-dots svg {top: 30px; left: 30px;} } @media (max-width: 991px) {#inf .grid {display: flex; flex-wrap: wrap; flex-direction: column-reverse; }} #poch {position: relative;} #poch::before {content: ""; position: absolute; bottom: 0; width: 100%; height: 30%; background: linear-gradient(to right, #e6b800, #f0d65c); z-index: -2;} #poch div.pm {display: flex; justify-content: space-between; align-items: baseline;} #poch .premt {width: 85%; margin-bottom: 40px;} #poch .poly {margin-bottom: 30px;} #poch .card {height: 100%; background-color: #fff; border: 2px solid #e0e0e0; padding: 24px; border-radius: 25px; box-shadow: 0 10px 25px rgba(0,0,0,0.05); transition: transform 0.3s ease, box-shadow 0.3s ease;} #poch .card:hover {transform: translateY(-4px); box-shadow: 0 15px 35px rgba(0,0,0,0.08);} #poch .card .icon {display: flex; text-align: center; gap: 15px; align-items: center; flex-direction: column;} #poch .card .icon img {/*filter: grayscale(100%) brightness(0.8);*/ max-width: 60px;} #poch .card .p-text {color: #555; font-size: 15px; line-height: 1.6; margin-top: 10px;} #poch h3 {font-size: 16px; margin-bottom: 0; font-weight: 600; color: #2c2c2c;} @media (max-width: 991px) {#poch::before {height: 46%;} #poch .poly {margin-bottom: 20px;} #poch h2 {width: 80%;} #poch .premt {width: 100%; margin-bottom: 10px;} #poch .cards {gap: 0;}} #services h2 {text-align: center; margin-bottom: 20px; color: #072226;} #services .t-dots {display: flex; justify-content: center; margin-bottom: 30px;} #services .card-item {gap: 0; margin-bottom: 30px;} #services .image {width: 100%; height: 100%; overflow: hidden;} #services .image img {width: 100%; height: 100%; object-fit: cover; border-radius: 16px;} #services .content {border: 1px solid #e0e0e0; background: #fff; padding: 25px; border-radius: 25px; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.04);} #services .content h3 {font-size: 18px; margin-bottom: 20px; font-weight: 600; color: #072226;} #services .advantages {list-style: none; padding: 0; margin: 0;} #services .advantages li {display: flex; align-items: center; margin-bottom: 12px;} #services .advantages li p {width: 90%; margin-bottom: 0;} #services .description span {color: #707070;} #services .description p {margin-top: 10px; color: #333;} #services .dot {width: 10px; height: 10px; border-radius: 50%; display: inline-block; margin-right: 10px;} .green {background-color: #f0d65c;} .d-green {background-color: #b9a100;} .blue {background-color: #e6b800;} #services .pb {display: flex; justify-content: flex-end; align-items: center; gap: 20px;} #services .pb .price {font-size: 18px; font-weight: 600; color: #e6b800;} #services .pb .coll {font-weight: 600; color:#000;} #services .pb .grad-button__link {background: linear-gradient(90deg, #e6b800, #f0d65c); color: white; border-radius: 30px; padding: 10px 25px; font-weight: 600;} #services .pb .grad-button__link:hover {background: linear-gradient(90deg, #f0d65c, #e6b800); transform: translateY(-2px);} @media (max-width: 991px) { #services .image img {height: 250px;} #services .content h3 {text-align: center;} #services .details {padding: 0 20px;} #services .description p {margin-bottom: 30px;} #services .pb {gap: 20px; flex-direction: column;} } #pricing .title {display: flex; gap: 20px; justify-content: space-between; align-items: baseline;} #pricing .title h2 {font-size: 32px; font-weight: 700; color: #072226;} #pricing .title .t-dots {display: flex;} #pricing .table-wrapper { overflow-x: auto; border-radius: 20px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05); background: #fff; padding: 10px;} /* Таблица */ .price-table {width: 100%;border-collapse: separate; border-spacing: 0 12px; font-family: inherit;} .price-table thead tr { background-color: #fdfbf5;} .price-table th { padding: 16px 20px; font-size: 18px; text-align: center; background-color: #fff; font-weight: 700; color: #072226; border-radius: 16px; border-bottom: 2px solid #e6b800;} .price-table td {padding: 16px 20px;font-size: 17px;text-align: center; background-color: #ffffff; color: #333; border-radius: 16px; border: 1px solid #e5e5e5; position: relative;} .price-table td.free, .price-table td.gold {color: #e6b800;font-weight: 600;} .price-table td.dark { background: #072226; color: #fff;} .price-table td.gold::before { content: ""; position: absolute; left: 0; top: 10%; bottom: 10%; width: 4px; background: #e6b800; border-radius: 2px;} .price-table tbody tr:hover { background-color: #fafafa;} @media (max-width: 991px) {#pricing .container {background: none;}#pricing .title {flex-direction: column; align-items: flex-start;} .price-table {margin-left: 0; font-size: 16px;}} @media (max-width: 768px) {.price-table th, .price-table td {font-size: 15px; padding: 14px;}} #cons .grid {align-items: center; gap: 0;} #cons .title {text-align: center; margin-bottom: 40px; color: #fff;} #cons .right-content {background: url(images/cont.svg); background-repeat: no-repeat; background-position: -30px -26px; height: 100%; background-color: #454545; align-content: center; padding: 20px; border-radius: 25px;} #cons .right-content h3 {font-size: 30px; padding: 0 115px;} #cons .pb, .sv, .tw, .ve {display: flex; gap: 15px; align-items: center;} #cons .pb { display: flex; justify-content: center; align-items: center; gap: 20px; background: linear-gradient(90deg, #fdf8e4, #e6b80020); padding: 20px 30px; border-radius: 20px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);} #cons .contact-info {display: flex; justify-content: space-around; gap: 15px;} #cons .sv img {width: 45px;} #cons .phone-number {display: block; font-size: 18px; margin-bottom: 10px; color: #333;} @media (max-width: 991px){#cons .title {text-align: center; margin-bottom: 20px;} #cons .left-content {margin-top: -38px;} #cons .right-content {background-image: none; grid-row: 1; border-radius: 25px 25px 0 0;} #cons .right-content h3 {font-size: 20px; padding: 0; margin-bottom: 0;} #cons .pb, .sv, .tw, .ve {flex-direction: column;} #cons .tw, .ve {flex-direction: row;} #cons .contact-info {flex-direction: column-reverse; gap: 15px;} } #text4 .info {background: #fff; box-shadow: 0 10px 30px rgba(0,0,0,0.06); padding: 25px; border-radius: 20px; position: relative;} #text4 .info::before {content: ""; position: absolute; left: 0; top: 25px; width: 4px; height: calc(100% - 50px); background: #e6b800; border-radius: 3px;} #text4 .info .text {padding-left: 20px; font-size: 16px; line-height: 1.6; color: #222;} #text4 .block-img {height: 100%;} #text4 .block-img img {border-radius: 20px; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05); width: 100%; height: 100%; object-fit: cover;} #text4 .grid {align-items: center; gap: 30px;} #text4 .tline .st {color: #e6b800; font-weight: 600; font-size: 18px; margin-bottom: 10px;} #text4 .tline h2 {font-size: 32px; font-weight: 700; color: #072226;} @media (min-width: 992px) {#text4 .grid {grid-template-columns: 1fr 1fr 1fr;}} @media (min-width: 992px) {.block .tline {position: relative; padding-left: 50px;}} @media (min-width: 992px) {.block .tline::before {content: ""; position: absolute; width: 40px; height: 4px; top: 88%; background: #e6b800; left: 0; transform: translateY(-50%); border-radius: 2px;}} #faq .title {display: flex; gap: 20px; align-items: baseline; margin-top: 22px; transition: 1s;} #faq .title .t-dots {display: flex;} #faq .form-wrapper {background: linear-gradient(135deg, #ffffff, #f9f9f9);border: 2px solid #e6b800;box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);padding: 30px;border-radius: 25px;display: flex; flex-direction: column; align-items: center;} #faq p.fw {font-weight: 600; font-size: 18px; margin-bottom: 30px; color: #072226; display: flex;align-items: center; background: #fff8e1; border: 2px solid #e6b800; border-radius: 20px; padding: 20px; gap: 15px;box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);text-align: center; margin-bottom: -0px;} #faq .vopr .phone, #faq .vopr .mail {font-size: 20px; font-weight: 600; color: #e6b800;} .wpcf7 .wpcf7-text, .wpcf7 .wpcf7-mask, .wpcf7 .wpcf7-textarea {border-radius: 25px; padding: 20px!important; margin-top: 10px; font-size: 16px; } .modal .wpcf7 .wpcf7-text, .wpcf7 .wpcf7-mask, .wpcf7 .wpcf7-textarea { background-color: #a9a9a9e6;} .form-group {margin-bottom: 25px;} .form-group label {font-size: 18px; font-weight: 600; color: #333;} .form-group textarea {resize: none; height: 180px;} #faq .bw {display: flex; justify-content: center;} #accordion .card {margin-bottom: 15px;} #accordion .card > a {font-weight: 600; font-size: 18px; background: #fff; color: #072226; padding: 25px 30px; border: 3px solid #f3f3f3; border-radius: 25px; text-decoration: none; display: flex; justify-content: space-between; align-items: center; transition: 0.3s;} #accordion .card > a:hover {border-color: #e6b800; background: #fff8e1;} #accordion .card .collapsed:after {content: url('images/arr.svg'); margin-left: 10px;} #accordion .tr {padding: 20px 30px; font-size: 16px; background: #fff; border: 3px solid #f3f3f3; border-radius: 25px; color: #444; margin-top: 10px; transition: 0.3s;} #accordion .collapse.show {margin-bottom: 10px;} @media (max-width: 991px) { #faq .title {justify-content: space-between;} #faq .form-wrapper {padding: 20px;} .form-group textarea {height: 140px;} #accordion .card > a {padding: 20px;} #accordion .tr {padding: 15px 20px;} } #faq .contact-cards {display: flex; flex-direction: column; gap: 20px;} #faq .contact-card {display: flex; align-items: center; background: #fff; border: 2px solid #e6b800; border-radius: 20px; padding: 20px; gap: 15px; box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05); } #faq .contact-card img {width: 36px; height: 36px;} #faq .contact-card svg.imgs {width: 40px;} #faq .contact-card .label {font-weight: 600; margin: 0 0 4px; font-size: 16px; color: #072226;} #faq .contact-card a {color: #e6b800; font-weight: 600; text-decoration: none; font-size: 16px;} #faq .contact-card a:hover {color:#f5e642} #faq .contact-card.socials .icons {display: flex; gap: 10px;} #faq .contact-cards.sticky {position: sticky; top: 80px; z-index: 2;} @media (min-width: 991px) {#faq .contact-cards {position: sticky; top: 0; height: max-content;}} #text.ttwo {background: #f5f5f5!important;} #text.block.ttwo {padding: 5px 0 10px!important;} #text .title {display: flex; gap: 20px; align-items: baseline; margin-top: 22px;} #text .title .t-dots {display: flex; } #text h2 { padding-top: 10px;} #text h3 { font-size: 18px; padding: 10px 0;} #text p { margin: 20px 0; width: 70%;} #text.ttwo p {margin: 20px 0; width: 100%!important;} #text ul { list-style-type: none; padding-left: 0; } #text ul li { position: relative; padding-left: 15px; margin-bottom: 10px; } #text ul li::before { content: ""; position: absolute; left: 0; top: 9px; width: 5px; height: 5px; background-color: #f5e642; border-radius: 50%; } @media (max-width: 991px) {#text p {width: 100%;}} #tags {background-color: #f9f9f9; padding: 60px 0;} #tags h2 {text-align: center; font-size: 32px; color: #072226; margin-bottom: 40px; position: relative;} #tags .grid {gap: 20px; justify-content: center;} #tags .link {padding: 16px 25px; border-radius: 15px; border: 1.5px solid #e6b800; color: #072226 !important; font-size: 16px; font-weight: 600; background: #fff; box-shadow: 0 4px 15px rgba(0,0,0,0.05); transition: all 0.4s ease; display: inline-block; text-align: center;} #tags .link:hover { background: linear-gradient(90deg, #e6b800, #f5e642); color: #072226 !important; transform: translateY(-3px); box-shadow: 0 8px 20px rgba(0,0,0,0.08);} #rait {background-color: #f9f9f9; padding: 60px 0;} #rait h2 {text-align: center; font-size: 36px; color: #072226; margin-bottom: 50px; position: relative;} #rait .rait-row {display: grid; grid-template-columns: 1fr 1fr; gap: 30px; align-items: center; margin-bottom: 50px;} #rait .rait-img img {border-radius: 20px; max-height: 450px; width: 100%; object-fit: cover; box-shadow: 0 10px 30px rgba(0,0,0,0.08);} #rait .rait-content {display: grid; gap: 20px; background: #dedede; border-left: 4px solid #e6b800; padding: 30px; border-radius: 20px; box-shadow: 0 8px 20px rgba(0,0,0,0.08);} #rait .rait-content.right {/*justify-items: end;*/ border-left: none; border-right: 4px solid #e6b800;} #rait .rait-icon {width: 45px; height: auto; /*filter: brightness(0) invert(1);*/} #rait .rait-text {font-size: 20px; font-weight: 700; color: #000;} #rait .rait-desc {font-size: 16px; color: #595959; line-height: 1.7;} @media (max-width: 768px) { #rait .container {display: grid; gap: 30px;} #rait .rait-row {grid-template-columns: 1fr; gap: 20px;} #rait .rait-content {order: 1; justify-items: start; text-align: left;} #rait .rait-img {order: 2;} #rait .rait-content.right {border-right: none; border-left: 4px solid #e6b800; /*justify-items: start; text-align: left;*/} } #ti h2 {text-align: center;} #ti .grid { gap: 5px; } #ti .grid.reverse {direction: rtl;} #ti .text {padding: 20px; display: flex; flex-direction: column; justify-content: flex-start;} #ti .text .dots {margin-bottom: 15px;} #ti .text h3 { font-size: 16px; margin: 20px 0;} #ti .img img {height: 350px; width: 100%; object-fit: cover; } @media (max-width: 991px) {#ti .text {grid-row: 1;}} #rews {position: relative; padding: 60px 0; background-color: #f9f9f9;} #rews::before {content: ""; position: absolute; bottom: 0; width: 100%; height: 30%; background: linear-gradient(to right, #e6b800, #f0d65c);} #rews h2 {text-align: center; font-size: 32px; font-weight: 700; color: #072226; margin-bottom: 30px; position: relative;} #rews .t-dots img {display: block; margin: 0 auto 30px;} #rews .poly {margin-bottom: 30px;} #rews .card {height: 100%; background-color: #fff; border: 2px solid #e0e0e0; padding: 24px; border-radius: 25px; box-shadow: 0 10px 25px rgba(0,0,0,0.05); transition: transform 0.3s ease, box-shadow 0.3s ease;} #rews .card:hover {transform: translateY(-4px); box-shadow: 0 15px 35px rgba(0,0,0,0.08);} #rews .card .user {display: flex; align-items: center; gap: 15px; padding-bottom: 20px; border-bottom: 1px solid #e0e0e0; margin-bottom: 20px;} #rews .card .user img {width: 45px; height: 45px; border-radius: 50%; filter: grayscale(100%) brightness(0.85);} #rews .card .user div {font-size: 18px; font-weight: 600; color: #2c2c2c;} #rews .card .p-text {font-size: 15px; color: #555; line-height: 1.6;} #rews .owl-nav {position: absolute; width: 100%; transform: translateY(-50%); display: flex; justify-content: center; gap: 90px; margin-top: 10px; pointer-events: none;} #rews .owl-nav button {background-color: #fff; width: 55px; height: 55px; border-radius: 50%; box-shadow: 0 5px 15px rgba(0,0,0,0.1); background-repeat: no-repeat; background-position: center; pointer-events: all; border: none; cursor: pointer; transition: transform 0.2s ease;} #rews .owl-nav button:hover {transform: scale(1.1);} #rews .owl-nav button.owl-prev {background-image: url('images/g-left.svg');} #rews .owl-nav button.owl-next {background-image: url('images/g-right.svg');} @media (max-width: 991px) { #rews::before {background: none;} #rews .owl-nav {justify-content: space-between; padding: 0 20px; gap: 40px;} } #kak .title {display: flex; gap: 20px; justify-content: space-between; align-items: baseline; margin-top: 22px; transition: 1s;} #kak .title .t-dots {display: flex; } #kak .num {display: flex; gap: 20px; align-items: flex-end; margin-bottom: 20px;} #kak .step h3 {font-size: 16px; font-weight: bold;} #kak .step {background: #fff; border-radius: 25px; box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05); padding: 24px; display: flex; gap: 16px; align-items: flex-start; flex-direction: column; transition: transform 0.3s ease, box-shadow 0.3s ease;} @media (max-width: 768px) {#kak .steps {grid-template-columns: 1fr 1fr; gap: 15px;} #kak .step {width: 100%;} #kak .step-number {font-size: 26px;} #kak .step p {font-size: 16px;} #kak .step-description {font-size: 12px;}} @media (max-width: 480px) {#kak .title { justify-content: space-between;} #kak .steps {grid-template-columns: 1fr;} #kak .step {width: 100%;} #kak .step-number {font-size: 22px;}} #contacts-section {background: linear-gradient(to bottom, #ffffff, #f7f7f7);; padding: 60px 0;} #contacts-section .label {display: inline-block; background: #fff8e1; color: #e6b800; padding: 6px 14px; border-radius: 20px; font-size: 14px; font-weight: 600; margin-bottom: 20px;} #contacts-section .title {font-size: 32px; font-weight: 700; color: #072226; margin-bottom: 40px;} #contacts-section .contacts-grid {display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: start;} #contacts-section .contacts-info {display: flex; flex-direction: column; height: 100%;} #contacts-section .contacts-cards {display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; height: 100%;} #contacts-section .contacts-card {background: #fff; border-radius: 25px; box-shadow: 0 10px 25px rgba(0,0,0,0.05); padding: 24px; display: flex; gap: 16px; align-items: flex-start; flex-direction: column; transition: transform 0.3s ease, box-shadow 0.3s ease;} #contacts-section .contacts-card:hover {transform: translateY(-4px); box-shadow: 0 15px 35px rgba(0,0,0,0.08);} #contacts-section .contacts-icon {width: 32px; height: 32px; flex-shrink: 0; margin-top: 4px; /*filter: grayscale(100%) brightness(0.8);*/} #contacts-section .contacts-card h4 {font-size: 18px; font-weight: 700; margin-bottom: 6px; color: #072226;} #contacts-section .contacts-card p {margin: 0; font-size: 16px; color: #555;} #contacts-section .contacts-card a {color: #e6b800; text-decoration: none;} #contacts-section .contacts-card .mail a {color: #666;} #contacts-section .contacts-card a:hover, .contacts-card .mail a:hover {color: #000;} #contacts-section .contacts-map iframe {border-radius: 25px; width: 100%; height: 100%; min-height: 400px;} @media (max-width: 991px) {#contacts-section .contacts-grid {grid-template-columns: 1fr;} #contacts-section .contacts-cards {grid-template-columns: 1fr 1fr;}} @media (max-width: 768px) {#contacts-section .contacts-cards {grid-template-columns: 1fr;}} #footer { background: #454545 !important;; } #footer .c {grid-template-columns: 1fr 1fr 2fr;} #footer .logo { display: block; margin-bottom: 10px; } #footer .lb {gap: 0px;} #footer .lt { display: grid; gap: 15px; align-items: start;} #footer .lt.d {display: none;} #footer .buttons.b2.d {display: none;} #footer .title { font-size: 13px; line-height: 1.1; text-align: left;color: #fff;} #footer .buttons { margin-top: 20px; display: flex; flex-direction: column; gap: 10px; } #footer .buttons .grad-button { margin-bottom: 10px; } #footer .phone { font-size: 18px; font-weight: 600; display: flex; justify-content: flex-end; color: #f5e642;} #footer .phone:hover, #footer .mail:hover { color: #fff!important;} #footer .time { padding-left: 15px; } #footer .mail { color: #f5e642; font-weight: 600; display: block; } #footer .f-cont { text-align: right; gap: 10px; } #footer .soc { display: flex; justify-content: flex-end; gap: 15px; } #footer .soc img { height: 40px; } #footer ul { padding: 0; list-style: none; margin: 0; } #footer ul li { padding: 5px 0; } #footer ul li a { text-decoration: none; } #footer .poly:hover {color: #f5e642;} @media (max-width: 991px) { #footer .c {grid-template-columns: none;} #footer .container { text-align: center; } #footer .soc { justify-content: center; } #footer .lb.d {display: none;} #footer .buttons.b2.d { display: grid; margin: 5px 0 15px;} #footer .f-cont { justify-items: center; } #footer .mail { margin: 10px 0 ; } #footer .lt.d {display: grid; grid-template-columns: 0.3fr 0.5fr; justify-content: center; align-items: stretch;} } #contpage {padding: 0 0 50px;} #contpage .bold{ font-size: 25px; color: #f0d65c; white-space: nowrap;display: block;font-weight: 600; } #contpage h3{ font-size:30px;margin-bottom:10px; font-weight: 500; } #contpage .item{ margin-bottom:15px; } #serv-title h1 {padding: 20px 0; margin-bottom: -5px; border-top: 1px solid #f0d65c; border-bottom: 1px solid #f0d65c;} @media (max-width: 991px) {#serv-title h1 {margin-top: 20px;}} .cookie {color: #efd529;} .cookie:hover {color: #cab422;} .cbc {padding: 10px 0;} @media (max-width: 991px) { .cbc {margin-top: 15px; border-top: 1px solid #f0d65c;} } #cookie-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.6); /* затемнение */ z-index: 9998; display: none; transition: opacity 0.3s; } body.cookie-active #cookie-overlay { display: block; }