:root {
  --title-font: philosopher;
  --main-font: quicksand;
  --font-light: 300;
  --font-normal: 400;
  --font-bold: 700;
}

@font-face {
  font-family: 'quicksand';
  src: url(/assets/fonts/Quicksand_Light.otf) format('opentype');
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: 'quicksand';
  src: url(/assets/fonts/Quicksand_Light_Oblique.otf) format('opentype');
  font-weight: 300;
  font-style: italic;
}

@font-face {
  font-family: 'quicksand';
  src: url(/assets/fonts/Quicksand_Book.otf) format('opentype');
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: 'quicksand';
  src: url(/assets/fonts/Quicksand_Book_Oblique.otf) format('opentype');
  font-weight: 500;
  font-style: italic;
}

@font-face {
  font-family: 'quicksand';
  src: url(/assets/fonts/Quicksand_Bold.otf) format('opentype');
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: 'quicksand';
  src: url(/assets/fonts/Quicksand_Bold_Oblique.otf) format('opentype');
  font-weight: 700;
  font-style: italic;
}

@font-face {
  font-family: 'philosopher';
  src: url(/assets/fonts/Philosopher-Regular.ttf) format('truetype');
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: 'philosopher';
  src: url(/assets/fonts/Philosopher-Italic.ttf) format('truetype');
  font-weight: 500;
  font-style: italic;
}

@font-face {
  font-family: 'philosopher';
  src: url(/assets/fonts/Philosopher-Bold.ttf) format('truetype');
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: 'philosopher';
  src: url(/assets/fonts/Philosopher-BoldItalic.ttf) format('truetype');
  font-weight: 700;
  font-style: italic;
}