@font-face {
  font-family: 'Roboto Serif';
  font-style: normal;
  font-weight: 100;
  src: url('/static/fonts/RobotoSerif-Thin.ttf') format('truetype');
}

@font-face {
  font-family: 'Roboto Serif';
  font-style: italic;
  font-weight: 100;
  src: url('/static/fonts/RobotoSerif-ThinItalic.ttf') format('truetype');
}

@font-face {
  font-family: 'Roboto Serif';
  font-style: normal;
  font-weight: 200;
  src: url('/static/fonts/RobotoSerif-ExtraLight.ttf') format('truetype');
}

@font-face {
  font-family: 'Roboto Serif';
  font-style: italic;
  font-weight: 200;
  src: url('/static/fonts/RobotoSerif-ExtraLightItalic.ttf') format('truetype');
}

@font-face {
  font-family: 'Roboto Serif';
  font-style: normal;
  font-weight: 300;
  src: url('/static/fonts/RobotoSerif-Light.ttf') format('truetype');
}

@font-face {
  font-family: 'Roboto Serif';
  font-style: italic;
  font-weight: 300;
  src: url('/static/fonts/RobotoSerif-LightItalic.ttf') format('truetype');
}

@font-face {
  font-family: 'Roboto Serif';
  font-style: normal;
  font-weight: 400;
  src: url('/static/fonts/RobotoSerif-Regular.ttf') format('truetype');
}

@font-face {
  font-family: 'Roboto Serif';
  font-style: italic;
  font-weight: 400;
  src: url('/static/fonts/RobotoSerif-Italic.ttf') format('truetype');
}

@font-face {
  font-family: 'Roboto Serif';
  font-style: normal;
  font-weight: 500;
  src: url('/static/fonts/RobotoSerif-Medium.ttf') format('truetype');
}

@font-face {
  font-family: 'Roboto Serif';
  font-style: italic;
  font-weight: 500;
  src: url('/static/fonts/RobotoSerif-MediumItalic.ttf') format('truetype');
}

@font-face {
  font-family: 'Roboto Serif';
  font-style: normal;
  font-weight: 600;
  src: url('/static/fonts/RobotoSerif-SemiBold.ttf') format('truetype');
}

@font-face {
  font-family: 'Roboto Serif';
  font-style: italic;
  font-weight: 600;
  src: url('/static/fonts/RobotoSerif-SemiBoldItalic.ttf') format('truetype');
}

@font-face {
  font-family: 'Roboto Serif';
  font-style: normal;
  font-weight: 700;
  src: url('/static/fonts/RobotoSerif-Bold.ttf') format('truetype');
}

@font-face {
  font-family: 'Roboto Serif';
  font-style: italic;
  font-weight: 700;
  src: url('/static/fonts/RobotoSerif-BoldItalic.ttf') format('truetype');
}

@font-face {
  font-family: 'Roboto Serif';
  font-style: normal;
  font-weight: 800;
  src: url('/static/fonts/RobotoSerif-ExtraBold.ttf') format('truetype');
}

@font-face {
  font-family: 'Roboto Serif';
  font-style: italic;
  font-weight: 800;
  src: url('/static/fonts/RobotoSerif-ExtraBoldItalic.ttf') format('truetype');
}

@font-face {
  font-family: 'Roboto Serif';
  font-style: normal;
  font-weight: 900;
  src: url('/static/fonts/RobotoSerif-Black.ttf') format('truetype');
}

@font-face {
  font-family: 'Roboto Serif';
  font-style: italic;
  font-weight: 900;
  src: url('/static/fonts/RobotoSerif-BlackItalic.ttf') format('truetype');
}

@font-face {
  font-family: 'Geologica';
  font-style: normal;
  font-weight: 100;
  src: url('/static/fonts/Geologica-Thin.ttf') format('truetype');
}

@font-face {
  font-family: 'Geologica';
  font-style: normal;
  font-weight: 200;
  src: url('/static/fonts/Geologica-ExtraLight.ttf') format('truetype');
}

@font-face {
  font-family: 'Geologica';
  font-style: normal;
  font-weight: 300;
  src: url('/static/fonts/Geologica-Light.ttf') format('truetype');
}

@font-face {
  font-family: 'Geologica';
  font-style: normal;
  font-weight: 400;
  src: url('/static/fonts/Geologica-Regular.ttf') format('truetype');
}

@font-face {
  font-family: 'Geologica';
  font-style: normal;
  font-weight: 500;
  src: url('/static/fonts/Geologica-Medium.ttf') format('truetype');
}

@font-face {
  font-family: 'Geologica';
  font-style: normal;
  font-weight: 600;
  src: url('/static/fonts/Geologica-SemiBold.ttf') format('truetype');
}

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

@font-face {
  font-family: 'Geologica';
  font-style: normal;
  font-weight: 800;
  src: url('/static/fonts/Geologica-ExtraBold.ttf') format('truetype');
}

@font-face {
  font-family: 'Geologica';
  font-style: normal;
  font-weight: 900;
  src: url('/static/fonts/Geologica-Black.ttf') format('truetype');
}


:root {
  --black: #000000;
  --white: #ffffff;

  --grey: #aaaaaa;
  --dark-grey: #313232;
  --light-grey: #dddddd;
  --lightest-grey: #eeeeee;
  --orange: #E08933;
  --pink: #C27ACD;
  --blue: #7db4db;
  --dark-blue: #4A6AA3;
  --card-blue: #8499C7;
  --bright-blue: #0091f9;
  --light-blue: #cee9ff;
  --lightest-blue: #ecf6fd;
  --olive: #A5A134;
  --green: #00620d;
  --bright-green: #59BF1A;

  --highlight: #FFFF66;
}


body {
  margin: 0;
  font-family: 'Geologica', sans-serif;
  line-height: 1.4;
  background: var(--white);
  color: var(--dark-grey);
  font-size: 18px;
  font-weight: 300;
}

h1, h2, h3, h4 {
  font-family: 'Roboto Serif', serif;
  font-weight: 400;
}

a {
  color: var(--bright-blue);
  text-decoration: underline;
  text-underline-position: under;
  text-decoration-thickness: 1px;
}


.clearfix:after {
  clear: both;
  content: " ";
  height: 0;
  display: block;
}