@charset "UTF-8";
.code .hll {
  background-color: #ffc;
}

.code {
  background: #f8f8f8;
}

.code .c {
  color: #408080;
  font-style: italic;
} /* Comment */
.code .err {
  border: 1px solid #F00;
} /* Error */
.code .k {
  color: #008000;
  font-weight: bold;
} /* Keyword */
.code .o {
  color: #666;
} /* Operator */
.code .ch {
  color: #408080;
  font-style: italic;
} /* Comment.Hashbang */
.code .cm {
  color: #408080;
  font-style: italic;
} /* Comment.Multiline */
.code .cp {
  color: #BC7A00;
} /* Comment.Preproc */
.code .cpf {
  color: #408080;
  font-style: italic;
} /* Comment.PreprocFile */
.code .c1 {
  color: #408080;
  font-style: italic;
} /* Comment.Single */
.code .cs {
  color: #408080;
  font-style: italic;
} /* Comment.Special */
.code .gd {
  color: #A00000;
} /* Generic.Deleted */
.code .ge {
  font-style: italic;
} /* Generic.Emph */
.code .gr {
  color: #F00;
} /* Generic.Error */
.code .gh {
  color: #000080;
  font-weight: bold;
} /* Generic.Heading */
.code .gi {
  color: #00A000;
} /* Generic.Inserted */
.code .go {
  color: #888;
} /* Generic.Output */
.code .gp {
  color: #000080;
  font-weight: bold;
} /* Generic.Prompt */
.code .gs {
  font-weight: bold;
} /* Generic.Strong */
.code .gu {
  color: #800080;
  font-weight: bold;
} /* Generic.Subheading */
.code .gt {
  color: #04D;
} /* Generic.Traceback */
.code .kc {
  color: #008000;
  font-weight: bold;
} /* Keyword.Constant */
.code .kd {
  color: #008000;
  font-weight: bold;
} /* Keyword.Declaration */
.code .kn {
  color: #008000;
  font-weight: bold;
} /* Keyword.Namespace */
.code .kp {
  color: #008000;
} /* Keyword.Pseudo */
.code .kr {
  color: #008000;
  font-weight: bold;
} /* Keyword.Reserved */
.code .kt {
  color: #B00040;
} /* Keyword.Type */
.code .m {
  color: #666;
} /* Literal.Number */
.code .s {
  color: #BA2121;
} /* Literal.String */
.code .na {
  color: #7D9029;
} /* Name.Attribute */
.code .nb {
  color: #008000;
} /* Name.Builtin */
.code .nc {
  color: #00F;
  font-weight: bold;
} /* Name.Class */
.code .no {
  color: #800;
} /* Name.Constant */
.code .nd {
  color: #A2F;
} /* Name.Decorator */
.code .ni {
  color: #999;
  font-weight: bold;
} /* Name.Entity */
.code .ne {
  color: #D2413A;
  font-weight: bold;
} /* Name.Exception */
.code .nf {
  color: #00F;
} /* Name.Function */
.code .nl {
  color: #A0A000;
} /* Name.Label */
.code .nn {
  color: #00F;
  font-weight: bold;
} /* Name.Namespace */
.code .nt {
  color: #008000;
  font-weight: bold;
} /* Name.Tag */
.code .nv {
  color: #19177C;
} /* Name.Variable */
.code .ow {
  color: #A2F;
  font-weight: bold;
} /* Operator.Word */
.code .w {
  color: #bbb;
} /* Text.Whitespace */
.code .mb {
  color: #666;
} /* Literal.Number.Bin */
.code .mf {
  color: #666;
} /* Literal.Number.Float */
.code .mh {
  color: #666;
} /* Literal.Number.Hex */
.code .mi {
  color: #666;
} /* Literal.Number.Integer */
.code .mo {
  color: #666;
} /* Literal.Number.Oct */
.code .sa {
  color: #BA2121;
} /* Literal.String.Affix */
.code .sb {
  color: #BA2121;
} /* Literal.String.Backtick */
.code .sc {
  color: #BA2121;
} /* Literal.String.Char */
.code .dl {
  color: #BA2121;
} /* Literal.String.Delimiter */
.code .sd {
  color: #BA2121;
  font-style: italic;
} /* Literal.String.Doc */
.code .s2 {
  color: #BA2121;
} /* Literal.String.Double */
.code .se {
  color: #B62;
  font-weight: bold;
} /* Literal.String.Escape */
.code .sh {
  color: #BA2121;
} /* Literal.String.Heredoc */
.code .si {
  color: #B68;
  font-weight: bold;
} /* Literal.String.Interpol */
.code .sx {
  color: #008000;
} /* Literal.String.Other */
.code .sr {
  color: #B68;
} /* Literal.String.Regex */
.code .s1 {
  color: #BA2121;
} /* Literal.String.Single */
.code .ss {
  color: #19177C;
} /* Literal.String.Symbol */
.code .bp {
  color: #008000;
} /* Name.Builtin.Pseudo */
.code .fm {
  color: #00F;
} /* Name.Function.Magic */
.code .vc {
  color: #19177C;
} /* Name.Variable.Class */
.code .vg {
  color: #19177C;
} /* Name.Variable.Global */
.code .vi {
  color: #19177C;
} /* Name.Variable.Instance */
.code .vm {
  color: #19177C;
} /* Name.Variable.Magic */
.code .il {
  color: #666;
} /* Literal.Number.Integer.Long */
@font-face {
  font-family: "Source Sans Pro Variable";
  font-weight: 200 900;
  font-style: normal;
  src: url("../fonts/SourceSans3VF-Roman.otf.woff2"), url("../fonts/SourceSans3VF-Roman.ttf.woff2") format("woff2-variations");
}
@font-face {
  font-family: "Source Sans Pro Variable";
  font-weight: 200 900;
  font-style: italic;
  src: url("../fonts/SourceSans3VF-Italic.otf.woff2") url("../fonts/SourceSans3VF-Italic.ttf.woff2") format("woff2-variations");
}
@font-face {
  font-family: "Crimson Pro Variable";
  font-weight: 200 900;
  size-adjust: 112%;
  font-style: normal;
  src: url("../fonts/CrimsonPro.woff2") format("woff2-variations");
}
@font-face {
  font-family: "Crimson Pro Variable";
  font-weight: 200 900;
  size-adjust: 112%;
  font-style: italic;
  src: url("../fonts/CrimsonPro-Italic.woff2") format("woff2-variations");
}
@font-face {
  font-family: "Source Code Pro Variable";
  font-weight: 200 900;
  size-adjust: 81.25%;
  font-style: normal;
  src: url("../fonts/SourceCodeVariable-Roman.otf.woff2") format("woff2-variations");
}
@font-face {
  font-family: "Source Code Pro Variable";
  font-weight: 200 900;
  size-adjust: 81.25%;
  font-style: italic;
  src: url("../fonts/SourceCodeVariable-Italic.otf.woff2") format("woff2-variations");
}
:root {
  --color-primary: 0, 153, 230;
  --color-primary-darker: 0, 136, 205;
  --color-primary-lighter: 1, 170, 255;
  --color-primary-light: 48, 192, 255;
  --color-primary-dark: 0, 102, 154;
  --color-secondary: 225, 152, 43;
  --color-gray-100: 246, 246, 246;
  --color-gray-200: 240, 240, 240;
  --color-gray-300: 224, 224, 224;
  --color-gray-400: 192, 192, 192;
  --color-gray-500: 172, 172, 172;
  --color-gray-600: 140, 140, 140;
  --color-gray-700: 112, 112, 112;
  --color-gray-800: 80, 80, 80;
  --color-gray-900: 48, 48, 48;
  --color-orange-100: 238, 183, 132;
  --color-orange-200: 231, 156, 88;
  --color-orange-300: 225, 152, 43;
  --color-orange-350: 225, 130, 43;
  --color-orange-400: 190, 105, 27;
  --color-orange-500: 145, 80, 21;
  --color-red-100: 248, 79, 79;
  --color-red-200: 247, 42, 42;
  --color-red-300: 240, 8, 8;
  --color-red-400: 204, 8, 8;
  --color-red-500: 167, 7, 7;
  --color-green-100: 0, 208, 0;
  --color-green-200: 0, 195, 0;
  --color-green-300: 0, 170, 0;
  --color-green-400: 0, 157, 0;
  --color-green-500: 0, 144, 0;
  --color-blue-100: 48, 192, 255;
  --color-blue-200: 1, 170, 255;
  --color-blue-300: 0, 153, 230;
  --color-blue-400: 0, 136, 205;
  --color-blue-500: 0, 102, 154;
  --color-yellow-100: 246, 227, 85;
  --color-yellow-200: 244, 221, 49;
  --color-yellow-300: 241, 214, 13;
  --color-yellow-400: 192, 171, 11;
  --color-yellow-500: 168, 149, 9;
  --serif-font: "Crimson Pro Variable", serif;
  --sans-serif-font: "Source Sans Pro Variable", sans-serif;
  --code-font: "Source Code Pro Variable", monospace;
}

.sr-only, .hidden {
  display: none;
}

a {
  color: rgba(var(--color-primary), 1);
}
a:hover {
  color: rgba(var(--color-secondary), 1);
}

code {
  background-color: rgba(var(--color-gray-200), 1);
  padding: 0.1rem;
  color: #333;
}

div.code pre code {
  background-color: unset;
  padding: unset;
}

figure img, div.figure img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  max-width: 100%;
  box-shadow: 0 0 0.25rem rgba(var(--color-gray-900), 1);
}
figure figcaption, figure .caption, div.figure figcaption, div.figure .caption {
  color: rgba(var(--color-gray-800), 1);
  font-style: italic;
  padding: 1rem;
  text-align: center;
}

figure.diagram img, figure.noshadow img {
  box-shadow: none;
}

img {
  height: auto;
}

img#logo {
  width: 128px;
  height: 32px;
}

table {
  width: 100%;
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}
table thead {
  background-color: rgba(var(--color-gray-300), 1);
}
table tr, table td {
  border-collapse: collapse;
  border: 1px solid rgba(var(--color-gray-400), 1);
}
table td {
  padding: 0.5rem;
}

table.footnote td, table.footnote tr {
  border: none;
}
table.footnote tr td:first-child {
  width: 10%;
}

body {
  padding: 0;
  margin: 0;
  background-color: rgba(var(--color-gray-200), 1);
  font-family: var(--serif-font);
  font-size: 18px;
  font-weight: 400;
}

a.social-media-link {
  display: inline-block;
  padding: 6px 12px 6px 30px;
  margin: 0.5em 0 0;
  border: #ccc solid 1px;
  border-radius: 3px;
  color: #333;
  white-space: nowrap;
}

a.social-media-link:hover,
a.social-media-link:focus {
  background-color: #dedede;
}

a.social-media-link:focus {
  outline: none;
  border-color: #0089cb;
}

a.twitter-timeline {
  background: #f8f8f8 url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNy4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgNzIgNzIiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDcyIDcyIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxyZWN0IHg9IjAiIGZpbGw9Im5vbmUiIHdpZHRoPSI3MiIgaGVpZ2h0PSI3MiIvPg0KPHBhdGggZmlsbD0iIzU1YWNlZSIgZD0iTTY4LjgxMiwxNS4xNDFjLTIuMzQ4LDEuMDM5LTQuODY5LDEuNzQzLTcuNTE5LDIuMDZjMi43MDMtMS42Miw0Ljc3OC00LjE4Nyw1Ljc1Ni03LjI0NGMtMi41MjksMS41LTUuMzMsMi41OTItOC4zMTMsMy4xNzYNCglDNTYuMzQ5LDEwLjU5MSw1Mi45NDgsOSw0OS4xODIsOWMtNy4yMjksMC0xMy4wOTIsNS44NjEtMTMuMDkyLDEzLjA5M2MwLDEuMDI2LDAuMTE4LDIuMDIxLDAuMzM4LDIuOTgxDQoJYy0xMC44ODUtMC41NDgtMjAuNTI4LTUuNzU3LTI2Ljk4Ny0xMy42NzljLTEuMTI2LDEuOTM2LTEuNzcxLDQuMTg0LTEuNzcxLDYuNTgxYzAsNC41NDIsMi4zMTIsOC41NTEsNS44MjQsMTAuODk4DQoJYy0yLjE0Ni0wLjA2OS00LjE2NS0wLjY1Ny01LjkzLTEuNjM4Yy0wLjAwMiwwLjA1NS0wLjAwMiwwLjExLTAuMDAyLDAuMTYyYzAsNi4zNDUsNC41MTMsMTEuNjM4LDEwLjUwNCwxMi44NA0KCWMtMS4xMDEsMC4yOTgtMi4yNTYsMC40NTctMy40NDksMC40NTdjLTAuODQ2LDAtMS42NjctMC4wNzgtMi40NjUtMC4yMzFjMS42NjcsNS4yLDYuNDk5LDguOTg2LDEyLjIzLDkuMDkNCgljLTQuNDgyLDMuNTEyLTEwLjEyOSw1LjYwNi0xNi4yNiw1LjYwNmMtMS4wNTUsMC0yLjA5Ni0wLjA2MS0zLjEyMi0wLjE4NGM1Ljc5NCwzLjcxNywxMi42NzYsNS44ODIsMjAuMDY3LDUuODgyDQoJYzI0LjA4MywwLDM3LjI1MS0xOS45NDksMzcuMjUxLTM3LjI0OWMwLTAuNTY2LTAuMDE0LTEuMTM0LTAuMDM5LTEuNjk0QzY0LjgzOCwyMC4wNjgsNjcuMDU4LDE3Ljc2NSw2OC44MTIsMTUuMTQxeiIvPg0KPC9zdmc+DQo=") 8px 8px no-repeat;
  background-size: 1rem 1rem;
  font: normal 12px/18px sans-serif;
}

a.mastodon {
  background: #f8f8f8 url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNzUiIGhlaWdodD0iNzkiIHZpZXdCb3g9IjAgMCA3NSA3OSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTczLjgzOTMgMTcuNDg5OEM3Mi42OTczIDkuMDAxNjUgNjUuMjk5NCAyLjMxMjM1IDU2LjUyOTYgMS4wMTYxNEM1NS4wNSAwLjc5NzExNSA0OS40NDQxIDAgMzYuNDU4MiAwSDM2LjM2MTJDMjMuMzcxNyAwIDIwLjU4NSAwLjc5NzExNSAxOS4xMDU0IDEuMDE2MTRDMTAuNTc5OCAyLjI3NjQ0IDIuNzkzOTkgOC4yODcxMiAwLjkwNDk5NyAxNi44NzU4Qy0wLjAwMzU4NTI0IDIxLjEwNTYgLTAuMTAwNTQ5IDI1Ljc5NDkgMC4wNjgyMzk0IDMwLjA5NjVDMC4zMDg4NTIgMzYuMjY1MSAwLjM1NTUzOCA0Mi40MjMgMC45MTU3NyA0OC41NjY1QzEuMzAzMDcgNTIuNjQ3NCAxLjk3ODcyIDU2LjY5NTcgMi45Mzc2MyA2MC42ODEyQzQuNzMzMjUgNjguMDQyIDEyLjAwMTkgNzQuMTY3NiAxOS4xMjMzIDc2LjY2NjZDMjYuNzQ3OCA3OS4yNzI4IDM0Ljk0NzQgNzkuNzA1NSA0Mi44MDM5IDc3LjkxNjJDNDMuNjY4MiA3Ny43MTUxIDQ0LjUyMTcgNzcuNDgxNyA0NS4zNjQ1IDc3LjIxNkM0Ny4yNzUgNzYuNjA5MiA0OS41MTIzIDc1LjkzMDUgNTEuMTU3MSA3NC43Mzg1QzUxLjE3OTcgNzQuNzIxNyA1MS4xOTgyIDc0LjcwMDEgNTEuMjExMiA3NC42NzUzQzUxLjIyNDMgNzQuNjUwNCA1MS4yMzE2IDc0LjYyMjkgNTEuMjMyNSA3NC41OTQ4VjY4LjY0MTZDNTEuMjMyMSA2OC42MTU0IDUxLjIyNTkgNjguNTg5NiA1MS4yMTQyIDY4LjU2NjFDNTEuMjAyNSA2OC41NDI2IDUxLjE4NTggNjguNTIyIDUxLjE2NTEgNjguNTA1OEM1MS4xNDQ0IDY4LjQ4OTYgNTEuMTIwNCA2OC40NzgzIDUxLjA5NDggNjguNDcyNkM1MS4wNjkyIDY4LjQ2NjkgNTEuMDQyNiA2OC40NjcgNTEuMDE3MSA2OC40NzI5QzQ1Ljk4MzUgNjkuNjc1IDQwLjgyNTQgNzAuMjc3NyAzNS42NTAyIDcwLjI2ODJDMjYuNzQzOSA3MC4yNjgyIDI0LjM0ODYgNjYuMDQyIDIzLjY2MjYgNjQuMjgyNkMyMy4xMTEzIDYyLjc2MiAyMi43NjEyIDYxLjE3NTkgMjIuNjIxMiA1OS41NjQ2QzIyLjYxOTcgNTkuNTM3NSAyMi42MjQ3IDU5LjUxMDUgMjIuNjM1NyA1OS40ODU3QzIyLjY0NjYgNTkuNDYwOSAyMi42NjMzIDU5LjQzOTEgMjIuNjg0MyA1OS40MjJDMjIuNzA1MyA1OS40MDQ4IDIyLjczIDU5LjM5MjkgMjIuNzU2NSA1OS4zODcxQzIyLjc4MyA1OS4zODEzIDIyLjgxMDQgNTkuMzgxOCAyMi44MzY3IDU5LjM4ODZDMjcuNzg2NCA2MC41ODI2IDMyLjg2MDQgNjEuMTg1MyAzNy45NTIyIDYxLjE4MzlDMzkuMTc2OCA2MS4xODM5IDQwLjM5NzggNjEuMTgzOSA0MS42MjI0IDYxLjE1MTZDNDYuNzQzNSA2MS4wMDggNTIuMTQxMSA2MC43NDU5IDU3LjE3OTYgNTkuNzYyMUM1Ny4zMDUzIDU5LjczNjkgNTcuNDMxIDU5LjcxNTQgNTcuNTM4NyA1OS42ODMxQzY1LjQ4NjEgNTguMTU3IDczLjA0OTMgNTMuMzY3MiA3My44MTc4IDQxLjIzODFDNzMuODQ2NSA0MC43NjA2IDczLjkxODQgMzYuMjM2NCA3My45MTg0IDM1Ljc0MDlDNzMuOTIxOSAzNC4wNTY5IDc0LjQ2MDYgMjMuNzk0OSA3My44MzkzIDE3LjQ4OThaIiBmaWxsPSJ1cmwoI3BhaW50MF9saW5lYXJfNTQ5XzM0KSIvPgo8cGF0aCBkPSJNNjEuMjQ4NCAyNy4wMjYzVjQ4LjExNEg1Mi44OTE2VjI3LjY0NzVDNTIuODkxNiAyMy4zMzg4IDUxLjA5NiAyMS4xNDEzIDQ3LjQ0MzcgMjEuMTQxM0M0My40Mjg3IDIxLjE0MTMgNDEuNDE3NyAyMy43NDA5IDQxLjQxNzcgMjguODc1NVY0MC4wNzgySDMzLjExMTFWMjguODc1NUMzMy4xMTExIDIzLjc0MDkgMzEuMDk2NSAyMS4xNDEzIDI3LjA4MTUgMjEuMTQxM0MyMy40NTA3IDIxLjE0MTMgMjEuNjM3MSAyMy4zMzg4IDIxLjYzNzEgMjcuNjQ3NVY0OC4xMTRIMTMuMjgzOVYyNy4wMjYzQzEzLjI4MzkgMjIuNzE3NiAxNC4zODQgMTkuMjk0NiAxNi41ODQzIDE2Ljc1NzJDMTguODUzOSAxNC4yMjU4IDIxLjgzMTEgMTIuOTI2IDI1LjUyNjQgMTIuOTI2QzI5LjgwMzYgMTIuOTI2IDMzLjAzNTcgMTQuNTcwNSAzNS4xOTA1IDE3Ljg1NTlMMzcuMjY5OCAyMS4zNDZMMzkuMzUyNyAxNy44NTU5QzQxLjUwNzQgMTQuNTcwNSA0NC43Mzk1IDEyLjkyNiA0OS4wMDk1IDEyLjkyNkM1Mi43MDEzIDEyLjkyNiA1NS42Nzg0IDE0LjIyNTggNTcuOTU1MyAxNi43NTcyQzYwLjE1MzEgMTkuMjkyMiA2MS4yNTA4IDIyLjcxNTIgNjEuMjQ4NCAyNy4wMjYzWiIgZmlsbD0id2hpdGUiLz4KPGRlZnM+CjxsaW5lYXJHcmFkaWVudCBpZD0icGFpbnQwX2xpbmVhcl81NDlfMzQiIHgxPSIzNy4wNjkyIiB5MT0iMCIgeDI9IjM3LjA2OTIiIHkyPSI3OSIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiPgo8c3RvcCBzdG9wLWNvbG9yPSIjNjM2NEZGIi8+CjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iIzU2M0FDQyIvPgo8L2xpbmVhckdyYWRpZW50Pgo8L2RlZnM+Cjwvc3ZnPgo=");
  background-size: 1rem 1rem;
  background-repeat: no-repeat;
  background-position: 0.5rem 0.5rem;
  font: normal 12px/18px sans-serif;
}

#header {
  z-index: 1;
  position: fixed;
  top: 0;
  width: 100%;
  font-family: var(--sans-serif-font);
  box-shadow: 0 0 0.75rem rgba(var(--color-primary-dark), 1);
}
@supports (backdrop-filter: none) {
  #header {
    background: linear-gradient(to bottom, rgba(var(--color-primary), 1), rgba(var(--color-primary-lighter), 0.85));
    backdrop-filter: blur(0.1rem);
  }
}
@supports not (backdrop-filter: none) {
  #header {
    background: linear-gradient(to bottom, rgba(var(--color-primary), 1), rgba(var(--color-primary-lighter), 1));
  }
}
#header .content {
  display: flex;
  max-width: 1024px;
  margin: auto;
  align-items: stretch;
}
#header .content #brand {
  padding-left: 1rem;
  padding-right: 0.5rem;
  padding-top: 0.5rem;
}

#content, #sidebar {
  padding-top: 4rem;
}

#container, #footer {
  --content-offset: 1rem;
  padding-left: var(--content-offset);
  padding-right: var(--content-offset);
  max-width: 1024px;
  margin: auto;
  background-color: white;
}

#footer {
  border-top: 1px solid rgba(var(--color-gray-400), 1);
  background-color: rgba(var(--color-gray-100), 1);
  font-size: 0.85rem;
  color: rgba(var(--color-gray-600), 1);
  font-family: var(--sans-serif-font);
  display: flex;
}
#footer .item {
  padding: 0 0.5rem;
  margin: 0.5rem 0;
}
#footer .item:first-child {
  padding-left: 0;
}
#footer .item + .item {
  border-left: 1px solid rgba(var(--color-gray-500), 1);
}
#footer a {
  text-decoration: none;
}

ul.recent-post-list {
  list-style-type: none;
  display: flex;
  flex-direction: column;
  margin-top: 0.5em;
}
ul.recent-post-list li {
  border-top: 1px solid rgba(var(--color-gray-400), 1);
}
ul.recent-post-list li a {
  padding: 0.5em 1em;
  display: block;
  text-decoration: none;
  transition: all 0.25s;
}
ul.recent-post-list li a:hover {
  background-color: rgba(var(--color-gray-100), 1);
  box-shadow: inset 0 0 0.25em 0.25em rgba(var(--color-gray-200), 1);
}
ul.recent-post-list li a .metadata {
  color: black;
  font-size: 0.85em;
}
ul.recent-post-list li:first-child {
  border-top: none;
}

ul.card-list {
  list-style-type: none;
  display: grid;
  margin: 0;
  padding: 0;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 1rem;
}
ul.card-list li {
  margin: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background: linear-gradient(45deg, rgb(255, 255, 255), rgb(248, 248, 248));
  box-shadow: 0 0.1rem 0.2rem rgba(var(--color-gray-400), 1), 0 0.25rem 1rem rgba(var(--color-gray-300), 1);
}
ul.card-list li img.preview {
  max-width: 100%;
}
ul.card-list li .content {
  flex-grow: 2;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 0.5rem;
}
ul.card-list li .content a {
  text-decoration: none;
}
ul.card-list li .metadata {
  margin-top: 0.5rem;
  padding-top: 0.5rem;
  border-top: 1px solid rgba(var(--color-gray-300), 1);
  font-family: var(--sans-serif-font);
  font-size: 1rem;
  color: rgba(var(--color-gray-800), 1);
  font-weight: light;
}
ul.card-list li:hover {
  box-shadow: 0 0.15rem 0.25rem rgba(var(--color-gray-500), 1), 0 0.5rem 1.5rem rgba(var(--color-gray-200), 1);
}

#container article a.hero-button, #container .frontpage .block a.hero-button, ul.link-list a {
  font-family: var(--sans-serif-font);
  display: block;
  border: 0.15em solid rgba(var(--color-primary), 1);
  text-decoration: none;
  padding: 0.5em;
  background-color: rgba(var(--color-primary), 1);
  color: white;
  line-height: 100%;
  transition: all 0.25s;
}
#container article a.hero-button::after, #container .frontpage .block a.hero-button::after, ul.link-list a::after {
  content: "➔";
  float: right;
  transition: all 0.5s;
  margin-right: 0.25em;
}
#container article a.hero-button:hover, #container .frontpage .block a.hero-button:hover, ul.link-list a:hover {
  background-color: white;
  box-shadow: inset 0 0 0.25em 0.25em rgba(var(--color-gray-200), 1);
  color: rgba(var(--color-secondary), 1);
}
#container article a.hero-button:hover::after, #container .frontpage .block a.hero-button:hover::after, ul.link-list a:hover::after {
  margin-right: 0;
}

ul.link-list {
  list-style-type: none;
  padding: 0;
  margin: 0.5em 0;
}
ul.link-list li + li {
  margin-top: 0.5em;
}
#container #content {
  padding-bottom: 1rem;
}
#container.sidebar {
  display: grid;
  grid-template-areas: "content sidebar";
  grid-template-columns: 75% 25%;
}
#container.sidebar #sidebar {
  padding-left: 1em;
  padding-bottom: 1em;
  margin-left: 1em;
  border-left: 1px solid rgba(var(--color-gray-200), 1);
  grid-area: sidebar;
}
#container.sidebar #sidebar div.sticky {
  top: 4rem;
  position: sticky;
}
#container.sidebar #sidebar ul.recent-post-list {
  padding: 0 1em;
  margin-left: -2em;
  margin-right: calc(-2em + 2px);
}
#container h1, #container h2, #container h3, #container h4, #container h5, #container h6 {
  margin: 0;
  font-family: var(--sans-serif-font);
  line-height: 125%;
}
#container h1 {
  font-size: 150%;
  color: rgba(var(--color-primary), 1);
}
#container h2 {
  font-size: 125%;
  font-weight: 500;
}
#container h3 {
  margin-top: 1.5rem;
  margin-bottom: 0.5rem;
  font-size: 110%;
  font-weight: 500;
}
#container .frontpage {
  display: grid;
  grid-template-areas: "blog consulting" "blog research" "blog links";
  grid-gap: 1em;
}
#container .frontpage .block {
  display: grid;
  border-radius: 0.25rem;
  overflow: hidden;
  box-shadow: 0 0.15rem 0.25rem rgba(var(--color-gray-500), 1), 0 0.5rem 1.5rem rgba(var(--color-gray-200), 1);
  grid-template-areas: "header content";
  grid-template-columns: 33% 67%;
}
#container .frontpage .block .header {
  background-color: rgba(var(--color-gray-200), 1);
  grid-area: header;
}
#container .frontpage .block .header, #container .frontpage .block .main {
  padding: 1em;
}
#container .frontpage .block .main {
  border-left: 1px solid rgba(var(--color-gray-300), 1);
  grid-area: content;
}
#container .frontpage .block .main ul.recent-post-list {
  padding: 0 1em;
  margin: 0.5em -2em 0;
}
#container .frontpage .block .main .grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-column-gap: 1em;
}
#container .frontpage .block .main .grid-2 .col-0 {
  grid-column: 1/2;
}
#container .frontpage .block .main .grid-2 .col-1 {
  grid-column: 2/3;
}
#container .frontpage .block .header, #container .frontpage .block .header h1 {
  color: white;
  text-shadow: 1px 1px 4px rgba(var(--color-gray-900), 1);
}
#container .frontpage .block.blog {
  grid-area: blog;
}
#container .frontpage .block.blog .main {
  padding-bottom: 0;
}
#container .frontpage .block.blog .header {
  background-color: rgba(var(--color-blue-300), 1);
}
#container .frontpage .block.consulting {
  grid-area: consulting;
}
#container .frontpage .block.consulting .header {
  background-color: rgba(var(--color-orange-300), 1);
}
#container .frontpage .block.research {
  grid-area: research;
}
#container .frontpage .block.research .header {
  background-color: rgba(var(--color-green-300), 1);
}
#container .frontpage .block.consulting .main, #container .frontpage .block.research .main {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
#container .frontpage .block.links {
  grid-area: links;
}
#container .frontpage .block.links .header {
  background-color: rgba(var(--color-gray-400), 1);
}
@media (prefers-reduced-motion: no-preference) {
  #container .frontpage .block {
    transition: all 250ms;
  }
  #container .frontpage .block:hover {
    box-shadow: 0 0.25em 0.75em rgba(var(--color-gray-600), 1);
    box-shadow: 0 0.5em 1em rgba(var(--color-gray-500), 1);
  }
}
#container .frontpage p {
  margin-bottom: 0.5em;
  padding-bottom: 0;
}
#container .frontpage p:first-child {
  margin-top: 0;
}
#container article h2 {
  margin-top: 1rem;
}
#container article p {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}
#container article .metadata {
  font-family: var(--sans-serif-font);
  display: flex;
  font-size: 80%;
  color: rgba(var(--color-gray-500), 1);
  border-bottom: 1px solid rgba(var(--color-gray-200), 1);
  padding-bottom: 0.5rem;
}
#container article .metadata > div {
  border-left: 1px solid rgba(var(--color-gray-300), 1);
  padding-left: 0.25em;
  margin-left: 0.25em;
}
#container article .metadata > div:first-child {
  border-left: none;
  padding-left: 0;
  margin-left: 0;
}
#container article .metadata a {
  color: rgba(var(--color-gray-500), 1);
  text-decoration: none;
}
#container article .metadata a:hover {
  text-decoration: underline;
}
#container article .metadata p {
  margin: 0;
}
#container article .metadata .divider {
  padding: 0 0.25rem;
}
#container article .metadata ul.tags {
  list-style-type: none;
  display: flex;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
}
#container article .metadata ul.tags li::after {
  content: ",";
  margin-right: 0.25em;
}
#container article .metadata ul.tags li:last-child::after {
  content: "";
  margin-right: 0;
}
#container article .metadata ul.tags li a {
  text-decoration: none;
}
#container article .metadata ul.tags li a:hover {
  color: rgba(var(--color-secondary), 1);
}
#container article .metadata ul.tags::before {
  content: "tagged: ";
  padding-right: 0.25em;
}
#container article blockquote {
  border-left: 0.75rem solid rgba(var(--color-gray-300), 1);
  margin-left: 0;
  padding-left: 1rem;
}
#container article div.code {
  margin: 0.5rem calc(-1 * var(--content-offset));
  padding-left: var(--content-offset);
  width: calc(100% + var(--content-offset) + 0.25rem);
  border-top: 1px solid rgba(var(--color-gray-300), 1);
  border-bottom: 1px solid rgba(var(--color-gray-300), 1);
}
#container article div.code pre {
  background-color: rgba(var(--color-gray-100), 1);
  overflow: auto;
  padding: 0;
  margin: 0.25rem 0;
}
#container article table {
  border-collapse: collapse;
}
#container article div.admonition {
  padding: 0;
  box-shadow: inset 0 0 4px rgba(var(--color-gray-400), 1);
  margin-bottom: 0.5rem;
}
#container article div.admonition p {
  padding: 0.5rem;
  margin: 0;
}
#container article div.admonition.series {
  background-color: rgba(var(--color-gray-100), 1);
}
#container article div.admonition.series ul {
  margin: 0;
  padding-bottom: 1rem;
  list-style-type: none;
  overflow-y: auto;
  max-height: 8rem;
}
#container article div.admonition.series ul li:not(.active) {
  list-style: circle;
}
#container article div.admonition.series ul li.active {
  font-weight: bold;
  list-style: disc;
}
#container article div.admonition.note {
  background-color: rgba(var(--color-gray-200), 1);
  border: none;
}
#container article .admonition-title {
  font-family: var(--sans-serif-font);
}
#container article div.note .admonition-title,
#container article div.warning .admonition-title {
  color: white;
  margin: 0;
  padding: 0.25rem;
  padding-left: 0.5rem;
}
#container article div.note .admonition-title {
  background-color: rgba(var(--color-blue-400), 1);
}
#container article div.admonition.warning {
  background-color: rgba(var(--color-red-300), 0.05);
  border: none;
}
#container article div.warning .admonition-title {
  background-color: rgba(var(--color-red-400), 1);
}
#container article header h1 + div.admonition {
  margin-top: 0.5em;
}
#container article pre,
#container article code,
#container article kbd,
#container article samp,
#container article tt,
#container article div.code {
  font-family: var(--code-font);
}
#container article tt {
  word-wrap: break-word;
}
#container article img.inline {
  float: left;
  margin: 0.25em 0.5em 0;
}
#container article aside {
  font-family: var(--sans-serif-font);
  border-top: 1px solid rgba(var(--color-gray-200), 1);
}
#container article aside .pagination {
  display: grid;
  grid-template-columns: 1fr 2fr 1fr;
  grid-template-areas: "left padding right";
  margin: 0;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  padding: 0;
  text-align: center;
}
#container article aside .pagination a {
  display: block;
  text-decoration: none;
  padding: 0.25rem;
  transition: all 250ms;
  background-color: rgba(var(--color-gray-100), 1);
}
#container article aside .pagination a:hover {
  box-shadow: 0 0.1rem 0.2rem rgba(var(--color-gray-400), 1), 0 0.25rem 1rem rgba(var(--color-gray-300), 1);
}
#container article aside .pagination a:hover {
  background-color: rgba(var(--color-gray-200), 1);
}
#container article aside .pagination a .title {
  color: black;
}
#container article aside .pagination .previous {
  grid-area: left;
}
#container article aside .pagination .next {
  grid-area: right;
}

#header #nav-toggle {
  cursor: pointer;
  border: none;
  background: none;
  display: none;
  color: white;
  line-height: 3rem;
  font-size: 1.5rem;
  width: 3rem;
  padding: 0;
}
#header #nav-toggle:hover, #header #nav-toggle {
  text-decoration: none;
}
#header #nav-toggle:hover {
  text-shadow: 0 0 2px white;
}

nav#menu {
  display: flex;
  cursor: pointer;
  width: 100%;
}
nav#menu ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: row;
}
nav#menu ul li {
  font-weight: 400;
  color: #eee;
  text-align: center;
  position: relative;
  flex: 1;
}
nav#menu ul li ul {
  display: none;
  position: absolute;
  left: 0;
  box-shadow: 0.25em 0.25em 0.5em rgba(var(--color-gray-500), 1);
  min-width: 384px;
  font-size: 80%;
}
nav#menu ul li ul li {
  background-color: rgba(var(--color-gray-200), 1);
  border: none;
  border-bottom: 1px solid rgba(var(--color-gray-300), 1);
  padding: 0;
}
nav#menu ul li ul li a {
  color: #000;
  display: block;
  padding: 0.5rem;
  text-align: left;
  line-height: initial;
}
nav#menu ul li ul li a:hover {
  color: rgba(var(--color-secondary), 1);
  background-color: white;
  box-shadow: inset 0 0 0.25em 0.25em rgba(var(--color-gray-100), 1);
}
nav#menu ul li ul li:hover {
  background-color: rgba(var(--color-gray-200), 1);
}
nav#menu ul li:hover, nav#menu ul li[aria-expanded=true] {
  background-color: rgba(var(--color-primary-darker), 1);
  transition-duration: 250ms;
  transition-property: all;
}
nav#menu ul li[aria-expanded=true] ul {
  display: block;
}
nav#menu ul li a {
  text-decoration: none;
  color: white;
  line-height: 3rem;
  display: block;
  padding: 0 1rem;
}
nav#menu ul li.active {
  font-weight: bold;
}

@media only screen and (max-width: 614.4px) {
  #header .content {
    justify-content: space-between;
    flex-wrap: wrap;
  }
  #header .content #brand {
    order: 1;
  }
  #header .content nav#menu {
    order: 3;
    width: 100%;
    display: none;
  }
  #header .content nav#menu.expanded {
    display: unset;
  }
  #header .content nav#menu ul {
    width: 100%;
    flex-direction: column;
  }
  #header .content nav#menu ul li {
    border-top: 1px solid rgba(0, 0, 0, 0.15);
  }
  #header .content nav#menu ul li:hover ul {
    display: none;
  }
  #header .content #nav-toggle {
    order: 2;
    display: block;
  }
  ul.card-list {
    grid-template-columns: 1fr;
  }
  ul.card-list li {
    flex-direction: row;
  }
  ul.card-list li img.preview {
    max-width: 33%;
    object-fit: cover;
  }
}
@media only screen and (max-width: 768px) {
  #container, #footer {
    border: none;
  }
  #container .frontpage .block {
    grid-template-areas: "header" "content";
    grid-template-columns: 1fr;
  }
}
@media only screen and (max-width: 1040px) {
  #container, #footer {
    max-width: 768px;
  }
  #container.sidebar {
    display: block;
  }
  #container.sidebar #content {
    padding-right: 0;
  }
  #container.sidebar #content div.code {
    width: calc(100% + var(--content-offset));
  }
  #container.sidebar #sidebar {
    border: none;
    border-top: 1px solid rgba(var(--color-gray-400), 1);
    padding-top: 1em;
    padding-left: 0;
    margin-left: 0;
  }
  #container.sidebar #sidebar ul.recent-post-list {
    margin-left: -2rem;
    padding-left: 1rem;
    padding-right: 0;
    margin-right: -1rem;
  }
  #container .frontpage {
    grid-template-areas: "blog" "consulting" "research" "links";
  }
  #footer {
    flex-direction: column;
  }
  #footer .item + .item, #footer .item {
    border: unset;
    padding: unset;
  }
}
.table-wrapper {
  overflow-x: auto;
}

*[data-print-only=yes] {
  display: none;
}

@media print {
  body {
    background-color: unset;
  }
  #container.sidebar {
    display: grid;
    grid-template-areas: "content";
    grid-template-columns: 100%;
  }
  #content {
    padding-top: 2rem;
  }
  #sidebar, #container article aside .pagination {
    display: none;
  }
  .print-footnote-link {
    font-weight: 600;
  }
  #print-footnotes ul {
    list-style-type: none;
    padding: 0;
  }
  #print-footnotes ul li {
    padding-left: 0.25rem;
  }
  #print-footnotes ul li .id {
    font-weight: bold;
  }
  #print-footnotes ul li .link {
    font-family: var(--code-font);
  }
  #header {
    position: unset;
    top: unset;
    width: unset;
  }
  *[data-print-only=yes] {
    display: unset;
  }
}
