:root {
  --color-primary: #de9425;
}

@media (max-width: 1000px) {
  /* type start */
  .type-row {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  *,
  html {
    font-size: 86%;
  }

  .title-home {
    width: 25%;
  }

  .title-home img {
    width: 100%;
  }

  .navbar {
    padding: 0.8rem 7%;
  }

  .navbar-list {
    position: absolute;
    top: 100%;
    right: -230px;
    width: 230px;
    height: 100vh;
    background: #212121;
    transition: 240ms linear;
  }

  .navbar-list a {
    display: block;
    margin: 2.4rem 2rem;
  }

  .navbar-list i {
    display: inline-block;
    margin: 1rem 1rem 0;
    font-size: 1.4rem;
  }

  .navbar-list i:hover {
    color: #de9425;
  }

  .navbar-icon {
    display: inline-block;
  }

  .navbar-icon i {
    font-size: 1.4rem;
  }

  .sticky {
    background: #212121bb;
    backdrop-filter: blur(5px);
    padding: 0.8rem 6%;
  }

  .btn_home a {
    font-size: 0.9rem;
  }

  /* home start */
  .content-home h3 {
    font-size: 1rem;
  }
  .content-home p {
    width: 90%;
  }

  /* about start */
  .about-row {
    grid-template-columns: 1fr;
  }

  /* type start */
  .type-row {
    grid-template-columns: repeat(2, 1fr);
  }

  /* contact start */
  .contact-row {
    grid-template-columns: 1fr;
  }

  .type-row .type-box img {
    width: 100%;
    height: 48%;
  }

  input,
  textarea {
    font-size: 0.9rem;
  }

  .send {
    padding: 0.3rem 0.55rem;
  }
}

@media (max-width: 576px) {
  *,
  html {
    font-size: 79%;
  }

  /* type start */
  .type-row {
    grid-template-columns: 1fr;
  }

  .type-row .type-box img {
    width: 100%;
    height: 40%;
  }
}
