@media (max-width: 950px) {
  html {
    font-size: 52.5%;
  }
}

@media (max-width: 810px) {
  html {
    font-size: 42.5%;
  }

  .footer-inner {
    font-size: 1.8rem;
  }
}

@media (max-width: 660px) {
  html {
    font-size: 32.5%;
  }

  .btn,
  .btn-outline {
    font-size: 2.5rem;
    padding: auto;
    height: 5.8rem;
  }

  .messanger {
    font-size: 2.5rem;
  }

  .footer-inner {
    font-size: 2.2rem;
  }
}

@media (max-width: 510px) {
  html {
    font-size: 22.5%;
  }

  .header-text {
    font-size: 3.6rem;
  }

  .btn,
  .btn-outline {
    font-size: 3.5rem;
    height: 6.5rem;
  }

  .messanger {
    font-size: 3.5rem;
    /* padding: 3.6rem 2rem; */
  }

  .footer-inner {
    font-size: 2.8rem;
  }
}

@media (max-width: 360px) {
  html {
    font-size: 16%;
  }

  .header,
  .header-video {
    width: 100%;
    height: 94rem;
  }

  .header-title,
  .project-title {
    font-size: 7rem;
  }

  .header-text,
  .project-text {
    font-size: 5.6rem;
  }

  .btn,
  .btn-outline {
    font-size: 4.5rem;
    height: 7.5rem;
  }

  .project {
    width: 120rem;
    height: 64rem;
  }

  .project-map {
    width: 120rem;
    height: 64rem;
    margin-bottom: 6rem;
  }

  .messanger {
    font-size: 5.5rem;
  }

  .footer-inner {
    font-size: 3.8rem;
  }

  .inner-page-text {
    font-size: 5.2rem;
  }

  .portfolio-back {
    font-size: 7rem;
  }
}