html
*::-webkit-scrollbar {
width: 8px;
}
*::-webkit-scrollbar-track {
background-color: #B9BFD2;
}
*::-webkit-scrollbar-thumb {
background-color: #37457a;
border-radius: 20px;
}
* {
scrollbar-color: #37457a #B9BFD2;
scrollbar-width: thin;
}
body{
font-family: 'Exo 2.0';
zoom: 0.75;
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
color: #37457a;
text-align: center;
font-family: 'Exo 2.0';
}
.h1, .h2, h1, h2 {
font-family: 'Exo 2.0';
font-weight:700;
margin-bottom: 30px;
font-size: 30px;
padding: 0 20px;
}
h3, .h3{
font-size: 22px;
font-weight: 600;
padding: 0 10px 20px;
}
h4, .h4{
font-size: 24px;
font-weight:700;
}
h5, .h5{
font-size: 22px;
font-weight:500;
}
h6, .h6{
font-size: 18px;
font-weight:500;
}
h2::after{
position: absolute;
content: '';
width: 90%;
height: 110px;
background-repeat: no-repeat;
background-position: center center;
left: 50%;
transform: translateX(-50%);
background-image: url(/images/2line.webp);
margin: 15px 10px;
}
p {
font-size: 24px;
}
section {
margin: 80px auto;
}
a:not([class]){
text-decoration:none;
}
.container{
width: 100%;
max-width: 1098px;
margin: 0 auto;
}
.page-header{
margin-top: 50px;
}
@media (max-width:850px) {
.h1, .h2, h1, h2 {
font-size: 26px;
}
h3, .h3{
font-size: 22px;
font-weight:700;
}
h4, .h4{
font-size: 22px;
font-weight:700;
}
h5, .h5{
font-size: 20px;
font-weight:500;
}
h6, .h6{
font-size: 18px;
font-weight:500;
}
p {
font-size: 22px;
}
}
@media (max-width:680px) {
.h1, .h2, h1, h2 {
font-size: 24px;
}
h3, .h3{
font-size: 22px;
font-weight:700;
}
h4, .h4{
font-size: 20px;
font-weight:700;
}
h5, .h5{
font-size: 18px;
font-weight:500;
}
h6, .h6{
font-size: 16px;
font-weight:500;
}
p {
font-size: 18px;
}
}
/*===================BUTTONS==========================*/
#feedback-132 a,
#feedback-140 a,
#feedback-145 a{
width: 180px;
height: 50px;
padding: 10px 20px;
border: 2px solid #d84a13;
font-family: 'Exo 2.0', sans-serif;
font-weight: 500;
background: transparent;
cursor: pointer;
transition: all 0.3s ease;
position: relative;
display: inline-block;
color: #fff;
border-radius: 10px;
text-decoration:none;
background: #d84a13;
z-index: 2;
overflow: hidden;
box-shadow: 4px 4px 6px 0 rgba(255,255,255,.3),
-4px -4px 6px 0 rgba(116, 125, 136, .2),
inset -4px -4px 6px 0 rgba(255,255,255,.2),
inset 4px 4px 6px 0 rgba(0, 0, 0, .2);
}
#feedback-140 a{
width: 140px;
text-align: center;
}
#feedback-132 a:hover,
#feedback-140 a:hover,
#feedback-145 a:hover{
box-shadow: 4px 4px 6px 0 rgba(255,255,255,.5),
-4px -4px 6px 0 rgba(116, 125, 136, .2),
inset -4px -4px 6px 0 rgba(255,255,255,.5),
inset 4px 4px 6px 0 rgba(116, 125, 136, .3);
color: #d84a13;
background-color:#f15141;
border-color:#f15141;
}
#feedback-132 a:after,
#feedback-140 a:after,
#feedback-145 a:after{
position: absolute;
content: " ";
z-index: -1;
top: 0;
left: 0;
width: 100%;
height: 100%;
transition: all 0.3s ease;
}
#feedback-132 a:hover:after,
#feedback-140 a:hover:after,
#feedback-145 a:hover:after{
-webkit-transform: scale(2) rotate(180deg);
transform: scale(2) rotate(180deg);
background: #fff;
box-shadow: 4px 4px 6px 0 rgba(255,255,255,.5),
-4px -4px 6px 0 rgba(116, 125, 136, .2),
inset -4px -4px 6px 0 rgba(255,255,255,.5),
inset 4px 4px 6px 0 rgba(116, 125, 136, .3);
}
.btn-primary{
width: 140px;
padding: 10px 20px;
border: 2px solid #d84a13;
background-color: #f15141 !important;
font-family: 'Exo 2.0', sans-serif;
font-size: 17px;
font-weight: 500;
background: transparent;
cursor: pointer;
transition: all 0.3s ease;
position: relative;
display: inline-block;
color: #fff;
border-radius: 10px;
text-decoration:none;
box-shadow: 4px 4px 6px 0 rgba(255,255,255,.3), -4px -4px 6px 0 rgba(116, 125, 136, .2), inset -4px -4px 6px 0 rgba(255,255,255,.2), inset 4px 4px 6px 0 rgba(0, 0, 0, .2);
}
.btn-primary:focus {
background-color: #d84a13;
border-color: #d84a13;
}
.btn-primary:hover {
border-color: #d84a13;
background-color: #fcfcfc !important;
color: #d84a13;
}
.btn-3-orange{
background: #f15141;
z-index: 2;
transition: all 0.3s ease;
overflow: hidden;
box-shadow: 4px 4px 6px 0 rgba(255,255,255,.3),
-4px -4px 6px 0 rgba(116, 125, 136, .2),
inset -4px -4px 6px 0 rgba(255,255,255,.2),
inset 4px 4px 6px 0 rgba(0, 0, 0, .2);
}
.btn-3-orange:after{
position: absolute;
content: " ";
z-index: -1;
top: 0;
left: 0;
width: 100%;
height: 100%;
transition: all 0.3s ease;
}
.btn-3-orange:hover{
box-shadow: 4px 4px 6px 0 rgba(255,255,255,.5),
-4px -4px 6px 0 rgba(116, 125, 136, .2),
inset -4px -4px 6px 0 rgba(255,255,255,.5),
inset 4px 4px 6px 0 rgba(116, 125, 136, .3);
color: #f15141;
background-color:#f15141;
border-color:#f15141;
}
.btn-3-orange:hover:after {
-webkit-transform: scale(2) rotate(180deg);
transform: scale(2) rotate(180deg);
background: #fff;
box-shadow: 4px 4px 6px 0 rgba(255,255,255,.5),
-4px -4px 6px 0 rgba(116, 125, 136, .2),
inset -4px -4px 6px 0 rgba(255,255,255,.5),
inset 4px 4px 6px 0 rgba(116, 125, 136, .3);
}
@-webkit-keyframes shiny-btn1 {
0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}
/*===================HEADER============================*/
.header {
background-image: none;
background-color: #37457a;
padding-bottom: 30px;
}
.brand-logo img {
height: 170px;
position: relative;
z-index: 7;
}
.header .top-menu {
display: block;
color: #e2e9e7;
position: relative;
padding-top: 15px;
}
.header .top-info{
padding-top: 55px;
padding-bottom: 70px;
}
.top-menu nav{
padding: 5px;
width: 100%;
max-width: 1098px;
}
.top-bar {
display: grid;
grid-template-columns: 2fr 2fr 1fr;
align-items: center;
grid-template-areas:
"A B C"
"A B D";
}
.brand {
grid-area: A;
justify-self: center;
}
.contacts{
grid-area: B;
text-align: center;
}
.callback {
grid-area: C;
justify-self: center;
}
.top-social{
grid-area: D;
justify-self: center;
}
.header .mod-menu{
justify-content: space-between;
margin: 0 auto;
}
.contact-phone{
font-size: 20pt;
font-weight: 700;
color: #e2e9e7;
}
.phone-code {
font-size: 14pt;
}
.time-work {
font-size: 14pt;
font-weight: 700;
margin-top: 8px;
color: #e2e9e7;
}
.zona {
font-size: 15pt;
font-weight: 700;
letter-spacing: 1.1px;
margin-top: 8px;
color: #e2e9e7;
}
.social{
display: flex;
justify-content: space-between;
margin-top: 10px;
position: relative;
}
.time-work i{
padding: 10px 11px;
color: #37457a;
margin-right: 5px;
margin-top: 5px;
background: linear-gradient(0deg, #aeaeae, #fff);
border-radius: 50px;
box-shadow: 0 5px 5px rgba(0,0,0,0.3);
position: relative;
left: 3px;
}
.phone-code i{
padding: 11px 15px;
color: #37457a;
margin-right: 5px;
background: linear-gradient(0deg, #aeaeae, #fff);
border-radius: 50px;
box-shadow: 0 5px 5px rgba(0,0,0,0.3);
}
.zona i{
padding: 10px 12px;
color: #37457a;
margin-right: 9px;
margin-top: 5px;
background: linear-gradient(0deg, #aeaeae, #fff);
border-radius: 50px;
box-shadow: 0 5px 5px rgba(0,0,0,0.3);
position: relative;
left: 3px;
}
.tel a{
color: #256bb3;
font-size: 28px;
padding: 6px 10px;
background: linear-gradient(0deg, #aeaeae, #fff);
border-radius: 50px;
margin-right: 10px;
position: relative;
box-shadow: 0 5px 5px rgba(0,0,0,0.3);
}
.tel a:hover {
background: #256bb3;
color: #e2e9e7;
box-shadow: 0 2px 5px rgba(0,0,0,0.3);
}
.max a {
width: 45px;
padding: 8px 10px;
background: linear-gradient(0deg, #aeaeae, #fff);
border-radius: 50px;
margin-right: 10px;
position: relative;
top: -2px;
box-shadow: 0 5px 5px rgba(0,0,0,0.3);
display: block;
}
.max-img {
width: 30px;
position: relative;
background-image: url("/images/headers/max-color.svg");
height: 29.5px;
background-size: cover;
right: 2px;
}
.max a:hover {
background: conic-gradient(#3816df, #ca54ff, #69a4ff, #0734e3);
color: #e2e9e7;
box-shadow: 0 2px 5px rgba(0,0,0,0.3);
.max-img {
width: 30px;
position: relative;
background-image: url("/images/headers/max-white.svg");
height: 29.5px;
background-size: cover;
}
}
.whatsapp a {
color: #1e9125;
font-size: 30px;
padding: 4px 10px;
background: linear-gradient(0deg, #aeaeae, #fff);
border-radius: 50px;
margin-right: 10px;
box-shadow: 0 5px 5px rgba(0,0,0,0.3);
top: -1px;
position: relative;
}
.whatsapp a:hover {
background: #1e9125;
color: #e2e9e7;
box-shadow: 0 2px 5px rgba(0,0,0,0.3);
}
.mail a {
color: #072aae;
font-size: 25px;
padding: 7px 10px;
background: linear-gradient(0deg, #aeaeae, #fff);
border-radius: 50px;
position: relative;
top: 2px;
box-shadow: 0 5px 5px rgba(0,0,0,0.3);
}
.mail a:hover {
background: #4b65ae;
color: #ebebeb;
box-shadow: 0 2px 5px rgba(0,0,0,0.3);
}
.menuuslug{
position: relative;
border-top: 3px solid #c1c5c1;
border-bottom: 3px solid #c1c5c1;
text-transform: uppercase;
font-weight: 700;
padding: 10px;
}
.menuuslug li{
flex: 1 1 auto;
}
.menu-column-item{
flex: 1 1 30%;
}
/* =============================================================
MEGAMENU — общие стили для mega.php (RIGHT) и megatop.php (LEFT)
============================================================= */
/* ============================
ОБЩЕЕ
============================ */
.main-menu-holder {
background: #2f3a6a;
padding: 12px 0;
position: relative;
z-index: 50;
}
/* =============================================================
MEGATOP (LEFT MENU) — держатель и контейнер
============================================================= */
.header .megatop-menu-holder { background: none !important; }
.megatop-menu-holder { background: #2f3a6a; padding: 12px 0; position: relative; z-index: 50; }
.megatop-container { display: flex; justify-content: space-around; align-items: center; max-width: 1200px; margin: 0 auto; padding: 0 15px; }
/* Бургер-кнопка */
.megatop-mobile-toggle {
display: none; background: #e6e6e6; border: 1px solid rgba(255,255,255,0.2);
padding: 8px 10px; cursor: pointer; border-radius: 4px; flex-direction: column;
justify-content: space-between; align-items: center; width: 44px; height: 40px;
}
.megatop-burger-line { display: block; width: 24px; height: 3.2px; background: #37457A; border-radius: 2px; transition: all 0.3s ease; }
.megatop-mobile-toggle._active .megatop-burger-line:nth-child(1) { transform: translateY(9px) rotate(45deg); }
.megatop-mobile-toggle._active .megatop-burger-line:nth-child(2) { opacity: 0; }
.megatop-mobile-toggle._active .megatop-burger-line:nth-child(3) { transform: translateY(-9px) rotate(-45deg); }
@media(max-width: 840px) {
.megatop-mobile-toggle { display: flex; position: absolute; top: 16px; left: 20px; z-index: 1003; }
}
/* Десктоп */
.megatop-menu { display: flex; gap: 65px; margin: 0; padding: 0; list-style: none; }
.megatop-menu__item { position: relative; padding-bottom: 20px;}
.megatop-menu__current,
.megatop-menu__link { color: #e9e9e9; font-size: 17px; font-weight: 500; text-decoration: none; cursor: pointer; }
.megatop-menu__link:hover{
color: #e9e9e9;
}
.megatop-menu__down { display: inline-block; width: 8px; height: 8px; margin-left: 6px; border-right: 2px solid #e9e9e9; border-bottom: 2px solid #e9e9e9; transform: rotate(45deg); transition: .2s; vertical-align: middle; }
.megatop-menu__item._open .megatop-menu__down { transform: rotate(225deg); }
.megatop-sub-menu {
position: absolute; top: 40px; left: 0; background: #e9e9e9; padding: 20px 35px 20px 35px; border-radius: 5px;
box-shadow: 0 10px 40px rgba(0,0,0,0.15); display: none; opacity: 0; width: max-content; max-width: 800px; box-sizing: border-box; z-index: 200;
}
.megatop-menu__item:hover .megatop-sub-menu { display: block; opacity: 1; }
.megatop-sub-list { display: grid; gap: 10px; padding: 0; margin: 0; list-style: none; grid-template-columns: repeat(1, 1fr); }
.megatop-sub-list:has(> li:nth-child(n+7)) { grid-template-columns: repeat(4, 1fr); }
.megatop-sub-title { font-size: 15px; font-weight: 600; color: #2f3a6a; display: block; text-decoration: none; }
.megatop-sub-title:hover{
color: #1c63ee;
}
.megatop-level-3 { margin: 0; padding: 0; list-style: none; }
.megatop-level-3 a { font-size: 14px; color: #555; display: block; padding: 3px 0; text-decoration: none; }
/* Мобильная версия (выезжает слева) */
@media(max-width: 840px) {
.megatop-menu {
position: absolute; top: 0; left: -100%; width: 320px; max-width: 90vw; height: 100vh;
background: #2f3a6a; flex-direction: column; gap: 0; padding: 70px 0 40px;
overflow-y: auto; overflow-x: hidden; transition: left 0.3s ease; box-shadow: 4px 0 20px rgba(0,0,0,0.3); z-index: 1001;
}
.megatop-menu._megatop-open { left: -20px; }
.megatop-menu__item { border-bottom: 1px solid rgba(255,255,255,0.08); position: relative; padding-bottom: 0; }
.megatop-menu__current,
.megatop-menu__link { display: block; padding: 14px 20px; font-size: 15px; }
.megatop-menu__current { padding-right: 50px; }
.megatop-menu__down {
position: absolute; right: 0; top: 0; width: 50px; height: 50px; display: flex; align-items: center; justify-content: center; margin: 0; border: none; background: none;
}
.megatop-menu__down::before { content: ''; display: block; width: 7px; height: 7px; border-right: 2px solid rgba(255,255,255,0.6); border-bottom: 2px solid rgba(255,255,255,0.6); transform: rotate(45deg); transition: .25s; }
.megatop-menu__item._open > .megatop-menu__down::before { transform: rotate(225deg); }
.megatop-sub-menu {
position: static !important; width: 100% !important; background: rgba(0,0,0,0.18) !important; max-height: 0; overflow: hidden; transition: max-height 0.35s ease; display: block !important; opacity: 1 !important; padding: 0 !important; box-shadow: none !important;
}
.megatop-menu__item._open > .megatop-sub-menu { max-height: 3000px; }
.megatop-sub-list { display: block !important; padding: 4px 0 8px; }
.megatop-sub-item { border-bottom: 1px solid rgba(255,255,255,0.05); }
.megatop-sub-title { padding: 10px 20px 10px 28px; font-size: 12px; color: rgba(255,255,255,0.75); }
.megatop-level-3 { padding: 2px 0 8px; background: rgba(0,0,0,0.12); }
.megatop-level-3 a { padding: 8px 20px 8px 40px; font-size: 13px; color: rgba(255,255,255,0.55); position: relative; }
.megatop-level-3 a::before { content: '–'; position: absolute; left: 28px; color: rgba(255,255,255,0.25); }
}
@media(max-width: 480px) { .megatop-menu { width: 100%; max-width: 100vw; } }
/* ============================
ЗАТЕМНЕНИЕ ПОД МЕНЮ
============================ */
.menu-overlay {
display: none;
position: fixed;
inset: 0;
background: rgba(0,0,0,0.45);
z-index: 1000;
}
.menu-overlay._visible {
display: block;
}
/* ============================
БУРГЕР-КНОПКА
============================ */
.mobile-menu-toggle {
display: none;
background: transparent;
border: 1px solid rgba(255,255,255,0.2);
padding: 8px 10px;
cursor: pointer;
border-radius: 4px;
flex-direction: column;
justify-content: space-between;
align-items: center;
width: 44px;
height: 40px;
}
.mobile-menu-toggle:hover {
border-color: rgba(255,255,255,0.4);
}
.burger-line {
display: block;
width: 24px;
height: 2px;
background: #fff;
border-radius: 2px;
transition: all 0.3s ease;
transform-origin: center;
}
.mobile-menu-toggle._active .burger-line:nth-child(1) {
transform: translateY(9px) rotate(45deg);
}
.mobile-menu-toggle._active .burger-line:nth-child(2) {
opacity: 0;
transform: scaleX(0);
}
.mobile-menu-toggle._active .burger-line:nth-child(3) {
transform: translateY(-9px) rotate(-45deg);
}
@media(max-width: 991px) {
.mobile-menu-toggle {
display: flex;
/* Фиксируем кнопку — она всегда поверх дровера */
position: fixed;
top: 25px;
right: 15px;
z-index: 1003; /* выше дровера (1001) и оверлея (1000) */
}
}
/* ============================
ПЕРВЫЙ УРОВЕНЬ (ДЕСКТОП)
============================ */
.main-menu {
display: flex;
gap: 40px;
margin: 0;
padding: 0;
list-style: none;
}
.main-menu__item {
position: relative;
}
.main-menu__current,
.main-menu__link {
color: #fff;
font-size: 18px;
font-weight: 600;
text-decoration: none;
cursor: pointer;
}
.main-menu__down {
display: inline-block;
width: 8px;
height: 8px;
margin-left: 6px;
border-right: 2px solid #fff;
border-bottom: 2px solid #fff;
transform: rotate(45deg);
transition: .2s;
vertical-align: middle;
}
.main-menu__item._open .main-menu__down {
transform: rotate(225deg);
}
/* ============================
ВЫПАДАЮЩЕЕ МЕНЮ - ДЕСКТОП
============================ */
.main-sub-menu {
position: absolute;
top: calc(100% + 12px);
left: 0;
background: #fff;
padding: 25px 30px;
border-radius: 6px;
box-shadow: 0 10px 40px rgba(0,0,0,0.15);
display: none;
opacity: 0;
width: max-content;
max-width: 800px;
box-sizing: border-box;
overflow: hidden;
z-index: 200;
}
.main-menu__item:nth-last-child(-n+2) .main-sub-menu {
left: auto;
right: 0;
}
.main-menu__item:hover .main-sub-menu,
.main-menu__item._open .main-sub-menu {
display: block;
opacity: 1;
}
/* ============================
КОЛОНКИ (2 или 4) — ДЕСКТОП
============================ */
.sub-menu {
display: grid;
gap: 20px 40px;
padding: 0;
margin: 0;
list-style: none;
grid-template-columns: repeat(2, 1fr);
}
.sub-menu:has(> li:nth-child(n+7)) {
grid-template-columns: repeat(4, 1fr);
}
/* ============================
ВТОРОЙ УРОВЕНЬ (ДЕСКТОП)
============================ */
.sub-menu__item .sub-menu__title {
text-transform: uppercase;
font-size: 13px;
font-weight: 700;
letter-spacing: .04em;
color: #2f3a6a;
display: block;
margin-bottom: 6px;
line-height: 1.2;
text-decoration: none;
}
.sub-menu__item .sub-menu__title:hover {
color: #1c63ee;
}
/* ============================
ТРЕТИЙ УРОВЕНЬ (ДЕСКТОП)
============================ */
.menu-level-3 {
margin: 0;
padding: 0;
list-style: none;
}
.menu-level-3 a {
font-size: 14px;
color: #555;
display: block;
padding: 3px 0;
text-decoration: none;
line-height: 1.3;
}
.menu-level-3 a:hover {
color: #1c63ee;
}
/* ============================
МОБИЛЬНОЕ МЕНЮ
============================ */
@media(max-width: 991px) {
/* Дровер */
.main-menu {
position: fixed;
top: 0;
right: -100%;
width: 320px;
max-width: 90vw;
height: 100vh;
background: #2f3a6a;
flex-direction: column;
gap: 0;
padding: 70px 0 40px;
overflow-y: auto;
overflow-x: hidden;
transition: right 0.3s ease;
box-shadow: -4px 0 20px rgba(0,0,0,0.3);
z-index: 1001;
list-style: none;
margin: 0;
}
.main-menu._mobile-open {
right: 0;
}
/* ---- Пункт 1-го уровня ---- */
.main-menu__item {
border-bottom: 1px solid rgba(255,255,255,0.08);
position: relative;
}
.main-menu__current {
display: block;
padding: 14px 50px 14px 20px;
font-size: 15px;
font-weight: 600;
color: #fff;
cursor: pointer;
line-height: 1.2;
}
.main-menu__link {
display: block;
padding: 14px 20px;
font-size: 15px;
font-weight: 600;
color: #fff;
}
/* Стрелка */
.main-menu__down {
position: absolute;
right: 0;
top: 0;
width: 50px;
height: 50px;
display: flex;
align-items: center;
justify-content: center;
margin: 0;
cursor: pointer;
border: none;
background: none;
}
.main-menu__down::before {
content: '';
display: block;
width: 7px;
height: 7px;
border-right: 2px solid rgba(255,255,255,0.6);
border-bottom: 2px solid rgba(255,255,255,0.6);
transform: rotate(45deg) translateY(-2px);
transition: transform 0.25s ease;
}
.main-menu__item._open > .main-menu__down::before {
transform: rotate(225deg) translateY(-2px);
}
/* ---- Аккордеон-подменю ---- */
.main-sub-menu {
position: static !important;
width: 100% !important;
max-width: 100% !important;
box-shadow: none !important;
border-radius: 0 !important;
padding: 0 !important;
transform: none !important;
background: rgba(0,0,0,0.18) !important;
max-height: 0;
overflow: hidden;
transition: max-height 0.35s ease;
display: block !important;
opacity: 1 !important;
z-index: auto !important;
}
.main-menu__item._open > .main-sub-menu {
max-height: 4000px;
}
/* Список → блок */
.sub-menu {
display: block !important;
padding: 4px 0 8px;
margin: 0;
list-style: none;
}
/* ---- Пункт 2-го уровня ---- */
.sub-menu__item {
border-bottom: 1px solid rgba(255,255,255,0.05);
}
.sub-menu__item .sub-menu__title {
display: block;
padding: 10px 20px 10px 28px;
font-size: 12px;
font-weight: 700;
letter-spacing: .05em;
text-transform: uppercase;
color: rgba(255,255,255,0.75);
text-decoration: none;
margin: 0;
line-height: 1.3;
}
.sub-menu__item .sub-menu__title:hover {
color: #fff;
}
/* ---- Пункт 3-го уровня ---- */
.menu-level-3 {
margin: 0;
padding: 2px 0 8px;
list-style: none;
background: rgba(0,0,0,0.12);
}
.menu-level-3 li {
border: none;
}
.menu-level-3 a {
display: block;
padding: 8px 20px 8px 40px;
font-size: 13px;
color: rgba(255,255,255,0.55);
text-decoration: none;
position: relative;
line-height: 1.3;
}
.menu-level-3 a::before {
content: '–';
position: absolute;
left: 28px;
color: rgba(255,255,255,0.25);
}
.menu-level-3 a:hover {
color: rgba(255,255,255,0.9);
}
}
@media(max-width: 480px) {
.main-menu {
width: 100%;
max-width: 100vw;
}
}
/* ---------------------------------------------------------------
MEGA (RIGHT MENU) — держатель и контейнер
--------------------------------------------------------------- */
.mega-menu-holder { position: relative; z-index: 50; }
.mega-container { display: flex; justify-content: space-around; align-items: center; max-width: 1200px; margin: 0 auto; padding: 0 15px; }
/* Бургер-кнопка */
.mega-mobile-toggle {
display: none; background: #e6e6e6; border: 1px solid rgba(255,255,255,0.2);
padding: 8px 10px; cursor: pointer; border-radius: 4px; flex-direction: column;
justify-content: space-between; align-items: center; width: 44px; height: 40px;
}
.mega-burger-line { display: block; width: 24px; height: 3px; background: #37457a; border-radius: 2px; transition: all 0.3s ease; }
.mega-mobile-toggle._active .mega-burger-line:nth-child(1) { transform: translateY(9px) rotate(45deg); }
.mega-mobile-toggle._active .mega-burger-line:nth-child(2) { opacity: 0; }
.mega-mobile-toggle._active .mega-burger-line:nth-child(3) { transform: translateY(-10px) rotate(-45deg); }
@media(max-width: 840px) {
.mega-mobile-toggle { display: flex; position: absolute; top: -417px; right: 35px; z-index: 1003; }
.menu-uslug { background: none; }
.mega-menu-holder {
padding: 0;
}
.header .top-info {
padding-top: 85px;
padding-bottom: 0;
}
}
/* Десктоп */
.mega-menu {margin: 0; padding: 26.5px 0; list-style: none; text-transform: uppercase; background: linear-gradient(0deg, #121b48, #5767a3); }
.mega-menu__item {
position: relative;
display: inline;
padding: 30px 20px 30px;
border-right: 2.5px solid #0c1b52;
border-left: 2px solid #3149a5;
}
.mega-menu__item:hover {
background: #172356;
}
.mega-menu__current,
.mega-menu__link { color: #e9e9e9; font-size: 18px; font-weight: 800; text-decoration: none; cursor: pointer; letter-spacing: 1px;}
.mega-menu__link:hover {
color:#1c63ee;
}
.mega-menu__item._open .mega-menu__down { transform: rotate(225deg); }
.mega-sub-menu {
position: absolute; left: 0; background: #e9e9e9; padding: 25px 20px 25px 30px; border-radius: 5px; top: 75px;
box-shadow: 0 10px 40px rgba(0,0,0,0.15); display: none; opacity: 0; width: max-content; max-width: 1090px; box-sizing: border-box; z-index: 200;
}
.mega-menu__item:nth-last-child(-n+2) .mega-sub-menu { left: auto; right: 0; }
.mega-menu__item:hover .mega-sub-menu { display: block; opacity: 1; }
.mega-sub-list { display: grid; gap: 8px 25px; padding: 0; margin: 0; list-style: none; grid-template-columns: repeat(2, 1fr); }
.mega-sub-list:has(> li:nth-child(n+20)) { grid-template-columns: repeat(4, 1fr); }
.mega-sub-title { text-transform: uppercase; font-size: 13.5px; font-weight: 700; color: #2f3a6a; display: block; margin-bottom: 6px; text-decoration: none; }
.mega-sub-title:hover{
color:#1c63ee;
}
.mega-menu__down{
display: inline-block;
}
.mega-level-3 { margin: 0; padding: 0; list-style: none; }
.mega-level-3 a { font-size: 14px; color: #555; display: block; padding: 3px 0; text-decoration: none; text-transform: none; letter-spacing: unset; font-weight: 600; }
/* Мобильная версия (выезжает справа) */
@media(max-width: 840px) {
.mega-menu {
position: absolute; top: -335px; width: 335px; max-width: 90vw; height: 100vh;
background: #2f3a6a; flex-direction: column; gap: 0; padding: 70px 0 40px;
overflow-y: auto; overflow-x:hidden; transition: right 0.3s ease; box-shadow: -4px 0 20px rgba(0,0,0,0.3); z-index: 1001;
}
.js-mega-menu{
display: none;
}
.mega-menu._mega-open { right: 0; display: block; }
.mega-menu__item { border-bottom: 1px solid rgba(255,255,255,0.08); position: relative;
display: block; padding: 0; border-right: 0; border-left: 0; }
.mega-menu__item:hover { background: none;}
.mega-menu__current,
.mega-menu__link { display: block; padding: 14px 20px; font-size: 15px; }
.mega-menu__current { padding-right: 50px; }
.mega-menu__down {
position: absolute; right: 0; top: 0; width: 50px; height: 50px; display: flex; align-items: center; justify-content: center; margin: 0; border: none; background: none;
}
.mega-menu__down::before { content: ''; display: block; width: 7px; height: 7px; border-right: 2px solid rgba(255,255,255,0.6); border-bottom: 2px solid rgba(255,255,255,0.6); transform: rotate(90deg); transition: .25s; }
.mega-menu__item._open > .mega-menu__down::before { transform: rotate(225deg); }
.mega-sub-menu {
position: static !important; width: 100% !important; background: rgba(0,0,0,0.18) !important; max-height: 0; overflow: hidden; transition: max-height 0.35s ease; display: block !important; opacity: 1 !important; padding: 0 !important; box-shadow: none !important;
}
.mega-menu__item._open > .mega-sub-menu { max-height: 3000px; }
.mega-sub-list { display: block !important; padding: 4px 0 8px; }
.mega-sub-item { border-bottom: 1px solid rgba(255,255,255,0.05); }
.mega-sub-title { padding: 10px 20px 10px 28px; font-size: 12px; color: rgba(255,255,255,0.75); }
.mega-level-3 { padding: 2px 0 8px; background: rgba(0,0,0,0.12); }
.mega-level-3 a { padding: 8px 20px 8px 40px; font-size: 13px; color: rgba(255,255,255,0.55); position: relative; }
.mega-level-3 a::before { content: '–'; position: absolute; left: 28px; color: rgba(255,255,255,0.25); }
}
@media (max-width: 640px) {
.mega-mobile-toggle {
top: -533px;
}
.mega-menu {
top: -545px;
}
}
@media(max-width: 480px) { .mega-menu { width: 100%; max-width: 100vw; } }
@media(max-width: 340px) { body { overflow-x: hidden !important; } }
/*======================breadcrumbs====================*/
.breadcrumbs{
background-color: #37457A;
}
.mod-breadcrumbs__item{
color: white !important;
}
.mod-breadcrumbs__item::before{
color: white !important;
}
.pathway {
color: #f15141;
text-decoration: none;
}
.pathway:hover{
color: white;
}
@media (min-width: 990px) {
.header .mod-menu {
display: flex;
flex: 1 1 0%;
flex-direction: row;
}
}
@media (max-width: 990px) {
.navbar-expand-md {
display: block;
}
.navbar-expand-md .navbar-toggler, .navbar-expand-md .offcanvas-header {
display: block;
}
.navbar-expand-md .navbar-collapse {
display: none !important;
flex-basis: auto;
}
.collapse.show {
display: flex !important;
}
}
@media (max-width: 840px) {
.top-bar{
grid-template-columns: 2fr 2fr;
grid-template-rows: 2fr 2fr;
grid-template-areas:
"A B"
"C D";
}
}
@media (max-width: 640px) {
.top-bar{
grid-template-columns: 2fr;
grid-template-areas:
"A"
"B"
"C"
"D";
}
}
/*========================CALLBACK-FORM start=======================*/
.rsform-simple-js-modal-content {
overflow-y: scroll !important;
z-index: 11;
height: auto !important;
width: auto !important;
}
#rsfp-counter-35,
#rsfp-counter-52,
#rsfp-counter-68,
#rsfp-counter-94 {
font-size:14px;
}
#Callback h2,
#Callback2 h2,
#CallbackFooter h2,
#Feedback h2{
font-size: 20px;
font-weight: 700;
padding-top: 35px;
margin-bottom: 0px;
}
#Callback h2::after,
#Callback2 h2::after,
#CallbackFooter h2::after,
#Feedback h2::after {
display: none;
}
.closeModal {
position: absolute;
top: 20px;
right: 30px;
}
.rsform-simple-js-modal-close-button {
background-color: #f9f9f900 !important;
color: #fff0 !important;
z-index: 11;
position: absolute;
top: 20px;
right: 27px;
}
#Callback .tos-box{
padding-top: 20px;
}
#Callback .submit,
#Callback2 .submit,
#CallbackFooter .submit,
#Feedback .submit{
width: 140px;
margin: 0 auto;
}
@media (min-width: 300px) and (max-width: 800px) {
.rsform-simple-js-modal-content {
width: 80% !important;
height: 720px !important;
}
}
/*===================BANNER============================*/
.banner{
margin-top: 0;
}
.banner-container{
height: 480px;
position: relative;
}
.banner-content{
background-color: #37457aad;
width: 100%;
display: grid;
max-width: 600px;
padding: 35px 15px 25px 35px;
position: absolute;
bottom: 0;
border-radius: 10px;
top: 40px;
}
.banner-title{
color: white;
font-size: 36px;
font-weight: 800;
letter-spacing: 1.5px;
display: block;
margin-bottom: 20px;
text-transform: uppercase;
text-shadow: 3px 3px 3px #000;
text-align: left;
}
.banner-text, .banner-bullets p{
color: white;
text-shadow: 3px 3px 3px #000;
}
.banner-bullets p::before{
font-family: Font Awesome\ 5 Free;
color: #fab83a;
content: "\2b";
font-weight: 600;
margin-left: 10px;
font-size: 24px;
right: 12px;
position: relative;
}
.banner-content button{
margin-top: 10px;
}
/*============================ВЫВОЗ МУСОРА==============================*/
.banner-background1{
background: url("/images/banners/vyvoz_musora.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ МУСОРА ИЗ КВАРТИРЫ==============================*/
.banner-background1-1{
background: url("/images/banners/vyvoz_musora_iz_kvartiry.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ МУСОРА ИЗ ГАРАЖА==============================*/
.banner-background1-2{
background: url("/images/banners/vyvoz_musora_iz_garagha.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ МУСОРА ИЗ ОФИСА==============================*/
.banner-background1-3{
background: url("/images/banners/vyvoz-musora-is-ofisa.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ МУСОРА ИЗ МАГАЗИНА==============================*/
.banner-background1-4{
background: url("/images/banners/vyvoz-musora-iz-magazina.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ МУСОРА ИЗ АВТОСЕРВИСА==============================*/
.banner-background1-5{
background: url("/images/banners/vyvoz-musora-iz-avtoservisa.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ МУСОРА ИЗ РЕСТОРАНА==============================*/
.banner-background1-6{
background: url("/images/banners/vyvoz-musora-is-restorana.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ МУСОРА ИЗ ГОСТИНИЦЫ==============================*/
.banner-background1-7{
background: url("/images/banners/vyvoz-musora-iz-gostinitsy.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ МУСОРА СО СКЛАДА==============================*/
.banner-background1-8{
background: url("/images/banners/vyvoz-musora-so-sklada.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ МУСОРА КОНТЕЙНЕРАМИ==============================*/
.banner-background1-9{
background: url("/images/banners/vyvoz-musora-konteynerami.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ МУСОРА С ДАЧНОГО УЧАСТКА==============================*/
.banner-background1-10{
background: url("/images/banners/vyvoz-musora-s-dashnogo-uchastka.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ МУСОРА ИЗ ЧАСТНОГО ДОМА==============================*/
.banner-background1-11{
background: url("/images/banners/vyvoz-musora-iz-doma.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ МУСОРА ИЗ СНТ==============================*/
.banner-background1-12{
background: url("/images/banners/vyvoz-musora-iz-snt.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ СПИЛА ДЕРЕВЬЕВ==============================*/
.banner-background1-13{
background: url("/images/banners/vyvoz-spila.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ МУСОРА САМОСВАЛОМ==============================*/
.banner-background1-14{
background: url("/images/banners/vyvoz-samosvalom.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ МУСОРА С ПОГРУЗКОЙ==============================*/
.banner-background1-15{
background: url("/images/banners/vyvoz-musora-s-pogruzkoj.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ МУСОРА В МЕШКАХ==============================*/
.banner-background1-16{
background: url("/images/banners/vyvoz-musora-v-meshkakh.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ СТРОИТЕЛЬНОГО МУСОРА==============================*/
.banner-background2{
background: url("/images/banners/vyvoz_stroitelnogo_musora.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ МУСОРА С АИС ОССИГ==============================*/
.banner-background2-1{
background: url("/images/banners/vyvoz-musora-ossig.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ МУСОРА ПОСЛЕ РЕМОНТА==============================*/
.banner-background2-2{
background: url("/images/banners/vyvoz-musora-posle-remonta.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ МУСОРА ПОСЛЕ ДЕМОНТАЖА==============================*/
.banner-background2-3{
background: url("/images/banners/vyvoz-musora-posle-demontazha.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ МУСОРА СО СТРОИТЕЛЬНОЙ ПЛОЩАДКИ==============================*/
.banner-background2-4{
background: url("/images/banners/vyvoz-musora-so-stroiploshadki.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
.banner-background2-5{
background: url("/images/banners/vyvoz-gelezobetona.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
.banner-background2-6{
background: url("/images/banners/vyvoz-betonnogo-skola.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
.banner-background2-7{
background: url("/images/banners/vyvoz-kirpicha.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
.banner-background2-8{
background: url("/images/banners/vyvoz-asfalta.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
.banner-background2-9{
background: url("/images/banners/vyvoz-shifera.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
.banner-background2-10{
background: url("/images/banners/vyvoz-ruberoida.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ БЫТОВОГО МУСОРА==============================*/
.banner-background3{
background: url("/images/banners/vyvoz-tbo.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ ПИЩЕВОГО МУСОРА==============================*/
.banner-background3-1{
background: url("/images/banners/vyvoz-pichevogo-musora.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ МАКУЛАТУРЫ И КАРТОНА==============================*/
.banner-background3-2{
background: url("/images/banners/vyvoz-makulatury-i-kartona.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ ПЛАСТИКОВЫХ ОТХОДОВ==============================*/
.banner-background3-3{
background: url("/images/banners/vyvoz-plastika.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ CТЕКЛОБОЯ==============================*/
.banner-background3-4{
background: url("/images/banners/vyvoz-stekloboya.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ ПЛЕНКИ И ПВД==============================*/
.banner-background3-5{
background: url("/images/banners/vyvoz-plenki-i-pvd.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ ОТХОДОВ ТЕКСТИЛЯ=============================*/
.banner-background3-6{
background: url("/images/banners/vyvoz-tekstily.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ КГМ=============================*/
.banner-background4{
background: url("/images/banners/vyvoz-kgm.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ СТАРОЙ МЕБЕЛИ=============================*/
.banner-background4-1{
background: url("/images/banners/vyvoz-staroj-mebely.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ СТАРЫХ ОКОН=============================*/
.banner-background4-2{
background: url("/images/banners/vyvoz-staryh-okon.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ СТАРЫХ ДВЕРЕЙ=============================*/
.banner-background4-3{
background: url("/images/banners/vyvoz-staryh-dverej.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ МЕТАЛЛИЧЕСКОГО МУСОРА=============================*/
.banner-background4-4{
background: url("/images/banners/vyvoz-metalloloma.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ ДЕРЕВЯННОГО МУСОРА=============================*/
.banner-background4-5{
background: url("/images/banners/vyvoz-derevjnnih-othodov.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ МУСОРА ПОСЛЕ ПОЖАРА=============================*/
.banner-background4-6{
background: url("/images/banners/vyvoz-musora-posle-pozhara.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ВЫВОЗ ВЫВОЗ СНЕГА==============================*/
.banner-background7{
background: url("/images/banners/vyvoz_snega.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ЗЕМЛЯНЫЕ РАБОТЫ==============================*/
.banner-background5{
background: url("/images/banners/zemlyanye_raboty.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
/*============================ДЕМОНТАЖ И СНОС==============================*/
.banner-background6{
background: url("/images/banners/demontazh_i_snos.webp") no-repeat;
background-position: center;
background-size: cover;
height: 520px;
}
@media (max-width:450px) {
.banner-title {
font-size: 32px;
}
.banner-content {
top: 20px;
}
.banner-bullets p{
font-size: 16px;
}
}
/*===================SEO-TEXT-MENU============================*/
.seo-text-menu {
display: grid;
grid-template-areas:
"A A A A B B B B"
"A A A A C C C C";
justify-content: space-evenly;
padding-bottom: 30px;
align-items: inherit;
gap: 30px;
}
.seo-text {
grid-area: A;
width: 100%;
max-width: 900px;
margin: 0 auto;
font-size: 26px;
}
.seo-text .row{
padding: 0px 0px 15px;
}
.seo-text .row p{
margin-top: 9px;
padding: 10px 30px;
margin-bottom: 0px;
font-size: 22px;
text-align: justify;
text-indent: 50px;
}
.seo-text h3 {
margin: 0;
text-align: center;
font-size: 30px;
font-weight: 700;
border-radius: 10px !important;
padding: 20px 10px;
}
.menu-item {
display: block;
width: 100%;
}
.menu .menu-item > a{
color:#37457A;
font-size: 16px;
}
.card h3{
font-size: 25px;
font-weight: 700;
padding: 20px 10px;
color: #37457a;
}
.img-seo-card{
display: block;
padding-top: 20px;
width: 150px;
margin: 0 auto;
}
.sidebar-right-first {
grid-area: B;
display: flex;
}
.sidebar-right-second {
grid-area: C;
display: flex;
}
.sidebar-right{
flex-grow: 1;
flex-basis: fit-content;
}
.sidebar-right-first:last-child{
padding-left: 10px;
}
.sidebar-uslugi{
padding: 0 20px;
font-size: 16px;
color:#37457A;
}
.sidebar-uslugi .mod-menu > li > a{
color: #37457a;
text-decoration: none;
}
.sidebar-uslugi .mod-menu > li > a:hover{
color: #1342ed;
}
@media (max-width:930px) {
.seo-text-menu {
grid-template-areas:
"A A A A"
"B B C C";
justify-content: center;
padding-bottom: 30px;
align-items: inherit;
gap: 30px;
}
}
@media (max-width:850px) {
.seo-text .row p {
font-size: 20px;
}
}
@media (max-width:680px) {
.seo-text-menu {
grid-template-areas:
"A A"
"B B"
"C C";
justify-content: space-evenly;
padding-bottom: 30px;
align-items: baseline;
}
.sidebar-right{
height: auto;
}
.seo-text .row p {
font-size: 16px;
}
.seo-text .row p{
padding: 5px 10px;
}
.card h3 {
font-size: 24px;
}
}
/*===================SEO-TEXT-MENU============================*/
/*===================SEO-TEXT-ONLY===========================*/
.seo-text-only {
margin-top: 30px;
padding-top: 30px;
}
.seo-text-only h1 {
padding-bottom: 30px;
}
.seo-text-only p {
padding: 20px;
text-align: justify;
}
.img-card-one img{
margin: 0 auto;
display: block;
}
/*===================FORMA SEND-FAILE============================*/
#userForm{
display: flex;
min-width: 340px;
max-width: 340px;
margin: 0 auto;
}
#rsform_11{
background-color: #f3f3f3;
padding: 20px;
border-radius: 10px;
border: 0.1px solid #37457a;
flex-grow: 1;
flex-basis: fit-content;
}
.SendFaile{
display: grid;
justify-content: center;
gap: 25px;
}
.SendFaile .submit{
text-align: center;
}
.tos-box a{
font-size: 16px;
}
.send-faile{
padding-top: 30px;
}
.send-faile-container{
padding-top: 60px;
display: grid;
grid-template-columns: 2fr 1fr;
gap: 20px;
}
.send-faile-text{
position: relative;
padding: 0 20px;
top: -10px;
}
.send-faile-text p{
text-indent:50px;
font-size: 24px;
text-align: justify;
overflow-wrap: break-word;
hyphens: auto;
}
.btn-secondary,
.btn-secondary:hover,
.btn-secondary:disabled{
color: #2AA918;
background-color: #f3f3f3;
margin-top: 10px;
border: #f3f3f3;
}
.btn-secondary::before{
content: '+';
color:#2AA918;
margin-right: 5px;
font-weight: 600;
}
@media (max-width:1100px) {
.send-faile-text p{
font-size: 22px;
}
}
@media (max-width:990px) {
.send-faile-text p{
font-size: 20px;
}
}
@media (max-width:890px) {
.send-faile-text p{
font-size: 18px;
}
.send-faile-text{
padding: 0 20px;
}
}
@media (max-width:800px) {
.send-faile-container{
grid-template-columns: 1fr;
}
}
/*===================ADVANTAGES============================*/
.our_advantages{
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-auto-rows: 1fr;
grid-column-gap: 20px;
grid-row-gap: 60px;
margin-bottom: 50px;
padding-top: 80px;
}
.img_advantages{
width: 120px;
display: inline-block;
margin-bottom: 20px;
position: relative;
margin: 0 auto;
}
.card-advantages-text{
display: block;
font-size: 18px;
text-align: center;
}
.our_advantages_cell {
display: grid;
gap: 20px;
align-self: baseline;
}
.card-advantages-title::before {
position: absolute;
content: '';
width: 100px;
height: 1px;
background-color: #57585d;
left: 50%;
bottom: -20px;
transform: translateX(-50%);
}
.card-advantages-title {
color: #37457a;
font-size: 20px;
text-transform: uppercase;
font-weight: 700;
letter-spacing: 1.1px;
}
@media (max-width:990px) {
.our_advantages{
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width:560px) {
.our_advantages{
grid-template-columns: repeat(1, 1fr);
}
}
/*================================ADVANTAGES1 start===========================*/
.advantages {
padding: 10px 10px 0;
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 50px;
}
.advantages_line {
display: inline-flex;
}
.advantages_left {
text-align: right;
}
.advantages_icon_left {
margin-top: 15px;
margin-left: 15px;
margin-bottom: 15px;
}
.advantages_icon_right {
margin-top: 15px;
margin-right: 15px;
margin-bottom: 15px;
}
.icon_left,
.icon_right {
display: inline-block;
width: 120px;
}
.advantages_text_right,
.advantages_text_left {
margin-bottom: 15px;
margin-top: 15px;
padding-top: 10px;
}
.advantages_text_left h4 {
text-align: right !important;
}
.advantages_text_left p {
text-align: right !important;
}
.advantages_text_right h4 {
text-align: left;
}
@media (max-width:1060px) {
.advantages_text_right h4 {
font-size: 22px;
}
.advantages_text_right p {
font-size: 20px;
}
.advantages_text_left p {
font-size: 20px;
}
.advantages_text_left h4 {
font-size: 22px;
}
}
@media (max-width:740px) {
.advantages {
display: block;
}
}
/*================================ADVANTAGES1 end=============================*/
/*================================ADVANTAGES2 start===========================*/
.container.our_advantages2 {
display: grid;
grid-template-columns: repeat(4, 1fr);
align-items: last baseline;
}
.our_advantages_cell2 .card2{
max-width: 250px;
}
.card-img-top2 {
width: 120px;
height: auto;
align-self: center;
justify-self: center;
}
.our_advantages_cell2 {
padding-top: 20px;
justify-self: center;
}
.card2 {
position: relative;
display: grid;
height: 250px;
text-align: center;
}
.advant-body h4 {
font-size: 18px;
text-transform: uppercase;
}
.advant-body p {
font-size: 16px;
text-align: center;
line-height: 20px;
}
@media (max-width:890px) {
.container.our_advantages2 {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width:460px) {
.container.our_advantages2 {
grid-template-columns: 1fr;
}
}
/*================================ADVANTAGES2 end=============================*/
/*================================USLUGI start===========================*/
.uslugi {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 20px;
padding-bottom: 30px;
padding-top: 30px;
}
.uslugi_line {
background: #FFFFFF;
border: 5px solid transparent;
transition: 300ms;
border-radius: 10px;
padding: 15px 20px;
}
.uslugi_line:hover {
transition: 300ms;
border-color: #37457a;
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
}
.uslugi_icon {
display: flex;
}
.uslugi_img{
display: block;
width: 90px;
}
.uslugi_line h4 {
text-align: left;
padding-left: 20px;
padding-top: 30px;
text-transform: uppercase;
letter-spacing: 1.1px;
}
.uslugi_text {
font-size: 20px;
padding: 15px 10px;
text-align: justify;
}
@media (max-width:990px) {
.uslugi {
grid-template-columns: 1fr;
}
}
/*===================SERVICE============================*/
.service {
margin: 100px auto;
max-width: 1320px;
}
.service_cell {
position: relative;
max-width: 350px;
text-align: center;
background: #ededed;
height: 450px;
border-radius: 15px;
box-shadow: 3px 4px 6px 1px #a6a6a6;
padding: 0;
margin: 40px 20px;
transition: 0.5s;
}
.service_cell:hover .info {
visibility: visible;
}
.service_cell:hover{
transform: scale(1.07);
transition-duration: .5s;
}
.service_cell:hover .image-filter {
visibility: visible;
}
.service-details{
color: #4aa247;
display: inline-block;
position: relative;
font-size: 22px;
font-weight: 700;
text-decoration: none;
bottom: 20px;
}
.service-details:hover{
color: #3fb73b;
text-decoration: none;
}
.service-details:focus{
color: #3fb73b;
text-decoration: none;
}
.service-details:active{
color: #3fb73b;
text-decoration: none;
}
.service-details>i::before{
content: "\f054";
margin-left: -10px;
opacity: 0;
vertical-align: middle;
-webkit-transition: margin .3s, opacity .3s;
transition: margin .3s, opacity .3s;
}
.service-details:hover i::before {
margin-left: 5px;
opacity: 1;
}
.service-cards {
display: flex;
justify-content: space-between;
}
.card-image {
position: relative;
background: transparent;
cursor: pointer
}
.card-image img{
border-radius: 15px 15px 0px 0px;
}
.image-filter {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background: #37457a;
opacity: 0.85;
visibility: hidden;
border-radius: 15px 15px 0px 0px;
}
.service_cell .title{
font-size: 26px;
font-weight: 700;
margin: 20px auto;
}
.service_cell .info{
font-size: 22px;
position: absolute;
color: #ededed;
text-shadow: 1px 1px 1px #000;
top: 60px;
display: block;
max-width: 320px;
left: 15px;
visibility: hidden;
}
.service_cell .price {
font-size: 20px;
margin: 30px auto 10px auto;
display: block;
font-weight: 700;
color: #37457a;
}
.service_cell .price span, .service_cell .price i {
position: relative;
top: -12px;
}
.area_btn{
display:flex;
justify-content: space-around;
align-items: center;
}
@media (max-width:1235px) {
.service-cards {
justify-content: space-evenly;
}
}
@media (max-width:860px) {
.service_cell .title {
font-size: 24px;
}
.service_cell .info {
font-size: 18px;
}
}
/*======================FLIP-CONTENT-CARDS start==============================*/
.flip-cards{
margin-top: 80px;
margin-bottom:100px;
display: grid;
grid-template-columns: repeat(3, 1fr);
}
.flip-card {
height: 380px;
position: relative;
perspective: 1000px;
border: 20px solid #fff;
}
.card-cover{
position: relative;
background-size: cover;
height: 14rem;
-webkit-clip-path: polygon(0 0, 100% 0, 100% 85%, 0 100%);
clip-path: polygon(0 0, 100% 0, 100% 95%, 0 100%);
border-top-left-radius: 10px;
border-top-right-radius: 10px;
background-image: linear-gradient(to top right, rgba(226, 226, 226, 0.75), rgba(133, 133, 133, 0.65));
}
.front, .back {
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
display: flex;
justify-content: center;
align-items: baseline;
transition: 1s;
backface-visibility: hidden;
background-color: #f3f3f3;
border-radius: 10px;
box-shadow: 3px 4px 6px 1px #a6a6a6;
}
.front img {
border-top-left-radius: 10px;
border-top-right-radius: 10px;
max-width: 100%;
min-width: 100%;
height: 63%;
}
.front h3{
position: absolute;
top: 75%;
font-size: 18px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 1.2px;
}
.back {
transform: rotateY(180deg);
overflow-wrap: break-word;
hyphens: auto;
}
.back p{
display: block;
font-size: 20px;
line-height: 25px;
position: absolute;
top: 300px;
}
.back > span{
font-size: 16px;
line-height: 21px;
position: absolute;
text-align: justify;
padding: 25px;
text-indent: 30px;
}
.blocks-link a{
display: block;
color: #1e9125;
font-size: 18px;
font-weight: 600;
}
.blocks-link i{
display: block;
position: absolute;
top: 5px;
color: #578f31;
right: -30px;
}
.blocks-link a:hover .blocks-link i{
display: block;
}
.flip-card:hover .front {
transform: rotateY(180deg);}
.flip-card:hover .back {
transform: rotateY(360deg);
}
@media (max-width:860px) {
.flip-cards {
grid-template-columns: repeat(2, 1fr);
max-width: 800px;
}
.flip-card {
max-width: 400px;
}
}
@media (max-width:690px) {
.flip-cards {
display: block;
}
.flip-card {
margin: 0 auto;
width: 350px;
}
}
/*======================FLIP-CONTENT-CARDS end==============================*/
/*=======================FOR-CONTENT-BLOCKS-CONTENT start=====================*/
.blocks-content {
display: flex;
flex-direction: row;
margin: 70px auto;
box-shadow: 10px 15px 15px 0px #a6a6a6;
margin-bottom: 10%;
background: #eee;
border-radius: 5px;
overflow: hidden;
z-index: 0;
}
.blocks-content .blocks {
flex-basis: 45%;
height: auto;
position: relative;
z-index: 0;
}
.blocks-content .blocks-description {
flex-basis: 55%;
}
.blocks-content .blocks-description::before {
-webkit-transform: skewX(-3deg);
transform: skewX(-3deg);
content: "";
background: #eee;
width: 40px;
position: absolute;
left: -20px;
top: 0;
bottom: 0;
}
.blocks-content.alt .blocks-photo::before {
transform: skewX(3deg);
content: "";
background: #eee;
width: 40px;
position: absolute;
left: -20px;
top: 0px;
bottom: 0;
}
.blocks-content.alt {
flex-direction: row-reverse;
}
.blocks-content .blocks-photo {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-size: cover;
background-position: center;
}
.blocks-content a:hover {
color: #5ad67d;
}
.blocks-content .blocks-description {
padding: 1rem;
background: #eee;
position: relative;
z-index: 1;
}
.blocks-content .blocks-description h3 {
padding-top: 20px;
}
.blocks-link {
text-align: right;
}
.blocks-link a {
color: #578f31;
display: inline-block;
position: relative;
font-weight: 700;
}
.blocks-content p {
position: relative;
margin: 1rem 0 0;
}
.blocks-content p.text-block-without-shadow {
margin-top: 1.25rem;
font-size: 20px;
overflow-wrap: break-word;
hyphens: auto;
}
.blocks-content p.text-block-without-shadow:before {
content: "";
position: absolute;
height: 5px;
background: #578f31;
width: 55px;
top: -30px;
border-radius: 3px;
}
.blocks-content:hover .blocks-info {
left: 0%;
}
@media (max-width:920px) {
.blocks-content,
.blocks-content.alt {
flex-direction: column;
}
.blocks-content .blocks,
.blocks-content.alt .blocks{
flex-basis: auto;
position: relative;
z-index: 0;
height: 350px;
}
}
/*======================FOR-CONTENT-BLOCKS-CONTENT end=========================*/
/*===================TABS-CONTET-HOW TO REMOVAL GARBAGE start=================*/
.howto {
min-height: 620px;
margin-bottom: 50px;
}
.howto .tabs {
width: 100%;
margin: 80px auto;
position: relative;
border-bottom: 1px solid rgba(74, 74, 74, 0.2);
padding-bottom: 25px;
overflow: inherit;
}
.howto .tabs .tab {
display: inline-block;
}
.howto .tabs .tab>input[type="radio"] {
position: absolute;
left: -9999px;
max-width: 532px;
width: 100%;
}
.howto .tabs .tab>label {
display: block;
max-width: 210px;
font-size: 18px;
line-height: 1.44;
text-transform: uppercase;
cursor: pointer;
position: relative;
color: #696969;
padding-left: 50px;
}
.howto .tabs .tab>label i {
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
font-size: 16px;
display: none;
color: #0cae21;
}
.howto .tabs .tab>label:hover {
color: #37457a;
}
.howto .tabs .tab>label>span {
position: absolute;
left: 0;
font-size: 65px;
color: #868686;
font-weight: 600;
font-style: italic;
top: 50%;
transform: translateY(-50%);
}
.howto .tabs .tab>label::before {
position: absolute;
content: "";
border-bottom: 1px solid #578f31;
width: 80%;
bottom: -26px;
left: 40%;
transform: translateX(-50%);
border-width: 0;
}
.howto .tabs .tab>label:after {
position: absolute;
content: "";
height: 100%;
width: 1px;
top: 50%;
right: 10px;
border-right: 1px solid rgba(74, 74, 74, 0.2);
transform: translateY(-50%) rotate(12deg);
}
.howto .tabs .tab:last-child>label::after {
display: none;
}
.howto .tabs .content {
z-index: 0;
max-width: 609px;
position: absolute;
top: 190px;
right: -35px;
opacity: 0;
transition: opacity 400ms ease-out;
text-align: justify;
color: rgba(0, 0, 0, 0.53);
font-size: 18px;
line-height: 26px;
margin-bottom: 20px;
}
.howto .tabs .content p {
padding: 35px;
background-color: #f3f3f3;
box-shadow: 10px 15px 15px 0px #a6a6a6;
border-radius: 5px;
text-align: justify;
font-size: 20px;
}
.howto .tab .content>img {
display: inline-block;
position: absolute;
top: -75px;
max-width: 532px;
width: 100%;
z-index: -1;
left: -500px;
border-radius: 5px;
}
.howto .tabs>.tab>[id^="tab"]:checked+label {
top: 0;
color: #37457a;
}
.howto .tabs>.tab>[id^="tab"]:checked+label::before {
border-width: 1px;
}
.howto .tabs>.tab>[id^="tab"]:checked~[id^="tab-content"] {
z-index: 1;
/* or display: block; */
opacity: 1;
transition: opacity 400ms ease-out;
margin-top: 20px;
}
.tabs {
width: 100%;
margin: 40px auto;
position: relative;
border-bottom: 1px solid rgba(74, 74, 74, 0.2);
padding-bottom: 25px;
}
.tabs .tab {
display: inline-block;
}
.tabs .tab>input[type="radio"] {
position: absolute;
left: -9999px;
max-width: 532px;
width: 100%;
}
.size-main__tab>label {
display: block;
max-width: 250px;
width: 100%;
padding-left: 90px;
font-size: 22px;
line-height: 1.44;
text-transform: uppercase;
cursor: pointer;
position: relative;
color: #696969;
margin-right: 20px;
margin-bottom: 0px;
}
.container.height {
min-height: 650px;
}
.container.height.height-auto {
height: 750px;
}
.size {
margin-top: 40px;
}
.size-main__tab>label i {
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
font-size: 16px;
display: none;
color: #1b681e;
}
.size .tabs .tab>label:hover {
color: #37457a;
}
.size-main__tab>label>span {
position: absolute;
left: 20px;
font-size: 50px;
color: #aaaaaa;
top: 50%;
transform: translateY(-50%);
line-height: 0.77;
}
.size-main__tab:nth-child(1)>label>span {
left: 50px;
}
.size-main__tab:nth-child(3)>label>span {
left: 0px;
}
.size .tabs .tab>label::before {
position: absolute;
content: "";
border-bottom: 1px solid #0a0a0a;
width: 80%;
bottom: -26px;
left: 50%;
transform: translateX(-50%);
border-width: 0;
}
.size-main__tab>label:after {
position: absolute;
content: "";
height: 200%;
width: 1px;
top: 50%;
right: 5px;
border-right: 1px solid rgba(74, 74, 74, 0.2);
transform: translateY(-50%) rotate(12deg);
}
.size .tabs .tab:last-child>label::after {
display: none;
}
.size .size-main__tabs .content {
z-index: 0;
/* or display: none; */
/* overflow: hidden; */
position: absolute;
min-height: 500px;
top: 80px;
left: 0;
max-width: 1130px;
width: 100%;
opacity: 0;
transition: opacity 400ms ease-out;
text-align: justify;
color: rgba(0, 0, 0, 0.53);
font-size: 18px;
line-height: 26px;
margin-bottom: 20px;
padding: 35px;
background-color: #dfdfdf;
box-shadow: 10px 15px 15px 0px #a6a6a6;
}
.size .tabs>.tab>[id^="main__tab"]:checked+label {
top: 0;
color: #37457a;
}
.size .tabs>.tab>[id^="main__tab"]:checked+label::before {
border-width: 1px;
}
.size .tabs>.tab>[id^="main__tab"]:checked~[id^="tab-content"] {
z-index: 1;
/* or display: block; */
opacity: 1;
transition: opacity 400ms ease-out;
}
@media (max-width: 1129px) {
.howto {
min-height: 850px;
}
.howto .tabs {
text-align: center;
}
.howto .tabs .tab>label {
text-align: left;
}
.howto .tab .content>img {
position: unset;
transform: scale(1);
}
.howto .tab .content {
width: 100%;
left: 50%;
transform: translateX(-50%);
text-align: center;
}
.howto .tab .content {
top: 82px;
}
.howto .tabs .tab>label {
max-width: 150px;
font-size: 12px;
padding-left: 30px;
}
.howto .tabs .tab>label span {
font-size: 48px;
}
}
@media (min-width: 350px) and (max-width: 640px) {
.howto {
min-height: 800px;
}
.howto-tabs{
padding-bottom: 70px;
}
.howto .tabs {
border-bottom: 0;
}
.howto .tabs .tab {
width: 100%;
}
.howto .tabs .tab {
margin-bottom: 15px;
}
.howto .tabs .tab>label {
max-width: 550px;
font-size: 12px;
padding-left: 30px;
margin: 0 auto;
}
.howto .tabs .tab>label span {
font-size: 32px;
}
.howto .tabs .tab>label:after {
display: none;
}
.howto .tabs>.tab>[id^="tab"]:checked+label::before {
border-width: 0px;
}
.howto .tabs>.tab>[id^="tab"]:checked+label i {
display: block;
right: 30%;
}
.howto .tab .content {
top: 100px;
}
}
@media (min-width: 350px) and (max-width: 410px) {
.howto-tabs {
padding-bottom: 150px;
}
}
/*========================SLICK-SLIDER-CARD-PRICE start=======================*/
.slick-initialized .slick-slide{
margin-left: 10px;
margin-right: 10px;
}
.slick{
margin: 80px auto;
}
.slick-slide>div {
margin: 0 auto;
display: flex;
justify-content: center;
}
.slick_cell {
text-align: center;
background: #dfdfdf;
max-width: 360px;
height: 450px;
overflow: hidden;
border-radius: 15px;
box-shadow: 3px 4px 6px 1px #a6a6a6;
position: relative;
}
.slick_cell img {
margin: 30px auto 10px;
width: 280px;
}
.slick-title {
font-size: 24px;
color: #37457a;
font-weight: 700;
text-transform: uppercase;
text-align: center;
display: block;
margin-bottom: 17px;
letter-spacing: 1.1px;
}
.slick-price{
font-size: 30px;
font-weight: 700;
color: #37457a;
}
.slick-sub{
display: flex;
align-items: flex-start;
justify-content: center;
gap: 20px;
margin-top: 30px;
}
.sub-price{
font-size: 18px;
color: #37457a;
font-weight: 600;
}
.icon-text-title-plus h4,
.icon-text-title-minus h4{
color: #f3f3f3;
}
.multiple-items__slider-arrow {
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
z-index: 1;
background-color: rgba(25, 32, 109, 0.75);
width: 30px;
height: 30px;
border-radius: 50%;
cursor: pointer;
transition: all 0.3s;
}
.multiple-items__slider-arrow:hover {
background-color: rgba(25, 32, 109, 1);
}
.multiple-items__slider-arrow::before {
font-size: 30px;
color: #fff;
position: absolute;
top: 0;
}
.multiple-items__slider-arrow.next-arrow {
right: -23px;
}
.multiple-items__slider-arrow.next-arrow::before {
left: 8px;
}
.multiple-items__slider-arrow.prev-arrow {
left: -23px;
}
.multiple-items__slider-arrow.prev-arrow::before {
left: 7px;
}
.inside {
z-index: 9;
background: #37457a;
width: 130px;
height: 130px;
position: absolute;
top: -70px;
right: -70px;
border-radius: 0px 0px 300px 200px;
transition: all 0.5s, border-radius 2s, top 1s;
overflow: hidden;
}
.inside .icon {
position: absolute;
right: 90px;
top: 80px;
color: white;
opacity: 1;
}
.inside:hover {
width: 100%;
right: 0;
top: 0;
border-radius: 0;
height: 100%;
}
.inside:hover .icon {
opacity: 0;
right: 15px;
top: 15px;
}
.inside:hover .contents {
opacity: 1;
transform: scale(1);
transform: translateY(0);
}
.inside .contents {
margin-top: 10px;
padding-top: 20px;
padding-bottom: 10px;
padding-left: 10px;
padding-right: 10px;
opacity: 0;
transform: scale(0.5);
transform: translateY(-200%);
transition: opacity 0.2s, transform 0.8s;
}
.inside .contents h1,
.inside .contents p,
.inside .contents table {
color: white;
}
.inside .contents p {
font-size: 14px;
}
.image-avtopark img{
margin: 0 auto;
}
/*=========================SLICK-SLIDER-CARD-PRICE end========================*/
/*===========================default-slider start============================ */
.slider-default {
margin: 20px;
box-shadow: 10px 15px 15px 0px #a6a6a6;
border-radius: 5px;
}
.default-slide__img {
text-align: center;
}
.default-slide__img img {
min-height: 300px;
margin: 0 auto;
}
.default-slide__text {
background-color: #dfdfdf;
padding: 15px;
text-align: justify;
font-size: 20px;
line-height: 30px;
margin: 0;
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
}
.default-slider__arrow {
position: absolute;
top: 200px;
cursor: pointer;
z-index: 1;
background-color: rgba(25, 32, 109, 0.75);
width: 30px;
height: 30px;
border-radius: 50%;
}
.default-slider__arrow:before {
color: #ffffff;
font-size: 30px;
position: absolute;
top: 0;
}
.default-slider__arrow.next-arrow {
right: 0px;
}
.default-slider__arrow.next-arrow:before {
left: 8px;
}
.default-slider__arrow.prev-arrow:before {
left: 7px;
}
.default-slider__arrow.prev-arrow {
left: 0px;
}
.slider-default .slick-slide>div {
margin: 0;
}
/*===========================default-slider end============================== */
/*================================text-slider start========================= */
.slider-box {
display: flex;
justify-content: space-between;
margin: 120px 0;
}
.slider-text {
width: 49%;
}
.slider-text__box {
height: 377px;
}
#slider-text>.slick-list.draggable {
padding: 0;
}
#slider-text .slick-dots {
bottom: -40px;
}
.slider-text p {
padding: 20px 0;
}
.slider-box__img {
width: 49%;
}
.slider-box__img img {
width: 100%;
}
.slick-dots {
padding: 0;
margin: 0 auto;
text-align: center;
bottom: -70px;
width: 100%;
position: absolute;
}
.slick-dots li {
display: inline-block;
}
.slick-dots li+li {
margin-left: 10px;
}
.slick-dots>li>button {
outline: none;
padding: 0;
font-size: 0;
border: none;
cursor: pointer;
width: 20px;
height: 20px;
border-right: 3px solid #37457A;
border-radius: 50%;
background-color: rgba(83, 88, 146, 0.25);
transition: all 0.3s;
}
.slick-dots>li>button:hover {
background-color: rgba(83, 88, 146, 0.75);
}
.slick-dots>.slick-active>button {
background-color: rgba(83, 88, 146, 0.75);
}
.slider-box__text {
width: 49%;
}
.slider-img {
width: 49%;
}
#slider-img .slick-dots {
bottom: -50px;
}
.slider-img__slide img {
width: 100%;
}
pre {
display: none;
}
.text-center {
text-align: center;
}
.icon-text-title-minus,
.icon-text-title-plus,
.icon-text-plus,
.icon-text-minus {
display: flex;
padding: 0 20px;
}
.icon-text-title-minus>i,
.icon-text-title-plus>i,
.icon-text-plus>i,
.icon-text-minus>i {
padding-right: 10px;
}
.icon-text-plus>i,
.icon-text-minus>i,
.icon-text-title-minus>i {
margin-top: 7px;
}
.icon-text-title-minus>i {
margin-top: 5px;
}
.icon-text-title-plus>i {
margin-top: 3px;
}
.icon-text-plus>i,
.icon-text-title-plus>i {
color: #0cae21;
}
.icon-text-minus>i,
.icon-text-title-minus>i {
color: #b04135;
}
.icon-text-title-plus>h4,
.icon-text-title-minus>h4,
.icon-text-plus>h4,
.icon-text-minus>h4 {
font-size: 18px;
}
.icon-text-title-plus>p,
.icon-text-title-minus>p,
.icon-text-plus>p,
.icon-text-minus>p {
font-size: 16px;
text-align: left !important;
line-height: 25px;
}
.icon-text-title-plus,
.icon-text-title-minus {
margin: 0 auto;
position: relative;
width: max-content;
display: flex;
}
/*================================text-slider end========================= */
/*================================SLIDER PARTNERS start========================= */
.full-container{
position:relative;
}
.partners-row-overlay {
background-color: #ededed;
position: absolute;
height: 350px;
top: -50px;
right: 0;
left: 0;
}
.full-container > h2{
position: inherit;
margin: 50px auto;
}
.card-image-partners {
position: relative;
background: transparent;
cursor: pointer;
max-width: 150px;
width:100%;
margin: 0 auto;
transition: .5s;
}
.card-image-partners:hover {
transform: scale(1.3);
transition-duration: .5s;
}
/*================================SLIDER PARTNERS end========================= */
/*===================EFFECTIVE-SHEME-OF-WORK start============================*/
.sheme-of-work {
margin: 80px auto;
}
.sheme {
margin: 100px auto;
}
.step {
text-align: center;
display: block;
}
.step .icon {
width: 120px;
display: inline-block;
margin-bottom: 20px;
position: relative;
}
.step>h4 {
font-size: 20px;
line-height: 22px;
text-transform: uppercase;
letter-spacing: 1.1px;
}
.step>p {
text-align: center;
font-size: 18px;
font-weight: 300;
line-height: 1.3;
}
.t569__line {
max-width: 90px;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: space-around;
-ms-flex-pack: distribute;
justify-content: space-around;
position: absolute;
top: 60px;
right: 100px;
width: 100%;
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.t569__line-mobile {
display: none;
}
.t569__cirqle {
width: 6px;
height: 6px;
border-radius: 30px;
background-color: #37457a;
}
@media (min-width: 0px) and (max-width: 576px) {
.t569__bgimg {
height: 90px;
}
}
@media (min-width: 300px) and (max-width: 766px) {
.t569__line {
display: none;
}
.t569__cirqle {
margin: 0 auto 15px;
}
.t569__line-mobile {
display: grid;
margin-top: 10px;
margin-bottom: 10px;
}
}
@media (min-width: 576px) and (max-width: 766px) {
.t569__bgimg {
height: 120px;
}
.t569__cirqle {
margin: 0 auto 15px;
}
.t569__cirqle {
width: 6px;
height: 6px;
border-radius: 30px;
background-color: #222;
}
}
@media (min-width: 766px) and (max-width: 830px){
.t569__line {
max-width: 50px;
left: -22%;
}
}
@media (min-width: 831px) and (max-width: 920px){
.t569__line {
max-width: 50px;
left: -30%;
}
}
@media (min-width: 921px) and (max-width: 992px) {
.t569__bgimg {
height: 100px;
}
.t569__line {
max-width: 50px;
left: -40%;
}
}
@media (min-width: 992px) and (max-width: 1200px) {
.t569__line {
max-width: 55px;
}
}
/*===================EFFECTIVE-SHEME-OF-WORK end============================*/
/*===================FORMS-ZAKAZ start============================*/
#ZakazForm{
position: relative;
padding-top: 50px;
padding-bottom: 10px;
}
.zakaz_musor{
justify-content: space-between;
position: relative;
display: grid;
grid-template-areas:
"A A A A B B B B E E E E"
"A A A A C C C C E E E E"
"A A A A D D D D F F F F"
"G G G G G G G G G G G G";
padding: 50px;
gap: 10px;
}
.musor-zakaz{
grid-area: A;
max-width: 600px;
width: 100%;
display: grid;
background-color: #5d6c9ede;
padding: 20px 30px;
border-radius: 15px;
color: white;
text-shadow: 1px 1px 1px #525252;
position: relative;
height: 250px;
align-self: center;
margin-top: 20px;
justify-self: center;
}
#ZakazForm .name {
grid-area: B;
max-width: 280px;
width: 100%;
justify-self: center;
}
#ZakazForm .email {
grid-area: C;
max-width: 280px;
width: 100%;
justify-self: center;
}
#ZakazForm .phone {
grid-area: D;
max-width: 280px;
width: 100%;
justify-self: center;
}
#ZakazForm .comment {
grid-area: E;
align-self: center;
justify-self: center;
}
#ZakazForm .submit {
grid-area: F;
align-self: center;
justify-self: center;
}
#ZakazForm .tos-box {
grid-area: G;
display: flex;
justify-content: center;
align-items: center;
margin-top: 50px;
}
.form-check-input {
border: 1px solid rgba(0, 0, 0, 0.79);
}
#services_form{
margin-bottom: 0;
}
.services-form{
display: grid;
margin-top: 10px;
grid-template-columns: 230px 180px;
}
input#company_name[type="text"] {
background: #fff url("/images/forms-atributes/office.svg") no-repeat;
background-position-x: 0%;
background-position-y: 0%;
background-position: center left 10px;
font-style: italic;
font-size: 14px;
color: #525357;
border-radius: 5px;
padding-left: 50px;
padding-right: 10px;
}
input[type="text"] {
background: #fff url("/images/forms-atributes/user.svg") no-repeat;
background-position: center left 10px;
font-style: italic;
font-size: 14px;
color: #525357;
border-radius: 5px;
padding-left: 50px;
padding-right: 10px;
}
input[type="email"]{
background: #fff url("/images/forms-atributes/mail.svg") no-repeat;
background-position: center left 10px;
font-style: italic;
font-size: 14px;
color: #525357;
border-radius: 5px;
padding-left: 50px;
padding-right: 10px;
}
input[type="tel"]{
background: #fff url("/images/forms-atributes/phone.svg") no-repeat;
background-position: center left 10px;
font-style: italic;
font-size: 14px;
color: #525357;
border-radius: 5px;
padding-left: 50px;
padding-right: 10px;
}
.form-check-input:checked[type="radio"] {
background-image: none;
background-color: #23d81a;
border-color: #0a4709;
}
.form-check-input:checked[type="checkbox"] {
background-image: none;
background-color: #23d81a;
border-color: #0a4709;
}
.order{
background-color: #ededed;
margin: 0 auto;
padding: 50px 0;
}
@media (min-width: 0px) and (max-width: 691px) {
.services-form {
grid-template-columns: 200px;
}
}
@media (max-width: 890px){
.zakaz_musor{
grid-template-areas:
"A A A A A A A A"
"B B B B E E E E"
"C C C C E E E E"
"D D D D F F F F"
"G G G G G G G G";
width: 600px;
}
#ZakazForm .tos-box {
display: grid;
}
}
@media (max-width: 576px){
.zakaz_musor{
grid-template-areas:
"A A A A"
"B B B B"
"C C C C"
"D D D D"
"E E E E"
"F F F F"
"G G G G";
max-width: 400px;
width: 100%;
}
.musor-zakaz{
height: 300px;
}
#ZakazForm .comment {
width: 280px;
}
#ZakazForm .submit_1 {
margin-top: 30px;
}
#ZakazForm .tos-box {
margin-top: 30px;
}
}
/*===================FORMS-ZAKAZ end============================*/
/*===================CALCULYATOR-VYVOZ-MUSORA start============================*/
#userFormCalc {
margin: 80px auto;
background-color: #37457a;
padding: 60px 20px;
}
#userFormCalc h2{
color: #ededed;
}
#userFormCalc h2::after {
display: none;
}
.FormCalculate{
display: grid;
position: relative;
grid-template-areas:
"A A A A B B B B D D D D E E E E"
"A A A A B B B B D D D D E E E E"
"A A A A C C C C D D D D E E E E"
"A A A A C C C C D D D D E E E E"
"F F F F G G G G H H H H I I I I"
"J J J J J J J J J J J J J J J J";
color: #ededed;
margin-top: 20px;
}
.FormCalculate .musor{
grid-area: A;
width: 100%;
background-color: #58658f;
margin: 0;
padding: 20px;
}
.FormCalculate .obyom{
grid-area: B;
width: 100%;
background-color: rgb(52, 65, 115);
margin: 0;
padding: 20px;
}
.FormCalculate .range{
grid-area: C;
width: 100%;
background-color: rgb(52, 65, 115);
margin: 0;
padding-left: 30px;
padding-right: 30px;
padding-bottom: 60px;
}
.FormCalculate .pogruzka{
grid-area: D;
width: 100%;
background-color: rgb(26, 38, 83);
margin: 0;
padding: 20px;
}
.FormCalculate .oplata{
grid-area: E;
width: 100%;
background-color: rgb(21, 32, 73);
margin: 0;
padding: 20px;
}
.FormCalculate .totalprice{
grid-area: F;
width: 100%;
padding: 20px;
align-self: center;
}
.FormCalculate .name{
grid-area: G;
width: 100%;
padding-left: 20px;
padding-right: 20px;
align-self: center;
justify-self: center;
}
.FormCalculate .phone{
grid-area: H;
width: 100%;
margin-left: 15px;
padding-right: 40px;
align-self: center;
justify-self: center;
}
.FormCalculate .submit{
grid-area: I;
align-self: center;
justify-self: center;
}
.FormCalculate .tos-box{
grid-area: J;
position: relative;
justify-content: center;
display: flex;
padding: 40px 5px 5px 5px;
align-items: center;
}
.obyomMus{
display: flex;
width: 310px;
flex-wrap: wrap;
}
.rsfp_thankyou_popup_inner {
border-radius: 10px;
padding: 60px 20px 30px !important;
}
.rsfp_thankyou_popup_inner p{
color: #37457A;
font-size: 26px;
text-align: center;
margin-top: 20px;
}
.greatfull{
font-size: 80px;
position: relative;
color: green;
text-align: center;
}
.rsfp_thankou_popup_close_btn{
top: 20px !important;
right: 30px !important;
}
.closeCalc {
position: absolute;
top: 31px;
right: 30px;
}
#userFormCalc label.form-check-label[for="obyom0"] {
background: url("/images/sprites/SVG/kont8_2d.svg") no-repeat;
height: 36px;
width: 60px;
cursor: pointer;
padding: 40px 0px 20px 0px;
text-align: center;
}
#userFormCalc label.form-check-label[for="obyom1"] {
background: url("/images/sprites/SVG/kont20_2d.svg") no-repeat;
height: 36px;
width: 60px;
cursor: pointer;
padding: 40px 0px 20px 0px;
text-align: center;
}
#userFormCalc label.form-check-label[for="obyom2"] {
background: url("/images/sprites/SVG/kont27_2d.svg") no-repeat;
height: 36px;
width: 60px;
cursor: pointer;
padding: 40px 0px 20px 0px;
text-align: center;
}
#userFormCalc label.form-check-label[for="obyom3"] {
background: url("/images/sprites/SVG/samosval-wite.svg") no-repeat;
width: 80px;
cursor: pointer;
padding: 40px 0px 20px 0px;
text-align: center;
}
#userFormCalc label.form-check-label[for="obyom4"] {
background: url("/images/sprites/SVG/samosval-wite.svg") no-repeat;
width: 80px;
cursor: pointer;
padding: 40px 0px 20px 0px;
text-align: center;
}
#obyom0, #obyom1, #obyom2, #obyom3, #obyom4{
background-color: #34417300;
border: 0;
}
#obyom0:checked, #obyom1:checked, #obyom2:checked {
box-shadow: 0 0 0 3px #4c911e;
background-color: #34417300;
position: absolute;
width: 60px;
height: 38px;
border-radius: 0;
margin: 0;
}
#obyom3:checked, #obyom4:checked {
box-shadow: 0 0 0 3px #4c911e;
background-color: #34417300;
position: absolute;
width: 70px;
height: 42px;
border-radius: 0;
margin: 0;
}
#userFormCalc .form-check {
margin-bottom: 15px;
margin-top: 15px;
}
#userFormCalc .rsfp-skinHtml5 .irs-max, #userFormCalc .rsfp-skinHtml5 .irs-min {
color: white;
font-size: 16px;
background: rgb(52, 65, 115);
}
#userFormCalc .totalprice label.form-label[for="totalPrice"] {
text-transform: uppercase;
font-size: 20px;
font-weight: 700;
}
.totalPriceMus{
display: flex;
align-self: end;
}
#tos_box0-lbl a{
color: #29ceff;
}
.formRequired {
color: red;
font-size: 26px;
font-weight: 500;
}
#musor-lbl, #obyom-lbl, #pogruzka-lbl, #oplata-lbl, #rol-lbl, #totalPrice-lbl, #range-lbl{
text-transform: uppercase;
font-size: 20px;
font-weight: 700;
}
#totalPrice{
background-color: #37457a;
border: none;
color: #fff;
display: block;
font-size: 22px;
font-weight: 700;
background: none;
}
#tos_box-lbl {
align-self: center;
font-size: 16px;
margin-bottom: 10px;
}
#tos_box0-lbl{
font-size: 16px;
}
#tos_box-lbl a{
color: #41d2ff;
}
@media (min-width: 800px) and (max-width: 1020px) {
.FormCalculate{
grid-template-areas:
"A A A A B B B B D D D D"
"A A A A B B B B D D D D"
"A A A A C C C C D D D D"
"A A A A C C C C D D D D"
"E E E E E E E E E E E E"
"F F F F G G G G I I I I"
"F F F F H H H H I I I I"
"J J J J J J J J J J J J";
}
}
@media (min-width: 620px) and (max-width: 800px) {
.FormCalculate{
grid-template-areas:
"A A A A B B B B"
"A A A A B B B B"
"A A A A C C C C"
"A A A A C C C C"
"D D D D E E E E"
"F F F F G G G G"
"F F F F H H H H"
"I I I I I I I I"
"J J J J J J J J";
}
.FormCalculate .submit {
padding-top:50px;
}
}
@media (min-width: 300px) and (max-width: 720px) {
.FormCalculate .tos-box{
display: block;
margin: 0 auto;
}
}
@media (min-width: 300px) and (max-width: 620px) {
.FormCalculate{
grid-template-areas:
"A A A A"
"B B B B"
"C C C C"
"D D D D"
"E E E E"
"F F F F"
"G G G G"
"H H H H"
"I I I I"
"J J J J";
}
.FormCalculate .submit {
padding-top:50px;
}
}
@media (min-width: 300px) and (max-width: 620px) {
#tos_box0-lbl {
font-size: 14px;
}
#tos_box-lbl {
font-size: 14px;
}
}
/*===================SECTION-CUSTOMER=======================*/
.section-customer{
background-color: #37457A;
margin: 80px auto;
}
.customer{
display: grid;
grid-template-columns: minmax(300px, min-content) calc(400px);
padding: 80px 30px;
}
.customer_help{
background-color: rgb(21, 32, 73);
padding: 30px;
}
.customer_title{
color: #ededed;
text-transform: uppercase;
font-size: 20px;
font-weight: 700;
text-align: right;
padding-bottom: 0;
padding-right: 0;
}
.customer_text{
color: #ededed;
text-transform: uppercase;
font-size: 20px;
font-weight: 700;
text-align: right;
}
#rsform10 {
display: grid;
justify-content: center;
gap: 30px;
}
#rsform10 label {
color: #FFFFFF;
}
.slider-avtopark .slick-dots > .slick-active > button{
background-color: #f15141;
}
.slider-avtopark .slick-dots li > button{
background-color: white;
border-right: none;
}
.slider-avtopark .slick-list.draggable{
padding: 0;
}
@media (min-width: 200px) and (max-width: 950px) {
.customer {
display: block;
}
.customer_help {
margin: 150px auto 0px;
}
}
@media (min-width: 500px) and (max-width: 950px) {
.customer_title,
.customer_text {
text-align: center;
}
}
/*===================SECTION-PARALLAX=======================*/
.parallax {
background: url(/images/banners/parallax-glavnaya.webp);
position: relative;
height: 400px;
background-repeat: repeat-x;
background-size: cover;
background-attachment: fixed;
background-position: 50% 50%;
}
.parallax-content {
display: flex;
justify-content: space-around;
color: #ff503e;
text-shadow: 1px 1px 1px #000;
font-size: 70px;
align-items: center;
height: 400px;
padding: 0px 50px;
}
.text-inline{
display: flex;
justify-content: space-evenly;
}
.blok-content-icon{
text-align: center;
}
.blok-content-text h5{
color:#ededed;
align-self: center;
}
.blok-content-text h3{
color:#ededed;
font-size: 36px;
}
@media (min-width: 0px) and (max-width: 840px) {
.parallax {
height: 880px;
}
.parallax-content {
flex-direction: column;
justify-content: space-evenly;
height: 880px;
}
}
/*===================КОНТЕЙНЕРЫ И ИХ ТЕХНИЧЕСКИЕ ХАРАКТЕРИСТИКИ=================================*/
.section-techContainers{
width: 100%;
max-width: 1098px;
}
.our-kont-sell{
display: grid;
justify-content: center;
}
.kont-tech-container{
display: grid;
grid-template-columns: repeat(3, 1fr);
padding-top: 40px;
}
.our-kont-sell:nth-last-child(2) .our-kont-img{
width: 280px;
height: auto;
position: relative;
top: 10px;
}
.our-kont-sell:nth-last-child(3) .our-kont-img{
width: 280px;
height: auto;
}
.our-kont-sell:nth-last-child(1) .our-kont-img{
width: 250px;
}
.our-kont-sell:nth-last-child(2) .our-kont-title{
display: block;
margin-top: -18px;
}
.our-kont-sell:nth-last-child(3) .our-kont-title{
display: block;
margin-top: -18px;
}
.our-kont-table{
margin: 30px auto;
width: 250px;
}
.table-blue{
background: #e0eaf3;
color: #5f5f5f;
}
.table-darkblue{
background: #536297;
color: #e7e7e7;
}
.table-blue > td,
.table-darkblue > td{
text-align: right;
padding: 10px 20px 10px 0;
}
.table-blue > th,
.table-darkblue > th{
text-align: left;
padding: 10px 0px 10px 20px;
}
.our-kont-btn{
text-align: center;
margin-top: 20px;
}
@media (max-width: 860px){
.kont-tech-container{
grid-template-columns: 1fr;
}
.our-kont-sell {
padding-bottom: 50px;
}
}
/*================================МОДАЛЬНОЕ ОКНО=================================*/
.fade {
opacity: 1 !important;
}
.modal-backdrop {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1040;
background-color: #fff;
}
.modal-backdrop.fade {
opacity: 0.7 !important;
}
.modal-dialog{
max-width: 75%;
border: 2px solid #34547a;
border-radius: 10px;
box-shadow: 0 10px 40px rgba(0,0,0,0.4);
}
.btn-close{
align-self: end;
padding: 40px 40px 0 0;
}
.modal-header{
align-self: center;
padding-top: 0px;
}
.modal-body{
padding: 20px 40px 40px;
}
.modal-title{
font-weight: 600;
}
.modal-text{
text-align: justify;
}
@media (min-width: 1500px){
.modal-dialog {
max-width: 40%;
}
}
@media (min-width: 360px) and (max-width: 860px) {
.modal-dialog {
max-width: 95%;
}
}
/*===================SECTION-RATING=======================*/
.rewiews{
display: grid;
grid-template-areas:
"A D"
"B D"
"C D";
grid-gap: 50px;
margin: 80px 10px 80px;
}
.otzyvy{
grid-area: D;
display: grid;
text-align: justify;
}
.otzyvy p{
padding: 20px 20px 5px 20px;
margin-bottom: 0px;
font-size: 22px;
}
.quote-left{
margin-right: 10px;
}
.autor_name_date{
padding-left: 20px;
color: green;
font-size: 18px;
font-weight: 500;
}
.autor_name_date::before{
font-family: Font Awesome\ 5 Free;
color: green;
content: "\f068";
font-weight: 600;
margin-right: 10px;
font-size: 26px;
top: 3px;
position: relative;
}
.otzyvy a{
color: #37457a;
padding-right: 20px;
font-size: 20px;
font-weight: 600;
text-decoration: none;
text-align: end;
}
.otzyvy a::after{
font-family: Font Awesome\ 5 Free;
color: #37457a;
content: "\f178";
font-weight: 600;
margin-left: 10px;
font-size: 24px;
top: 3px;
position: relative;
}
.rating-site{
grid-area: A;
color: #37457a;
font-weight: 700;
}
.rating-poisk{
grid-area: B;
color: #37457a;
font-weight: 700;
}
.btn-rating{
grid-area: C;
width: 250px;
}
.poisk{
display: flex;
}
.slash{
font-size: 40px;
display: block;
top: -15px;
position: relative;
}
.extravote {
width: 250px;
display: grid;
}
.extravote-stars,
.extravote-info {
margin: 0!important;
padding: 0!important;
position: relative;
vertical-align: middle;
}
.extravote-info.ihide {
display: none;
}
.voted .extravote-info.ihide, .extravote-stars {
display: inline-block;
}
.extravote-stars,
.extravote-star a,
.extravote-info,
.extravote-stars .current-rating {
height: 50px;
line-height: 25px;
}
.current-rating ,
.extravote-small .extravote-stars,
.extravote-small .extravote-star a,
.extravote-small .extravote-info,
.extravote-small .extravote-stars .current-rating{
height: 22px;
line-height: 22px;
}
.extravote-stars {
font-size: 1em;
overflow: hidden;
width: 252px;
}
.extravote-small .extravote-stars {
width: 110px;
}
.extravote-info {
font-size: .98em;
color: #F15141;
font-weight: 700;
z-index: 1;
justify-self: center;
}
.extravote-star {
background-position: 0!important;
background-image: none;
display: inline;
margin: 0!important;
padding: 0!important;
}
.extravote-stars,
.extravote-star a:hover,
.extravote-stars .current-rating {
background-image: url('/images/sprites/SVG/star.svg')!important;
background-color: transparent!important;
background-repeat: repeat-x!important;
display: block;
}
.extravote-star a:hover,
.extravote-stars .current-rating {
background-position: left -1000px;
}
.extravote-star a,
.extravote-stars .current-rating {
border: medium none;
cursor: pointer;
left: 0;
outline: none;
overflow: hidden;
position: absolute;
text-indent: -1000em!important;
top: 0;
}
.extravote-star a:hover {
background-position: left bottom!important;
}
.extravote-star a:focus,
.extravote-star a:active {
background: none!important;
}
.extravote-stars .current-rating {
background-position: left center;
z-index: 1;
}
.extravote-star a.ev-5-stars,
.extravote-star a.ev-10-stars,
.extravote-star a.ev-15-stars,
.extravote-star a.ev-20-stars,
.extravote-star a.ev-25-stars,
.extravote-star a.ev-30-stars,
.extravote-star a.ev-35-stars,
.extravote-star a.ev-40-stars,
.extravote-star a.ev-45-stars,
.extravote-star a.ev-50-stars {
margin: 0;
padding: 0;
}
.extravote-star a.ev-5-stars {
width: 10%;
z-index: 12;
}
.extravote-star a.ev-10-stars {
width: 20%;
z-index: 11;
}
.extravote-star a.ev-15-stars {
width: 30%;
z-index: 10;
}
.extravote-star a.ev-20-stars {
width: 40%;
z-index: 9;
}
.extravote-star a.ev-25-stars {
width: 50%;
z-index: 8;
}
.extravote-star a.ev-30-stars {
width: 60%;
z-index: 7;
}
.extravote-star a.ev-35-stars {
width: 70%;
z-index: 6;
}
.extravote-star a.ev-40-stars {
width: 80%;
z-index: 5;
}
.extravote-star a.ev-45-stars {
width: 90%;
z-index: 4;
}
.extravote-star a.ev-50-stars {
width: 100%;
z-index: 3;
}
@media (min-width:760px) and (max-width:990px) {
.rewiews {
grid-gap: 30px;
}
}
@media (max-width: 760px) {
.rewiews {
grid-template-areas:
"A"
"B"
"C"
"D";
grid-gap: 10px;
}
.rating-site {
justify-self: center;
}
.rating-site p{
text-align: center;
}
.rating-poisk {
justify-self: center;
}
.rating-poisk p{
text-align: center;
}
#feedback-134{
justify-self: center;
}
.btn-rating{
justify-self: center;
}
}
/*===================OTZYVY_SITE=======================*/
.otzyvy_site{
display: grid;
text-align: justify;
grid-template-columns: auto auto;
gap: 50px;
margin-top: 80px;
margin-bottom: 80px;
}
.otzyvy_site p{
padding: 30px 5px 30px 0px;
margin-bottom: 0px;
font-size: 20px;
}
.otzyvy_site span{
padding-left: 20px;
color: green;
font-size: 18px;
font-weight: 500;
}
.otzyvy_site span::before{
font-family: Font Awesome\ 5 Free;
color: green;
content: "\f068";
font-weight: 600;
margin-right: 10px;
font-size: 26px;
top: 3px;
position: relative;
}
.otzyv{
border-radius: 10px;
padding: 35px;
-webkit-box-shadow: 18px 18px 32px 0px rgba(34, 60, 80, 0.2);
-moz-box-shadow: 18px 18px 32px 0px rgba(34, 60, 80, 0.2);
box-shadow: 18px 18px 32px 0px rgba(34, 60, 80, 0.2);
}
.otzyvy_img{
display: grid;
grid-template-columns: auto auto;
}
.stars-5{
justify-self: end;
}
.rating_otzyvy{
display: grid;
grid-template-columns: auto auto;
justify-content: space-around;
align-items: center;
margin-top: 100px;
}
@media (max-width: 840px) {
.otzyvy_site {
grid-template-columns: auto;
}
.rating-poisk_otzyvy p{
text-align: center;
}
.otzyv{
max-width: 670px;
margin: 0px auto;
width: 100%;
}
}
@media (max-width: 600px) {
.rating_otzyvy {
grid-template-columns: auto;
}
.otzyv{
max-width: 470px;
margin: 0px auto;
width: 100%;
}
}
/*==========================FAQ-QUESTIONS-TERMS start=========================*/
.faq {
margin: -8px 0;
background-color: #ededed;
padding: 60px 10px 100px;
}
.question-box .flipIn,
.question-box h3,
.question-box ul li {
-webkit-animation: flipdown 1.5s ease both;
animation: flipdown 1.5s ease both;
}
.faq h3 {
margin: 10px 0;
}
.faq__inner::before {
content: "";
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
background-color: rgba(0, 0, 0, 0.45);
z-index: 0;
}
.faq-question__box.question-box {
border-radius: 5px;
padding: 30px;
margin: 0 15px;
z-index: 1;
}
.faq-question__box.question-box__list {
list-style: none;
-webkit-perspective: 900;
perspective: 900;
padding: 0;
margin: 0;
}
.question{
box-shadow: 10px 15px 15px 0px #a6a6a6;
}
.question-box__list .question-box__item {
color: #37457a;
position: relative;
width: 97%;
border-top: 2px solid #bdbdbd;
border-bottom: 2px solid #fff;
}
.question-box__item > i{
position: absolute;
right: -20px;
}
.question-box__list .question-box__item h3 {
color: #37457a;
text-align: left;
font-size: 24px;
font-weight: 500;
padding: 15px 5px 0px 5px;
}
.question-box__list li:nth-of-type(1) {
-webkit-animation-delay: 0.8s;
animation-delay: 0.8s;
}
.question-box__list li:nth-of-type(2) {
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
.question-box__list li:nth-of-type(3) {
-webkit-animation-delay: 1.5s;
animation-delay: 1.5s;
}
.question-box__item-descr{
color: #000;
padding: 15px 0px 15px 30px;
}
.question-box__item-descr p{
margin-bottom: 0;
font-size: 20px;
}
.question-box__list .question-box__item i {
position: absolute;
right: -10px;
top: 40px;
font-size: 30px;
color: #379b37;
}
.question-box__list>.question-box__item>input[type="checkbox"] {
position: absolute;
cursor: pointer;
width: 100%;
height: 100%;
z-index: 1;
opacity: 0;
}
.question-box__list>.question-box__item>input[type="checkbox"]:checked~.question-box__item-descr p {
margin-top: 0;
max-height: 0;
opacity: 0;
-webkit-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
transform: translate(0, -50%);
}
.question-box__list>.question-box__item>input[type="checkbox"]:checked~i {
-webkit-transform: translate(2px, 0) rotate(-90deg);
-ms-transform: translate(2px, 0) rotate(-90deg);
transform: translate(2px, 0) rotate(-90deg);
}
@-webkit-keyframes flipdown {
0% {
opacity: 0;
-webkit-transform-origin: top center;
transform-origin: top center;
-webkit-transform: rotateX(-90deg);
transform: rotateX(-90deg);
}
80% {
-webkit-transform: rotateX(8deg);
transform: rotateX(8deg);
}
83% {
-webkit-transform: rotateX(6deg);
transform: rotateX(6deg);
opacity: 1;
}
92% {
-webkit-transform: rotateX(-3deg);
transform: rotateX(-3deg);
}
100% {
-webkit-transform-origin: top center;
transform-origin: top center;
-webkit-transform: rotateX(0deg);
transform: rotateX(0deg);
}
}
@keyframes flipdown {
0% {
opacity: 0;
-webkit-transform-origin: top center;
transform-origin: top center;
-webkit-transform: rotateX(-90deg);
transform: rotateX(-90deg);
}
80% {
-webkit-transform: rotateX(8deg);
transform: rotateX(8deg);
}
83% {
-webkit-transform: rotateX(6deg);
transform: rotateX(6deg);
opacity: 1;
}
92% {
-webkit-transform: rotateX(-3deg);
transform: rotateX(-3deg);
}
100% {
-webkit-transform-origin: top center;
transform-origin: top center;
-webkit-transform: rotateX(0deg);
transform: rotateX(0deg);
}
}
.faq-additional__box {
width: 34%;
background-color: rgba(214, 214, 214, 0.8);
border-radius: 5px;
margin: 0 15px;
z-index: 1;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: space-evenly;
-ms-flex-pack: space-evenly;
justify-content: space-evenly;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.faq-additional__box h4 {
font-size: 22px;
}
.faq-additional__box h4>span {
display: block;
}
.faq-additional__box-btn i {
position: absolute;
right: 15px;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
.question a{
display: block;
width: 100%;
color: #37457a;
padding-right: 20px;
padding-bottom: 40px;
font-size: 20px;
font-weight: 600;
text-decoration: none;
text-align: end;
}
.question a::after {
font-family: Font Awesome\ 5 Free;
color: #37457a;
content: "\f178";
font-weight: 600;
margin-left: 10px;
font-size: 24px;
top: 3px;
position: relative;
}
/*================================FOOTER========================*/
.footer{
background-color: #37457a;
margin-top: 0px;
position: relative;
top: -10px;
}
.footer-columns{
display: grid;
grid-template-areas:
"A A A A B B B B D D D D"
"A A A A B B B B D D D D"
"A A A A C C C C D D D D"
"A A A A C C C C D D D D"
"E E E E F F F F G G G G"
"E E E E F F F F G G G G"
"H H H H H H H H H H H H";
gap: 0 90px;
align-content: center;
align-items: baseline;
justify-content: center;
padding-bottom: 50px;
}
.footer-contacts{
grid-area: A;
width: 330px;
position: relative;
top: 10px;
}
.footer-menu-uslugi{
grid-area: B;
width: 100%;
}
.footer-menu-zony{
grid-area: C;
width: 100%;
}
.footer-info{
grid-area: D;
width: 100%;
}
.footer-rating{
grid-area: E;
width: 100%;
position: relative;
top: 3px;
left: 10px;
}
.footer-rating .poisk{
padding-top: 10px;
}
.footer-menu-sosial{
grid-area: F;
width: 100%;
}
.callback-footer{
grid-area: G;
width: 100%;
align-self: flex-start;
position: relative;
top: 40px;
left: 30px;
}
.footer-rights{
grid-area: H;
width: 100%;
position: relative;
left: 10px;
}
.footer-icons{
display: grid;
grid-template-columns: repeat(5, 1fr);
width: 280px;
position: relative;
left: 30px;
}
.footer-time-text{
margin: 10px;
font-size: 16px;
text-align: justify;
font-weight: 600;
}
.footer-logo{
width: 320px;
margin-top: 20px;
}
.footer-menu-title,
.footer-menu-list{
list-style-type: none;
}
.footer-menu-title{
font-size: 20px;
text-transform: uppercase;
font-weight: 700;
color: #f3f3f3;
position: relative;
}
.footer-menu-list{
margin-top: 5px;
}
.footer-rating ul{
padding-left: 0px;
}
.footer-rights .footer-link{
color: #f3f3f3 !important;
text-transform: uppercase;
text-decoration: none;
position: relative;
left: 5px;
}
.footer-rights .footer-link:hover{
color: #29ceff !important;
}
.rights-text{
text-align: justify;
}
.rsform-simple-js-modal-content {
color: #000;
}
.footer a:not(.btn), .footer .btn-link {
color: blue;
}
.footer a:not(.btn):hover{
color: #37457A;
}
.footer a:not(.btn):active{
color: #37457A;
}
.footer-menu-list .footer-list-link{
color: #f3f3f3 !important;
text-decoration: none;
}
.footer-menu-list .footer-list-link:hover{
color: #29ceff !important;
}
@media (max-width: 1130px) {
.footer-columns{
grid-template-areas:
"A A A A D D D D"
"A A A A D D D D"
"A A A A D D D D"
"A A A A D D D D"
"B B B B C C C C"
"B B B B C C C C"
"E E E E F F F F"
"E E E E F F F F"
"H H H H G G G G";
max-width: 800px;
margin: 0 auto;
gap: 0px;
padding-left: 10px;
padding-right: 20px;
}
.rights-text {
font-size: 13px;
}
}
@media (max-width: 630px) {
.footer-columns{
grid-template-areas:
"A A A A"
"B B B B"
"C C C C"
"D D D D"
"E E E E"
"F F F F"
"G G G G"
"H H H H";
max-width: 600px;
margin: 0 auto;
gap: 20px;
padding-left: 10px;
padding-right: 20px;
}
.callback-footer {
top: 0;
left: 0;
}
.footer-menu-sosial ul{
padding-left: 0;
}
.rights-text {
width: 300px;
font-size: 13px;
}
.footer-icons {
left: 0;
}
.footer-menu-sosial {
position: relative;
top: -20px;
}
}
/*==========================BACK-TO-TOP=======================*/
.back-to-top-link {
width: 40px;
height: 40px;
background-color: #dfdfdf;
text-decoration: none;
}
.back-to-top-link::after {
font-family: Font Awesome\ 5 Free;
color: #37457a;
content: "\f102";
font-weight: 600;
font-size: 26px;
left: 1px;
bottom: 8px;
position: relative;
}
.back-to-top-link:hover {
background-color: #37457a;
}
.back-to-top-link:hover:after {
color: #dfdfdf;
}
.back-to-top-link:focus{
background-color: #dfdfdf;
border: 1px solid #37457a;
}
.back-to-top-link:focus:hover{
background-color: #37457a;
border: 1px solid #dfdfdf;
}
.back-to-top-link:focus:hover:after{
color: #dfdfdf;
}
@media (min-width: 1300px) {
.back-to-top-link{
left: 90%;
}
}
@media (min-width: 1098px) {
.back-to-top-link{
left: 95%;
}
}
.SmartCaptcha-Overlay.SmartCaptcha-Overlay_visible {
height: 100%;
width: 100%;
}