body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  margin: auto;
  line-height: 1.5;
  background-color: #f7fafc;
  font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
}
code { font-family: Consolas, 'Cascadia Code', 'Fira Code', 'Courier New', monospace; background-color: #d9f0ef; }
a { text-decoration: none; }
a:hover { filter: brightness(40%); }

.container { display: flex;  flex: 1; }
.sidebar, .main-content, footer {padding: 20px;  box-sizing: border-box;}
.sidebar { width: 25%; height: 100vh; }
.main-content { flex: 1; max-width: 50%; margin-left: 27%;}
.sidebar, .right-sidebar, footer { position: fixed; }
.right-sidebar { margin-left: 77%; padding: 50px; height: 90vh; overflow-y: auto;}
.site-title, h1, h2, h3, h4, h5, h6, .description { color: #00513a; }
.site-title { font-size: 2.5em; margin-top: 0px; text-align: right; }
.description, h1 { margin: 0; }
.post-info, .post-date, .menu a, a, strong { color: #01865f; }
.menu { list-style-type: none; text-align: right; font-size: 1.3em; }
.menu li { margin-bottom: 15px; }
.post-list { list-style-type: none; padding: 0; }
.post-title-line, .post-meta-line { display: flex; justify-content: space-between; }
.post-title-line a { font-size: 1.3em; }
.post-meta-line { font-size: 0.9em; }
.pagination { display: flex; justify-content: center; list-style-type: none; }
.pagination li { padding: 0px 15px; }
.pagination .active { font-weight: 900; }
.terms { list-style-type: none; padding: 0; font-size: 1.1em; }
.terms li { margin-bottom: 0.5em; }
.mermaid { display: block; max-width: 100%; margin: auto; text-align: center; }
.pin-icon { width: 0.7em; height: 0.7em; margin-left: 10px; fill: #01865f; transform: rotate(45deg);}
pre {
  border: 1px solid #017955;
  padding: 1em;
  overflow-x: auto;
  background-color: #d9f0ef;
  white-space: pre-wrap;
  word-wrap: break-word;
}
img, iframe, video { max-width: 100%; }
blockquote { background: #f9f9f9; border-left: 5px solid #017955; }
::-webkit-scrollbar { display: none; }
table { margin: auto; border-collapse: collapse; }
table, th, td { border: 1px solid #666; }
table thead th { background-color: #f2f2f2; border-bottom: 2px solid #017955; }
th, td { padding: 5px; }
footer { bottom: 0; left: 0; width: 25%; color: gray; text-align: right;}
.pagefind-ui {
  --pagefind-ui-scale: 0.8;
  --pagefind-ui-background: #f7fafc;
  --pagefind-ui-tag: #f7fafc;
  --pagefind-ui-border-radius: 20px;
}
.taxonomy-mobile { display: none; }
@media only screen and (max-width: 1000px){
  .container { flex-direction: column; }
  .site-title { font-size: 2em; margin: 0; text-align: center; }
  .menu li { flex: 1; margin: 5px; padding: 5px; text-align: center; border-radius: 15px; border-bottom: 3px solid #017955; }
  .menu { display: flex; padding: 0; margin: 0; font-size: 1.1em; }
  .menu li a { color: #01865f; }
  .pagefind-ui { --pagefind-ui-scale: 0.7; }
  .post-title-line a { font-size: 1em; order: 0;}
  .post-title-line { display: flex; flex-direction: column; }
  .post-list { display: flex; flex-direction: column; }
  .post-date { order: 1; font-size: 0.8em; color: #666; }
  .sidebar { width: 100%; height: auto; position: static; padding-bottom: 0px;}
  .right-sidebar, .post-meta-line { display: none; }
  .taxonomy-mobile { display: block; padding: 5px;   text-align: right;}
  .main-content { min-width: 100%;  margin-left: 0; }
  footer { position: static; width: 100%; text-align: center; }
}