a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    vertical-align: baseline
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block
}

body {
    line-height: 1;
    padding: 0;
    margin: 0;
    font-size: 14px;
    font-family: "segoe ui, sans-serif";
    background: #f4f6f8
}

h1,
h2,
h3,
h4,
h5,
h6 {
    text-align: center
}



ol,
ul {
    list-style: none
}

blockquote,
q {
    quotes: none
}

blockquote:after,
blockquote:before,
q:after,
q:before {
    content: '';
    content: none
}

table {
    border-collapse: collapse;
    border-spacing: 0
}



.container {
    max-width: 1200px;
    margin: 0 auto
}

.ajax-form {
    text-align: center;
    font-size: 30px;
    color: red;
    font-weight: bold;
}

.flex {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: space-between;
    flex-wrap: nowrap;
    flex-direction: row
}

.flex-block {
    flex: 1 1
}

.slider {
    width: 100%;
    height: 800px;
}

.header {
    position: relative
}

.header-fixed {
    width: 100%;
    position: fixed;
    z-index: 3000;
    top: 0;
    background: #fff
}

.header-flex {
    height: 80px
}

.header-adress,
.header-calc,
.header-order {
    margin-top: 18px;
    text-align: center;
}

.header-logo {
    text-align: center;
}

.header-tel {
    margin-top: 18px;
    text-align: center
}

.header-nav {
    margin-top: 80px;
    background: #000;
    width: 100%;
    line-height: 50px;
    justify-content: center
}

.header-tel__info {
    color: gray
}

.header-nav__item {
    text-align: center
}

.header-nav__link {
    text-decoration: none;
    color: #fff;
    margin: 0 auto;
    padding: 5px;
    display: block;
    border: 1px solid #000;
    text-transform: uppercase;
    transition: all .5s ease;
}


.header-order__links {
    color: black;
    text-decoration: none;
}

.header-nav__link:hover {
    background: #fff;
    color: #000;
}

.main-slider1 {
    background: url(../images/slider1.jpg) no-repeat;
    background-size: cover
}

.main-slider2 {
    background: url(../images/slider2.jpg) no-repeat
}

.main-slider3 {
    background: url(../images/slider3.jpg) no-repeat
}

.main-slider4 {
    background: url(../images/slider4.png) no-repeat
}

.main-slider {
    width: 100%;
}


.cars__title {
    text-align: center;
    font-size: 50px;
    margin-bottom: 30px
}

.cars-flex {
    justify-content: center
}

.cars-block {
    flex: 1 1;
    margin: 20px 20px 50px;
    background: #fff;
    height: 350px;
    max-width: 400px;
    transition: all .5s ease;
}

.cars-block:hover, .park-block:hover {
    transform: scale(1.1);
}

.cars-block__link {
    display: block;
    text-align: center;
    color: #fff;
    background: red;
    border: 1px solid red;
    margin: 10px auto;
    line-height: 30px;
    width: 150px;
    height: 30px;
    text-decoration: none;
    border-radius: 5px;
    transition: all .5s ease;
    text-transform: uppercase;
}

.cars-block__link:hover {
    background: white;
    color: red;
}

.cars-block__title {
    margin-top: 20px;
    text-align: center;
    font-weight: 700;
    font-size: 20px
}

.cars-block__price {
    text-align: center
}

.cars-block__img {
    text-align: center;
    display: block;
    margin: 10px auto;
    max-width: 200px;
    height: auto
}

.info {
    width: 100%;
    height: 1000px;
    background: url(../images/bg.jpeg) no-repeat;
    background-size: cover
}

.info__img {
    width: 100px;
    height: 100px;
    text-align: center
}

.info__title {
    padding: 80px 0;
    text-align: center;
    font-size: 50px;
    margin-bottom: 30px;
    color: #fff
}

.info-flex {
    flex-wrap: wrap;
    margin-top: 50px
}

.info-block {
    flex: 1 1 300px;
    min-width: 300px;
    text-align: center;
    margin: 10px
}

.info__text {
    font-size: 20px;
    color: #fff;
    text-align: center;
    max-width: 200px;
    display: block;
    margin: 10px auto;
}

.top__title {
    color: #000
}

.top__img {
    border-radius: 50px;
    max-width: 600px
}

.top-flex {
    justify-content: space-between;
}

.top-img,
.top-text {
    flex: 1 1;
    margin: 10px
}

.top-text {
    font-size: 20px
}

.top__text {
    margin-top: 25px
}

.advantage__title2 {
    color: #fff;
    padding: 80px 0;
    text-align: center;
    font-size: 50px;
    margin-bottom: 30px
}

.advantage__title {
    color: #fff
}

.advantage-flex {
    flex-wrap: wrap
}

.advantage-block {
    flex: 1 1 400px
}

.advantage__nums {
    font-size: 30px;
    background: red;
    width: 50px;
    height: 50px;
    border-radius: 25px;
    display: block;
    text-align: center;
    line-height: 50px;
    margin: 5px auto 20px;
    color: #fff
}

.advantage__title {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 30px
}

.advantage__text {
    max-width: 300px;
    display: block;
    margin: 5px auto;
    text-align: center;
    color: #fff
}

.fa-header__icon {
    color: red
}

.ten {
    margin-top: 100px;
    background: url(../images/b2.jpg);
    width: 100%;
    height: 800px
}

.form {
    margin-top: 100px;
    width: 100%;
    height: 800px;
    background: url(../images/without_driver.jpg);
    background-size: cover
}

.form-block {
    padding-top: 300px
}

.form-form {
    padding-top: 20px;
    width: 500px;
    background: rgba(0, 0, 0, .5);
    display: block;
    height: 200px;
    color: #fff;
    border: 1px solid red;
    border-radius: 20px
}

.form__btn,
.form__tel {
    display: block;
    width: 300px;
    height: 30px;
    margin: 10px auto
}

.form__tel {
    text-align: center;
}

.form__text {
    text-align: center;
    font-size: 16px;
    padding-top: 5px
}

.form__text2 {
    color: red;
    text-align: center;
    font-size: 16px;
    padding-top: 5px;
    font-weight: 700
}

.form__btn {
    color: #fff;
    text-transform: uppercase;
    background: red;
    border: 1px solid red;
    transition: all .5s ease;
    cursor: pointer;
}

.form__btn:hover {
    background: white;
    color: red;
}

.form-adv {
    padding-top: 260px;
    padding-left: 250px;
    color: #fff
}

.form-adv__list {
    padding: 15px
}

.park__title {
    color: #000;
    padding: 80px 0;
    text-align: center;
    font-size: 50px;
    margin-bottom: 30px
}

.park-flex {
    flex-wrap: wrap
}

.park-block {
    flex: 1 1;
    margin: 30px 30px 50px;
    background: #fff;
    height: 350px;
    max-width: 300px;
    transition: all .5s ease;
}

.map {
    position: relative
}

.map__title {
    color: #000;
    padding: 40px 0;
    text-align: center;
    font-size: 50px;
    margin-bottom: 30px
}

.map__text {
    text-align: justify;
    font-size: 16px;
    padding: 0 0 50px
}

.map-info {
    background: rgba(255, 255, 255, .8);
    width: 400px;
    height: 330px;
    position: absolute
}

.map-info__text {
    font-size: 16px;
    padding: 5px 0 5px 30px
}

.map-social {
    justify-content: center
}

.map-social__item {
    list-style-type: none
}

.map-social__link {
    display: block;
    margin: 5px
}

.map__social {
    color: red
}

.footer {
    color: #fff;
    margin-top: 100px;
    width: 100%;
    background: #000;
    height: 120px
}

.footer__copy {
    text-align: center
}

.footer-flex {
    justify-content: center;
    text-align: center
}

.footer-social {
    padding-top: 30px;
}

.footer-phones {
    padding-top: 30px
}

.footer-phones__tel {
    margin-left: 15px;
    color: white;
}

.forma {
    background: black;
    width: 100%;
    height: 150px;
    text-align: center;
}


.forma__name {
    margin: 50px auto 0px;
    width: 300px;
    display: block;
    height: 50px;
    padding-left: 20px;
    border: 1px solid black;
}

.forma__tel {
    margin: 50px auto 0px;
    width: 300px;
    display: block;
    height: 50px;
    padding-left: 20px;
    border: 1px solid black;
}

.forma__text {
    margin-top: 10px;
    font-size: 20px;
    font-weight: bold;
    color: white;
}

.forma__btn {
    margin: 50px auto 0px;
    border: 2px solid red;
    width: 300px;
    display: block;
    height: 57px;
    transition: all .5s ease;
        cursor: pointer;
    border: 2px solid white;
}



.forma__btn:hover {
    background: red;
}

.bold {
    color: red;
    font-weight: 700;
    font-size: 20px;
    list-style-type: none;
    text-align: center;
    padding-bottom: 20px;
    padding-top: 20px
}

.fa-check-square-o {
    color: #ff4500;
    padding-right: 20px;
    padding-top: 5px
}

.price {
    color: red
}

.mobile-phone {
    display: none;
    text-align: center;
    background: black;
    color: white;
    height: 50px;
    line-height: 50px;

}

.mobile-menu {
    background: black;
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 4000;
    display: none;
}


.mobile-list__item {
    text-align: center;
}

.mobile-list__link {
    text-align: center;
    color: white;
    display: block;
    margin: 0 auto;
    width: 300px;
    height: 50px;
    border: 1px solid white;
    line-height: 50px;
    text-decoration: none;
    transition: all .5s ease;
}

.mobile-list__link:hover {
    background: white;
    color: black;
}


.phone-icon {
    text-align: center;
}

.mobile-phones__text {
    text-align: center;
    font-size: 22px;
    position: relative;
}



.mobile__tel {
    flex: 2 1;
}

.mobile__burger {
    flex: 1 1;
    margin-top: 5px;
    cursor: pointer;
}

.fa-bars {
    color: white;
}

.mobile-phone__num {
    margin-left: 15px;
    color: white;
}

.menu-close {
    position: absolute;
    top: 1%;
    right: 1%;
}

.mobile-menu__img {
margin: 10px auto;
    display: block;
}

.order {
    display: block;
    width: 200px;
    height: 50px;
    line-height: 50px;
    color: red;
    border: 1px solid red;
    margin: 20px auto;
    text-align: center;
    transition: all .5s ease;
    text-transform: uppercase;
    cursor: pointer;
    text-decoration: none;
}

.order:hover {
    background: red;
    color: white;
    border: 1p solid white;
}

.slider1 {
    position: absolute;
    font-size: 80px;
    font-weight: 700;
    color: #fff;
    max-width: 600px;
    display: block;
    font-family: "segoe ui,sans-serif";
    background: rgba(255, 255, 255, .6);
    height: 280px
}

.slider2 {
    position: absolute;
    font-size: 80px;
    font-weight: 700;
    color: #fff;
    max-width: 600px;
    display: block;
    font-family: "segoe ui,sans-serif";
    background: rgba(255, 255, 255, .6);
    height: 340px;
}

.slider3 {
    position: absolute;
    font-size: 80px;
    font-weight: 700;
    color: #fff;
    width: 500px;
    display: block;
    font-family: "segoe ui,sans-serif";
    background: rgba(255, 255, 255, .6);
    height: 180px;
    right: 10%;
}

.slider4 {
    position: absolute;
    font-size: 80px;
    font-weight: 700;
    color: #fff;
    max-width: 600px;
    display: block;
    font-family: "segoe ui,sans-serif";
    background: rgba(255, 255, 255, .6);
    height: 220px;

}

.slider1:after,
.slider1:before,
.slider2:after,
.slider2:before,
.slider3:after,
.slider3:before,
.slider4:after,
.slider4:before {
    content: "";
    position: absolute
}

.slider1:after,
.slider2:after,
.slider4:after {
    height: 0;
    width: 0;
    right: -14.5px;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
    border-left: 15px solid rgba(255, 255, 255, .6)
}


.slider3:after {
    height: 0;
    width: 0;
    left: -15px;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
    border-right: 15px solid rgba(255, 255, 255, .6)
}

.slider__text {
    padding-left: 30px;
    padding-top: 20px;
    margin-left: 150px;
    margin-top: 100px
}

.slider__text2 {
    padding-left: 30px;
    padding-top: 20px;
    margin-left: 150px;
    margin-top: 70px
}

.slider__text3 {
    padding-left: 30px;
    padding-top: 30px;
    margin-left: 150px;
    margin-top: 100px
}

.slider__text4 {
    padding-left: 30px;
    padding-top: 20px;
    margin-left: 150px;
    margin-top: 500px;
}

.maincar {
    margin-top: 430px;
    background: #f4f6f8;
    height: 800px;
    width: 100%
}

.fixed {
    display: none;
    width: 100%;
}

.flex {
  display: flex;
  flex-direction: row;
}

.flex-viber, .flex-whats {
  flex: 1 1;
    max-width: 50%;
  text-align: center;
  height: 50px;
  line-height: 50px;
    cursor: pointer;
}
.fa-times-circle {
    cursor: pointer;
}

.fa-viber, .fa-whats {
    color: black;
    padding-top: 5px;
}

.flex-viber {
  background: #3eb4c1;
  color: white;
  font-size: 20px;
}

.flex-whats {
  background: green;
  color: white;
  font-size: 20px;
}

.fixed {
  width: 100%;
  max-width: 1200px;
  position: fixed;
  bottom: 1%;
}






/* media queries */

@media screen and (max-width: 1200px) {
    .container {
        width: 100%;
    }

}




@media screen and (max-width: 1024px) {
    .container {
        width: 100%;
    }
    .main-slider1 {
        background: url(../images/slider11024.jpg) no-repeat;
max-height: 420px;
    }
    .main-slider2 {
        background: url(../images/slider21024.jpg) no-repeat;
max-height: 420px;
    }
    .main-slider3 {
        background: url(../images/slider31024.jpg) no-repeat;
max-height: 420px;
    }
    .main-slider4 {
        background: url(../images/slider41024.png) no-repeat;
        max-height: 420px;
    }
    .slider__text {
        font-size: 40px;
        height: 150px;
        margin-left: 50px;
        margin-top: 50px;
        width: 300px;
        height: auto;
    }
    .slider__text2 {
        font-size: 40px;
        width: 320px;
        height: 180px;
        padding-left: 30px;
        padding-top: 20px;
        margin-left: 150px;
        margin-top: 70px;
    }
    .slider__text3 {
        font-size: 40px;
        height: 100px;
        width: 200px;
        margin-left: 100px;
        margin-top: 70px;
    }
    .slider__text4 {
        font-size: 40px;
        margin-top: 100px;
        margin-left: 50px;
        width: 300px;
        height: 120px;
    }
    .forma-flex {
        flex-direction: column;
    }
    .forma {
        height: 370px;
    }
    .cars-flex {
        flex-wrap: wrap;
    }
    .park-flex {
        justify-content: center;
    }
    .advantage__title2 {
        padding-bottom: 20px;
    }
    .top-flex {
        flex-direction: column;
        text-align: center;
    }
    .top-text {
        display: block;
        max-width: 800px;
        margin: 10px auto;
        text-align: justify;
    }
    .form-flex {
        flex-direction: column;
    }
    .form-form {
        margin: 0 auto;
        padding-top: 50px;
    }
    .form-adv {
        margin: 0 auto;
        padding-top: 50px;
        padding-left: 0;
        order: -1;
    }
    .form-block {
        padding-top: 100px;
    }
    .form-adv__list {
        padding: 5px;
    }
    .map__text {
        display: block;
        max-width: 700px;
        text-align: justify;
        margin: 5px auto;
    }
    .footer-flex {
        flex-direction: column;
    }
    .footer {
        height: 290px;
    }
    .footer-logo {
        margin-top: 10px;
    }
    .map-social__item {
        margin: 5px;
    }
    .footer-phones__text {
        padding: 5px;
    }
}

@media screen and (max-width: 768px) {
    .container {
        width: 100%;
    }
    .main-slider1 {
        background: url(../images/slider1768.jpg) no-repeat;
max-height: 320px;
    }
    .main-slider2 {
        background: url(../images/slider2768.jpg) no-repeat;
max-height: 320px;
    }
    .main-slider3 {
        background: url(../images/slider3768.jpg) no-repeat;
max-height: 320px;
    }
    .main-slider4 {
        background: url(../images/slider4768.png) no-repeat;
max-height: 320px;
    }
    .slider__text2 {
        margin-left: 50px;
        margin-top: 30px;
    }
    .ten {
        height: 1200px;
        background: none;

    }
    .advantage__title,
    .advantage__text,
    .advantage__title2 {
        color: black;
    }
    .advantage__title2 {
        padding-top: 20px;
    }
    .top-text {
        max-width: 600px;
    }
    .header-flex, .header-nav {
        display: none;
    }
    .mobile-phone {
        display: block;
    }
    .fixed {
        display: block;
    }
    .forma__tel, .forma__name, .forma__btn {
        margin-top: 10px;
    }
    .forma {
        height: 250px;
    }
    .forma__btn {
        width: 320px;
        transition: all .5s ease;
        text-transform: uppercase;
    }
    .forma__btn:hover {
        background: red;
    }
}


@media screen and (max-width: 480px) {
    .container {
        width: 100%;
    }
    .main-slider1 {
        background: url(../images/slider1480.jpg) no-repeat;
         max-height: 150px;

    }
    .main-slider2 {
        background: url(../images/slider2480.jpg) no-repeat;
 max-height: 150px;
    }
    .main-slider3 {
        background: url(../images/slider3480.jpg) no-repeat;
 max-height: 150px;
    }
    .main-slider4 {
        background: url(../images/slider4480.png) no-repeat;
 max-height: 150px;
    }
    .slider__text {
        font-size: 20px;
        margin-top: 5px;
        margin-left: 5px;
        height: 80px;
        width: 150px;
    }
    .slider__text2 {
        font-size: 20px;
        margin-left: 5px;
        margin-top: 10px;
        height: 90px;
        width: 120px;
        padding-top: 10px;
    }

    .slider__text3 {
        font-size: 20px;
        right: 1%;
        padding-left: 10px;
        padding-top: 20px;

        height: 50px;
        width: 200px;
        margin-left: 100px;
        margin-top: 70px;
    }
    .slider__text4 {
        font-size: 20px;
        padding-left: 30px;
        padding-top: 20px;
        margin-top: 10px;
        margin-left: 5px;
        width: 200px;
        height: 60px;
    }
    .slider1:after {
        height: 0;
        width: 0;
        top: 10px;
        right: -14.5px;
        border-top: 25px solid transparent;
        border-bottom: 25px solid transparent;
        border-left: 15px solid rgba(255, 255, 255, .6)
    }
    .slider2:after {
        height: 0;
        width: 0;
        top: 10px;
        right: -14.5px;
        border-top: 25px solid transparent;
        border-bottom: 25px solid transparent;
        border-left: 15px solid rgba(255, 255, 255, .6)
    }
    .slider4:after {
        height: 0;
        width: 0;
        top: 10px;
        right: -14.5px;
        border-top: 25px solid transparent;
        border-bottom: 25px solid transparent;
        border-left: 15px solid rgba(255, 255, 255, .6)
    }
    .info__title {
        font-size: 20px;
        padding-top: 20px;
        padding-bottom: 0;
    }
    .cars__title {
        padding-top: 20px;
        font-size: 20px;
    }
    .park__title {
        font-size: 20px;
                padding-top: 20px;
        padding-bottom: 0;
    }
    .advantage__title2 {
        font-size: 20px;
    }
    .top__title {
        font-size: 20px;
    }
    .map__title {
        font-size: 20px;
    }
    .info {
        background: none;
        background-color: black;
        height: 1600px;
    }
    .ten {
        margin-top: 30px;
    }
    .top__img {
        max-width: 400px;
    }
    .top__text {
        max-width: 350px;
    }
    .form-form {
        max-width: 350px;
    }
    .map__text {
        max-width: 350px;
    }
        .forma__tel, .forma__name, .forma__btn {
        height: 30px;
        line-height: 30px;
    }
    .forma {
        height: 180px;
        z-index: 5000;
    }
    .forma__btn {
        padding-top: 0;
    }
}


@media screen and (max-width: 400px) {
        .top__img {
        max-width: 260px;
    }
        .footer {
        height: 350px;
    }
}


@media screen and (max-width: 320px) {
    .container {
        width: 100%;
    }
    .main-slider1 {
        background: url(../images/slider1320.jpg) no-repeat;
  max-height: 150px;
    }
    .main-slider2 {
        background: url(../images/slider2320.jpg) no-repeat;
    max-height: 150px;
    }
    .main-slider3 {
        background: url(../images/slider3320.jpg) no-repeat;
       max-height: 150px;
    }
    .main-slider4 {
        background: url(../images/slider4320.png) no-repeat;
         max-height: 150px;
    }
    .forma__name, .forma__tel {
        max-width: 200px;
    }
    .forma__btn {
        max-width: 220px;
    }
    .forma__text {
        font-size: 14px;
        text-align: center;
    }
    .top__text {
        max-width: 240px;
    }
    .form-adv {
        max-width: 300px;
    }
    .form-form {
        max-width: 300px;
    }
    .form__btn, .form__tel {
        max-width: 200px;
    }
    
    
    .map__text {
        max-width: 260px;
    }
        .slider__text {
        font-size: 14px;
        padding-left: 5px;
        padding-top: 5px;
        margin-top: 5px;
        margin-left: 5px;
        height: 35px;
        width: 150px;
    }
    .slider__text2 {
        font-size: 14px;
          padding-left: 5px;
            padding-top: 5px;
        margin-left: 5px;
        margin-top: 10px;
        height: 50px;
        width: 120px;
        padding-top: 10px;
    }

    .slider__text3 {
        font-size: 14px;
        font-size: 14px;
right: 1%;
padding-left: 10px;
padding-top: 20px;
height: 40px;
width: 100px;
margin-left: 0px;
margin-top: 10px;
    }
    .slider__text4 {
       font-size: 14px;

padding-left: 5px;

padding-top: 5px;

margin-top: 10px;

margin-left: 5px;

width: 100px;

height: 35px;
    }
    .slider1:after {
        height: 0;
        width: 0;
        top: 10px;
        right: -4.5px;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
        border-left: 5px solid rgba(255, 255, 255, .6)
    }
    .slider2:after {
        height: 0;
        width: 0;
        top: 10px;
        right: -4.5px;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
        border-left: 5px solid rgba(255, 255, 255, .6)
    }
    .slider4:after {
        height: 0;
        width: 0;
        top: 10px;
        right: -4.5px;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
        border-left: 5px solid rgba(255, 255, 255, .6)
    }
    .slider3:after {
    height: 0;
    width: 0;
    left: -4.5px;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-right: 5px solid rgba(255, 255, 255, .6)
}

}

