.navbar {
  width: 20%;
  min-width: 280px;
  background-color: rgba(0, 0, 0, 0);
  flex-direction: column;
  padding: 50px;
  display: flex;
  position: fixed;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.container {
  flex-direction: column;
  flex: 1;
  display: flex;
}

.nav-menu {
  width: 100%;
  flex-direction: column;
  flex: 1;
  justify-content: center;
  align-items: flex-end;
  padding-bottom: 50px;
  padding-right: 0;
  display: flex;
}

.body {
  font-family: Karla, sans-serif;
  font-weight: 400;
}

.nav-link {
  width: 100%;
  color: #9e9e9e;
  text-align: right;
  text-transform: uppercase;
  border-bottom: 1px solid #9e9e9e;
  margin-left: 0;
  margin-right: 0;
  padding: 5px 0 5px 4px;
  font-weight: 700;
}

.nav-link:hover {
  color: #333;
}

.nav-link.w--current {
  color: #333;
  text-decoration: none;
}

.socials-contact {
  width: 100%;
  flex-direction: column;
  flex: 1;
  justify-content: flex-end;
  display: flex;
}

.socials-contact.contact-page {
  align-items: flex-start;
}

.icons {
  justify-content: flex-end;
  align-items: flex-start;
  padding-bottom: 15px;
  display: flex;
}

.icons.contact-page {
  padding-top: 15px;
  padding-bottom: 15px;
}

.social-icon {
  width: 20px;
  height: 20px;
  margin-left: 10px;
  margin-right: 10px;
  padding-left: 0;
  padding-right: 0;
}

.contact {
  padding-top: 10px;
  padding-bottom: 10px;
}

.link-block {
  color: #9e9e9e;
  justify-content: flex-end;
  align-items: center;
  padding-bottom: 10px;
  text-decoration: none;
  display: flex;
}

.link-block.contact-page {
  justify-content: flex-start;
}

.image {
  width: 15px;
  margin-right: 10px;
  padding-right: 0;
}

.div-block {
  align-items: center;
  display: flex;
}

.text-block {
  text-decoration: none;
}

.text-block-2 {
  text-align: right;
  font-weight: 500;
}

.section {
  width: 100%;
  flex-direction: row-reverse;
  justify-content: space-between;
  display: flex;
}

.site-content {
  width: 80%;
  padding: 50px;
}

.slider {
  height: 90vh;
}

.slide {
  background-image: url('../images/JD22_Interior1.jpg');
  background-position: 0%;
  background-size: cover;
}

.slide-2 {
  background-image: url('../images/pexels-алекке-блажин-10316236.jpg');
  background-position: 0 0;
  background-size: cover;
}

.icon {
  width: 25px;
}

.left-arrow {
  width: 30px;
  height: 50px;
  background-color: #fff;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.image-2 {
  width: 25px;
}

.right-arrow {
  width: 30px;
  height: 50px;
  background-color: #fff;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.slide-info {
  background-color: #000;
  margin-top: 50px;
  margin-left: 50px;
  padding: 30px;
}

.slide-title {
  color: #fff;
  background-color: #000;
  padding: 10px;
  font-size: 48px;
  font-weight: 700;
  line-height: 48px;
}

.slide-client {
  color: #9e9e9e;
  background-color: #000;
  padding: 10px;
  font-weight: 500;
  display: inline-block;
}

.slide-information {
  flex-direction: column;
  margin-bottom: 50px;
  margin-right: 50px;
  display: none;
}

.button {
  width: 160px;
  background-color: #000;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: center;
  margin-top: 30px;
  padding-top: 10px;
  padding-bottom: 10px;
  display: flex;
}

.text-block-3 {
  color: #fff;
  padding-right: 20px;
}

.image-3 {
  width: 20px;
}

.link-block-2 {
  justify-content: flex-start;
  text-decoration: none;
  display: flex;
}

.slide-nav {
  display: none;
}

.slide-div {
  width: 100%;
  height: 100%;
  flex-direction: row;
  justify-content: flex-end;
  align-items: flex-end;
  display: flex;
}

.slide-3 {
  background-image: url('../images/JD22_Interior2.jpg');
  background-position: 50%;
  background-size: cover;
}

.slide-4 {
  background-image: url('../images/JD22_interior3.jpg');
  background-position: 50%;
  background-size: cover;
}

.slide-5 {
  background-image: url('../images/JD22_interior4.jpg');
  background-position: 50%;
  background-size: cover;
}

.slide-6 {
  background-image: url('../images/JD22_interior5.jpg');
  background-position: 50%;
  background-size: cover;
}

.slide-7 {
  background-image: url('../images/JD22_interior6.jpg');
  background-position: 50%;
  background-size: cover;
}

.slide-8 {
  background-image: url('../images/JD22_interior8.jpg');
  background-position: 50%;
  background-size: cover;
}

.slide-9 {
  background-image: url('../images/JD22_interior9.jpg');
  background-position: 50%;
  background-size: cover;
}

.slide-10 {
  background-image: url('../images/JD22_interior7.jpg');
  background-position: 50%;
  background-size: cover;
}

.slide-1 {
  background-image: url('../images/JD22_watch1.jpg');
  background-position: 50%;
  background-size: cover;
}

.slide-1-2 {
  background-image: url('../images/JD22_watch2.jpg');
  background-position: 50%;
  background-size: cover;
}

.slide-1-3 {
  background-image: url('../images/JD22_wurc_1.jpg');
  background-position: 50%;
  background-size: cover;
}

.image-5 {
  display: none;
}

.slide-1-4 {
  background-image: url('../images/JD22_wurc_2.jpg');
  background-position: 50%;
  background-size: cover;
}

.about-div {
  background-color: #eee;
  padding: 50px;
}

.heading {
  font-family: Karla, sans-serif;
}

.body-2 {
  font-family: Karla, sans-serif;
  font-weight: 400;
}

.image-6 {
  padding-top: 50px;
}

.slider-2 {
  height: 90vh;
}

.slide-11 {
  background-image: url('../images/JD22_burgerking.jpg');
  background-position: 50%;
  background-size: cover;
}

.slide-12 {
  background-image: url('../images/JD22_burgerking2.jpg');
  background-position: 50%;
  background-size: cover;
}

.slide-13 {
  background-image: url('../images/JD22_dopper1.jpg');
  background-position: 50%;
  background-size: cover;
}

.slide-nav-2 {
  display: none;
}

.slide-14 {
  background-image: url('../images/JD22_dopper2.jpg');
  background-position: 50%;
  background-size: cover;
}

.slide-15 {
  background-image: url('../images/JD22_painting1.jpg');
  background-position: 50%;
  background-size: cover;
}

.slide-16 {
  background-image: url('../images/JD22_painting2.jpg');
  background-position: 50%;
  background-size: cover;
}

.slide-17 {
  background-image: url('../images/JD22_RVV.jpg');
  background-position: 50%;
  background-size: cover;
}

.slide-18 {
  background-image: url('../images/JD22_RVV2.jpg');
  background-position: 50%;
  background-size: cover;
}

.slide-19 {
  background-image: url('../images/JD22_tapes1.jpg');
  background-position: 50%;
  background-size: cover;
}

.slide-1-5 {
  background-image: url('../images/JD22_tapes2.jpg');
  background-position: 50%;
  background-size: cover;
}

.slide-1-6 {
  background-image: url('../images/JD22_watch1.jpg');
  background-position: 50%;
  background-size: cover;
}

.slide-1-7 {
  background-image: url('../images/JD22_watch2.jpg');
  background-position: 50%;
  background-size: cover;
}

.slide-1-8 {
  background-image: url('../images/JD22_wurc_1.jpg');
  background-position: 50%;
  background-size: cover;
}

.slide-1-9 {
  background-image: url('../images/JD22_wurc_2.jpg');
  background-position: 50%;
  background-size: cover;
}

.automotive---1 {
  background-image: url('../images/BMW_M3_1.jpg');
  background-position: 50%;
  background-size: cover;
}

.automotive {
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/img/background-image.svg');
  background-position: 50%;
  background-size: cover;
}

.automotive._1 {
  background-image: url('../images/BMW_M3_1.jpg');
}

.automotive._2 {
  background-image: url('../images/BMW_M3_2.jpg');
}

.automotive._3 {
  background-image: url('../images/BMW_M3_3.jpg');
}

.automotive._4 {
  background-image: url('../images/BMW_M3_4.jpg');
}

.automotive._5 {
  background-image: url('../images/JD22_BMWM5CS_1.jpg');
}

.automotive._6 {
  background-image: url('../images/JD22_BMWM5CS_2.jpg');
}

.automotive._7 {
  background-image: url('../images/JD22_BMWM5CS_3.jpg');
}

.automotive._8 {
  background-image: url('../images/JD22_BMWM5CS_5.jpg');
}

.automotive._9 {
  background-image: url('../images/JD22_BMWM5CS_6.jpg');
}

.automotive._10 {
  background-image: url('../images/JD22_BMWM5CS_7.jpg');
}

.automotive._11 {
  background-image: url('../images/JD22_BMWM5CS_8.jpg');
}

.automotive._12 {
  background-image: url('../images/JD22_F1_1.jpg');
}

.automotive._13 {
  background-image: url('../images/JD22_F1_2.jpg');
}

.automotive._14 {
  background-image: url('../images/JD22_GRYARIS_1.jpg');
}

.automotive._15 {
  background-image: url('../images/JD22_GRYARIS_2.jpg');
}

.automotive._16 {
  background-image: url('../images/JD22_GRYARIS_3.jpg');
}

.home {
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/img/background-image.svg');
  background-position: 50%;
  background-size: cover;
}

.home._1 {
  background-image: url('../images/BMW_M3_1.jpg');
}

.home._2 {
  background-image: url('../images/BMW_M3_2.jpg');
}

.home._3 {
  background-image: url('../images/JD22_BMWM5CS_3.jpg');
}

.home._4 {
  background-image: url('../images/JD22_BMWM5CS_6.jpg');
}

.home._5 {
  background-image: url('../images/JD22_dopper1.jpg');
}

.home._6 {
  background-image: url('../images/JD22_dopper2.jpg');
}

.home._7 {
  background-image: url('../images/JD22_burgerking.jpg');
}

.home._8 {
  background-image: url('../images/JD22_burgerking2.jpg');
}

.home._9 {
  background-image: url('../images/JD22_Interior2.jpg');
}

.home._10 {
  background-image: url('../images/JD22_interior7.jpg');
}

.home._11 {
  background-image: url('../images/JD22_F1_1.jpg');
}

.home._12 {
  background-image: url('../images/JD22_F1_2.jpg');
}

.div-block-2 {
  display: none;
}

@media screen and (max-width: 991px) {
  .navbar {
    width: 100%;
    flex: none;
    padding: 10px 25px;
    position: relative;
  }

  .container {
    width: 100%;
    flex-direction: row;
    display: flex;
    position: relative;
  }

  .nav-menu {
    z-index: 999;
    width: 60%;
    height: 100vh;
    background-color: #fff;
    flex: 0 auto;
    padding: 10px 25px 50px;
  }

  .nav-link {
    text-align: center;
    background-color: #fff;
    padding-top: 20px;
    padding-bottom: 20px;
  }

  .socials-contact {
    display: none;
  }

  .socials-contact.contact-page {
    display: flex;
  }

  .section {
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    display: flex;
  }

  .site-content {
    width: 100%;
    padding: 10px 25px;
  }

  .slider {
    height: 50vh;
    display: none;
  }

  .slide {
    background-position: 100%;
  }

  .menu-button {
    position: absolute;
    top: 0%;
    bottom: 0%;
    left: auto;
    right: 0%;
  }

  .image-4 {
    height: 60px;
  }

  .image-5 {
    height: 60px;
    display: block;
  }

  .slider-2 {
    display: none;
  }

  .tablet-image {
    padding-top: 0;
    padding-bottom: 25px;
  }

  .div-block-2 {
    display: block;
  }
}

@media screen and (max-width: 767px) {
  .navbar, .site-content {
    padding-left: 10px;
    padding-right: 10px;
  }

  .slider {
    height: 40vh;
  }

  .slide {
    background-position: 75%;
  }

  .about-div {
    padding-left: 25px;
    padding-right: 25px;
  }

  .brand, .brand-2, .brand-3, .brand-4 {
    padding-left: 0;
  }
}

@media screen and (max-width: 479px) {
  .slider {
    height: 30vh;
  }

  .slide {
    background-position: 65%;
  }

  .about-div {
    padding-left: 10px;
    padding-right: 10px;
  }
}