@font-face{
  font-family:Fraunces;
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url("./fonts/fraunces-500.ttf") format("truetype");
}
@font-face{
  font-family:Fraunces;
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url("./fonts/fraunces-600.ttf") format("truetype");
}
@font-face{
  font-family:Fraunces;
  font-style:normal;
  font-weight:700;
  font-display:swap;
  src:url("./fonts/fraunces-700.ttf") format("truetype");
}
@font-face{
  font-family:Karla;
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url("./fonts/karla-400.ttf") format("truetype");
}
@font-face{
  font-family:Karla;
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url("./fonts/karla-500.ttf") format("truetype");
}
@font-face{
  font-family:Karla;
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url("./fonts/karla-600.ttf") format("truetype");
}
@font-face{
  font-family:Karla;
  font-style:normal;
  font-weight:700;
  font-display:swap;
  src:url("./fonts/karla-700.ttf") format("truetype");
}
@font-face{
  font-family:Karla;
  font-style:normal;
  font-weight:800;
  font-display:swap;
  src:url("./fonts/karla-800.ttf") format("truetype");
}