/*---------Colors---------------*/
:root {
--color-accent: #EBD200;
--color-black: #080200;
--color-grey: #363538;/*#666;*/
--color-grey-light:#95959A;
--color-grey-white:#DDDDDD;
--color-white: #FFF;
--color-green: #3AB546;
--color-blue: #00C2FF;
--color-yellow: yellow;
--color-bg-white:#F5F5F5;
--shadow:0px 0px 20px rgb(0 0 0 / 10%);
}
/*---------Main-----------------*/
body {
font-family: 'Inter';
color:var(--color-black);background:#fff;
font-weight:400;font-size:16px;line-height:160%;letter-spacing:-0.2px;
-webkit-font-smoothing: subpixel-antialiased;
}
p{margin:0 0 15px 0}
img{display:block;width:100%;}
b {font-weight:500;color:var(--color-grey);}
mark {background-color: transparent;display:inline !important;}
mark span {background-color: #EBD200 !important;/*color:var(--color-white);*/}
.h1 mark span {margin:6px -8px;padding:0 8px;}
.h2 mark span {margin:2px -6px;padding:0 8px;}
@media(max-width:768px){
.h1 mark span {margin: 2px -6px;}
}
/*Скролл*/
body{scrollbar-width:thin;} /*Firefox*/
::-webkit-scrollbar {width:8px;height:8px;}
::-webkit-scrollbar-button {display:none;}
::-webkit-scrollbar-track {display:none;}
::-webkit-scrollbar-track-piece {background-color:transparent;}
::-webkit-scrollbar-thumb {background-color:var(--color-black);}
::-webkit-scrollbar-corner {display:none;}}
::-webkit-resizer {display:none;}
/*Анимация мерцающего фона*/
/*body:before{top:-10rem;left:-10rem;width:calc(100% + 20rem);height:calc(100% + 20rem);content:'';z-index:-1;position:fixed;pointer-events:none;background-position:50%;background-image:url(/upload/icon/bg.png);pointer-events:none;animation:noise 1s steps(2) infinite}
@keyframes noise{0{transform:translate3d(0,9rem,0)}10%{transform:translate3d(-1rem,-4rem,0)}20%{transform:translate3d(-8rem,2rem,0)}30%{transform:translate3d(9rem,-9rem,0)}40%{transform:translate3d(-2rem,7rem,0)}50%{transform:translate3d(-9rem,-4rem,0)}60%{transform:translate3d(2rem,6rem,0)}70%{transform:translate3d(7rem,-8rem,0)}80%{transform:translate3d(-9rem,1rem,0)}90%{transform:translate3d(6rem,-5rem,0)}to{transform:translate3d(-7rem,0,0)}}*/
/*Анимация перехода black*/
/*html {background: var(--color-black);}
body {animation:body 0.7s;background: var(--color-white);}
@keyframes body {0% {opacity:0;background: #000;} 100% {opacity:1;}}*/
/*Анимация перехода*/
body{animation:body 0.7s;}
@keyframes body {0% {opacity:0;} 100% {opacity:1;}}
/*---------Переключение языка----*/
.lang {margin-left:45px;border:1px solid var(--color-grey);border-radius:4px;line-height:32px;display:flex;justify-content:center;align-items:center;}
.lang a {padding:0 9px;font-size:10px;line-height:28px;margin:2px;border-radius:3px;}
.lang a.active {background: var(--color-grey);color: var(--color-white);}
@media(max-width:768px){
.lang {margin-left:0px;}
.lang a {padding:0 7px;line-height:24px;}
}
/*---------Colors BG------------*/
.bg-accent {background: var(--color-accent);color: var(--color-white);}
.bg-black {background: var(--color-black);color: var(--color-white);}
.bg-grey {background: var(--color-bg-white);}
/*Фоновое изображение*/
.bg {width:100%;background-repeat:no-repeat !important;background-size:cover !important;background-attachment:inherit !important;background-position:50% 50% !important;}
/*Позиция фона*/
.bg-1{background-position:10% 0%;}
.bg-2{background-position:20% 0%;}
.bg-3{background-position:30% 0%;}
.bg-4{background-position:40% 0%;}
.bg-5{background-position:50% 0%;}
.bg-6{background-position:60% 0%;}
.bg-7{background-position:70% 0%;}
.bg-8{background-position:80% 0%;}
.bg-9{background-position:90% 0%;}
.bg-10{background-position:100% 0%;}
@media (max-width: 768px){
.bg-mobile-1{background-position:10% 0%;}
.bg-mobile-2{background-position:20% 0%;}
.bg-mobile-3{background-position:30% 0%;}
.bg-mobile-4{background-position:40% 0%;}
.bg-mobile-5{background-position:50% 0%;}
.bg-mobile-6{background-position:60% 0%;}
.bg-mobile-7{background-position:70% 0%;}
.bg-mobile-8{background-position:80% 0%;}
.bg-mobile-9{background-position:90% 0%;}
.bg-mobile-10{background-position:100% 0%;}
}
/*---------Cursor---------------*/
/*html {cursor:none;}
.cursor {display: none;}
@media (any-pointer: fine) {
.cursor { display:block;height:5px;width:5px;border-radius:50%;background:#000;position:fixed;pointer-events:none;z-index:999999999;}
.cursor::after {backdrop-filter: invert(1);height:19px;width:19px;border-radius:50%;transform: translate(-7px, -7px); transition-duration:150ms;top:inherit;left:inherit;content:"";position:inherit;transition-timing-function:ease-out;pointer-events: none;}
.cursor.active {background:transparent;}
.cursor.active::after{transition-duration:150ms;width:50px;height:50px;transform:translate(-24px, -24px);}
для FireFox @supports (-webkit-backdrop-filter: none) or (backdrop-filter: none) {}
@supports not ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) {
.cursor::after {border:1px solid rgb(0 0 0 / 60%);}
.cursor.active::after {border:1px solid var(--color-accent);}
}
}*/
.cursor {display: none;}
@media (any-pointer: fine) {
.cursor {transition-duration:150ms; opacity:1;transform:translate(-50%, -50%);display:block;height:8px;width:8px;border-radius:50%;position:fixed;pointer-events:none;z-index:999999 !important;}
.cursor.active {cursor: pointer; border-radius:100%;transform:translate(-50%, -50%);background:none !important;}
.cursor.active:after{animation:cursorActive 2s ease infinite;border:3px solid var(--color-accent);content:"";position:absolute;z-index:0;top:50%;left:50%;width:30px;height:30px;border-radius:100%;transform:translate(-50%,-50%);}
@keyframes cursorActive{0%{width:0px;height:0px;opacity:1}100%{width:60px;height:60px;opacity:0}}
/*тяни*/
.cursor .pull {display: none; position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:60px;height:60px;background:var( --color-black);color:var( --color-white);font-weight:300;border-radius:100%;align-items:center;justify-content:center;}
}
/*---------Прилепающее img------*/
.hover-img {cursor: pointer;display:inline-block;}
.hover-img .img {position:fixed;z-index:-1;overflow:hidden;width:0px;transition:all 1.6s cubic-bezier(0.16, 1, 0.3, 1),width .3s;}
.hover-img .img img{width:200px;min-width:200px;}
.hover-img:hover .img{position:fixed; width:200px;}
/*---------Fonts----------------*/
/*Gilroy
@font-face {
font-family: 'Gilroy';
src: url('/upload/fonts/Gilroy/Gilroy-Regular.eot');
src: local('/upload/fonts/Gilroy/Gilroy Regular'), local('Gilroy-Regular'),
url('/upload/fonts/Gilroy/Gilroy-Regular.eot?#iefix') format('embedded-opentype'),
url('/upload/fonts/Gilroy/Gilroy-Regular.woff') format('woff'),
url('/upload/fonts/Gilroy/Gilroy-Regular.ttf') format('truetype');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'Gilroy';
src: url('/upload/fonts/Gilroy/Gilroy-Medium.eot');
src: local('/upload/fonts/Gilroy/Gilroy Medium'), local('Gilroy-Medium'),
url('/upload/fonts/Gilroy/Gilroy-Medium.eot?#iefix') format('embedded-opentype'),
url('/upload/fonts/Gilroy/Gilroy-Medium.woff') format('woff'),
url('/upload/fonts/Gilroy/Gilroy-Medium.ttf') format('truetype');
font-weight: 500;
font-style: normal;
}
@font-face {
font-family: 'Gilroy';
src: url('/upload/fonts/Gilroy/Gilroy-SemiBold.eot');
src: local('/upload/fonts/Gilroy/Gilroy SemiBold'), local('Gilroy-SemiBold'),
url('/upload/fonts/Gilroy/Gilroy-SemiBold.eot?#iefix') format('embedded-opentype'),
url('/upload/fonts/Gilroy/Gilroy-SemiBold.woff') format('woff'),
url('/upload/fonts/Gilroy/Gilroy-SemiBold.ttf') format('truetype');
font-weight: 600;
font-style: normal;
}*/
/*RF
@font-face {
font-family: 'RF';
src: url('/upload/fonts/RF/RFDewiExpanded-Semibold.eot');
src: local('/upload/fonts/RF/RF Semibold'), local('RFDewiExpanded-Semibold'),
url('/upload/fonts/RF/RFDewiExpanded-Semibold.eot?#iefix') format('embedded-opentype'),
url('/upload/fonts/RF/RFDewiExpanded-Semibold.woff') format('woff'),
url('/upload/fonts/RF/RFDewiExpanded-Semibold.ttf') format('truetype');
font-weight: 500;
font-style: normal;
}
@font-face {
font-family: 'RF';
src: url('/upload/fonts/RF/RFDewiExpanded-Bold.eot');
src: local('/upload/fonts/RF/RF Bold'), local('RFDewiExpanded-Bold'),
url('/upload/fonts/RF/RFDewiExpanded-Bold.eot?#iefix') format('embedded-opentype'),
url('/upload/fonts/RF/RFDewiExpanded-Bold.woff') format('woff'),
url('/upload/fonts/RF/RFDewiExpanded-Bold.ttf') format('truetype');
font-weight: 600;
font-style: normal;
}*/
/*SanFrancisco*/
/*@font-face {
font-family: 'SF';
src: url('/upload/fonts/SanFrancisco/SFProDisplay-Ultralight.eot');
src: local('/upload/fonts/SanFrancisco/SFProDisplay Ultralight'),
local('/upload/fonts/SanFrancisco/SFProDisplay-Ultralight'),
url('/upload/fonts/SanFrancisco/SFProDisplay-Ultralight.eot?#iefix') format('embedded-opentype'),
url('/upload/fonts/SanFrancisco/SFProDisplay-Ultralight.woff') format('woff'),
url('/upload/fonts/SanFrancisco/SFProDisplay-Ultralight.ttf') format('truetype');
font-weight: 100;
font-style: normal;
}
@font-face {
font-family: 'SF';
src: url('/upload/fonts/SanFrancisco/SFProDisplay-Thin.eot');
src: local('/upload/fonts/SanFrancisco/SFProDisplay Thin'),
local('/upload/fonts/SanFrancisco/SFProDisplay-Thin'),
url('/upload/fonts/SanFrancisco/SFProDisplay-Thin.eot?#iefix') format('embedded-opentype'),
url('/upload/fonts/SanFrancisco/SFProDisplay-Thin.woff') format('woff'),
url('/upload/fonts/SanFrancisco/SFProDisplay-Thin.ttf') format('truetype');
font-weight: 200;
font-style: normal;
}
@font-face {
font-family: 'SF';
src: url('/upload/fonts/SanFrancisco/SFProDisplay-Light.eot');
src: local('/upload/fonts/SanFrancisco/SFProDisplay Light'),
local('/upload/fonts/SanFrancisco/SFProDisplay-Light'),
url('/upload/fonts/SanFrancisco/SFProDisplay-Light.eot?#iefix') format('embedded-opentype'),
url('/upload/fonts/SanFrancisco/SFProDisplay-Light.woff') format('woff'),
url('/upload/fonts/SanFrancisco/SFProDisplay-Light.ttf') format('truetype');
font-weight: 300;
font-style: normal;
}
@font-face {
font-family: 'SF';
src: url('/upload/fonts/SanFrancisco/SFProDisplay-Regular.eot');
src: local('/upload/fonts/SanFrancisco/SFProDisplay'),
local('/upload/fonts/SanFrancisco/SFProDisplay-Regular'),
url('/upload/fonts/SanFrancisco/SFProDisplay-Regular.eot?#iefix') format('embedded-opentype'),
url('/upload/fonts/SanFrancisco/SFProDisplay-Regular.woff') format('woff'),
url('/upload/fonts/SanFrancisco/SFProDisplay-Regular.ttf') format('truetype');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'SF';
src: url('/upload/fonts/SanFrancisco/SFProDisplay-Medium.eot');
src: local('/upload/fonts/SanFrancisco/SFProDisplay Medium'),
local('/upload/fonts/SanFrancisco/SFProDisplay-Medium'),
url('/upload/fonts/SanFrancisco/SFProDisplay-Medium.eot?#iefix') format('embedded-opentype'),
url('/upload/fonts/SanFrancisco/SFProDisplay-Medium.woff') format('woff'),
url('/upload/fonts/SanFrancisco/SFProDisplay-Medium.ttf') format('truetype');
font-weight: 500;
font-style: normal;
}
@font-face {
font-family: 'SF'; src: url('/upload/fonts/SFProDisplay-Semibold.eot');
src: local('/upload/fonts/SanFrancisco/SFProDisplay Semibold'),
local('/upload/fonts/SanFrancisco/SFProDisplay-Semibold'),
url('/upload/fonts/SanFrancisco/SFProDisplay-Semibold.eot?#iefix') format('embedded-opentype'),
url('/upload/fonts/SanFrancisco/SFProDisplay-Semibold.woff') format('woff'),
url('/upload/fonts/SanFrancisco/SFProDisplay-Semibold.ttf') format('truetype');
font-weight: 600;
font-style: normal;
}
@font-face {
font-family: 'SF';
src: url('/upload/fonts/SFProDisplay-Bold.eot');
src: local('/upload/fonts/SanFrancisco/SFProDisplay Bold'),
local('/upload/fonts/SanFrancisco/SFProDisplay-Bold'),
url('/upload/fonts/SanFrancisco/SFProDisplay-Bold.eot?#iefix') format('embedded-opentype'),
url('/upload/fonts/SanFrancisco/SFProDisplay-Bold.woff') format('woff'),
url('/upload/fonts/SanFrancisco/SFProDisplay-Bold.ttf') format('truetype');
font-weight: 700;
font-style: normal;
}*/
/*HelveticaNeueCyr*/
/*@font-face {
font-family: 'HelveticaNeueCyr';
src: url('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-Light.eot');
src: local('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-Light'),
url('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-Light.eot?#iefix') format('embedded-opentype'),
url('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-Light.woff') format('woff'),
url('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-Light.ttf') format('truetype');
font-weight: 300;
font-style: normal;
}
@font-face {
font-family: 'HelveticaNeueCyr';
src: url('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-Roman.eot');
src: local('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-Roman'),
url('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-Roman.eot?#iefix') format('embedded-opentype'),
url('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-Roman.woff') format('woff'),
url('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-Roman.ttf') format('truetype');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'HelveticaNeueCyr';
src: url('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-Medium.eot');
src: local('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-Medium'),
url('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-Medium.eot?#iefix') format('embedded-opentype'),
url('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-Medium.woff') format('woff'),
url('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-Medium.ttf') format('truetype');
font-weight: 500;
font-style: normal;
}
@font-face {
font-family: 'HelveticaNeueCyr';
src: url('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-Bold.eot');
src: local('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-Bold'),
url('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-Bold.eot?#iefix') format('embedded-opentype'),
url('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-Bold.woff') format('woff'),
url('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-Bold.ttf') format('truetype');
font-weight: 600;
font-style: normal;
}
@font-face {
font-family: 'HelveticaNeueCyr';
src: url('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-LightItalic.eot');
src: local('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-LightItalic'),
url('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-LightItalic.eot?#iefix') format('embedded-opentype'),
url('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-LightItalic.woff') format('woff'),
url('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-LightItalic.ttf') format('truetype');
font-weight: 300;
font-style: italic;
}
@font-face {
font-family: 'HelveticaNeueCyr';
src: url('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-Italic.eot');
src: local('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-Italic'),
url('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-Italic.eot?#iefix') format('embedded-opentype'),
url('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-Italic.woff') format('woff'),
url('/upload/fonts/HelveticaNeueCyr/HelveticaNeueCyr-Italic.ttf') format('truetype');
font-weight: 400;
font-style: italic;
}*/
/*Inter*/
@font-face {
font-family: 'Inter';
src: url('/upload/fonts/Inter/Inter-Light.eot');
src: local('/upload/fonts/Inter/Inter Light'), local('Inter-Light'),
url('/upload/fonts/Inter/Inter-Light.eot?#iefix') format('embedded-opentype'),
url('/upload/fonts/Inter/Inter-Light.woff') format('woff'),
url('/upload/fonts/Inter/Inter-Light.ttf') format('truetype');
font-weight: 300;
font-style: normal;
}
@font-face {
font-family: 'Inter';
src: url('/upload/fonts/Inter/Inter-Regular.eot');
src: local('/upload/fonts/Inter/Inter Regular'), local('Inter-Regular'),
url('/upload/fonts/Inter/Inter-Regular.eot?#iefix') format('embedded-opentype'),
url('/upload/fonts/Inter/Inter-Regular.woff') format('woff'),
url('/upload/fonts/Inter/Inter-Regular.ttf') format('truetype');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'Inter';
src: url('/upload/fonts/Inter/Inter-Medium.eot');
src: local('/upload/fonts/Inter/Inter Medium'), local('Inter-Medium'),
url('/upload/fonts/Inter/Inter-Medium.eot?#iefix') format('embedded-opentype'),
url('/upload/fonts/Inter/Inter-Medium.woff') format('woff'),
url('/upload/fonts/Inter/Inter-Medium.ttf') format('truetype');
font-weight: 500;
font-style: normal;
}
@font-face {
font-family: 'Inter';
src: url('/upload/fonts/Inter/Inter-SemiBold.eot');
src: local('/upload/fonts/Inter/Inter SemiBold'), local('Inter-SemiBold'),
url('/upload/fonts/Inter/Inter-SemiBold.eot?#iefix') format('embedded-opentype'),
url('/upload/fonts/Inter/Inter-SemiBold.woff') format('woff'),
url('/upload/fonts/Inter/Inter-SemiBold.ttf') format('truetype');
font-weight: 600;
font-style: normal;
}
@font-face {
font-family: 'Inter';
src: url('/upload/fonts/Inter/Inter-Bold.eot');
src: local('/upload/fonts/Inter/Inter Bold'), local('Inter-Bold'),
url('/upload/fonts/Inter/Inter-Bold.eot?#iefix') format('embedded-opentype'),
url('/upload/fonts/Inter/Inter-Bold.woff') format('woff'),
url('/upload/fonts/Inter/Inter-Bold.ttf') format('truetype');
font-weight: 700;
font-style: normal;
}
/*---------AJAX preloader-------*/
.ajax-preloader {display:none;animation:ajax-preloader 2s infinite;position:fixed;top:0;left:0;width:0%;height:5px;z-index:999;background:var(--color-accent);}
@keyframes ajax-preloader { 0% {width: 0%;} 50% {width:100%;left:0;} 100% {width:0%;left:100%;} }
/*---------Preloader------------*/
.preloader-container{position:fixed;top:0;left:0;overflow:hidden;height:100%;width:100vw;transition:0.7s;background:var(--color-bg-white);z-index:99999;}
.preloader {transition:0.7s;min-width:100vw;position:absolute;left:0;top:0;width:100%;height:100%;}
.load {width:250px;height:44px;z-index:1;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);}
.logo-animate {width:0%;transition:0.7s;position:absolute;overflow:hidden;}
.logo-animate img{width:150px;max-width:inherit;}
@media (max-width: 768px){
.load {width:200px;height:37px;}
.logo-animate img{width:100px;max-width:inherit;}
}
/*---------Preloader IMG--------*/
/*.img-load {
min-height:500px;
animation:img-load 5s infinite linear;
background: linear-gradient(to right, #eeeeee 20%, #ddd 30%, #eeeeee 50%);
background-size: 400%;
}
@keyframes img-load {
0% {background-position: 200% 0%;}
100% {background-position: -200% 0%;}
}*/
/*---------Scroll Up------------*/
.scroll-up {cursor:pointer;width:40px;height:40px;border-radius:100%;background:var(--color-black);position:fixed;right:40px;bottom:60px;z-index:999;}
.scroll-up:before{width:7px;height:7px;content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-40%) rotate(45deg);border-left:2px solid var(--color-white);border-top:2px solid var(--color-white);}
@media (max-width:768px){.scroll-up {width:30px;height:30px;right:15px;bottom:70px;}}
/*---------Text/Title-----------*/
/*Title*/
.h1 {font-size:42px;font-weight:500;margin:0 0 15px 0;line-height:135%;letter-spacing:-1px;}
.h1 i {font-weight:300;display:inline;}
.h2 {font-size:28px;font-weight:500;margin:0 0 15px 0;line-height:140%;letter-spacing:-0.8px;}
.h2 i {font-weight:300;display:inline;}
.h3 {font-size:22px;font-weight:500;margin:0 0 15px 0;line-height:150%;}
.h4 {font-size:20px;font-weight:500;margin:0 0 15px 0;line-height:150%;}
.h5 {font-size:18px;font-weight:500;margin:0 0 15px 0;line-height:150%;}
.h6 {font-size:16px;font-weight:500;margin:0 0 15px 0;line-height:150%;}
.subtitle {font-size:11px;line-height:100%;text-transform: uppercase;}
/*ios*/
/*.ios .h1, .ios .h2{font-weight:200;}
.subtitle {font-weight:400;}*/
@media (max-width:768px){
.h1 {font-size:22px;}
.h2 {font-size:18px;}
.h3 {font-size:16px;}
.h4 {font-size:16px;}
.h5 {font-size:14px;}
.h6 {font-size:12px;}
}
@media (min-width:1900px){
body {font-size:18px;}
.h1 {font-size:52px;}
.h2 {font-size:40px;}
.h3 {font-size:30px;}
.h4 {font-size:22px;}
.h5 {font-size:20px;}
.h6 {font-size:18px;}
.subtitle {font-size:14px;}
}
/*Text*/
.t1 {font-size:18px;margin:0 0 15px 0;line-height:140%;}
.t2 {font-size:14px;margin:0 0 15px 0;line-height:140%;}
@media (max-width:768px){
.t1 {font-size:16px;}
.t2 {font-size:12px;}
}
@media (min-width:1900px){
.t1 {font-size:22px;}
.t2 {font-size:18px;}
}
/*Colors*/
.accent {color:var(--color-accent);}
.black {color:var(--color-black);}
.white {color: var(--color-white);font-weight:300;}
.grey {color:var(--color-grey);}
.grey-light {color:var(--color-grey-light);}
.grey-white {color: var(--color-grey-white);}
/*Position*/
.text-center{text-align:center;margin-left:auto; margin-right:auto;}
.text-right {text-align:right; margin-left:auto;}@media(max-width:768px){.text-right{text-align:left; margin-left:inherit;}}
.text-left {text-align: left}
/*weight*/
.fw500 {font-weight: 500;}
.fw600 {font-weight: 600;}
/*---------Разделители----------*/
.divider-grey {display:block;border-bottom:1px solid var(--color-grey-light);}
.divider-white {display:block;border-bottom:1px solid var(--color-white);}
/*---------ul-------------------*/
/*Список с точками*/
.ul-dots {margin:0;padding:0;list-style:none; margin-bottom:15px;}
.ul-dots li{margin:4px 0;}
.ul-dots li:before {margin:0 10px 0.3vw 0;background:var(--color-accent);content: '';position: relative;display:inline-block;width:4px;height:4px;border-radius:100%;}
/*Список с цифрами*/
.ul-num {position:relative;margin:0;padding:0;list-style:none; counter-reset: counter;}
.ul-num li{margin:10px 0 10px 30px; counter-increment: counter;}
.ul-num li:before {color:var(--color-accent); position:absolute;left:0px;content:'0' counter(counter);font-size:75%;line-height:inherit;}
.ul-num li:nth-child(n+10):before {content:''counter(counter);}
/*---------Buttons--------------*/
/* Кнопка текстом
Button
*/
.btn-text {font-size:24px;line-height:120%; display:inline-flex;position:relative;overflow:hidden;cursor:pointer;}
.btn-text i{font-style: normal;display:inline-block;color:rgb(0 0 0 / 0%);transition:transform 1.2s cubic-bezier(.19,1,.22,1)}
.btn-text i:after,.btn-text i:before{color:var(--color-black); content:attr(data-text);display:block;position:absolute;}
.btn-text i:before{top:0;transform:skewY(0);transform-origin:right bottom;transition:transform 2s cubic-bezier(.19,1,.22,1)}
.btn-text i:after{top:105%;transform:skewY(10deg);transform-origin:left top;transition:transform 2s cubic-bezier(.19,1,.22,1)}
.btn-text:hover i{transform:translateY(-105%);}
.btn-text:hover i:before{transform:skewY(10deg);}
.btn-text:hover i:after{transform:skewY(0);}
/* Кнопка с заливкой
Button
*/
.btn-black {position:relative;border-radius:44px;border:1px solid var(--color-grey-white);height:44px;white-space:nowrap;font-size:14px;padding:0 20px;transform:translateZ(0);transition:transform .3s;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;width:auto;cursor:pointer;}
.btn-black:hover {transform:scaleX(1.05);transition:transform .6s cubic-bezier(.34,5.56,.64,1)}
/*заливка*/
.btn-black:before {background:var(--color-black); content:'';position:absolute;overflow:hidden;width:100%;height:100%;transform:translateY(101%);border-radius:50% 50% 0 0;transition:transform .5s cubic-bezier(.4,0,0,1),border-radius .5s cubic-bezier(.4,0,0,1);}
.btn-black:hover:before {border-radius:0;transform:translateY(0);transition-duration:.5s,.9s;}
/*текст*/
.btn-black .title {position:relative;display:block;overflow:hidden;z-index:2}
.btn-black .title span{display:block;transition:transform .8s cubic-bezier(.16,1,.3,1)}
.btn-black .title span:after{color:var(--color-white); content:attr(data-text);display:block;position:absolute;top:110%;left:0;}
.btn-black:hover .title span {transform:translateY(-110%);}
.btn-white {position: relative; border-radius:44px;border:1px solid var(--color-white);color: var(--color-white); height:44px;font-size:14px;padding:0 20px;transform:translateZ(0);transition:transform .3s;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;width:auto;cursor:pointer;}
.btn-white:hover {border:1px solid var(--color-black); transform:scaleX(1.05);transition:transform .6s cubic-bezier(.34,5.56,.64,1)}
/*заливка*/
.btn-white:before {background: var(--color-black); content:'';position:absolute;overflow:hidden;width:100%;height:100%;transform:translateY(101%);border-radius:50% 50% 0 0;transition:transform .5s cubic-bezier(.4,0,0,1),border-radius .5s cubic-bezier(.4,0,0,1);}
.btn-white:hover:before {border-radius:0;transform:translateY(0);transition-duration:.5s,.9s;}
/*текст*/
.btn-white .title {position:relative;display:block;overflow:hidden;z-index:2}
.btn-white .title span{display:block;transition:transform .8s cubic-bezier(.16,1,.3,1)}
.btn-white .title span:after{color:var(--color-white);font-weight: 300; content:attr(data-text);display:block;position:absolute;top:110%;left:0;}
.btn-white:hover .title span {transform:translateY(-110%);}
/*Обычная кнопка*/
.btn {transition:0.3s;display:inline-flex;align-items:center;justify-content:center;position:relative;background:var(--color-grey);padding:10px 15px;color:var(--color-white);margin:0 0 5px 0;}
.btn:active,.btn:hover,.btn:focus,.btn:focus:hover {transition:0.3s;background:var(--color-white);color: var(--color-grey);}
/*Кнопка формы*/
.btn-form {line-height:40px;padding:0 20px;letter-spacing: -.2px; white-space:nowrap;background:var(--color-black);color:var(--color-white);cursor:pointer;border:none;}
.btn-form:active,.btn-form:hover,.btn-form:focus,.btn-form:focus:hover {background: var(--color-accent); color:var(--color-white);border:none;}
/*Кнопка назад*/
.btn-back {display:flex;align-items:center;}
.btn-back:before {content:'';transform:rotate(90deg);position:relative;display:block;margin-right:10px;width:8px;height:5px;background:url(/upload/icon/black/arrow.svg);background-repeat:no-repeat;background-size:cover;background-attachment:inherit;background-position:50% 50%; }
/*---------Buttons dop----------*/
/*Иконка закрыть*/
.btn-close-white, .btn-close-black {margin-right:10px;/*border:2px solid var(--color-accent);*/border-radius:100%;position:relative;width:40px;height:40px;cursor:pointer;display:inline-block}
.btn-close-white:before, .btn-close-black:before{content:"";position:absolute;margin:auto;top:50%;left:0;right:0;width:2px;height:25px;transform:translate(0,-50%) rotate(135deg)}
.btn-close-white:after, .btn-close-black:after{content:"";position:absolute;margin:auto;top:50%;left:0;right:0;width:2px;height:25px;transform:translate(0,-50%) rotate(45deg)}
.btn-close-white:before, .btn-close-white:after {background:var(--color-white);}
.btn-close-black:before, .btn-close-black:after {background:var(--color-black);}
/*Иконка назад*/
.btn-back-white, .btn-back-black {margin-right:10px;border:2px solid var(--color-accent);border-radius:100%;position:relative;width:40px;height:40px;cursor:pointer;display:inline-block}
.btn-back-white:before, .btn-back-black:before{content:"";position:absolute;margin:auto;top:50%;left:0;right:0;width:7px;height:7px;transform:translate(0%,-50%) rotate(135deg);}
.btn-back-white:before, .btn-back-white:after {border-right:2px solid var(--color-white); border-bottom:2px solid var(--color-white);}
.btn-back-black:before, .btn-back-black:after {border-right:2px solid var(--color-black); border-bottom:2px solid var(--color-black);}
/*Prev / Next*/
.btn-next,.btn-prev {cursor:pointer; display:inline-flex;width:50px;height:50px;border:1px solid var(--color-accent);border-radius:100%;align-items:center;justify-content:center;}
.btn-next:before, .btn-prev:before {width:20px;height:10px;background:url(/upload/icon/black/arrow-btn.svg);content:"";display:inline-block;background-repeat:no-repeat;background-size:cover;background-position:50% 50%;}
.btn-prev {margin-right: 5px;}
.btn-prev:before {transform: rotate(180deg);}
.btn-next.white:before, .btn-prev.white:before {opacity:0.6;background:url(/upload/icon/white/arrow-btn.svg);background-repeat:no-repeat;background-size:cover;background-position:50% 50%;}
.btn-next.white:hover:before, .btn-prev.white:hover:before {opacity:1;}
/*---------Space----------------*/
.space-15px {height: 15px;}
.space-30px {height:30px;}
.space-60px {height:60px;}
.space-90px {height:90px;}
.space-120px {height:120px;}
.space-150px {height:150px;}
.space-180px {height:180px;}
@media(max-width:767px){
.space-60px{height:30px;}
.space-90px{height:30px;}
.space-120px{height:30px;}
.space-150px{height:30px;}
.space-180px{height:30px;}
}
/*Только для мобильных*/
@media(max-width:767px){
.mobile-space-15px{height:15px;}
.mobile-space-30px{height:30px;}
.mobile-space-60px{height:60px;}
.mobile-space-90px{height:90px;}
}
/*---------Padding / Margin-----*/
.mr-15px {margin-right: 15px !important;}
.mr-30px {margin-right: 30px !important;}
.ml-15px {margin-left: 15px !important}@media(max-width:767px){.ml-15px {margin-left:inherit;}}
.ml-30px {margin-left: 30px !important}@media(max-width:767px){.ml-30px {margin-left:inherit;}}
.pt-0px {padding-top:0px;}
.pt-5px {padding-top:5px;}
.pt-10px {padding-top:10px;}
.pt-15px {padding-top:15px;}
.pt-30px {padding-top:30px;}
.pt-45px {padding-top:45px;}@media(max-width:767px){.pt-45px{padding-top:30px;}}
.pt-60px {padding-top:60px;}@media(max-width:767px){.pt-60px{padding-top:30px;}}
.pt-90px {padding-top:90px;}@media(max-width:767px){.pt-90px{padding-top:30px;}}
.pt-120px {padding-top:120px;}@media(max-width:767px){.pt-120px{padding-top:30px;}}
.pt-150px {padding-top:150px;}@media(max-width:767px){.pt-150px{padding-top:30px;}}
.pt-180px {padding-top:180px;}@media(max-width:767px){.pt-180px{padding-top:30px;}}
.pt-210px {padding-top:210px;}@media(max-width:767px){.pt-210px{padding-top:30px;}}
@media (min-width:1900px){
.pt-60px {padding-top:75px;}
.pt-90px {padding-top:105px;}
.pt-120px {padding-top:135px;}
.pt-150px {padding-top:165px;}
.pt-180px {padding-top:195px;}
.pt-210px {padding-top:225px;}
}
.pb-0px {padding-bottom:0px;}
.pb-5px {padding-bottom:5px;}
.pb-10px {padding-bottom:10px;}
.pb-15px {padding-bottom:15px;}
.pb-30px {padding-bottom:30px;}
.pb-45px {padding-bottom:45px;}@media(max-width:767px){.pb-45px{padding-bottom:30px;}}
.pb-60px {padding-bottom:60px;}@media(max-width:767px){.pb-60px{padding-bottom:30px;}}
.pb-90px {padding-bottom:90px;}@media(max-width:767px){.pb-90px{padding-bottom:30px;}}
.pb-120px {padding-bottom:120px;}@media(max-width:767px){.pb-120px{padding-bottom:30px;}}
.pb-150px {padding-bottom:150px;}@media(max-width:767px){.pb-150px{padding-bottom:30px;}}
.pb-180px {padding-bottom:180px;}@media(max-width:767px){.pb-180px{padding-bottom:30px;}}
.pb-210px {padding-bottom:210px;}@media(max-width:767px){.pb-210px{padding-bottom:30px;}}
@media (min-width:1900px){
.pb-60px {padding-bottom:75px;}
.pb-90px {padding-bottom:105px;}
.pb-120px {padding-bottom:135px;}
.pb-150px {padding-bottom:165px;}
.pb-180px {padding-bottom:195px;}
.pb-210px {padding-bottom:225px;}
}
.mt-0px {margin-top:0px;}
.mt-5px {margin-top:5px;}
.mt-10px {margin-top:10px;}
.mt-15px {margin-top:15px;}
.mt-30px {margin-top:30px;}
.mt-45px {margin-top:45px;}@media(max-width:767px){.mt-45px{margin-top:30px;}}
.mt-60px {margin-top:60px;}@media(max-width:767px){.mt-60px{margin-top:30px;}}
.mt-75px {margin-top:75px;}@media(max-width:767px){.mt-75px{margin-top:30px;}}
.mt-90px {margin-top:90px;}@media(max-width:767px){.mt-90px{margin-top:30px;}}
.mt-120px {margin-top:120px;}@media(max-width:767px){.mt-120px{margin-top:30px;}}
.mt-150px {margin-top:150px;}@media(max-width:767px){.mt-150px{margin-top:30px;}}
.mt-180px {margin-top:180px;}@media(max-width:767px){.mt-180px{margin-top:30px;}}
.mt-210px {margin-top:210px;}@media(max-width:767px){.mt-210px{margin-top:30px;}}
@media (min-width:1900px){
.mt-60px {margin-top:75px;}
.mt-75px {margin-top:90px;}
.mt-90px {margin-top:105px;}
.mt-120px {margin-top:135px;}
.mt-150px {margin-top:165px;}
.mt-180px {margin-top:195px;}
.mt-210px {margin-top:225px;}
}
.mb-0px {margin-bottom:0px;}
.mb-5px {margin-bottom:5px;}
.mb-10px {margin-bottom:10px;}
.mb-15px {margin-bottom:15px;}
.mb-30px {margin-bottom:30px;}
.mb-45px {margin-bottom:45px;}@media(max-width:767px){.mb-45px{margin-bottom:30px;}}
.mb-60px {margin-bottom:60px;}@media(max-width:767px){.mb-60px{margin-bottom:30px;}}
.mb-75px {margin-bottom:75px;}@media(max-width:767px){.mb-75px{margin-bottom:30px;}}
.mb-90px {margin-bottom:90px;}@media(max-width:767px){.mb-90px{margin-bottom:30px;}}
.mb-120px {margin-bottom:120px;}@media(max-width:767px){.mb-120px{margin-bottom:30px;}}
.mb-150px {margin-bottom:150px;}@media(max-width:767px){.mb-150px{margin-bottom:30px;}}
.mb-180px {margin-bottom:180px;}@media(max-width:767px){.mb-180px{margin-bottom:30px;}}
.mb-210px {margin-bottom:210px;}@media(max-width:767px){.mb-210px{margin-bottom:30px;}}
@media (min-width:1900px){
.mb-60px {margin-bottom:75px;}
.mb-75px {margin-bottom:90px;}
.mb-90px {margin-bottom:105px;}
.mb-120px {margin-bottom:135px;}
.mb-150px {margin-bottom:165px;}
.mb-180px {margin-bottom:195px;}
.mb-210px {margin-bottom:225px;}
}
/*---------Max Width------------*/
.max-200px {max-width: 200px;}
.max-250px {max-width: 250px;}
.max-300px {max-width: 300px;}
.max-350px {max-width: 350px;}
.max-400px {max-width: 400px;}
.max-450px {max-width: 450px;}
.max-500px {max-width: 500px;}
.max-550px {max-width: 550px;}
.max-600px {max-width: 600px;}
.max-650px {max-width: 650px;}
.max-700px {max-width: 700px;}
.max-750px {max-width: 750px;}
.max-800px {max-width: 800px;}
.max-10 {max-width: 10%;}
.max-20 {max-width: 20%;}
.max-30 {max-width: 30%;}
.max-40 {max-width: 40%;}
.max-50 {max-width: 50%;}
.max-60 {max-width: 60%;}
.max-70 {max-width: 70%;}
.max-80 {max-width: 80%;}
.max-90 {max-width: 90%;}
/*---------Forms----------------*/
/*Общие стили*/
div[id^="wait-comp-"]{ display: none;} /*bitrix*/
input,
input:hover,
input:focus,
input:active{font-family:'Inter';/*padding:0px 20px;*/min-height:48px;cursor:pointer;}
input::placeholder {font-size:14px; color: var(--color-grey);}
/*Автозаполнение*/
input::auto-fill {background: var(--color-white);}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active{-webkit-box-shadow:0 0 0 30px var(--color-white) inset !important;}
input[type="text"] {}
input[type="password"] {}
input[type="submit"] {}
/*Окошко успешной отправки / ошибки*/
form .sent-info {display:none;padding:50px 60px;z-index:999999;position:fixed;top:30px;right:30px;background:var(--color-black);color:var(--color-white);}
form [data-name] >* {background:#fff;margin-bottom:15px;border-radius: 4px;padding: 15px;}
form .error >* {border: 1px solid red;}
/*Анимация кнопки отправки*/
form [type=submit].active {position:relative;display:inline-block;cursor:auto;}
form [type=submit].active span {position:relative;}
form [type=submit].active:before {
background: rgb(0 0 0 / 20%);
animation:sent-load 1.6s cubic-bezier(0.785, 0.135, 0.15, 0.86) infinite;
content:'';position:absolute;left:0;top:0;display:block;width:100%;height:100%;clip-path:inset(0 0% 0 0);
}
@keyframes sent-load{
0%{clip-path:inset(0 0% 0 0)}
49%{clip-path:inset(0 100% 0 0%)}
50%{clip-path:inset(0 0% 0 100%)}
100%{clip-path:inset(0 0% 0 0%)}
}
.blocker {width: calc(100% - 30px);height:40px;position:absolute;cursor:pointer;}
.blocker:hover ~ .btn-form{background: var(--color-accent);}
/*Основная форма в подвале*/
form.main {}
/*Форма*/
.fp-send {cursor: pointer;}
.js-form-close {position:absolute;top:35px;right:35px;}
.form-wrapper {display:none;z-index:999;background:var(--color-bg-white);position:fixed;top:0;left:0;width:100%;height:100%;overflow:auto;}
.form-content {align-items:center;display:flex;position:absolute;min-height:100vh;width:100%;}
/*Перезвонить*/
.callback-send {cursor: pointer;}
.js-callback-close {position:absolute;top:35px;right:35px;}
.callback-wrapper {display:none;z-index:999;background:var(--color-bg-white);position:fixed;top:0;left:0;width:100%;height:100%;overflow:auto;}
.callback-content {align-items:center;display:flex;position:absolute;min-height:100vh;width:100%;}
/*Оформить заявку*/
.js-order-close {position:absolute;top:35px;right:35px;z-index:9999;}
.order-wrapper {display:none;z-index:999;background:var(--color-bg-white);position:fixed;top:0;left:0;width:100%;height:100%;overflow:auto;}
.order-content {align-items:center;display:flex;position:absolute;min-height:100vh;width:100%;}
/*Список услуг в форме*/
.order-checkbox {padding:40px 50px;border:1px solid var(--color-grey-light);border-radius:4px;}
.order-checkbox ul{list-style:none;margin:0;padding:0;max-width:400px;}
.box{position:relative;margin:18px 0;display:flex;align-items:center;user-select:none}
.box label{color: var(--color-grey);position:relative;z-index:10;padding-left:40px;cursor:pointer}
.box input{opacity:0;visibility:hidden;position:absolute}
.box input:checked ~ .check{border-color:var(--color-accent);box-shadow:0 0 0 15px var(--color-accent) inset}
.box input:checked ~ .check::after{opacity:1;transform:scale(1)}
.box input:checked ~ label{color:var(--color-black)}
.box .check{width:20px;height:20px;display:flex;justify-content:center;align-items:center;position:absolute;border-radius:100px;border:2px solid var(--color-accent);box-shadow:0 0 0 0 var(--color-accent) inset;transition:all .15s cubic-bezier(0,1.05,0.72,1.07)}
@media(max-width:767px){
.order-checkbox{margin-top:15px;padding:20px 30px;}
.box{margin:15px 0;}
}
.box-btn{margin:0px 0px 5px 0; position:relative;display:inline-flex;align-items:center;justify-content:center;user-select:none}
.box-btn label{padding:10px 15px;color:var(--color-grey);position:relative;z-index:10;cursor:pointer}
.box-btn input{opacity:0;visibility:hidden;position:absolute}
.box-btn input:checked ~ .check{background: var(--color-grey);}
/*.box-btn input:checked ~ .check::after{opacity:1;transform:scale(1)}*/
.box-btn input:checked ~ label{color:var(--color-white)}
.box-btn .check{background:var(--color-white);width:100%;height:46px;display:flex;justify-content:center;align-items:center;position:absolute;}
.box-btn:hover .check{transition:0.3s;background: var(--color-grey);}
.box-btn:hover label{transition:0.3s;color:var(--color-white);}
@media(max-width:768px){
.box-btn label{padding:5px 10px;font-size:14px;}
.box-btn .check {height:35px;}
}
/*---------Search---------------*/
/*Посик*/
.search-wrapper {display:none;z-index:999;background:var(--color-bg-white);position:fixed;top:0;left:0;width:100%;height:100%;overflow:auto;}
.search-content {position:absolute;min-height:100vh;height:100%;width:100%;}
.search-close {position:absolute;top:35px;right:35px;}
.bg-search {background:var(--color-bg-white);padding:150px 0 80px 0;}
.search {min-width:280px;position:absolute;top:45%;left:50%;transform:translate(-50%,-50%);}
.search input {border:none;border-bottom:1px solid rgba(0, 0, 0, 0.6);width:100%;font-size:46px;line-height:56px;font-weight:500;padding-bottom:15px;}
.search button {position:absolute;margin-top:25px;right:5px;cursor:pointer;float:right;}
.search button:before {width:23px;height:23px;content:"";display:inline-block;background:url(/upload/icon/black/search.svg);background-repeat:no-repeat;background-size:cover;background-position:50% 50%;}
/*Результаты поиска*/
.search-preloader{
position: relative;top:-2px;width:10%;height:3px;background:var(--color-black);margin-left:90%;
animation:search-preloader 0.5s cubic-bezier(0.445, 0.05, 0.55, 0.95) infinite;
}
@keyframes search-preloader{0%{margin-left:0%}100%{margin-left:90%}}
.item-serch {display: block;padding: 25px 0;border-bottom:1px solid rgba(0,0,0,0.2);color:var(--color-grey);transition: all 0.5s ease;font-size:22px;margin:0;}
.item-serch:before {content:"";display:inline-block;position:relative;float:right;margin-right:10px;margin-top:8px;width:5px;height:5px;border:1px solid rgba(0, 0, 0, 0.7);transform:rotate(45deg);}
.item-serch:after {transform:translate(0px,10px);transition:all 0.4s ease;content:'';position:relative;float:right;height:1px;width:0px;background:rgba(0, 0, 0, 0.7);}
.item-serch:hover {transition:all 0.5s ease;color:var(--color-black);}
.item-serch:hover:after {width:12px;transform:translate(0px, 10px);transition: all 0.5s ease;}
.item-serch:hover:before {border-left:1px solid rgba(0, 0, 0, 0);border-bottom:1px solid rgba(0, 0, 0, 0);transition: all 0.5s ease;}
@media (max-width: 992px){
.search input{font-size:36px;line-height:46px;}
.search button {margin-top:15px;}
}
@media (max-width: 768px){
.search input{font-size:26px;line-height:38px;}
.search button {margin-top:10px;}
.item-serch {font-size:16px;}
}
/*---------Footer---------------*/
footer {position: relative;color: var(--color-white);font-weight:300;}
footer .logo {max-width: 200px;}
footer .copyright {display: flex; align-items: center; justify-content: space-between;}
footer .copyright .logo {max-width:105px;height:auto;display: inline-block;}
footer video {object-fit:cover;height:100%;width:100%;position:absolute;top:0;left:0;}
.qr-block {display:flex;align-items:center;}
.qr-block img {width: 100%;}
.qr-block div {margin-left:30px;}
.qr-block span {border-radius: 2px; display: block; white-space:nowrap;background:var(--color-grey);color:var(--color-white);padding:10px 30px;margin-top:15px;}
/*---------Pagination-----------*/
.pagination {display:inline-flex;padding:0;list-style:none;margin:0;position:relative;/*left:50%;transform:translate(-50%,0);*/}
.pagination li {margin-right:5px;display:block;min-width:40px;height:40px;text-align:center;border:1px solid var(--color-grey-light);border-radius:40px;cursor:pointer;}
.pagination li.active {border:1px solid var(--color-accent);}
.pagination a {font-size:14px;font-weight:600;width:100%;height:100%;display:flex;align-items:center;justify-content:center;}
.pagination-prev:before{content:"";position:relative;display:inline-block;width:6px;height:6px;transform:rotate(45deg);border-left:2px solid;border-bottom:2px solid;margin:0 0 2px 1px}
.pagination-next:before{content:"";position:relative;display:inline-block;width:6px;height:6px;transform:rotate(-135deg);border-left:2px solid;border-bottom:2px solid;margin:0 0 2px 0}
/*---------breadcrumb-----------*/
.breadcrumb {display:flex;align-items:center;padding: 15px 0 10px 0;overflow-x:auto;margin-bottom:-10px;}
.breadcrumb a {white-space: wrap;color:var(--color-grey-light);}
.breadcrumb a.active { }
.breadcrumb a:hover {color: var(--color-accent);}
.breadcrumb a:before {background:url(/upload/icon/black/arrow.svg);opacity:.5;content:'';display:inline-block;margin:0 4px 2px 4px;width:7px;height:7px;background-repeat:no-repeat;background-size:contain;background-position:50% 50%;transform:rotate(-90deg);}
.breadcrumb a:first-child:before {display: none;}
.breadcrumb a:last-child {color: var(--color-accent);}
@media(max-width:768px){
.breadcrumb a{white-space: nowrap;}
}
/*---------Сворачиваемый текст--*/
.collapsible-text{max-height:100px;overflow:hidden;transition: 1s;}
.open.collapsible-text{max-height:1000px;overflow:hidden;transition:1s;}
.collapsible-text-more {color:var(--color-accent);cursor:pointer;position:relative;display:block;width:100%;}
.collapsible-text-more:before {content:"";opacity:1;transition:1s; position:absolute;bottom:22px;left:0;width:100%;height:100px;background:linear-gradient(180deg, #fff0,#FFF);}
.open.collapsible-text-more:before {opacity:0;transition:1s;}
/*---------Всплывающие рецепты--*/
.modal{display:none; position:fixed;z-index:9999;top:0;left:0;bottom:0;right:0;background:rgb(0 0 0 / 60%);}
.modal-container {background:var(--color-white);border-radius:30px;overflow: hidden;display:flex;align-items:center;position:absolute;width:80vw;height:600px;top:50%;left:50%;transform:translate(-50%, -50%);}
.modal-container .btn-close-black {position: absolute;right:20px;top:20px;}
.modal .content {color: var(--color-black);padding:60px;}
/*---------Блок с цифрой--------*/
.block-num {font-size:16px;line-height:160%;}
.block-num span{font-family:'RF';font-weight:600;letter-spacing:-0.2px;position:absolute;font-size:12px;border:1px solid var(--color-grey-light);border-radius:100%;line-height:58px;text-align:center;width:60px;}
.block-num p{padding-left:75px;margin-bottom:30px;top:-6px;position:relative;}
/*---------Таблица--------------*/
/*общие стили*/
table {border:none;margin:15px 0 30px 0;border-collapse:collapse;width:100%;display:block;overflow-x:auto;font-family:'Inter';font-size:16px;line-height:120%;letter-spacing: -0.2px;}
table tbody {display:table;width:100%;}
/*общие стили колонок и полос*/
table tr {color:var(--color-grey);background:var(--color-white);}
table tr td {padding:10px 15px;vertical-align:top;border:1px solid var(--color-grey-white);}
table tr td *{margin: 0;}
/*колонки*/
/*table tr td:first-child {font-size:14px;text-align:center;color:var(--color-black);}*/
/*table tr td:nth-child(3) {color:var(--color-black);}
table tr td:nth-child(4) {color:var(--color-black);}*/
/*шапка*/
table tr:first-child {color:var(--color-black);}
table tr:first-child td{white-space:nowrap;vertical-align:middle;background: var(--color-accent);border:1px solid var(--color-white);}
/*table tr:first-child td:nth-child(1) {width: 70px;font-size:16px;}*/
/*table tr:first-child td:nth-child(2) {width: auto;}
table tr:first-child td:nth-child(3) {width: 120px;}
table tr:first-child td:nth-child(4) {width: 120px;}*/
/*---------Карта----------------*/
ymaps[class$='-ground-pane'] {filter: grayscale(1); /*черная - filter: grayscale(1) invert(1);*/}
#map {width:100%;height:600px;border-radius:5px;overflow:hidden;}
@media(max-width:768px){}
@media (min-width:1900px){}
/*home-intro*/
.home-intro {height:100vh;overflow:hidden;position: relative;}
.home-intro .dop-info {color: var(--color-white);font-weight:300;display:flex;align-items:center;justify-content:center;}
.home-intro .dop-info div {display:flex;flex-direction:column;justify-content:space-between;border:1px solid var(--color-grey-light);height:15vh;width:100%;margin-right:15px;padding:15px;}
.home-intro .dop-info div:hover {border:1px solid var(--color-accent);}
.home-intro .dop-info div span {align-self:end;line-height:100%;font-size:14px;}
.home-intro .dop-info div p {margin-bottom:0px;line-height:120%;}
@media (max-width: 768px){
.home-intro {height:75vh;}
.home-intro .dop-info {flex-wrap:wrap;}
.home-intro .dop-info div {width:43vw;margin:5px;height:13vh;padding:10px;}
.home-intro .dop-info div span {font-size:12px;}
.home-intro .dop-info div p {font-size:13px;}
}
/*home-section-2*/
.home-section-2 {position:relative;}
.home-section-2 video {object-fit:cover;height:100%;width:100%;position:absolute;top:0;left:0;}
@media (max-width: 768px){
.home-section-2 {height:auto;}
}
/*home-section-3*/
.home-section-3 {
display:grid;
grid-template-columns: 21.3% 21.3% 21.3% 36.1%;
grid-template-rows: 18vw 18vw 9vw;
grid-template-areas:
"item-1 item-2 item-3 item-4"
"item-5 item-6 item-7 item-8"
"item-9 item-10 item-11 item-8";
}
.home-section-3 .item-1 {grid-area: item-1;}
.home-section-3 .item-2 {grid-area: item-2;}
.home-section-3 .item-3 {grid-area: item-3;}
.home-section-3 .item-4 {grid-area: item-4;}
.home-section-3 .item-5 {grid-area: item-5;}
.home-section-3 .item-6 {grid-area: item-6;}
.home-section-3 .item-7 {grid-area: item-7;}
.home-section-3 .item-8 {grid-area: item-8;}
.home-section-3 .item-9 {grid-area: item-9;}
.home-section-3 .item-10 {grid-area: item-10;}
.home-section-3 .item-11 {grid-area: item-11;}
.home-section-3 .white-block {background: var(--color-white);}
.home-section-3 .yellow-block {background: var(--color-accent);}
.home-section-3 .white-block,.home-section-3 .yellow-block {padding:30px;display:flex;flex-direction:column;justify-content:space-between;}
.home-section-3 .white-block p,.home-section-3 .yellow-block p {font-size: 22px;font-weight:500;color:var(--color-grey);}
.home-section-3 .white-block .num,.home-section-3 .yellow-block .num {align-self:end;text-align:end;}
.home-section-3 .white-block .num p,.home-section-3 .yellow-block .num p{font-size:68px;font-weight:600;letter-spacing:-2.5px;color:var(--color-black);}
.home-section-3 .white-block.num span,.home-section-3 .yellow-block .num span{font-size:16px;font-weight:500;color:var(--color-grey);}
.home-section-3 .dop-block {transition: 0.3s;color:var(--color-white);padding:30px;display:flex;flex-direction:column;justify-content:space-between;}
.home-section-3 .dop-block p{font-size:22px;}
.home-section-3 .dop-block ul {padding:0;margin:0;list-style:none;}
.home-section-3 .dop-block ul li {margin: 2px 0;}
.home-section-3 .dop-block:hover {background: rgb(255 255 255 / 15%);transition: 0.3s;}
.home-section-3 .black-block {background: var(--color-black);color:var(--color-white);padding:30px;position:relative;z-index:0;display:flex;flex-direction:column;justify-content:space-between;}
.home-section-3 .black-block img {position:absolute;right:0;top:0;width:20%;z-index:-1;}
.home-section-3 .black-block p {font-size:22px;font-weight:500;}
.home-section-3 .black-block .info {margin-left:60px;font-weight:300;}
@media(max-width:768px){
.home-section-3 {display: block;}
.home-section-3 .black-block {padding:15px;}
.home-section-3 .white-block,.home-section-3 .yellow-block {padding:15px;min-height:160px;}
.home-section-3 .white-block p, .home-section-3 .yellow-block p {font-size:18px;line-height:130%;}
.home-section-3 .white-block .num p, .home-section-3 .yellow-block .num p {font-size:52px;}
.home-section-3 .black-block p {font-size:18px;}
.home-section-3 .black-block .info {margin-left:0px;}
.home-section-3 .black-block img {width:18%;}
.home-section-3 .dop-block {border:1px solid var(--color-grey-white);margin: 5px 0;}
}
/*home-section-4*/
/*home-section-5*/
.home-section-5 {
display: grid;
grid-template-columns: 21.3% 21.3% 21.3% 36.1%;
grid-template-rows: 18vw 18vw 18vw 18vw;
grid-column-gap:0px;grid-row-gap:0px;
grid-template-areas:
"item-1 item-1 . item-3"
"item-1 item-1 item-2 ."
". item-5 item-6 item-6"
"item-4 . item-6 item-6";
}
.home-section-5 .item-1 {grid-area: item-1;background: var(--color-accent);padding:30px 40px;}
.home-section-5 .item-2 {grid-area: item-2;}
.home-section-5 .item-3 {grid-area: item-3; border:2px solid var(--color-accent);padding:30px 40px;}
.home-section-5 .item-4 {grid-area: item-4;}
.home-section-5 .item-5 {grid-area: item-5; border:2px solid var(--color-accent);}
.home-section-5 .item-6 {grid-area: item-6;background:var(--color-grey);padding:30px 40px;position: relative;}
.home-section-5 .item-6 img {position:absolute;right:7%;bottom:10%;width:15%;}
@media(max-width:768px){
.home-section-5 {display: block;}
.home-section-5 .item-1 {padding:15px;}
.home-section-5 .item-3 {padding:15px;}
.home-section-5 .item-3 *{margin-bottom:0px;}
.home-section-5 .item-6 {padding:15px;}
.home-section-5 .item-6 img {display:none;}
}
/*home-section-6*/
.home-section-6 {display:flex;}
.home-section-6 .item {width:100%;position:relative;margin-right:15px;min-height:450px;}
.home-section-6 .item:last-child{margin-right: 0;}
.home-section-6 .item h4{position:relative;display:inline-block;background:#fff;padding-right:40px;padding-bottom:15px}
.home-section-6 .item h4:before{content:'';position:absolute;right:-8px;top:0;border:8px solid transparent;border-top:44px solid #fff}
.home-section-6 .item ul {padding: 15px 30px;}
.home-section-6 .ul-num li:before {color: var(--color-white);left: 30px;}
.home-section-6 .item-1 {background: var(--color-accent);}
.home-section-6 .item-2 {background: var(--color-grey-light);}
.home-section-6 .item-3 {background: var(--color-grey-white);}
@media(max-width:768px){
.home-section-6 {flex-direction:column;}
.home-section-6 .item {min-height:350px;margin-bottom:15px;}
.home-section-6 .item h4{top:-5px;padding-bottom:16px;}
.home-section-6 .item h4:before {border-top:39px solid #fff;}
}
/*about-section-3*/
.about-section-3 {
display: grid;
grid-auto-columns: 1fr;
grid-template-columns: 1fr 1fr 1fr 1fr 0.5fr;
grid-template-rows: 1fr 1fr 1fr 1fr;
grid-column-gap:0px;grid-row-gap:0px;
grid-template-areas:
"item-1 item-1 . item-2 ."
"item-3 . item-4 . ."
". item-5 . item-6 ."
"item-7 . item-8 item-9 item-9";
}
.about-section-3 .item-1 {grid-area: item-1;background: var(--color-accent);padding:30px;}
.about-section-3 .item-2 {grid-area: item-2;border:2px solid var(--color-accent);padding:30px;}
.about-section-3 .item-3 {grid-area: item-3;border:2px solid var(--color-accent);}
.about-section-3 .item-4 {grid-area: item-4;border:2px solid var(--color-accent);}
.about-section-3 .item-5 {grid-area: item-5;border:2px solid var(--color-accent);}
.about-section-3 .item-6 {grid-area: item-6;border:2px solid var(--color-accent);}
.about-section-3 .item-7 {grid-area: item-7;border:2px solid var(--color-accent);}
.about-section-3 .item-8 {grid-area: item-8;border:2px solid var(--color-accent);}
.about-section-3 .item-9 {grid-area: item-9;background:var(--color-grey);color: var(--color-white);padding:30px;}
@media(max-width:768px){
.about-section-3 {display: block;}
.about-section-3 .item-1 {padding:15px;}
.about-section-3 .item-2 {display: none; padding:15px;}
.about-section-3 .item-9 {padding:15px;}
}
/*services-section-1*/
.services-section-1 {
display: grid;
grid-auto-columns: 1fr;
grid-template-columns: 1fr 1fr;
grid-template-rows: 1.5fr 1.5fr;
grid-column-gap:0px;grid-row-gap:0px;
grid-template-areas:
"item-1 item-2"
"item-3 item-4";
color: var(--color-grey);
}
.services-section-1 .item-1 {grid-area: item-1;}
.services-section-1 .item-2 {grid-area: item-2;background: var(--color-accent);padding:45px;}
.services-section-1 .item-3 {grid-area: item-3;background:var(--color-grey);color: var(--color-white);padding:45px;}
.services-section-1 .item-4 {grid-area: item-4;padding:45px;}
@media(max-width:768px){
.services-section-1 {display: block;}
.services-section-1 .item-2 {padding:15px;}
.services-section-1 .item-3 {padding:15px;}
.services-section-1 .item-4 {padding:15px;}
}
/*services-section-3*/
.services-section-3 {display: flex;flex-wrap: wrap;}
.services-section-3 .item {background:var(--color-white);padding:20px 30px;width:31%;margin:15px;}
@media(max-width:768px){
.services-section-3 {flex-direction: column;}
.services-section-3 .item {padding:15px;width:auto;margin:5px 0px;}
}
/*catalog*/
.catalog {padding-right:0;padding-left:0;margin-right:-10px;width:auto;}
.catalog>.col, .catalog>[class*=col-] {padding-right:10px;padding-left:0;margin-bottom:10px;}
.element {border:1px solid var(--color-grey-white);height:100%;padding:20px 20px 100px 20px;border-radius:4px;position:relative;display:block;z-index:1;}
.element:last-item{margin-right: 0;}
.element .title {font-size:28px;line-height:120%;font-weight:500;}
.element .sub-title {font-size:14px;}
.element .description {font-size:14px;margin-top:30px;margin-bottom:15px;}
.element .dop-title {font-size:14px;color: rgb(0 0 0 / 50%);}
.element .application {font-size:14px;margin-bottom:15px;}
.element .characteristics {font-size:14px;}
.element .category {font-size:14px;position:absolute;bottom:12px;right:25px;}
.element .bg-category{position:absolute;background:rgb(255 255 255 / 40%);width:calc(100% + 35px);height:50px;right:-25px;bottom:-12px;z-index:-1}
.element .bg-category:before{content:'';position:absolute;left:-20px;bottom:0;border:20px solid transparent;border-bottom:50px solid rgb(255 255 255 / 40%);border-right:0 solid rgb(255 255 255 / 40%)}
.element.item-yellow {border:none; background:var(--color-accent);}
.element.item-grey-white {border:none; background:var(--color-grey-white);}
.element.item-grey-light {border:none; background:var(--color-grey-light);}
.element.item-grey {border:none; background:var(--color-grey);color:var(--color-white);}
.element.item-black {border:none; background:var(--color-black);color:var(--color-white);}
.element.item-grey .dop-title {color: rgb(255 255 255 / 50%);}
.element.item-black .dop-title {color: rgb(255 255 255 / 50%);}
.element.item-dop {background: #69c9ff;margin-bottom: 30px;}
/*filter*/
.filter {}
.filter .btn-filter {transition:0.3s;cursor:pointer;display:inline-flex;justify-content:center;align-items:center;background:var(--color-accent);padding:0 30px;line-height:45px;}
.filter .btn-filter:hover {transition:0.3s;background:var(--color-grey);color: var(--color-white);}
.filter .btn-cat {transition:0.3s;display:inline-flex;align-items:center;justify-content:center;position:relative;background:var(--color-white);padding:10px 15px;color:var(--color-grey);margin:0 0 5px 0;}
.filter .btn-cat:hover {transition:0.3s;background:var(--color-grey);color: var(--color-white);}
.filter .btn-cat.active {background:var(--color-grey);color: var(--color-white);}
@media(max-width:768px){
.filter .btn-cat {padding:5px 10px;font-size:14px;}
}
/*documents*/
.documents {padding-right:0;padding-left:0;margin-right:-10px;width:auto;}
.documents>.col, .documents>[class*=col-] {padding-right:10px;padding-left:0;margin-bottom:10px;}
.doc {border:1px solid var(--color-grey-white);height:100%;padding:20px;border-radius:4px;position:relative;display:block;z-index:1;}
.doc:last-item{margin-right: 0;}
.doc .title {font-size:18px;line-height:120%;font-weight:500;}
.doc .description {font-size:14px;line-height:120%;margin:10px 0;}
.doc .category {font-size:14px;opacity: 0.5;margin: 10px 0;}
.doc .doc-btns {margin-top:10px;}
.doc .doc-btns a {transition:0.3s;margin-bottom: 5px; background:rgb(255 255 255 / 60%);padding:0 15px;line-height:35px;font-size:14px;display:inline-block;position:relative;}
.doc .doc-btns a:hover {transition:0.3s;background:var(--color-grey);color: var(--color-white);}
.doc.item-yellow {border:none; background:var(--color-accent);}
.doc.item-grey-white {border:none; background:var(--color-grey-white);}
.doc.item-grey-light {border:none; background:var(--color-grey-light);}
.doc.item-grey {border:none; background:var(--color-grey);color:var(--color-white);}
.doc.item-black {border:none; background:var(--color-black);color:var(--color-white);}
.doc.item-grey .dop-title {color: rgb(255 255 255 / 50%);}
.doc.item-black .dop-title {color: rgb(255 255 255 / 50%);}
@media(max-width:768px){
.doc .title {font-size:18px;}
}
/*news*/
.news>*{background: var(--color-white);padding:20px;}
.news {padding-right:0;padding-left:0;margin-right:-10px;width:auto;}
.news>.col, .news>[class*=col-] {padding-right:10px;padding-left:0px;margin-bottom:10px;margin-right:10px;overflow: hidden;border-radius: 4px;}
.new {min-height:350px;height:100%;padding:0px 20px;border-radius:4px;position:relative;display:block;z-index:1;}
.new:last-item{margin-right: 0;}
.new .info {display:flex;flex-direction:column;height:100%;}
.new .info {transition:0.3s;}
.new .info div {margin-top:auto;}
.new .info:hover div {transition:0.3s; color: var(--color-accent);}