/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
* Autoprefixer: v10.4.7
* Browsers: last 4 version
*/

* {
    //outline:1px solid #ccc;
}

:root {
    --content-size:1400px;
    --content-padding:0 40px;
    --slider-size:1920px;
    
    --cl-link:#d9000b;
    --cl-link-hover:#ee3a43;
   
    --cl-gray:#57514e;
    --cl-gray-light:#efeeee;
    --cl-gray-middle:#aba8a6;
}


@font-face {
	font-family: 'Inter-Regular';
	font-style: normal;
	src: local('Inter-Regular'), local('Inter-Regular'),
	    url('../../../../../fonts/Inter-Regular.otf') format('opentype');}

@font-face {
	font-family: 'Inter-Light';
	src: local('Inter-Light'), local('Inter-Light'),
	    url('../../../../../fonts/Inter-Light.otf') format('opentype');}

@font-face {
	font-family: 'Inter-Bold';
	src: local('Inter-Bold'), local('Inter-Bold'),
	    url('../../../../../fonts/Inter-Bold.otf') format('opentype');}

@font-face {
	font-family: 'Inter-ExtraBold';
	src: local('Inter-ExtraBold'), local('Inter-ExtraBold'),
	    url('../../../../../fonts/Inter-ExtraBold.otf') format('opentype');}

@font-face {
	font-family: 'Inter-SemiBold';
	src: local('Inter-SemiBold'), local('Inter-SemiBold'),
	    url('../../../../../fonts/Inter-SemiBold.otf') format('opentype');}

* {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;}

.actions,
.icons{
    display:none;}

html{
    height: 100%;}

body{
    font-family: 'Inter-Regular';
    background:#fff;
    min-width:360px;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
        -ms-flex-direction:column;
            flex-direction:column;
    min-height: 100%;
    font-size:14pt;
    line-height: 1.4;
    color:#222;}

a{
    color:var(--cl-link);
    text-decoration: none;
    -webkit-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;}

a:hover{
    color:var(--cl-link-hover);
    -webkit-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;}


header {
    width:100%;
    margin:0 auto;
    -webkit-box-flex:1;
        -ms-flex:1 0 auto;
            flex:1 0 auto;
    position:relative;
    z-index:2;
    background:#fff;}

.header-top{
    width: 100%;
    display:table;
    background:var(--cl-gray-light);}

.header-top > div{
    width: 100%;
    margin:0 auto;
    max-width:var(--content-size);
    padding:var(--content-padding);
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
        flex-wrap:wrap;}

.header-bottom {
    width: 100%;
    max-width: var(--size-content);
    padding:10px 0;
    display:table;}

.header-bottom > div{
    width: 100%;
    margin:0 auto;
    max-width:var(--content-size);
    padding:var(--content-padding);
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
        flex-wrap:wrap;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;}


/* Адрес */

.header-top .adress {
    -webkit-box-ordinal-group:2;
        -ms-flex-order:1;
            order:1;
    width:calc(100% - 255px);
    float:right;
    padding:16px 0 9px;
    padding-right:20px; 
    font-size:11pt;}


/* Телефон */

.header-top .phone {
    font-family: 'Inter-Bold';
    text-align: right;
    -webkit-box-ordinal-group:3;
        -ms-flex-order:2;
            order:2;
    width:255px;
    float:right;
    position:relative;
    padding:11px 0 9px;}

.header-top .phone a{
    color:#000;
    position:relative;
    font-size:17pt;}

.header-top .phone a:hover{
    color:var(--cl-link);}

.header-top .phone a:before{
    position: absolute;
    content: "";
    display:block;
    width:20px;
    height:20px;
    background-image:url(../../../../../images/style/telephone2.png);
    background-size:100%;
    background-repeat:no-repeat;
    left:-32px;
    top:4px;
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    -webkit-filter: gray;
            filter: gray;}
    
.header-top .phone a:hover:before{
        -webkit-filter: grayscale(0%);
    -moz-filter: grayscale(0%);
    -ms-filter: grayscale(0%);
    -o-filter: grayscale(0%);
    filter: grayscale(0%);
    -webkit-filter: none;
            filter: none}
    
.header-top .phone a.whatsapp{
    font-size:0;
    width:20px;
    height:20px;
    display:table;
    position:absolute;
    right:220px;
    margin:5.7px 6px 0 0;
    background-image:url(../../../../../images/style/whatsapp.png);
    background-size:cover;
    background-repeat:no-repeat;
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    -webkit-filter: gray;
            filter: gray;}
    
.header-top .phone a.whatsapp:hover{
    -webkit-filter: grayscale(0%);
    -moz-filter: grayscale(0%);
    -ms-filter: grayscale(0%);
    -o-filter: grayscale(0%);
    filter: grayscale(0%);
    -webkit-filter: none;
            filter: none;}
    
.header-top .phone a.whatsapp:before{
    display:none;}

/* Логотип */

.header-bottom .logo{
    width:400px;
    float:left;
    padding:10px 0 0;
    text-shadow:0.1px 0.1px 0 #000}

.header-bottom .logo img{
    width:42px;
    height:42px;
    margin:-3px 45px 5px 0;
    float:left;}

.header-bottom .logo h1,
.header-bottom .logo h3{
    font-family: 'Inter-ExtraBold';
    font-stretch: condensed;
    letter-spacing: 0px;
    text-transform: uppercase;
    font-size:22pt;
    font-weight:600;
    color:var(--cl-gray);
    display: inline-block;
    -webkit-transform: scaleX(1.21);
        -ms-transform: scaleX(1.21);
            transform: scaleX(1.21)}

.header-bottom .logo a{
    color:var(--cl-gray);}


/* МЕНЮ */



/* Кнопка - Обсудить партнерство */

.header-bottom .button {
    width:300px;
    float:right;
    padding:12px 0 5px;}

.header-bottom .button a{
    color:#fff;
    background: var(--cl-gray);
    background: var(--cl-link); /* Замена */
    display:table;
    float:right;
    font-size:11pt;
    padding:10px 18px;
    border-radius: 5px;
    text-transform: uppercase;}

.header-bottom .button a:hover{
    background: var(--cl-link);
    background: var(--cl-gray); /* Замена */
    
}

    @media screen and (max-width: 1920px) {
        .header-bottom {
            padding:20px 0;}
    }

    @media screen and (max-width: 800px) {
        .header-top > div{
            justify-content:flex-end;}
            
        .header-top .adress,
        .header-top .phone{
            padding:20px 0 0;
            float:right;
            width:calc(100% - 60px);
            padding-right: 0;}
        
        .header-top .adress{
            text-align: right;}
        
        .header-top .phone{
            padding: 10px 0 10px;}
        
        .header-bottom .button {
            width:250px;
            padding:10px 0 5px;}
        
        .header-bottom .button a{
            font-size:10pt;}
        
        .header-bottom .logo{
            width:350px;}
        
        .header-bottom .logo h1,
        .header-bottom .logo h3{
            font-size:20pt;}
    }

    @media screen and (max-width: 700px) {
        header{
            padding: 0 30px;}
        
        header,
        .header-top > div{
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            padding:0;
            -webkit-box-orient: vertical;
            -webkit-box-direction: reverse;
                -ms-flex-direction: column-reverse;
                    flex-direction: column-reverse;}
        
        .header-top > div{
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column}
        
        header{
            padding:0 0 80px;
            position: relative;}
        
        .header-top{
            background:#fff;}
            
        .header-bottom .logo,
        .header-top .phone,
        .header-top .adress{
            width:100%;}
            
        .header-top .adress{
            float:right;
            width:calc(100% - 40px);
            margin-left:40px;}
        
        .header-top .phone{
            text-align: right;
            padding:5px 40px 0;}
            
        .header-top .phone a.whatsapp{
            right:260px;}
        
        .header-top .adress{
            text-align: right;
            padding:15px 40px 0;}
        
        .header-bottom .button {
            position: absolute;
            z-index:1;
            bottom: 20px;
            right:40px;
            width:100%;}
        
        .header-bottom {
            background: var(--cl-gray-light);}
    }

    @media screen and (max-width: 650px) {
        .header-bottom  > div{
            padding:0 30px;}
        
        .header-top .phone{
            text-align: right;
            padding:5px 30px 0;}
            
        .header-top .phone a.whatsapp{
            right:250px;}
        
        .header-top .adress{
            text-align: right;
            padding:15px 30px 0;}
        
        .header-bottom .button {
            right:30px;}
    }
    
    @media screen and (max-width: 600px) {
        .header-top .adress{
            padding-left:80px;

        }
    }


    @media screen and (max-width: 450px) {
        .header-bottom {
            padding:25px 0 20px;}
        
        .header-bottom .logo img{
            margin:-8px 35px 5px 0;}
        
        .header-bottom .logo h1,
        .header-bottom .logo h3{
            font-size:17pt;}

    }
    



.slider {
    margin:0px 0 0;
    z-index:0;
    width: 100%;
    display:flex;
    position: relative;
    background:var(--cl-gray-middle);
    background:#605d5c;
    background:#313c48; /* Замена */
    background-image:url(../../../../../images/style/fon_w.png);
    background-position:top; /* Замена */
    background-size:1800px;
    background-repeat:repeat-x;}

.slider > div {
    width:100%;
    display:flex;
    margin: 0 auto;
    width: 100%;
    max-width:var(--slider-size);
    max-height:920px !important;
    position:relative;
    background-image:url(../../../../../images/style/fon_w.png);
    background-position:bottom;
    background-size:1600px;
    background-repeat:repeat-x;
    overflow: hidden;}
    
.slider > div img{
    width:100% !important;
    height:auto !important;}


    @media screen and (max-width: 1920px) {
        .slider > div {
            max-width:1500px;
            background-size:1500px;}
  
        .slider p a{
            font-size: calc(9pt + 10 * (100vw / 1920));}
    }

    @media screen and (max-width: 1200px) {
        .slider > div {
            background-size:1200px;}
            
        .slider {
            margin:0;}
            
        .slider p{
            bottom:4%;}
        
        .slider p a{
            padding:11px 25px;
            font-size: calc(9pt + 7 * (100vw / 1920));}
    }

    @media screen and (max-width: 900px) {
        .slider h2{
            font-size: calc(9pt + 94 * (100vw / 1920));
            bottom:13%;}
    }
    
    @media screen and (max-width: 800px) {
        .slider h2{
            font-size: calc(9pt + 94 * (100vw / 1920));
            bottom:14%;}
        
        .slider p a{
            padding:10px 20px;}
    }
    
    @media screen and (max-width: 650px) {
        .slider {
            margin:0;}
            
        .slider h2{
            font-size: calc(9pt + 84 * (100vw / 1920));
            bottom:15%;}
    }
    
    @media screen and (max-width: 600px) {
        .slider h2{
            bottom:18%;}
        
        .slider p{
            bottom:5%}
        
        .slider p a{
            padding:7px 15px;}
    }
    
    @media screen and (max-width: 450px) {
        .slider h2{
            font-size: calc(9pt + 68 * (100vw / 1920));
            bottom:20%;}
        
        .slider p{
            bottom:7%}
        
        .slider p a{
            font-size: 9pt;
            padding:5px 10px;}
    }

/* Склады ответсвенного хранения */


.preim {
    position:relative;
    z-index:2;
    margin:-50px 0 0;
    width: 100%;
    background: #fff;
    padding:var(--content-padding);
    background-image: url(../../../../../images/style/fon_c.png);
    background-size:1400px;
    background-repeat: repeat-x;
    background-position: bottom;}

.preim > div{
    width: 100%;
    max-width: var(--content-size);
    padding:70px 0 71px;
    margin:0 auto;}


    
.preim > div > p{
    font-family: 'Inter-Light';
    display:table;
    text-align:center;
    margin:10px auto;
    max-width:1100px;
    font-size:17pt;
    font-weight:600;}
    

    
.preim > div > p span{
    color:var(--cl-link);}

.preim table{
    margin:70px 0 0;
    background:#fff;
    -webkit-box-shadow:3px 3px 10px #ccc;
    box-shadow:3px 3px 10px #ccc;
    border-radius:10px;}

.preim table td {
    width:25%;
    padding:40px 30px 45px;
    text-align:center;}

.preim table td p{
    font-family: 'Inter-Light';
    color:var(--cl-gray);
    font-size:13pt;
    display:table;
    text-align:center;
    margin:5px auto;
    max-width:220px;
    line-height: 1.2}

.preim table td strong{
    font-family: 'Inter-ExtraBold';
    color:var(--cl-link);
    font-size:30pt;
    font-weight:600;}
    
.preim h2{
    //font-size:45pt;
    font-size:45pt;
    margin:-30px auto 20px;
    font-family: 'Inter-ExtraBold';
    text-align:center;
    text-transform:uppercase;}
    
.preim sup {
        font-size:15pt;
        display:inline-block;
        margin:-30px 0 0;
        position:relative;
        top:0;
        vertical-align: super;
    }

    @media screen and (max-width: 1920px) {
        .preim > div{
            padding:60px 0 71px;}
            
        .preim h2{
            font-size: calc(30pt + 20 * (100vw / 1920));}
    }
    @media screen and (max-width: 1400px) {

        .preim table td strong{
            font-size:26pt;}
            
        .preim table td p{
            font-size:12pt;}
    }

    @media screen and (max-width: 1200px) {
        .preim > div{
            padding:60px 0 61px;}
            
        .preim {
            background-size:1300px;
            margin:-10px auto;}
            
        .preim h2{
            font-size: calc(9pt + 60 * (100vw / 1920));}
            
        .preim table{
            margin:50px 0 0;}
        
        .preim table td {
            padding:30px 30px 35px;}
            
        .preim table td p{
            font-size:11pt;}
        
        .preim table td strong{
            font-size:24pt;}
    }
    
    @media screen and (max-width: 1000px) {
        .preim table tr{
            display:-webkit-box;
            display:-ms-flexbox;
            display:flex;
            -ms-flex-wrap: wrap;
                flex-wrap: wrap;}
        
        .preim table td:nth-child(1),
        .preim table td:nth-child(2){
            width:50%;
            padding:30px 30px 10px;}
        
        .preim table td:nth-child(3),
        .preim table td:nth-child(4){
            width:50%;
            padding:10px 30px 30px;}
    }

    @media screen and (max-width: 900px) {
        .preim > div{
            padding:60px 0 61px;}
            
        .preim {
            background-size:1400px;}
            
        .preim table{
            margin:50px 0 0;}
        
        .preim table td {
            padding:30px 30px 35px;}
            
        .preim > div > p{

            max-width:900px;}
        
        .preim table td p{
            font-size:10pt;}
        
        .preim table td strong{
            font-size:26pt;}
        
        .preim sup {
            font-size:13pt;}
    }

    @media screen and (max-width: 800px) {
        
        .preim > div > p{
            font-size:12pt;}
        
        .preim table td strong{
            font-size:22pt;}
            
        .preim sup {
            font-size:12pt;}
            
        .preim h2{
            font-size: 27pt;
            line-height:1.2;

        }
    }
    
    @media screen and (max-width: 650px) {
        .preim {
            margin:-10px 0 0;
            background-size:1300px;}
            
        .preim > div > p{
            width:95%;}
            
        .preim table td strong{
            font-size:18pt;}
        
        .preim sup {
            font-size:11pt;}
            
        .preim h2{
            font-size: 25pt;
            text-align:left;}
            
        .preim > div > p{
            width:100%;
            font-size:13pt;
            text-align:left;
        }
    }

    @media screen and (max-width: 450px) {
        
        .preim {
            padding:10px 30px 0;}
            
        .preim > div{
            padding:50px 0 30px;}
            
        .preim h2{
            font-family: 'Inter-Bold';
            font-size: 22pt;}
        
        .preim table{
            margin:30px 0 0;}
        
        .preim table td:nth-child(1),
        .preim table td:nth-child(2){
            padding:30px 10px 10px;}
        
        .preim table td:nth-child(3),
        .preim table td:nth-child(4){
            padding:10px 10px 30px;}
        
        .preim table td strong{
            font-size:18pt;}
            
        .preim sup {
            font-size:10pt;}
    }


.moduletable.usluga-top {
    background:var(--cl-gray-light);
    width: 100%;
    padding:50px 40px 30px;}

.moduletable.usluga-top > div{
    width: 100%;
    max-width:calc(var(--content-size) - 150px); /* 150 */
    max-width:var(--content-size); /* 150 */
    padding:20px 0;
    margin:0 auto;}
    
.moduletable.usluga-top h2{
    font-size:32pt;
    text-transform:uppercase;
    font-family: 'Inter-Bold';
    margin:10px 0 0px;}
    
.moduletable.usluga-top > div p{
    font-size:15pt;}

.moduletable.usluga-top h2 span{
    color:var(--cl-link);}

.moduletable.usluga-top > div .nspArtScroll2 {
    display:flex;
    flex-wrap:wrap;
    padding:30px 0 0;
    gap:30px;}

.moduletable.usluga-top > div .nspArtScroll2 .nspArtPage  {
    width:calc(33.333% - 30px*2/3);
    position:relative;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    aspect-ratio: 1 / 1;}

.moduletable.usluga-top > div .nspArtScroll2 .nspArtPage img {
    width:100% !important;
    top:0;
    left:0;
    height:auto !important;
    border-radius: 7px;
    //position:absolute;
    
    -webkit-filter: grayscale(30%);
    -moz-filter: grayscale(30%);
    -ms-filter: grayscale(30%);
    -o-filter: grayscale(30%);
    filter: grayscale(30%);

    -webkit-transition: all 1000ms ease;
    -moz-transition: all 1000ms ease;
    -ms-transition: all 1000ms ease;
    -o-transition: all 1000ms ease;
    transition: all 1000ms ease;}
    
.moduletable.usluga-top > div .nspArtScroll2 .nspArtPage:hover img {
    width:110% !important;
    top:-5%;
    left:-5%;
    -webkit-transition: all 1000ms ease;
    -moz-transition: all 1000ms ease;
    -ms-transition: all 1000ms ease;
    -o-transition: all 1000ms ease;
    transition: all 1000ms ease;}

.moduletable.usluga-top > div .nspArtScroll2 .nspArtPage h4 {
    position:relative;
    background:#fff;
    border-radius:5px;
    padding:15px 10px 10px 20px;
    //bottom:30px;
    margin:-40px 0 0 40px;
    z-index:2;
    display:table;
    max-width:calc(100% - 40px);
    
}

.moduletable.usluga-top > div .nspArtScroll2 .nspArtPage h4 a{
    color:#444;
    font-size:14pt;
    //font-family: 'Inter-Bold';
    line-height:1;
    //text-transform:uppercase;
    //text-shadow:1px 1px 10px #000;
    
}
    

    @media screen and (max-width: 1440px) {
        .moduletable.usluga-top > div .nspArtScroll2 .nspArtPage h4 a{
            font-size:20pt;}
    }
        
    @media screen and (max-width: 1200px) {
        .moduletable.usluga-top h2{
            font-size:28pt;}
            
        .moduletable.usluga-top > div p{
            font-size:14pt;}
            
        .moduletable.usluga-top > div .nspArtScroll2 .nspArtPage h4 {
            max-width:180px;
            left:20px;}
        
        .moduletable.usluga-top > div .nspArtScroll2 .nspArtPage h4 a{
            font-size:18pt;}
    }
    
    @media screen and (max-width: 1000px) {
        .moduletable.usluga-top h2{
            font-size:32pt;}
            
        .moduletable.usluga-top > div p{
            font-size:15pt;}
            
        .moduletable.usluga-top > div .nspArtScroll2 .nspArtPage  {
            width:calc(50% - 15px);}
    
        .moduletable.usluga-top > div .nspArtScroll2 .nspArtPage h4 {
            max-width:250px;
            left:40px;}
        
        .moduletable.usluga-top > div .nspArtScroll2 .nspArtPage h4 a{
            font-size:26pt;}
    }
    
    @media screen and (max-width: 800px) {
        .moduletable.usluga-top h2{
            font-size:27pt;}
            
        .moduletable.usluga-top > div p{
            font-size:14pt;
            width:80%;}
            
        .moduletable.usluga-top > div .nspArtScroll2 .nspArtPage h4 {
            max-width:220px;
            left:20px;}
            
        .moduletable.usluga-top > div .nspArtScroll2 .nspArtPage h4 a{
            font-size:22pt;}
        
    }
    @media screen and (max-width: 650px) {
        .moduletable.usluga-top h2{
            font-size:24pt;
            line-height:1.2;}
            
        .moduletable.usluga-top > div p{
            font-size:12pt;
            width:80%;}
        
        .moduletable.usluga-top h2 strong{
            display:inline-block;}
            
        .moduletable.usluga-top > div .nspArtScroll2 .nspArtPage h4 {
            max-width:180px;
            left:20px;}
        
        .moduletable.usluga-top > div .nspArtScroll2 .nspArtPage h4 a{
            font-size:17pt;}
        


    }
    @media screen and (max-width: 500px) {
        .moduletable.usluga-top > div .nspArtScroll2 .nspArtPage  {
            aspect-ratio: 3 / 2;
            border-radius:6px;}
        
        .moduletable.usluga-top > div p{
            width:100%;}
            
        .moduletable.usluga-top > div .nspArtScroll2 .nspArtPage h4 {
            max-width:200px;
            left:auto;
            text-align:right;
            right:20px;
            bottom:auto;
            top:30px;
            line-height:1.2;}
        
        .moduletable.usluga-top > div .nspArtScroll2 .nspArtPage h4 a{
            font-size:22pt;}
            
        .moduletable.usluga-top > div .nspArtScroll2 .nspArtPage  {
            width:100%;}
    }
    @media screen and (max-width: 450px) {
        .moduletable.usluga-top {
            padding:30px;}
            
        .moduletable.usluga-top > div .nspArtScroll2 .nspArtPage h4 {
            max-width:220px;
            left:auto;
            right:20px;
            bottom:auto;
            top:30px;
            line-height:1.6;
            text-align:right;
            bottom:20px;}
            
        .moduletable.usluga-top > div .nspArtScroll2 .nspArtPage h4 a{
            font-size:20pt;
            text-align:right;

        }
    }

/* Не просто услуги */

.uslugi {
    background:#fff;
    width: 100%;
    padding:var(--content-padding);}

.uslugi > div{
    width: 100%;
    max-width:calc(var(--content-size) - 150px); /* 150 */
    padding:50px 0;
    margin:0 auto;}

.uslugi > div > p{
    font-family: 'Inter-Bold';
    font-size:32pt;
    text-transform:uppercase;
    line-height:1.2;
    color:var(--cl-link);}
    
.uslugi > div > p:nth-child(2){
    text-transform:none;
    color:#000;
    width:100%;
    margin:10px 0 0;
    display:table;
    font-family: 'Inter-Regular';
    font-size: 15pt;}

.uslugi > div > p strong{
    color:var(--cl-link);}

.uslugi table{
    margin:40px 0 0;}

.uslugi table tr{
    width:100%;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
        flex-wrap:wrap;
    gap:30px;}

.uslugi table td{
    box-shadow:3px 3px 15px #ccc;
    background:#fff;
    padding:20px 25px 20px 90px;
    border-radius:8px;
    min-height:100px;
    width:calc(33.33% - 30px*2/3);
    background-repeat: no-repeat;
    background-size:60px;
    background-position: 15px;
    position: relative}

/*
.uslugi table td:nth-child(1){
    background-image: url(../../../../../images/style/icons/01_part.svg);}

.uslugi table td:nth-child(2){
    background-image: url(../../../../../images/style/icons/06_part.svg);}

.uslugi table td:nth-child(3){
    background-image: url(../../../../../images/style/icons/02_part.svg);}

.uslugi table td:nth-child(4){
    background-image: url(../../../../../images/style/icons/05_part.svg);}

.uslugi table td:nth-child(5){
    background-image: url(../../../../../images/style/icons/03_part.svg);}

.uslugi table td:nth-child(6){
    background-image: url(../../../../../images/style/icons/04_part.svg);}
*/
.uslugi table tr p{
    font-size:11pt; /* 11 */
    font-family: 'Inter-light';}

.uslugi table tr p strong{
    font-family: 'Inter-Bold';
    font-size:13pt;
    margin:5px 0;
    display:table;
    clear:both;
    color:var(--cl-gray);}

    @media screen and (max-width: 1200px) {
        .uslugi > div > p{
            font-size:28pt;}
    
        .uslugi > div > p:nth-child(2){
            font-size: 14pt;
            width:70%;
            line-height:1.4;}
    
        .uslugi > div{
            padding:80px 0;}
        
        .uslugi table{
            margin:50px 0 0;}
        
        .uslugi table td{
            width:calc(50% - 15px);}
    }
    
     @media screen and (max-width: 1000px) {
        .uslugi > div > p{
            font-size:32pt;}
            
        .uslugi > div > p:nth-child(2){
            font-size: 15pt;
            width:90%;
            line-height:1.4;}
     }

    @media screen and (max-width: 800px) {
        .uslugi > div{
            padding:60px 0;}
        
        .uslugi table{
            margin:40px 0 0;}
        
        .uslugi > div > p{
            font-size:27pt;}
            
        .uslugi > div > p:nth-child(2){
            font-size: 14pt;
            width:100%;
            line-height:1.4;}
            
        .uslugi table td{
            width:100%;}
    }

    @media screen and (max-width: 650px) {
        .uslugi > div > p{
            font-size:24pt;}
            
        .uslugi > div > p:nth-child(2){
            font-size: 12pt;}
        

        
    }

    @media screen and (max-width: 450px) {    
        .uslugi {
            padding:0 30px}
            
        .uslugi > div{
            padding:40px 0 30px;}
        
    }


/* Оставьте заявку */


.zayavka {
    width: 100%;
    padding:var(--content-padding);
    position: relative;
    z-index: 1;
    //background:#f3f3f3;
}


.zayavka:before {
    content:"";
    position: absolute;
    width:100%;
    height:320px;
    background:#313c48; /* Замена */
    bottom:0;
    z-index:0;
    left:0;}



.zayavka > div{
    width: 100%;
    max-width:calc(var(--content-size) - 150px);
    padding:100px 0 50px;
    margin:0 auto;
    position:relative;
    min-height:450px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
    z-index:3;}
    
/*   
.zayavka > div img{
    position:absolute;
    right:-45px;
    bottom:-15px;
    transform:rotate(1.5deg);
    width:45% !important;
    height:auto !important;}    
*/
.zayavka > div > p:nth-child(3){
    font-family: 'Inter-ExtraBold';
    color:#fff;
    font-size:16pt;
    display: table;
    width:calc(100% - 420px);}
    
.zayavka > div > p:nth-child(4){
    font-family: 'Inter-ExtraBold';
    color:#fff;
    font-size:24pt;
    display: table;
    width:calc(100% - 420px);}

.zayavka > div a{
    font-family: 'Inter-Bold';
    background:#fff;
    color:var(--cl-link);
    color:#313c48; /* Замена */
    padding:10px 30px;
    font-size:18pt;
    border-radius: 6px;
    margin:20px 20px 0 0;
    display:inline-block;}

    @media screen and (max-width: 1440px) {
        .zayavka > div{
            min-height:400px;}
            
        .zayavka:before {
            height:280px;}
        
        .zayavka > div > p{
            font-size:20pt;}
            
        .zayavka > div a{
            font-size:14pt;}
            /*
        .zayavka > div img{
            right:-20px;
            width:40% !important;
            height:auto !important;}  */
    }
    
    @media screen and (max-width: 1200px) {
        .zayavka > div{
            min-height:350px;}
            
        .zayavka:before {
            height:260px;}
        
        .zayavka > div > p{
            font-size:16pt;}
            
        .zayavka > div a{
            font-size:12pt;}
         /*   
        .zayavka > div img{
            right:-20px;
            width:40% !important;
            height:auto !important;}      */
    }
    
    @media screen and (max-width: 1000px) {
        .zayavka > div{
            min-height:auto;}
            
        .zayavka:before {
            height:240px;}
        
        .zayavka > div > p{
            font-size:14pt;}
            
        .zayavka > div a{
            font-size:11pt;}
            /*
        .zayavka > div img{
            right:-20px;
            width:40% !important;
            height:auto !important;}   
            */
        .zayavka > div > p{
            width:calc(100% - 320px);}
    }
    
    @media screen and (max-width: 900px) {
        .zayavka:before {
            height:250px;}
        
        .zayavka > div > p{
            font-size:14pt;}
            
        .zayavka > div a{
            font-size:11pt;}
            /*
        .zayavka > div img{
            right:-20px;
            bottom:-10px;
            width:40% !important;
            height:auto !important;}   
           */ 
        .zayavka > div > p{
            width:calc(100% - 220px);}
    }
    
    @media screen and (max-width: 800px) {
        .zayavka:before {
            height:300px;}
        
        .zayavka > div > p{
            font-size:14pt;}
            
        .zayavka > div a{
            font-size:11pt;}
           /* 
        .zayavka > div img{
            right:-20px;
            bottom:-8px;
            width:40% !important;
            height:auto !important;}   
          */  
        .zayavka > div > p{
            width:calc(100% - 220px);}
    }
    
    @media screen and (max-width: 650px) {
        .zayavka{
            padding:20px 40px 0px;
            background:#313c48;}
            
        .zayavka:before {
            height:300px;
            display:none;}
            
        .zayavka > div > p{
            width:calc(100% - 50px);}
            
        .zayavka > div{
            width: 100%;
            padding:25px 0 50px;}
        
        .zayavka > div a{
            clear:both;
            display:table;
            padding:10px 15px;
            font-size:12pt;}
            
        .zayavka br {
            display:none;}
    }
    
    @media screen and (max-width: 450px) {
        .zayavka{
            padding:20px 30px 0px;}
        
        .zayavka > div > p{
            width:100%;}
        
        .zayavka > div a{
            font-size:11pt;}
    }






/* НАши гарантии */

.garantii {
    background:#fff;
    width: 100%;
    padding:var(--content-padding);}

.garantii > div{
    width: 100%;
    max-width:calc(var(--content-size) - 150px);
    padding:90px 0 50px;
    margin:0 auto;
    position:relative;}

.garantii > div p{
    font-family: 'Inter-Bold';
    font-size:37pt;
    color:#000;
    line-height: 1.2;
    font-weight:600;
    text-transform: uppercase;}

.garantii table{
    margin:60px 0 0;}

.garantii table tr{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;}

.garantii table tr td{
    width:calc((100%/6));
    padding:120px 15px 0;
    text-align: center;
    font-size:13pt;
    position:relative;
    background-size: 100px;
    background-repeat: no-repeat;
    background-position: top center;}

.garantii table tr td:nth-child(1){
    background-image: url(../../../../../images/style/01_G.svg);}

.garantii table tr td:nth-child(2){
    background-image: url(../../../../../images/style/02_G3.svg);}

.garantii table tr td:nth-child(3){
    background-image: url(../../../../../images/style/03_G.svg);}

.garantii table tr td:nth-child(4){
    background-image: url(../../../../../images/style/04_G.svg);}

.garantii table tr td:nth-child(5){
    background-image: url(../../../../../images/style/05_G3.svg);}

.garantii table tr td:nth-child(6){
    background-image: url(../../../../../images/style/06_G.svg);}

.garantii table tr td p{
    font-size:13pt;}

    @media screen and (max-width: 1200px) {
        .garantii > div{
            padding:80px 0 20px;}
        
        .garantii table{
            margin:40px 0 0;}
            
        .garantii > div p{
            font-size:32pt;}
        
        .garantii table tr td{
            padding:100px 10px 30px;
            background-size: 80px;
            text-align: center;
            font-size:11pt;}
    }

    @media screen and (max-width: 900px) {
        .garantii > div p{
            font-size:26pt;}
        
        .garantii table tr td{
            background-size: 80px;
            width:calc((100%/3));
            font-size:12pt;}
            
    }

    @media screen and (max-width: 800px) {
        .garantii > div p{
            font-size:22pt;}

    }

    @media screen and (max-width: 600px) {
        .garantii table tr td{
            background-size: 80px;
            width:calc((100%/2));
            font-size:12pt;}

    }
    @media screen and (max-width: 450px) {
        .garantii {
            padding:0 30px;}
        
        .garantii > div{
            padding:50px 0 20px;}
        
        .garantii > div p{
            font-size:20pt;}
        
        .garantii table tr td{
            padding:70px 10px 30px 0;
            background-size: 60px;
        font-size:11pt;}
    }







main{
    //min-height:800px;
    -webkit-box-flex:1;
        -ms-flex:1 0 auto;
            flex:1 0 auto;
}





/* ФУТЕР */

footer {
    -webkit-box-flex:0;
        -ms-flex:0 0 auto;
            flex:0 0 auto;
    width:100%;
    background:var(--cl-gray-light);}

footer .footer-top{
    clear:both;
    margin:0 auto;
    display:table;
    width:100%;
    max-width:var(--content-size);
    padding:40px 40px;}

footer .footer-bottom{
    width:100%;
    clear:both;
    border-top:1px solid #d1cfce;
    max-width:var(--content-size);
    margin:0 auto;
    display:table;
    padding:20px 40px 20px;
    font-size:13.5pt;}

footer .footer-bottom div:nth-child(1){
    float:left;
    -webkit-box-ordinal-group:3;
        -ms-flex-order:2;
            order:2;}

footer .footer-bottom div:nth-child(2){
    float:right;
    -webkit-box-ordinal-group:2;
        -ms-flex-order:1;
            order:1;}

footer .footer-bottom div:nth-child(3){
    float:right;
    -webkit-box-ordinal-group:4;
        -ms-flex-order:3;
            order:3;}

footer .footer-bottom p,
footer .footer-bottom a{
    font-family: 'Inter-light';
    color:#000;}
    
footer .footer-bottom span{
    font-size:10.2pt;
    margin:0 0 20px 20px;}

footer .footer-bottom a:hover{
    color:var(--cl-link);}

/* Логотип в Футтере */

footer .footer-top .logo{
    width:250px;
    float:left;
    padding:10px 15px 0;
    text-shadow:0.1px 0.1px 0 #000}

footer .footer-top .logo img{
    width:27px;
    height:30px;
    margin:-3px 15px 5px 0;
    float:left;}

footer .footer-top .logo p {
    font-family: 'Inter-ExtraBold';
    font-stretch: condensed;
    letter-spacing: 0;
    text-transform: uppercase;
    font-size:15pt;
    font-weight:600;
    color:var(--cl-gray);
    display: inline-block;
    -webkit-transform: scaleX(1.21);
        -ms-transform: scaleX(1.21);
            transform: scaleX(1.21)}
    
footer .footer-top .logo p span{
    font-size:8.5pt;
    font-family: 'Inter-Light';
    font-weight:100;
    -webkit-transform: scaleX(1);
        -ms-transform: scaleX(1);
            transform: scaleX(1);}

footer .footer-top .logo a{
    color:var(--cl-gray);}
    
footer .footer-top .logo a:hover{
    color:var(--cl-link);}


/* Телефон в Футтере */

footer .footer-top .phone {
    font-family: 'Inter-SemiBold';
    text-align: right;
    -webkit-box-ordinal-group:3;
        -ms-flex-order:2;
            order:2;
    width:245px;
    position:relative;
    float:right;
    padding:11px 0 9px;}

footer .footer-top .phone a{
    color:#000;
    position:relative;
    font-size:13.5pt;}

footer .footer-top .phone a:hover{
    color:var(--cl-link);}

footer .footer-top .phone a:before{
    position: absolute;
    content: "";
    display:block;
    width:20px;
    height:20px;
    background-image:url(../../../../../images/style/telephone2.png);
    background-size:cover;
    left:-27px;
    top:0px;}
    
footer .footer-top a.whatsapp{
    font-size:0;
    width:20px;
    height:20px;
    display:table;
    position:absolute;
    right:175px;
    margin:2px 6px 0 0;
    background-image:url(../../../../../images/style/whatsapp.png);
    background-size:cover;
    //background-repeat:no-repeat;
    //-webkit-filter: grayscale(100%);
    //-moz-filter: grayscale(100%);
    //-ms-filter: grayscale(100%);
    //-o-filter: grayscale(100%);
    //filter: grayscale(100%);
    //filter: gray;
    
}
    
footer .footer-top a.whatsapp:hover{
    -webkit-filter: grayscale(0%);
    -moz-filter: grayscale(0%);
    -ms-filter: grayscale(0%);
    -o-filter: grayscale(0%);
    filter: grayscale(0%);
    -webkit-filter: none;
            filter: none;}
    
footer .footer-top a.whatsapp:before{
    display:none;
}

/* Email в Футтере */

footer .footer-top .email {
    font-family: 'Inter-SemiBold';
    text-align: right;
    -webkit-box-ordinal-group:3;
        -ms-flex-order:2;
            order:2;
    width:220px;
    float:right;
    padding:11px 0 9px;}

footer .footer-top .email a{
    color:#000;
    position:relative;
    font-size:13.5pt;}

footer .footer-top .email a:hover{
    color:var(--cl-link);}

footer .footer-top .email a:before{
    position: absolute;
    content: "";
    display:block;
    width:18px;
    height:18px;
    background-image:url(../../../../../images/style/pochta.svg);
    background-size:cover;
    background-repeat:no-repeat;
    left:-27px;
    top:2px;}


/* Политика */

footer .politika {
    float:right;
    font-size:12pt;
    text-align: left;
    padding:0 85px 0 0}


footer .autor {
    width:50%;
    float:left;
    
    padding:10px 0 30px;}

footer .autor p{
    line-height: 1.5;}

footer .autor a{
    color:#f3f3f3;}

footer .autor a:hover{
    color:#fff;}
    
footer .footer-bottom div:nth-child(2){
    font-size:12pt;
}

    @media screen and (max-width: 1400px) {
        footer {
            padding:0 30px;}

        footer .footer-bottom{
            padding:20px 10px 20px;}

        footer .footer-top{
            padding:40px 10px;}
    }

    @media screen and (max-width: 1200px) {
        footer .footer-bottom{
            font-size:12pt;}
            
        footer .footer-bottom span{
            font-size:10pt;
            margin:0 0 20px 67px;}

        footer .politika {
            padding:0 45px 0 0}
    }

    @media screen and (max-width: 900px) {
        footer .footer-top{
            padding:20px 10px;}

        footer .footer-top .logo{
            margin:-38px 0 0}
        
        footer .footer-top .email{
            clear:both;
            padding:0px;}
        
        footer .footer-bottom div:nth-child(2){
            float:left;
            padding:10px 0 0;
            clear:both;}

        footer .politika {
            text-align:left;
            padding:0}
            
        footer .footer-bottom span{
            font-size:10pt;
            margin:0;}
    }

    @media screen and (max-width: 600px) {
        footer .footer-bottom{
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: reverse;
                -ms-flex-direction: column-reverse;
                    flex-direction: column-reverse;}
        
        footer .footer-top{
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            padding:30px 10px 20px;}
        
        footer .footer-top div{
            min-width:100%;
            text-align: left;
            padding:0 0 0 50px;}
        
        footer .footer-top .logo{
            margin:0 0 0 -50px;
            width:100%;}

        footer .footer-top .phone a,
        footer .footer-top .email a{
            font-family: 'Inter-Regular';
            padding:0;}

        footer .footer-top .phone,
        footer .footer-top .email{
            padding-left:28px;
        }
        
        footer .footer-top .phone{
            padding-left:53px;
        }
        
        footer .footer-top a.whatsapp{

    left:50px;}
        
        footer .footer-top .phone a:before,
        footer .footer-top .email a:before{
            //display: none;
            
        }
    }

    @media screen and (max-width: 450px) {
        footer {
            padding:0 20px;}
    }


        
        
.cookie {
    position:fixed;
    z-index:99999;
    display:table;
    bottom:15px;
    left:30px;
    max-width:400px;
    background:rgb(255,255,255,1);
    -webkit-box-shadow:0px 0px 10px #000;
            box-shadow:0px 0px 10px #000;
    padding:20px 30px;
    line-height:1.2;
    border-radius:5px;
    font-size:11pt}
    
.cookie p{
    margin:10px 0;}
    
.cookie a#cookie-agreement-button{
    display:table;
    padding:7px 30px;
    background:var(--cl-link-hover);
    color:#fff;
    font-size:14pt;
    border-radius:5px;
    margin:15px 0 0;}
    
.cookie a#cookie-agreement-button:hover{
    background:var(--cl-link);}




.com-content-category,
.com-content-article{
    width:100%;
    max-width: var(--content-size);
    margin:30px auto;
    padding:0 40px;
    text-align:left;
    background:#fff;
    border-radius: 20px;}
    
.com-content-category .visually-hidden {
    display:none;}

.com-content-category a{
    font-size:14pt;
    margin:5px 0;
    display:table;
    color:var(--cl-link-hover);}
    
.com-content-category a:hover{
    color:var(--cl-link);}

.com-content-article h1 {
    margin: 15px 0;
    font-family: 'Inter-Bold';
    text-transform: uppercase;
    font-size: 20pt;}
    
.com-content-article h2 {
    margin: 15px 0;
    font-family: 'Inter-Bold';
    text-transform: uppercase;
    font-size: 16pt;}
    
.com-content-article h3 {
    text-transform: uppercase;
    font-size: 14pt;
    margin:15px 0 5px}

.com-content-article p,
.com-content-article ul,
.com-content-article ol{
    font-family: 'Inter-Light';
    margin:13px 0;
    font-size:13pt;}
    


    @media screen and (max-width: 650px) {
        
        .com-content-category,
        .com-content-article{
            padding:0 30px;}
    }
    
.com-content-article ul,
.comp-video ul{
    margin:15px 0 0 50px;}
    
.com-content-article ul strong,
.com-content-article ol strong{
    color:#000;
    font-family: 'Inter-Regular';
}


    
.com-content-article ul li,
.com-content-article ol li,
.comp-video ul li{
    line-height:1.7;
    position:relative;}

.com-content-article ul li:before,
.com-content-article ul li:after,
.comp-video ul li:before,
.comp-video ul li:after{
    content:"";
    position:absolute;
    left:-25px;
    top:11px;
    width:6px;
    height:6px;
    display:block;
    border-top:2px solid var(--cl-link);
    border-right:2px solid var(--cl-link);

    transform:rotate(45deg);}
    
.com-content-article ul li:after,
.comp-video ul li:after{
    left:-30px;}

.com-content-article ol li{
    margin:7px 0 7px 40px;
    line-height:1.5;
    list-style-type: none;
    counter-increment: list;
    position: relative;}

.com-content-article ol li:after {
    content: counter(list) ".";
    position: absolute;
    top:0;
    left: -2.5em;
    width: 2em;
    text-align: right;
    color: var(--cl-link);}
    
.mod-breadcrumbs__wrapper{
    flex:1 0 auto;
    width:100%;
    max-width:calc(var(--content-size) - 0px);
    margin:0px auto;
    border-top:1px solid #ccc;
    font-family: 'Inter-Light';
    font-size: 11pt;
    padding:10px 40px;
    display:table;}
    
.com-content-article .item-image {
    width:calc(50% + 50px);
    float:right;
    padding:15px 0 15px 50px;}
    
.com-content-article .item-image img{
    width:100% !important;
    height:auto !important;}

    @media screen and (max-width: 800px) {
        .com-content-article .item-image {
        width:100%;
        padding:10px 0;}
    }

/* Хлебные крошки */

.mod-breadcrumbs__wrapper{
    -webkit-box-flex:1;
        -ms-flex:1 0 auto;
            flex:1 0 auto;
    width:100%;
    max-width:calc(var(--content-size) - 0px);
    margin:0px auto;
    border-top:1px solid #ccc;
    font-family: 'Inter-Light';
    font-size: 11pt;
    padding:10px 40px;
    display:table;}

.mod-breadcrumbs__wrapper span{
    color:var(--cl-gray);}

.mod-breadcrumbs__wrapper a >span{
    color:var(--cl-link);}

.mod-breadcrumbs__wrapper li {
    float:left;
    padding:0 20px 0 0;}
    
    @media screen and (max-width: 1400px) {
        .mod-breadcrumbs__wrapper{
            max-width:calc(100vw - 80px);
            padding:10px 0px;}
    }
    
    @media screen and (max-width: 650px) {
        .mod-breadcrumbs__wrapper{
            max-width:calc(100vw - 60px);}
    }


.menu {
    z-index:99;
    width:100%;
    display:table;
    font-family: 'Inter-Light';
    float:left;
    padding:10px 0 0}

.menu .topmenu {
    display:none;}

.menu li{
    padding:5px 30px 0px 0;
    float:left;}

.menu li a{
    color:#000;
    font-size:13pt;}

    @media screen and (max-width: 800px) {
        .menu {
            float:right;
            padding:10px 0}
            
        .menu .topmenu {
            display:block;
            font-size: 0pt;
            text-transform: uppercase;
            width:44px;
            height:42px;
            padding:5px 0px;
            text-align: center;
            position: absolute;
            top:30px;
            left:40px;
            margin:0px 0 0;
            border-radius: 6px;
            color:#fff;
            background:var(--cl-gray);
            text-shadow: .2px .2px #fff;}

        .menu .topmenu:before {
            content: "≡";
            position: absolute;
            width:38px;
            color:#fff;
            height:38px;
            border-radius:2px;
            top:-12px;
            left:3px;
            font-size: 35pt;}
        
        .menu .topmenu:hover{
            background:var(--cl-link);}
            
        .menu .nav{
            display:none;
            position:absolute;
            top:30px;
            left:90px;
            border-radius:6px;
            width:270px;
            background:#f3f3f3;}
        
        .menu li{
            float:none;
            padding:8px 20px;}
    }
        @media screen and (max-width: 700px) {
        .menu .topmenu {
            top:110px;
            left:30px;}
        
        .menu .nav{
            left:80px;
            top:110px;}
    }



.modalDialog {
	position: fixed;
    font-family: Arial, Helvetica, sans-serif;
	top: 0;
	right: 0;
	bottom:0;
	padding:20px;
	background: rgba(0,0,0,.5);
	z-index: 99999;
	-webkit-transition: opacity 400ms ease-in;
	-o-transition: opacity 400ms ease-in;
	transition: opacity 400ms ease-in;
	display: none;
	pointer-events: none;
    width:100%;}

.modalDialog:target {
	display: block;
	pointer-events: auto;}

.modalDialog > div,
.rsfp_thankyou_popup_inner{
	width: 100%;
	max-width:370px;
	min-height:400px;
	background:#fff;
	background-image: url(../../../../../images/style/fon_c.png);
    background-size: 500px;
    background-repeat: repeat-x;
    background-position: bottom center;

	position: relative;
	margin: 10% auto;
	border-radius:5px;
	padding: 30px 30px 13px 30px;
    display:table;}

.rsfp_thankyou_popup_inner{
    text-align:center;
    min-height:250px;
    padding:30px 30px 100px;}

.rsfp_thankyou_popup_inner p{
    margin:20px 0;}

.close,
.rsfp_thankou_popup_close_btn{
	color: #fff;
	line-height: 25px;
	position: absolute;
	right: -15px;
	text-align: center;
	top: -15px;
	text-decoration: none;
	padding:3px 18px;
	background: var(--cl-link);
	width:38px;
	border-radius:5px;
	height:38px;
	font-size:0;}
	
.close:before,
.rsfp_thankou_popup_close_btn:before{
    content:'';
    position:absolute;
    width:22px;
    height:2px;
    display:block;
    top:18px;
    right:8px;
    background:#fff;
    -webkit-transform:rotate(-45deg);
        -ms-transform:rotate(-45deg);
            transform:rotate(-45deg);}
    
.close:after,
.rsfp_thankou_popup_close_btn:after{
    content:'';
    position:absolute;
    width:22px;
    height:2px;
    display:block;
    top:18px;
    right:8px;
    background:#fff;
    -webkit-transform:rotate(-135deg);
        -ms-transform:rotate(-135deg);
            transform:rotate(-135deg);}

.close:hover,
.rsfp_thankou_popup_close_btn:hover{ 
    background: var(--cl-gray);}

form, fieldset {
    border:0;}
    
.modalDialog div {
    color:#222;
    font-size:15px;
    line-height:1.3;
    display:table;
    font-family: 'Inter-Regular';}

.modalDialog div h2 {
    color:#000;
    text-align:center;
    line-height:1.5;
    font-size:16pt;
    text-transform:uppercase;
    margin: 0 0 20px 0;}

.modalDialog div input[type="text"] {
    padding:9px 10px;
    font-size:14pt;
    color:#000;
    border:none;
    outline:none;
    margin:5px 0 20px;
    width:100%;
    background:#f3f3f3;
    border-radius:6px;
    clear:both;
    border:1px solid #ccc;
    font-family: 'Inter-Regular';}

.modalDialog div .politika {
    clear:both;
    margin:10px 0;
    position:relative;}
    
.modalDialog div a{
    display:inline;}

.modalDialog div button[type="submit"] {
    padding: 10px 20px 8px;
    background: var(--cl-link);
    color:#fff;
    margin:20px 0;
    border:none;
    text-transform: uppercase;
    font-size: 13pt;
    line-height: 1.4;
    text-align: center;
    cursor:pointer;
    clear:both;
    display:table;
    border-radius:6px;}

.modalDialog div button[type="submit"]:hover {
    background:var(--cl-gray);}

.modalDialog div textarea {
    width:100%;
    outline:none;
    border:1px solid #ccc;
    background:#f3f3f3;
    overflow:hidden;
    border-radius:6px;
    font-family: 'Inter-Regular';
    font-size:14pt;
    padding:9px 10px;
    margin:5px 0 0;
    height:100px;}

.modalDialog div .formRed {
    font-weight:100 !important;
    color:var(--cl-link);
    margin:-10px 0 10px;
    padding:0;
    font-size:11pt;}
    
.modalDialog .politika span:nth-child(3)    {
    margin:-22px 0 0 30px;
    display:table;
    float:left;}
  
/* Скрываем настоящий чекбокс */
.modalDialog .politika input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;}

  /* Кастомный чекбокс */
.modalDialog .checkmark {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: white;
    border: 2px solid #ccc;
    background:#fff;
    border-radius: 4px;
    margin-right: 10px;
    cursor: pointer;
    -webkit-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
    position: relative;
    top: 3px;}

  /* Состояние при наведении */
.modalDialog .tpolit0:hover .checkmark {
    border-color: #888;}

  /* Состояние "отмечено" */
.modalDialog .politika input:checked + .checkmark {
    background: var(--cl-link);
    border-color: var(--cl-link);}

  /* Галочка (появляется только при checked) */
.modalDialog .tpolit0:checked + .checkmark::after {
    content: "✓";
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    color: white;
    font-size: 14px;}


#toTop {
    width: 44px;
    height: 44px;
    display: block;
    border-radius: 5px;
    position: fixed;
    bottom: calc(10% - 25px);
    right: 20px;
    cursor: pointer;
    background: var(--cl-link);
    //mix-blend-mode: multiply;
    z-index: 9999}
    
#toTop:hover {
    background: var(--cl-gray);}

#toTop:before {
    content: "";
    position: absolute;
    width: 14px;
    height: 14px;
    border-top: 3px solid #fff;
    border-left: 3px solid #fff;
    -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
            transform: rotate(45deg);
    top: 13px;
    left: 14px;
    opacity:0.8;}
    
#toTop:after {
    content: "";
    position: absolute;
    width: 14px;
    height: 14px;
    border-top: 3px solid #fff;
    border-left: 3px solid #fff;
    -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
            transform: rotate(45deg);
    top: 23px;
    left: 14px;
    opacity:0.8;}


.cookie {
    font-family: 'Inter-Regular';
    position:fixed;
    z-index:99999;
    display:table;
    bottom:15px;
    left:30px;
    width:calc(50vw - 60px);
    max-width:500px;
    background:rgb(255,255,255,1);
    -webkit-box-shadow:5px 5px 10px #000;
            box-shadow:5px 5px 10px #000;
    padding:20px 30px;
    line-height:1.2;
    border-radius:5px;
    font-size:11pt}
    
.cookie p{
    margin:5px 0 10px;
    float:left;}
    
.cookie a#cookie-agreement-button{
    display:table;
    color:#fff;
    margin:0px 0 0;
    font-weight:100;
    float:left;
    font-size: 11pt;
    font-family: 'Inter-Regular';
    border-radius: 3px;
    background: var(--cl-link);
    padding: 9px 20px 8px;
    text-transform:uppercase;
    border: none;
    outline: none;
    cursor: pointer;}
    
.cookie a#cookie-agreement-button:hover{
    background: var(--cl-link-hover);}

main{
    -webkit-box-flex:1;
        -ms-flex:1 0 auto;
            flex:1 0 auto;
    padding:0;}

    @media screen and (max-width:1024px){
        .cookie {
            width:calc(100vw - 60px);}
            
        .cookie p{
            width:100%;}
            
        .cookie a#cookie-agreement-button{
            float:left;}
    }
    
    







.sklad {
    background:#fff;
    width: 100%;
    padding:var(--content-padding);}

.sklad > div{
    width: 100%;
    max-width:calc(var(--content-size) - 150px);
    padding:50px 0 20px;
    margin:0 auto;
    position:relative;}

.sklad > div table tbody{
    display:flex;
    flex-wrap:wrap;
    gap:50px;}

.sklad > div table tr{
    display:table;
    width:calc(25% - 50px *3/4);
    background: var(--cl-gray-light);
    border-radius:6px;}

.sklad > div table tr:nth-child(1){
    background:none;}

.sklad > div table tr td{
    display:table;
    width:100% !important;
    min-height:180px !important;
    aspect-ratio: 1 / 1;
    position:relative;
    background-repeat:no-repeat;
    background-size:70px;
    background-position:center 30px;}
    
.sklad > div table tr:nth-child(2) td{
    background-image:url(../../../../../images/style/icons/Usl_010.svg);}
    
.sklad > div table tr:nth-child(3) td{
    background-image:url(../../../../../images/style/icons/Usl_020.svg);}
    
.sklad > div table tr:nth-child(4) td{
    background-image:url(../../../../../images/style/icons/Usl_030.svg);}
    
.sklad > div table tr:nth-child(5) td{
    background-image:url(../../../../../images/style/icons/Usl_040.svg);}
    
.sklad > div table tr:nth-child(6) td{
    background-image:url(../../../../../images/style/icons/Usl_050.svg);}
    
.sklad > div table tr:nth-child(7) td{
    background-image:url(../../../../../images/style/icons/Usl_060.svg);}
    
.sklad > div table tr:nth-child(8) td{
    background-image:url(../../../../../images/style/icons/Usl_070.svg);}
    
.sklad > div table tr:nth-child(9) td{
    background-image:url(../../../../../images/style/icons/Usl_080.svg);}
    
.sklad > div table tr:nth-child(10) td{
    background-image:url(../../../../../images/style/icons/Usl_090.svg);}
    
.sklad > div table tr:nth-child(11) td{
    background-image:url(../../../../../images/style/icons/Usl_100.svg);}
    
.sklad > div table tr:nth-child(12) td{
    background-image:url(../../../../../images/style/icons/Usl_110.svg);}

.sklad > div table tr td p{
    position:absolute;
    width:80%;
    bottom:20px;
    left:10%;
    text-align:center;}

.sklad > div table tr:nth-child(1) strong{
    font-family: 'Inter-Bold';
    color:var(--cl-link);
    font-size: 32pt;
    display:table;
    margin:40px 0 0 30px;
    text-transform: uppercase;
    line-height: 1.2;}
    
    @media screen and (max-width:1440px){
        .sklad > div table tr:nth-child(1) strong{
            font-size: calc(9pt + 40 * (100vw / 1920));}
    }
    
    @media screen and (max-width:1200px){
        .sklad > div table tbody{
            gap:30px;}
            
        .sklad > div table tr{
            width:calc(25% - 30px *3/4);}
            
        .sklad > div table tr td p{
            font-size:13pt;}
    }
    
    @media screen and (max-width:1000px){
        .sklad > div table tr:nth-child(1) strong{
            margin:60px 0 0 20px;
            font-size: calc(9pt + 35 * (100vw / 1920));}
            
        .sklad > div table tr td p{
            font-size:12pt;}
    }
    
    
    @media screen and (max-width:900px){
        .sklad > div table tbody{
            gap:30px;}
            
        .sklad > div table tr{
            width:calc(33.33% - 30px *2/3);}
            
        .sklad > div table tr td p{
            font-size:13pt;}
            
        .sklad > div table tr:nth-child(1) strong{
            margin:60px 0 0 15px;
            font-size: calc(9pt + 50 * (100vw / 1920));}
    }
    
    @media screen and (max-width:800px){
        .sklad > div table tbody{
            gap:30px;}
            
        .sklad > div table tr{
            width:calc(50% - 16px);}
            
        .sklad > div table tr td p{
            font-size:13pt;}
            
        .sklad > div table tr:nth-child(1) strong{
            font-size: calc(9pt + 60 * (100vw / 1920));}
    }
    
    @media screen and (max-width:520px){
        .sklad > div table tr td p{
            font-size:11pt;
            bottom:15px;
            width:90%;
            left:5%;
            margin:0 auto;}
            

        .sklad > div table tr td{
            padding:0 10px;
            background-position:center 20px;
            background-size:60px;
            min-height:140px !important;}
            
        .sklad > div table tr:nth-child(1) strong{
            margin:40px 0 0 15px;}
    }
    
    @media screen and (max-width:450px){
        .sklad{
            padding:0 30px;}
            
        .sklad > div table tbody{
            gap:25px;}
            
        .sklad > div table tr td p{
            font-size:9pt;
            bottom:7px;}
        
        .sklad > div table tr td{
            background-position:center 13px;
            background-size:50px;
            min-height:110px !important;}
            
        .sklad > div table tr{
            width:calc(50% - 12.5px);}
    }

.comp-video{
    width: 100%;
    padding:var(--content-padding);}

.comp-video > div,
.text > div{
    width: 100%;
    max-width:calc(var(--content-size) - 150px);
    padding:50px 0 0;
    margin:0 auto;
    position:relative;}
    
.text > div{
    max-width:var(--content-size);
    padding:50px 40px 50px;}

.comp-video > div table{
    min-width:100%;}

.comp-video > div table tr{
    display:flex;
    flex-wrap:wrap;}

.comp-video > div table tr td{
    width:50%;}

.comp-video > div table tr td video{
    float:right;
    border-radius:6px;
    width:calc(100% - 25px);
    box-shadow:2px 2px 20px #ccc;}
    
.comp-video > div table tr td:first-child{
    padding:0px 25px 30px 0;}
    
.comp-video > div h2{
    display:table;
    padding-left:70px;
    font-family: 'Inter-ExtraBold';
    font-stretch: condensed;
    letter-spacing: 0px;
    text-transform: uppercase;
    font-size: 22pt;
    font-weight: 600;
    color: var(--cl-gray);
    position:relative;
    display: inline-block;
    -webkit-transform: scaleX(1.21);
    -ms-transform: scaleX(1.21);
    transform: scaleX(1.21);}
    
    .comp-video > div h2:before{
    content:"";
    position:absolute;
    left:20px;
    width:35px;
    height:40px;
    background:url(../../../../../images/style/logo.png);
    background-repeat:no-repeat;
    background-size:35px 40px;}

.comp-video > div table tr td:first-child p,
.text > div p{
    margin:15px 0;
    font-size:14pt;
    font-family: 'Inter-Light';}
    
.comp-video > div table tr td:first-child h3,
.text > div h3{
    margin:15px 0;
    font-family: 'Inter-Bold';
    text-transform:uppercase;
    font-size:20pt;}
    
.comp-video > div table tr td:first-child h3 span,
.text > div h3 span{
    color:var(--cl-link);}

    @media screen and (max-width:1200px){
        
        .comp-video > div{
            padding:0px 0 0;}
            
        .comp-video > div table tr td{
            width:100%;}
        
        .comp-video > div table tr td video{
            width:100%;}
        
        .comp-video > div table tr td:first-child h3,
        .text > div h3{
            font-size:24pt;}
    }

    @media screen and (max-width:900px){
        .comp-video{
            padding: 0px 40px 40px;}
            
        .comp-video > div table tr td:first-child h3,
        .text > div h3{
            font-size:20pt;}
    }
    
    @media screen and (max-width:650px){
        .comp-video{
            padding: 0px 40px 40px;}
    }

    @media screen and (max-width:600px){
        .comp-video > div table tr td:first-child h3{
            font-size:16pt;}
        
        .comp-video > div table tr td:first-child p{
            font-size:12pt;}
    }
    @media screen and (max-width:450px){
        .comp-video,
        .text > div{
            padding:0 30px 10px;}
    }

.image-container {
    width:40%;
    display:table;
    float:right;
    position:absolute;
    right:-15px;
    bottom:-53px;
    overflow: hidden;
    margin: 30px 0;}
        
.image-container img{
    width:100% !important;
    height:auto !important;}
        

/* Класс для анимации появления */
.animate-in {
    transform: translateX(0);
    opacity: 1;}
    
.contact-page table{
    width:100%;
    font-size:12pt;
    font-family: 'Inter-Light';
    margin:15px 0 30px;
    border-radius:10px;
    box-shadow:2px 2px 20px #ccc;}

.contact-page table thead {
    font-size:16pt;
    font-family: 'Inter-Regular';}
    
.contact-page table thead tr{
    margin:25px 35px 0;
    display:table;}

.contact-page table tbody tr td{
    padding:18px 0;}

.contact-page table tbody tr{
    margin:15px 35px 0;
    min-height:70px;
    display:table;
    width:calc(100% - 70px);
    border-bottom:1px solid #ccc;}

.contact-page table tbody tr:last-child{
    border-bottom:0;}

.contact-page table tbody tr td:nth-child(1){
    width:30%;
    color:#444;
    padding:18px 30px 7px 0;}

.contact-page table tbody tr td:nth-child(2){
    font-family: 'Inter-Regular';
    font-size:13pt;}

.contact-page table a{
    color:#000;}


    @media screen and (max-width: 600px) {
        .contact-page table tbody tr td:nth-child(1){
            max-width:20%;}
    
        .contact-page table{
            font-size:12pt;}
        
        .contact-page table tbody tr{
            display:flex;
            flex-direction:column;}
            
        .contact-page table tbody tr td:nth-child(1){
            min-width:100%;
            font-size:12pt;
            padding:8px 20px 0px 0}
    }


/* Прайс-лист */

.price table{
    width:100%;
    font-size:12pt;
    font-family: 'Inter-Light';
    margin:15px 0;
    border-radius:10px;}
    
.price table tr {
    margin:10px auto 25px;
    font-family: 'Inter-Light';
    display:flex;
    border-bottom:1px solid var(--cl-gray-light);
    box-shadow:2px 2px 20px #ccc;}
    
.price table tr:last-child {
    border-bottom:none;}
    
.price table tr td:nth-child(1){
    font-family: 'Inter-Regular';
    width:calc(100% - 220px);
    padding:25px;}
    
.price table tr td:nth-child(2) {
    width:220px;
    padding:25px;}
    
.price table ~ p{
    display:table;
    margin-left:30px;}

    @media screen and (max-width: 600px) {
        .price table{
            font-size:11pt;}
    
        .price table tr td:nth-child(1){
            width:calc(100% - 140px);
            padding:35px 15px 15px 15px;}
        
        .price table tr td:nth-child(2) {
            width:140px;
            padding:35px 15px 35px 15px;}
            
        .price table ~ p{
            display:table;
            margin-left:0px;}
    }
    


.comp-video sup,
.keis sup{
    font-size:8pt;
    display:inline-block;
    margin:-10px 0 0;
    position: relative;
    top: 0;
    vertical-align: super;}

/* Карта 2 ГИС */

.map {
    max-width: calc(var(--content-size) - 80px);
    margin: 0 auto 0px auto;
    border:1px solid #777;
    display:flex;}
    
.map > div{
    display:flex;}
    
.map * {
    min-width: 100%;
    max-width: var(--content-size);}


        
/* Кейсы */

.keis {
    clear:both;
    width:100%;
    margin:0 auto;
    padding:10px 40px 20px;
    position:relative;
    overflow:hidden;
    max-width:calc(var(--content-size) - 50px);}

.keis h3{    
    margin: 0px 0 15px 10px;
    font-family: 'Inter-Bold';
    text-transform: uppercase;
    font-size: 20pt;}
    
.keis .custom{
    margin:0 auto;
    overflow:hidden;
    width:100%;}

.keis .custom{
    font-family: 'Inter-Light';
    font-size:11pt;}

.keis .custom div.block{
    width:calc(100% - 20px);
    display:block;
    position:relative;
    margin:10px;
    min-height:335px;
    box-shadow:3px 3px 15px #ccc;
    padding:40px 20px 20px;}

.keis p:nth-child(1){
    font-family: 'Inter-Regular';
    font-size:12pt;
    margin:10px 0 15px;}

.keis ul li {
    position:relative;
    margin:10px 0 10px 25px;}

.keis ul li:before {
    content: "";
    position: absolute;
    left: -25px;
    top: 5px;
    width: 6px;
    height: 6px;
    display: block;
    border-top: 2px solid var(--cl-link);
    border-right: 2px solid var(--cl-link);
    transform: rotate(45deg);}
    
.keis ul li:after {
    content: "";
    position: absolute;
    left: -20px;
    top: 5px;
    width: 6px;
    height: 6px;
    display: block;
    border-top: 2px solid var(--cl-link);
    border-right: 2px solid var(--cl-link);
    transform: rotate(45deg);}

    
.keis .custom div.block:after {
    content: "";
    position: absolute;
    right: 20px;
    top: 20px;
    width: 20px;
    height: 20px;
    display: block;
    border-top: 3px solid #f3f3f3;
    border-right: 3px solid #f3f3f3;
    transform: rotate(-45deg);}
    
.keis .custom div.block:before {
    content: "";
    position: absolute;
    right: 20px;
    top: 29px;
    width: 20px;
    height: 20px;
    display: block;
    border-top: 3px solid #f3f3f3;
    border-right: 3px solid #f3f3f3;
    transform: rotate(-45deg);}


/* Честный знак */

.keis .custom div.block.chz:after {
    content: "";
    position: absolute;
    background-image:url(../../../../../images/style/4znak-mini.jpg);
    background-size:cover;
    right: 5px;
    top: 5px;
    width: 80px;
    height: 36px;
    display: block;
        border-top: 0;
    border-right: 0;
    transform: rotate(0deg);}

.keis .keis-tr .owl-item {
  box-sizing: border-box;}

    @media screen and (max-width: 900px) {
        .keis .custom div.block{
            min-height:250px;}
            
        .keis h3{    
            font-size: 16pt;}
    }
    
    @media screen and (max-width: 600px) {
        .keis .custom div.block{
            min-height:auto;}
            
        .keis {
            padding:30px 30px 20px;}
    }


/* Реклама склада */

.logoritm {
    width:100%;
    max-width:calc(var(--content-size) - 110px);
    margin:20px auto 10px;
    padding:0 20px;}
    
.logoritm a{
    color:#000;}

.logoritm .sklad-logoritm {
    border:1px solid #ccc;
    padding:30px 30px 10px;
    border-radius:5px;
    position:relative;
    background:#f3f3f3;
    box-shadow: 3px 3px 10px #ccc;}
    
.logoritm .sklad-logoritm h3{
    font-size:20pt;
    text-transform:uppercase;}
    
.logoritm .sklad-logoritm p{
    width:70%;
    font-size:12pt;
    margin:0 0 20px;
    color:#444;
    font-family: 'Inter-Light';}

.logoritm a .sklad-logoritm  img{
    width:20%;
    float:right;
    position:absolute;
    bottom:0px;
    right:0px;
  filter: none;
  -webkit-filter: grayscale(100%);
  -moz-filter:    grayscale(100%);
  -ms-filter:     grayscale(100%);
  -o-filter:      grayscale(100%);}

.logoritm a span {
    font-family: 'Inter-Regular';}

.logoritm a:hover span {
    color:var(--cl-link);}
  
.logoritm a:hover .sklad-logoritm {
    background:#fff;}
    
.logoritm a:hover .sklad-logoritm  img{
      filter: none;
  -webkit-filter: grayscale(0%);
  -moz-filter:    grayscale(0%);
  -ms-filter:     grayscale(0%);
  -o-filter:      grayscale(0%);}

.logoritm .sklad-logoritm br{
    display:none;}  
  
@media screen and (max-width: 650px) {
    .logoritm a .sklad-logoritm  img{
        width:40%;
        right:0;}
    
    .logoritm .sklad-logoritm p{
        width:60%;}
    
    .logoritm .sklad-logoritm br{
        display:block;} 
}

@media screen and (max-width: 450px) {
    .logoritm .sklad-logoritm h3{
        font-size:15pt;}
        
    .logoritm .sklad-logoritm p{
        font-size:11pt;}
}



/* Технические характеристики */

.tovar .teh_haract{
    border:1px solid #ccc;}

.tovar .teh_haract td {
    padding:10px;
    border:1px solid #ccc;}

.tovar .teh_haract td p{
    line-height:1;
    margin:0;}

    @media screen and (max-width: 450px) {
        .tovar .teh_haract td p{
            font-size:11pt;}
    }
    
    
.moduletable.GPU {
    width:100%;
    padding:0 30px;}

.moduletable.GPU {
    width: 100%;
    max-width:calc(var(--content-size) - 75px); /* 150 */
    padding:50px 40px;
    margin:0 auto;}

.moduletable.GPU .item-image {
    float:right;
    width:45%;
    margin: 0 0 0 30px;}

.moduletable.GPU .item-image img{
    width:100% !important;
    height:auto !important;}

.moduletable.GPU h2{
    font-family: 'Inter-Bold';
    font-size: 32pt;
    text-transform: uppercase;
    line-height: 1.2;
    color: #000;
    margin:0 0 20px;}

.moduletable.GPU p:nth-child(1){
    margin:50px 0 0;}

.moduletable.GPU ul{
    margin:20px 0;
    font-size:12pt;}

.moduletable.GPU ul li{
    line-height:1.7;
    margin:0 0 0 35px;
    position:relative;}

.moduletable.GPU ul li:before{
    content:"";
    position:absolute;
    left:-25px;
    top:11px;
    width:6px;
    height:6px;
    display:block;
    border-top:2px solid var(--cl-link);
    border-right:2px solid var(--cl-link);
    transform:rotate(45deg);}
    
.moduletable.GPU ul li:after{
    left:-30px;}
    
    @media screen and (max-width: 1200px) {
        .moduletable.GPU h2{
            font-size:28pt;}
    }
    
    @media screen and (max-width: 800px) {
        .moduletable.GPU h2{
            font-size:25pt;}
            
        .moduletable.GPU .item-image {
            float:right;
            width:100%;}
    }

    @media screen and (max-width: 650px) {
        .moduletable.GPU h2{
            font-size:23pt;}
    }

    @media screen and (max-width: 450px) {    
        .moduletable.GPU h2{
            font-size:20pt;}
        
    }