@font-face {
      font-family: "Montserrat";
      src: url("../fonts/Montserrat-Regular.ttf");
      font-weight: 400;
}
@font-face {
      font-family: "Montserrat";
      src: url("../fonts/Montserrat-SemiBold.ttf");
      font-weight: 600;
}
@font-face {
      font-family: "Montserrat";
      src: url("../fonts/Montserrat-Bold.ttf");
      font-weight: bold;
}
@font-face {
      font-family: "Montserrat";
      src: url("../fonts/Montserrat-Black.ttf");
      font-weight: 900;
}

body{
 margin:0; padding:0;
 font-family: Montserrat, sans-serif;
 background:#27272f;
 color: #fff;
}

@media (min-width: 1200px){
  .container, .container-lg, .container-md, .container-sm, .container-xl {
      max-width: 1600px;
  }
  
}

h1 {font-size: 52px; font-weight: 600; }
h2 {font-size: 42px; font-weight: 600; }
h3 {font-size: 24px; font-weight: 600; }

.header { background: #000; font-size: 14px; color: #98989b; padding: 10px 0}
.header a { color:#cd9975}
.soc { background:#19191e; width: 28px; height: 28px; border-radius: 14px; text-align: center; display: inline-block; padding-top: 5px;}

.soc-top { background:#19191e; height: 28px; border-radius: 14px; text-align: center; display: inline-block; padding: 5px 10px 5px 10px;}

.preview { min-width:100%;}
.bezh { color: #cd9975}

.header-menu { padding: 15px;}
.header-catalog { -webkit-box-shadow: 1px 6px 23px 0 rgba(20,20,25,1);
    -moz-box-shadow: 1px 6px 23px 0 rgba(20,20,25,1); white-space: nowrap;
    box-shadow: 1px 6px 23px 0 rgba(20,20,25,1); color:#fff; font-size: 16px; padding:0 20px 0 0; border-radius:5px; position: relative; display: inline-block}
.header-catalog:hover {color:#fff; text-decoration: none; background: #27282d}
.header-catalog-icon {width: 42px; background:#cd9975; color: #fff; text-align: center; padding: 10px 0; display: inline-block; margin-right: 20px; -webkit-border-top-left-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-bottomleft: 5px;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;}


.header-image { background: url('../images/avto_bg.jpg') no-repeat center center; background-size: cover;}
.header-car { background: rgba(25,25,30,0.5); -webkit-box-shadow: 0 0 15px 0 rgba(24,24,26,1);
    -moz-box-shadow: 0 0 15px 0 rgba(24,24,26,1);
    box-shadow: 0 0 15px 0 rgba(24,24,26,1); -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px;}
.header-car img {-webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px;}
.header-car-text { position: absolute; top:0; left:0; z-index: 10; width: 100%; }
.header-title { margin-top: 80px; text-align: center}
.header-title h1 { font-size: 32px; font-weight: 600;}
.header-button { margin: 80px 0 40px; text-align: center}
.preim { padding: 0 0 0 56px; background: url('../images/galka.png') no-repeat left center; font-size: 16px;}

.main-catalog { margin-bottom: 70px; padding-top:90px;}
.main-catalog h2 { margin: 0 0 45px 0; }
.main-category { background: url('../images/cat-bg.jpg') repeat; -webkit-border-radius: 25px; display:block;
    -moz-border-radius: 25px;
    border-radius: 25px; text-align: center; padding: 25px 0 29px; -webkit-box-shadow: 0 10px 15px 0 rgba(24,24,26,1);
    -moz-box-shadow: 0 10px 15px 0 rgba(24,24,26,1);
    box-shadow: 0 10px 15px 0 rgba(24,24,26,1); color: #fff; margin-bottom: 30px;}
.main-category:hover {color:#fff; text-decoration: none}
.cat-title h3 {}
.cat-count {color: #98989b; font-size: 14px; margin: 7px 0 17px}

.process { background: #16161a; padding: 50px 0; text-align: center; }
.process h2 {margin-bottom: 50px;}
.step-num { /*background: #19191e;*/ height: 47px; width: 47px; -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px; font-weight: 600; font-size: 16px; color: #909093; text-align: center; padding-top: 12px; position: absolute; top:-10px; left:20px;}
.step-text { font-size: 18px; font-weight: 600; margin-top: 10px;}

.popular {padding: 90px 0}
.popular h2 { margin-bottom: 35px;}

.avto-card { background:#2f2f38; border-radius:20px; -webkit-box-shadow: 0 10px 15px 0 rgba(24,24,26,1);
    -moz-box-shadow: 0 10px 15px 0 rgba(24,24,26,1);
    box-shadow: 0 10px 15px 0 rgba(24,24,26,1);}
.card-row .col-sm-6 { padding:0 25px 40px !important;}
.avto-p-40 {padding:40px 0 30px 40px; background:#383841; -webkit-border-top-left-radius: 20px;
    -webkit-border-bottom-left-radius: 20px;
    -moz-border-radius-topleft: 20px;
    -moz-border-radius-bottomleft: 20px;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;}
.avto-img { background:url('../images/krug.png') no-repeat 0 center; -webkit-transition: all 1s; -o-transition: all 1s; transition: all 1s; }
.avto-img img { margin-left:100px;  -webkit-transition: all 1s;
  -o-transition: all 1s;
  transition: all 1s;}

.avto-img-big { background:url('../images/krug_big.png') no-repeat 0 center;}
.avto-img_big img {}


.avto-card:hover .avto-img img  { margin:0; }
.avto-card:hover .avto-img {background-position: 30% center;}
.avto-card:hover .btn-primary {background:#aa7853; border-color:#aa7853;}
.avto-year { font-size:14px; color:#98989b;}
.avto-title { font-size:24px;}
.avto-cost {font-size:24px;}

.info-bg {  -webkit-border-top-right-radius: 20px;
-webkit-border-bottom-right-radius: 20px;
-moz-border-radius-topright: 20px;
-moz-border-radius-bottomright: 20px;
border-top-right-radius: 20px;
border-bottom-right-radius: 20px;}

.card-info { padding:35px 0 0 40px;}
.info-title {  font-size:12px; color:#98989b;}
.info-text { font-size:16px; margin-bottom:15px;}

.btn-primary {  background:#cd9975; border-color:#cd9975; padding: .375rem 2.4rem;}
.btn-primary:hover, .btn-primary:active, .btn-primary:focus { background:#aa7853 !important; border-color:#aa7853 !important; outline: none !important; box-shadow:none !important; }

.reviews-slider { margin: 0 -25px;}
.slick-slider { position: static !important;}

.reviews {background: #16161a; padding: 50px 0}
.reviews h2 { margin-bottom: 35px; text-align: center}
.review { background: url('../images/cat-bg.jpg') repeat; -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px; padding: 25px; -webkit-box-shadow: 0 10px 15px 0 rgba(24,24,26,1);
    -moz-box-shadow: 0 10px 15px 0 rgba(24,24,26,1);
    box-shadow: 0 10px 15px 0 rgba(24,24,26,1); margin: 0 25px;}
.review-text { font-size: 16px; padding: 20px 0 10px}
.review-date {color:#98989b; font-size: 14px;}
.ava img { border-radius: 32px;}

.fio1 {font-size: 16px; margin: 8px 0 4px 0;}
.fio2 { font-size: 14px; color: #98989b}
.rate {font-size: 18px; font-weight: 600}
.rate i { color: #cd9975}

.about { padding: 90px 0; font-size: 16px;}
.about h2 {margin-bottom: 35px;}
.about a {color:#cd9975}

.about-avto {
    -webkit-box-shadow: 0 0 15px 0 rgb(24 24 26);
    -moz-box-shadow: 0 0 15px 0 rgba(24,24,26,1);
    box-shadow: 0 0 15px 0 rgb(24 24 26);
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px;
}
.about-avto img {  -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px;}

.footer {background: #16161a; font-size: 16px; padding: 47px 0}
.footer a {color:#cd9975}
.footer-adr {color:#98989b; margin: 45px 0; text-align: center}
.copy {font-size:14px; color: #4b4b4e}
.socs { text-align: center}

.right-overlay { background: #000; width: 300px; right:0; top:0; min-height: 100%; z-index: 20}
.right-overlay-collapsed { right:-300px !important;}
.show {right:0 !important;}
.overlay-adr { font-size: 12px;}
.overlay-adr a {color:#cd9975}
.close { position: absolute; top:10px; right:10px;}
.close a {color:#ffffff}

.catalogDropdown { position: absolute; top:60px; left:0; background:#1e1e26; padding: 20px; z-index: 30; -webkit-box-shadow: 1px 6px 23px 0 rgb(20 20 25);
    -moz-box-shadow: 1px 6px 23px 0 rgba(20,20,25,1);
    box-shadow: 1px 6px 23px 0 rgb(20 20 25);}
.catalogDropdown a {color: #fff}
.catalogDropdown a:hover {color:rgba(255,255,255,.75)}


/* inner */

.title-block {background: #16161a; padding: 45px 0}
.breadcrumb { background: none; padding: 0.75rem 0}
.breadcrumb-item a {color: #fff}

.pageTitle h1 { font-size: 48px; font-weight: 600;}

.modal-content { background: #2f2f38}
.modal-header { border-bottom:0;}

.form-control { background: #000; border-color:#000; color: #fff; padding-top: 15px; padding-bottom: 15px;}
.form-control:focus {background: #000; border-color:#000; color: #fff}
.form-control::placeholder {color: #98989b}

.navbar-expand-lg .navbar-nav .nav-link {
    padding-left: 0;
    padding-right: 0;
}

.header-menu .navbar .nav-link {
    font-size:14px;
}


@media(min-width:1465px) {

    .header-menu .navbar .nav-link {
        font-size:16px;
    }
}

@media(min-width:1465px) {

    .navbar-expand-lg .navbar-nav .nav-link {
        padding-left: .5rem;
        padding-right: .5rem;
    }

}


@media(max-width:520px) {
    .header-button {margin: 50px 0 20px; text-align: center}
    .header-title h1 { font-size:28px }
    .main-catalog { margin-bottom: 50px;}
    .main-catalog h2 { margin: 45px 0 45px 0; }
    .main-category { margin-bottom: 25px;}
    .step-text { margin-bottom: 25px;}
    h2 {font-size: 32px;}
    .avto-img img { margin-left: 0;}
    .avto-p-40 {-webkit-border-top-left-radius: 20px;
        -webkit-border-top-right-radius: 20px;
        -moz-border-radius-topleft: 20px;
        -moz-border-radius-topright: 20px;
        border-top-left-radius: 20px;
        border-top-right-radius: 20px;}
    .pageTitle h1 { font-size: 28px; }
    .title-block { padding:25px 0 }

    .avto-img-big { background:url('../images/krug.png') no-repeat 0 center; background-size: contain}


}


@media(min-width:768px) {



    .header-button {
        margin: 50px 0 20px;
        text-align: center;

    }
    .preim {font-size: 14px;}
    .header-title h1 { font-size: 42px;}
}


@media(min-width:990px) {

    .header-button {
        margin: 80px 0 80px;
        text-align: center
    }
}


@media(min-width:1200px) {
    .header-button {
        margin: 140px 0 90px;
        text-align: center
    }
}

@media(min-width:1300px) {
    .header-button {
        margin: 240px 0 150px;
        text-align: center
    }

    .header-title h1 {
        font-size: 52px;
    }
}