[data-md-color-scheme="default"] {
  --md-default-bg-color: #fff7ec;
  --md-primary-fg-color: #D49017;
  --md-typeset-a-color: #006caa;
  --md-code-bg-color: #e7e7e7;
}

[data-md-color-scheme="slate"] {
  --md-primary-fg-color: #D49017;
  --md-default-fg-color: #fff7ec;
  --md-default-bg-color: #111111;
}

.theme-img--light,
.theme-img--dark {
  display: none;
}

body[data-md-color-scheme="default"] .theme-img--light { display: block; }
body[data-md-color-scheme="slate"] .theme-img--dark { display: block; }

.clickable-banner {
  color: #000000;
}

.md-main__inner.md-grid,
.md-grid {
  max-width: 64rem;
}

@media screen and (min-width: 1220px) {
  .md-main__inner.md-grid,
  .md-grid {
    max-width: 64rem;
  }
}

.md-typeset h1,
.md-typeset h2,
.md-typeset h3 {
  font-weight: 400;
  color: var(
    --md-primary-fg-color-dark
  ); /* this actually works for both light and dark themes */
}

@font-face {
  font-family: "TiltNeon";
  src: url("/assets/TiltNeon.ttf") format('truetype');
}

:root {
  --md-text-font: "Agbalumo"; 
}