@font-face {
  font-family: 'Inter';
  src: url('../fonts/inter/InterVariable.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root {
  --c-background: #fcffff;
  --c-type0: #ffffff;
  --c-type1: #000000;
  --c-type2: #4d4d4d;
  --c-typed: #dddddd;
  --c-hi1: #4deded;
  --c-hi2: #eddd4d;
  --c-hi3: #ed4d4d;
  --c-hi4: #5dc090;
  --c-hi1d: #0d8282;
  --c-hi2d: #ccba14;
  --c-hi3d: #c31313;
  --c-hi4d: #3c9a6d;
  --c-hi1b: #dafbfb;
  --c-hi2b: #fcf8cf;
  --c-hi3b: #fad1d1;
  --c-hi4b: hsl(151, 44%, 86%);
}

body {
  font-size: 18px;
  font-family: 'Inter', sans-serif;
  background-color: var(--c-background);
  color: var(--c-type1);
}

h1, h2, h3, h4, h5, h6 { font-weight: 700; }
h1 {font-size: 3.0rem; }
h2 {font-size: 2.2rem; }
h3 {font-size: 1.6rem; }
h4 {font-size: 1.2rem; }
h5 {font-size: 1.0rem; }
h6 {font-size: 0.8rem; }

small {
  font-size: 0.8rem;
  font-weight: 700;
}

header h1 {
  font-size: 2rem;
  font-weight: 900;
}

header a {
  color: var(--c-type1);
}

header h1 .xh, header h1 small {
  vertical-align: middle;
  font-weight: 900;
}

strong {
  font-weight: 700;
}

u {
  text-decoration: solid;
  text-decoration-thickness: 1px;
  color: var(--c-type1);
  text-decoration-color: var(--c-type1);
}

a {
  color: var(--c-hi1d);
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
  color: var(--c-type1; )
}

a:hover {cursor: pointer; }

p a {
  text-decoration: solid;
  text-decoration-thickness: 1px;
  text-decoration-color: var(--c-hi1d);
  text-underline-offset: 2px;
}

p a:hover,
p a:focus {
  background-color: --c-hi1b;
  color: var(--c-type1);
  text-decoration-color: var(--c-type1);
}

li a {
  text-decoration: none;
}