/* #Tip rem and em do NOT depend on html font-size in media queries! 
Instead, 1rem = 1em = 16px  */

/****************************************/
/* BELOW 1250px */
/****************************************/

@media (max-width: 78em) {
  .header {
    padding: 0 3.2rem;
  }
}

/****************************************/
/* BELOW 600px (Phones) */
/****************************************/

@media (max-width: 37.5em) {
  .logo {
    height: 4.8rem;
  }

  .heading-primary {
    font-size: 3rem;
  }

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

  .normal-paragraph {
    font-size: 1.4rem;
  }

  .footer {
    font-size: 1.4rem;
  }

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

  .footer-link:link,
  .footer-link:visited {
    font-size: 1.4rem;
  }
}