@font-face {
  font-family: 'Avenir';
  src: url('fonts/Avenir-Book-01.ttf') format('truetype');
}

:root {
  --offtext-color: #9B9B9B;

  /* base font */
  --base-font-size: 16px;
  --base-font-family: Avenir, sans-serif;

  --heading-font-weight: bold;

  --mark-background: yellow;

  /* theme */
  --theme-hue: 20;
  --theme-saturation: 88%;
  --theme-lightness : 54%;

  --search-input-font-size: 14px;
  --search-input-background-color--focus: white;
  --search-input-border-width: 0 0 1px;

  --sidebar-background: antiquewhite;
  --sidebar-padding: 0 10px;
  --sidebar-nav-link-color: var(--offtext-color);

  --sidebar-nav-link-color--active: var(--theme-color);
  --sidebar-nav-link-text-decoration--active: none;
  --sidebar-nav-padding: 0 0 0 10px;

  --sidebar-nav-link-margin: 0 -10px 0 -20px;
  --sidebar-nav-link-padding: 0.25em 10px 0.25em 20px;
  --sidebar-nav-link-background-color--active: var(--base-background-color);
  

  /*
  --sidebar-nav-link-border-color: transparent;
  --sidebar-nav-link-border-color--active: var(--theme-color);
  --sidebar-nav-link-border-width: 0 2px 0 0;
  */

  --code-block-border-radius: 4px;
  --code-block-padding: 1.75em 1em 1em;
}

footer {
  font-size: 0.8em;
  font-weight: bold;
  text-align: center;
  color: var(--offtext-color);
}