html, body {
  padding: 1em;
  max-width: min(80ch, 100% - 4rem);
  margin-inline: auto;
  margin-left: auto;
  margin-right: auto;
  font-family: sans-serif;
  background-color: #f2e3f5;
}

body {
  min-height: 80vh;
  position: relative;
  margin: 0;
  font-family: system-ui;
  font-size: 1.15rem;
  line-height: 1.4;
}

#content {
  padding: 10px;
  background-clip: content-box;
  padding-bottom: 80px;
}

nav {
  background-color: #e3bfe8;
  padding: 20px;
  font-size: 24px; 
}

.nav-list {
  padding: 0px;
  list-style-type: none;
}

.list-item {
  list-style: none;
  border: 1px solid black;
  border-radius: 10px;
  margin: 0px 0px 10px 0px;
  padding: 0 5px;
}

.top-image {
  text-align: center;
  display: inline-block;
  position: relative;
  line-height: 0px;
}

.top-image-caption {
  color: #3b3b3b;
  border-top: 0;
}

code {
  background: #f4f4f4;
  border: 1px solid #ddd;
  padding-left: 4px;
  padding-right: 4px;
  font-family: monospace;
}

.single-tag {
  background: #acacac;
  color: #000000;
  border: 4px solid #acacac;
  border-radius: 10%;
  text-decoration: none;
}

.tag-icon {
  width: 1em;
  height: 1em;
  margin-bottom: -0.15em;
  margin-right: -0.15em;
}

.footer {
  color: #3b3b3b;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  text-align: center;
  margin: auto;
}

/* Add a scroll bar to code blocks if necessary */
div.highlight pre {
  overflow-x: auto;
  overflow-y: clip;
}

/* Code block formatting */
/* Generated using: hugo gen chromastyles --style=vs */
/* Background */ .highlight .bg { background-color:#fff; }
/* PreWrapper */ .highlight .chroma { background-color:#fff; }
/* LineLink */ .highlight .chroma .lnlinks { outline:none;text-decoration:none;color:inherit }
/* LineTableTD */ .highlight .chroma .lntd { vertical-align:top;padding:0;margin:0;border:0; }
/* LineTable */ .highlight .chroma .lntable { border-spacing:0;padding:0;margin:0;border:0; }
/* LineHighlight */ .highlight .chroma .hl { background-color:#e5e5e5 }
/* LineNumbersTable */ .highlight .chroma .lnt { white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f }
/* LineNumbers */ .highlight .chroma .ln { white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f }
/* Line */ .highlight .chroma .line { display:flex; }
/* Keyword */ .highlight .chroma .k { color:#00f }
/* KeywordConstant */ .highlight .chroma .kc { color:#00f }
/* KeywordDeclaration */ .highlight .chroma .kd { color:#00f }
/* KeywordNamespace */ .highlight .chroma .kn { color:#00f }
/* KeywordPseudo */ .highlight .chroma .kp { color:#00f }
/* KeywordReserved */ .highlight .chroma .kr { color:#00f }
/* KeywordType */ .highlight .chroma .kt { color:#2b91af }
/* NameClass */ .highlight .chroma .nc { color:#2b91af }
/* LiteralString */ .highlight .chroma .s { color:#a31515 }
/* LiteralStringAffix */ .highlight .chroma .sa { color:#a31515 }
/* LiteralStringBacktick */ .highlight .chroma .sb { color:#a31515 }
/* LiteralStringChar */ .highlight .chroma .sc { color:#a31515 }
/* LiteralStringDelimiter */ .highlight .chroma .dl { color:#a31515 }
/* LiteralStringDoc */ .highlight .chroma .sd { color:#a31515 }
/* LiteralStringDouble */ .highlight .chroma .s2 { color:#a31515 }
/* LiteralStringEscape */ .highlight .chroma .se { color:#a31515 }
/* LiteralStringHeredoc */ .highlight .chroma .sh { color:#a31515 }
/* LiteralStringInterpol */ .highlight .chroma .si { color:#a31515 }
/* LiteralStringOther */ .highlight .chroma .sx { color:#a31515 }
/* LiteralStringRegex */ .highlight .chroma .sr { color:#a31515 }
/* LiteralStringSingle */ .highlight .chroma .s1 { color:#a31515 }
/* LiteralStringSymbol */ .highlight .chroma .ss { color:#a31515 }
/* OperatorWord */ .highlight .chroma .ow { color:#00f }
/* Comment */ .highlight .chroma .c { color:#008000 }
/* CommentHashbang */ .highlight .chroma .ch { color:#008000 }
/* CommentMultiline */ .highlight .chroma .cm { color:#008000 }
/* CommentSingle */ .highlight .chroma .c1 { color:#008000 }
/* CommentSpecial */ .highlight .chroma .cs { color:#008000 }
/* CommentPreproc */ .highlight .chroma .cp { color:#00f }
/* CommentPreprocFile */ .highlight .chroma .cpf { color:#00f }
/* GenericEmph */ .highlight .chroma .ge { font-style:italic }
/* GenericHeading */ .highlight .chroma .gh { font-weight:bold }
/* GenericPrompt */ .highlight .chroma .gp { font-weight:bold }
/* GenericStrong */ .highlight .chroma .gs { font-weight:bold }
/* GenericSubheading */ .highlight .chroma .gu { font-weight:bold }