@media (max-width: 1600px) {
  html:root {
    --section-padding: 100px;
  }
  main .works nav {
    flex-wrap: wrap;
    justify-content: space-around;
  }
  main .works .container .photo {
    margin-bottom: 25px;
  }
}
@media (max-width: 1280px) {
  html:root {
    --section-padding: 60px;
  }
  main .get-in-touch .container {
    flex-direction: column;
    align-items: center;
  }
}
@media (max-width: 1024px) {
  html:root {
    --section-padding: 40px;
  }
  main .blog .container {
    max-width: 460px;
  }
  main .blog .container .block {
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
}
@media (max-width: 768px) {
  html:root {
    --section-padding: 30px;
  }
  header {
    flex-direction: column;
  }
  main section .content p .content-text {
    flex-basis: 80%;
  }
  .welcome {
    height: 100%;
    min-height: 770px;
  }
  main .service {
    text-align: center;
  }
  main .service .grid {
    display: flex;
  }
  main .service .grid .wrap {
    flex-basis: 80%;
    margin-bottom: 25px;
  }
  main .about-us .content .content-text {
    flex-basis: 100%;
  }
}
@media (max-width: 540px) {
  html:root {
    --section-padding: 10px;
  }
  header .main-menu {
    display: none;
  }
  header .mobile-menu {
    display: flex;
  }
  main .blog .container {
    max-width: 460px;
  }
  main .get-in-touch .container .form .name-block,
  main .get-in-touch .container .form .e-mail-block {
    flex-wrap: wrap;
  }
  main .get-in-touch .container .form .name-block .name-form,
  main .get-in-touch .container .form .e-mail-block .name-form,
  main .get-in-touch .container .form .name-block .e-mail-form,
  main .get-in-touch .container .form .e-mail-block .e-mail-form {
    margin-right: 0;
    margin-bottom: 10px;
  }
  main .get-in-touch .container .form .name-block input,
  main .get-in-touch .container .form .e-mail-block input {
    flex-basis: 100%;
  }
}