/*Spectral (titre) */

.spectral-light {
  font-family: "Spectral", serif;
  font-weight: 300;
  font-style: normal;
}

.spectral-regular {
  font-family: "Spectral", serif;
  font-weight: 400;
  font-style: normal;
}

.spectral-bold {
  font-family: "Spectral", serif;
  font-weight: 700;
  font-style: normal;
}

h1 {
  font-family: "Spectral", serif;
  font-weight: 400;
  font-style: normal;
  font-size: 84px;
}

h2 {
  font-family: "Spectral", serif;
  font-weight: 400;
  font-style: normal;
  font-size: 48px;
}

h3 {
  font-family: "Spectral", serif;
  font-weight: 400;
  font-style: normal;
  font-size: 36px;
}

h5 {
  font-family: "Spectral", serif;
  font-weight: 600;
  font-style: normal;
  font-size: 18px;
}


/* Karla (paragraphe) */

.karla-regular {
  font-family: "Karla", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

p {
  font-family: "Karla", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 18px;
}

.font-medium {
  font-family: "Karla", serif;
  font-optical-sizing: auto;
  font-weight: 500;
}


/***************************
Responsive
***************************/

/* Nav */
@media (max-width: 1023px) {


  h1 {
    font-size: 4rem;
  }

  h2 {
    font-size: 3rem;
  }

  h3 {
    font-size: 2rem;
  }

  h5 {
    font-size: 18px;
  }
    
    p {
    font-size: 18px;
  }


}


@media (min-width: 180px) and (max-width: 480px) {

    h1 {
    font-size: 3rem;
  }

  h2 {
    font-size: 2.4rem;
  }

  h3 {
    font-size: 1.6rem;
  }

  h5 {
    font-size: 18px;
  }
    
    p {
    font-size: 18px;
  }

}