:root {
    --sans-font: -apple-system,BlinkMacSystemFont,"Avenir Next",Avenir,"Nimbus Sans L",Roboto,"Noto Sans","Segoe UI",Arial,Helvetica,"Helvetica Neue",sans-serif;
    --mono-font: Consolas,Menlo,Monaco,"Andale Mono","Ubuntu Mono",monospace;
    --standard-border-radius: 5px;
    --border-width: 1px;
    --color-base: #eff1f5;
    --color-text: #4c4f69;
    --color-pink: #ea76cb;
    --color-mauve: #8839ef;
    --color-red: #d20f39;
    --color-maroon: #e64553;
    --color-peach: #fe640b;
    --color-yellow: #df8e1d;
    --color-green: #40a02b;
    --color-teal: #179299;
    --color-sky: #04a5e5;
    --color-sapphire: #209fb5;
    --color-blue: #1e66f5;
    --color-lavender: #7287fd;
    --color-text: #4c4f69;
    --color-subtext1: #5c5f77;
    --color-subtext0: #6c6f85;
    --color-overlay2: #7c7f93;
    --color-overlay1: #8c8fa1;
    --color-overlay0: #9ca0b0;
    --color-surface2: #acb0be;
    --color-surface1: #bcc0cc;
    --color-surface0: #ccd0da;
    --color-base: #eff1f5;
    --color-mantle: #e6e9ef;
    --color-crust: #dce0e8;
}
*,
:before,
:after {
  box-sizing: border-box
}
hr {
  color: var(--color-mauve);
}
html {
    font-family: var(--sans-font);
    scroll-behavior: smooth;
    /* text-align: justify; */
}
body {
  color: var(--color-text);
  background-color: var(--color-base);
  /* grid-template-columns: 1fr min(45rem,90%) 1fr; */
  margin: 0;
  font-size: 1.15rem;
  line-height: 1.5;
  display: grid;
}
#preamble {
  background-color: var(--color-mantle);
  border-bottom: var(--border-width)solid var(--border);
  text-align: center;
  grid-column: 1/-1;
  padding: 0 .5rem 2rem;
}
#content {
  padding: 2rem;
}
#postamble {
  color: var(--color-subtext0);
  text-align: center;
  border-top: var(--border-width)solid var(--border);
  margin-top: 4rem;
  padding: 2rem 1rem 1.5rem;
  font-size: .9rem
}
body {
  display: grid;
}
#navbar {
  background: var(--color-mantle);
}
#content {
  max-width: 60em;
  margin: auto;
}
.hcontainer {
  display: flex;
  justify-content: center;
  align-items: stretch;
}
#navbar a {
  display: flex;
  align-items: center;
  color: var(--color-text);
  text-decoration: none;
  padding: 1em;
}
#navbar a:hover {
  background-color: var(--color-crust);
}

.fancybox {
  background-color: var(--color-crust);
  padding: 0 1rem;
  border-radius: 20px;
}

h2 > a {
  color: var(--color-text);
  text-decoration: none;
}

div.org-src-container {
  background-color: var(--color-mantle);
  border-radius: 1em;
  padding: 0em 0.5em;
}