:root {
  /* COLORS */
  --color-primary-darker: #121112;
  --color-primary-dark: #161d31;
  --color-primary-grey: #fbfbfd;
  --color-white: #ffffff;
  --color-primary: #ef4036;
  --color-primary-light: #dd5735;
  --color-primary-lighter: #ff6727;
  --color-grayscale-main: #464646;
  --color-grayscale-dark: #59585a;
  --color-grayscale-darker: #292829;
  --color-grayscale-medium: #909091;
  --color-grayscale-lighter: #e0e0e1;
  --color-grayscale-light: #f0f0f1;
  --color-action: #40ffa9;
  --color-accent1: #5acc79;
  --color-accent2: #6bccbc;
  --color-accent3: #3e9eff;
  --color-accent4: #fbe559;

  /* FONT SIZES */
  --font-xs: 0.75rem;
  --font-s: 0.875rem;
  --font-m: 1rem;
  --font-l: 1.125rem;
  --font-xl: 1.5rem;
  --font-title: 2rem;

  /* MEASUREMENTS */
  --screen-padding: 1rem;
  --header-height: 56px;
}
* {
  box-sizing: border-box;
}
html {
  font-size: 95%;
}
body {
  font-family: 'Lato', sans-serif;
  line-height: 1.56;
  background-color: var(--color-primary-grey);
  color: var(--color-grayscale-main);
}
ul {
  padding: 0;
  list-style-type: none;
}
a {
  text-decoration: none;
  color: var(--color-grayscale-main);
  transition: color 0.3s;
}
a:hover {
  color: var(--color-primary-lighter);
}
h1,
h2,
h3 {
  font-family: 'Arvo', serif;
  font-weight: normal;
  line-height: 1.25;
  color: var(--color-primary-dark);
}
h1 {
  font-size: 2rem;
  margin-top: 0;
}
h2 {
  font-size: 1.5rem;
}

.a-sectionOvertitle {
  margin: 0 0 0.3em;
  color: var(--color-primary-lighter);
  font-size: var(--font-l);
  font-weight: bold;
  text-align: center;
}