:root {
  --waline-font-size: 16px;
  --waline-white: #fff;
  --waline-light-grey: #999;
  --waline-dark-grey: #666;
  --waline-theme-color: #27ae60;
  --waline-active-color: #2ecc71;
  --waline-text-color: #444;
  --waline-bgcolor: #fff;
  --waline-bgcolor-light: #f8f8f8;
  --waline-bgcolor-hover: #f0f0f0;
  --waline-border-color: #ddd;
  --waline-disable-bgcolor: #f8f8f8;
  --waline-disable-color: #000;
  --waline-code-bgcolor: #282c34;
  --waline-bq-color: #f0f0f0;
  --waline-avatar-size: 3.25rem;
  --waline-mobile-avatar-size: calc(var(--waline-avatar-size) * 9 / 13);
  --waline-badge-color: #3498db;
  --waline-badge-font-size: 0.775em;
  --waline-info-bgcolor: #f8f8f8;
  --waline-info-color: #999;
  --waline-info-font-size: 0.625em;
  --waline-border: 1px solid var(--waline-border-color);
  --waline-avatar-radius: 50%;
  --waline-box-shadow: none;
}
/* libre-franklin-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Libre Franklin';
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/libre-franklin-v13-latin-regular.woff2") format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* libre-franklin-italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Libre Franklin';
  font-style: italic;
  font-weight: 400;
  src: url("../fonts/libre-franklin-v13-latin-italic.woff2") format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* libre-franklin-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Libre Franklin';
  font-style: normal;
  font-weight: 800;
  src: url("../fonts/libre-franklin-v13-latin-800.woff2") format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* libre-franklin-800italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Libre Franklin';
  font-style: italic;
  font-weight: 800;
  src: url("../fonts/libre-franklin-v13-latin-800italic.woff2") format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
body {
  font-family: 'Libre Franklin', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  font-size: 120%;
  margin: 0;
  padding: 0;
  font-size: 100%;
  line-height: 1.5;
  min-height: 100vh;
}
a {
  text-decoration: underline;
  color: #444;
}
a:hover {
  text-decoration: underline;
  transition: 1s;
  color: #111;
}
body p {
  -webkit-font-smoothing: antialiased;
}
body h1,
body h2,
body h3 {
  line-height: 1.2;
}
p {
  display: block;
  margin-block-start: 1em;
  margin-block-end: 1em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
}
.container {
  max-width: 50em;
  margin: 0 auto;
}
img,
article,
figure,
pre,
video,
iframe {
  max-width: 50em;
}
.footer {
  text-align: center;
  color: #bababa;
}
.container .highlight {
  overflow-x: auto;
  overflow-y: hidden;
  background-color: var(--body-bg);
  border-radius: 15px;
  max-width: calc(800px - 16px * 2);
}
figure {
  display: block;
  margin-block-start: 1em;
  margin-block-end: 1em;
  margin-inline-start: 40px;
  margin-inline-end: 40px;
}
.page-nav {
  text-align: center;
}
.page-nav>a {
  margin-right: 0.5em;
  margin-left: 0.5em;
}
.header {
  display: block;
  text-align: center;
  text-align: center;
  max-width: 50em;
  margin: 3em auto 4em;
}
.header .blog-title h1 a {
  text-decoration: none;
}
.header .blog-title h1 a:hover {
  text-decoration: underline;
}
.header .description {
  color: #444;
  font-size: 1.1em;
  margin-top: 0.2em;
  line-height: 1.5;
}
.header .navbar {
  line-height: 2.4em;
  display: block;
  margin: 1em 0;
}
.header .menu {
  margin: 0;
  padding: 0;
}
.header .menu .first-child {
  margin: 0;
  color: #111 !important;
}
.header .menu .menu-item {
  display: inline;
  line-height: 2.4em;
}
.header .menu .menu-item-link {
  color: #767676;
  margin: 0 0 0 1em;
  text-decoration: none;
}
.header .menu .menu-item-link:hover {
  color: #111;
}
.post {
  margin: 1em auto;
  padding: 30px 50px;
}
.posts .post:first-child {
  margin-top: 0;
}
.posts .post-title {
  font-size: 1.5em;
}
.posts .post-title::before {
  content: '#';
  color: #bababa;
}
.posts .post-title:hover::before {
  color: #111;
}
.posts .post-title .post-title-link {
  color: #111;
  text-decoration: none;
}
.posts .post-content a {
  color: #111;
  text-decoration: none;
}
.post-time {
  color: #bababa;
}
blockquote {
  border-left: 4px solid #ddd;
  color: var(--blockquote-color);
  margin: 0;
  padding: 0 15px;
  display: block;
  margin-block-start: 1em;
  margin-block-end: 1em;
  margin-inline-start: 40px;
  margin-inline-end: 40px;
}
article.post .post-content img {
  max-width: 20em;
}
