@font-face {
  font-family: recoleta-bold;
  src: local("recoleta-bold"), url(../fonts/Recoleta-Bold.otf);
  font-weight: 700;
  font-display: block;
  font-style: normal;
}

@font-face {
  font-family: recoleta-black;
  src: local("recoleta-black"), url(../fonts/PlayfairDisplay-Black.ttf);
  font-weight: 900;
  font-display: block;
  font-style: normal;
}

@font-face {
  font-family: recoleta-semi-bold;
  src: local("recoleta-semi-bold"), url(../fonts/PlayfairDisplay-SemiBold.ttf);
  font-weight: 600;
  font-display: block;
  font-style: normal;
}

@font-face {
  font-family: recoleta-medium;
  src: local("recoleta-medium"), url(../fonts/PlayfairDisplay-Medium.ttf);
  font-weight: 500;
  font-display: block;
  font-style: normal;
}

@font-face {
  font-family: worksans-bold;
  src: local("worksans-bold"), url(../fonts/WorkSans-Bold.ttf);
  font-weight: 700;
  font-display: block;
  font-style: normal;
}

@font-face {
  font-family: worksans-medium;
  src: local("worksans-medium"), url(../fonts/WorkSans-Medium.ttf);
  font-weight: 500;
  font-display: block;
  font-style: normal;
}

@font-face {
  font-family: worksans-regular;
  src: local("worksans-regular"), url(../fonts/WorkSans-Regular.ttf);
  font-weight: 400;
  font-display: block;
  font-style: normal;
}