/******************************/
/* BELOW 940px = 59em (Tablet) */
/******************************/

@media (max-width: 59em) {
  html {
    font-size: 56.25%;
  }
}

/******************************/
/* BELOW 750px = 47em (Small Tablet) */
/******************************/
@media (max-width: 47em) {
  .heading-primary {
    font-size: 4.2rem;
  }

  .heading-secondary {
    font-size: 2.4rem;
  }

  .grid {
    column-gap: 4.8rem;
    row-gap: 3.2rem;
  }

  .buttons,
  .social-list {
    gap: 4.8rem;
  }

  .about {
    grid-template-columns: 1fr;
    row-gap: 4.8rem;
  }

  .about__img-box {
    max-width: 30rem;
    justify-self: center;
  }

  .about__text-box {
    text-align: center;
  }

  .resume__btn p {
    font-size: 1.4rem;
  }
}

/******************************/
/* Above 1800px = 122.5rem (Large Desktop) */
/******************************/
@media (min-width: 122.5em) {
  html {
    font-size: 68.75%;
  }
}