@font-face {
  font-family: "Noto Serif";
  src: url("../../fonts/notoserif.ttf");
}

:root {
  --main-bg-color: #fcfbf5;
  --secondary-bg-color: #f5efe6;
  --main-fg-color: #504136;
  --main-border-color: #362100;
  --main-text-color: #160d08;
}

html {
  font-family: "Noto Serif", "serif";
  scrollbar-color: var(--main-bg-color) #00000000;
}

body {
  background-color: var(--secondary-bg-color);
}

main {
  background-color: var(--main-bg-color);
  color: var(--main-text-color);
}

main a {
  color: var(--main-fg-color);
}

a:focus,
a:hover {
  opacity: 50%;
}

a:active {
  opacity: 100%;
  color: var(--main-text-color);
}

nav,
main,
footer {
  border: 4px solid var(--main-border-color);
}

nav,
main {
  border-bottom: none;
}

nav,
footer {
  background-color: var(--main-fg-color);
  color: var(--main-bg-color);
}

nav a,
footer a {
  color: var(--main-bg-color);
}

blockquote {
  margin-left: 0;
  padding-left: 1.5rem;
  border-left: 3px solid var(--secondary-bg-color);
}

code {
  background-color: var(--main-fg-color);
  color: var(--main-bg-color);
  padding: 0.1rem;
}

pre:has(code) {
  background-color: var(--main-fg-color);
  color: var(--main-bg-color);
}

#pagination {
  background-color: var(--main-bg-color);
  color: var(--main-text-color);
}

#pagination a {
  color: var(--main-fg-color);
}

.lastupdate::after {
  content: " ◉ ";
}

.commentbox,
#disqus_thread {
  border-left: 4px ridge var(--main-border-color);
  border-right: 4px ridge var(--main-border-color);
  background-color: var(--main-bg-color);
}