@font-face {
  font-family: "Open Sans";
  font-style: italic;
  font-weight: 300;
  font-stretch: normal;
  font-display: swap;
  src: url(OpenSans-Italic-VariableFont_wdth,wght.ttf) format("truetype");
}
@font-face {
  font-family: "Open Sans";
  font-style: italic;
  font-weight: 400;
  font-stretch: normal;
  font-display: swap;
  src: url(OpenSans-Italic-VariableFont_wdth,wght.ttf) format("truetype");
}
@font-face {
  font-family: "Open Sans";
  font-style: italic;
  font-weight: 500;
  font-stretch: normal;
  font-display: swap;
  src: url(OpenSans-Italic-VariableFont_wdth,wght.ttf) format("truetype");
}
@font-face {
  font-family: "Open Sans";
  font-style: italic;
  font-weight: 600;
  font-stretch: normal;
  font-display: swap;
  src: url(OpenSans-Italic-VariableFont_wdth,wght.ttf) format("truetype");
}
@font-face {
  font-family: "Open Sans";
  font-style: italic;
  font-weight: 700;
  font-stretch: normal;
  font-display: swap;
  src: url(OpenSans-Italic-VariableFont_wdth,wght.ttf) format("truetype");
}
@font-face {
  font-family: "Open Sans";
  font-style: italic;
  font-weight: 800;
  font-stretch: normal;
  font-display: swap;
  src: url(OpenSans-Italic-VariableFont_wdth,wght.ttf) format("truetype");
}
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 300;
  font-stretch: normal;
  font-display: swap;
  src: url(OpenSans-VariableFont_wdth,wght.ttf) format("truetype");
}
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  font-stretch: normal;
  font-display: swap;
  src: url(OpenSans-VariableFont_wdth,wght.ttf) format("truetype");
}
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 500;
  font-stretch: normal;
  font-display: swap;
  src: url(OpenSans-VariableFont_wdth,wght.ttf) format("truetype");
}
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 600;
  font-stretch: normal;
  font-display: swap;
  src: url(OpenSans-VariableFont_wdth,wght.ttf) format("truetype");
}
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 700;
  font-stretch: normal;
  font-display: swap;
  src: url(OpenSans-VariableFont_wdth,wght.ttf) format("truetype");
}
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 800;
  font-stretch: normal;
  font-display: swap;
  src: url(OpenSans-VariableFont_wdth,wght.ttf) format("truetype");
}
.logos--bluesky::after {
  display: inline-block;
  width: 1.2em;
  height: 1.2em;
  vertical-align: -0.125em;
  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ae88e7' d='M12 10.8c-1.087-2.114-4.046-6.053-6.798-7.995C2.566.944 1.561 1.266.902 1.565C.139 1.908 0 3.08 0 3.768c0 .69.378 5.65.624 6.479c.815 2.736 3.713 3.66 6.383 3.364q.204-.03.415-.056q-.207.033-.415.056c-3.912.58-7.387 2.005-2.83 7.078c5.013 5.19 6.87-1.113 7.823-4.308c.953 3.195 2.05 9.271 7.733 4.308c4.267-4.308 1.172-6.498-2.74-7.078a9 9 0 0 1-.415-.056q.21.026.415.056c2.67.297 5.568-.628 6.383-3.364c.246-.828.624-5.79.624-6.478c0-.69-.139-1.861-.902-2.206c-.659-.298-1.664-.62-4.3 1.24C16.046 4.748 13.087 8.687 12 10.8'/%3E%3C/svg%3E");
}

.logos--mastodon::after {
  display: inline-block;
  width: 1.2em;
  height: 1.2em;
  vertical-align: -0.125em;
  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ae88e7' fill-rule='evenodd' d='M11 23c-4.354 0-9.5-.58-9.5-12.5C1.5.994 6.772.997 11.739 1H12c6.543 0 10.285.407 10.285 9.5c0 7.567-6.48 7.564-9.635 7.563h-.126c-1.273 0-2.532-.208-3.52-.371c-.637-.105-1.162-.192-1.504-.192c0 3.291 4.31 3.505 8.5 2.5v2c-.15.062-.288.134-.433.21c-.671.35-1.513.79-4.567.79M7.5 8.25a1.75 1.75 0 0 1 3.5 0v3.25h2V8.25a1.75 1.75 0 0 1 3.5 0V14h2V8.25A3.75 3.75 0 0 0 12 5.7a3.75 3.75 0 0 0-6.5 2.55V14h2z' clip-rule='evenodd'/%3E%3C/svg%3E");
}

.tag--rust {
  background-color: #5e2f00;
  border-color: #EB7500;
}

html {
  background-color: #471c87;
  font-family: "Open Sans", serif;
}

a {
  color: #ae88e7;
}
a :active, a :visited {
  color: inherit;
}

.separator {
  border: 1px solid #5a5a5a;
}

body {
  background-color: #090c08;
  color: #f6f8ff;
  margin: 0 auto;
  max-width: 1000px;
  width: 75%;
  min-width: 500px;
  min-height: 100vh;
  box-shadow: 0 0 5px 10px rgba(9, 12, 8, 0.4);
  padding: 20px;
  box-sizing: border-box;
}

main {
  margin: 0 10px;
}

header .titlebar {
  margin: 0 10px 20px 10px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: end;
}
header .titlebar * {
  margin: 0;
}
header .titlebar img {
  height: 60px;
  width: 60px;
  border-radius: 50%;
}
header nav {
  display: flex;
  flex-direction: row;
  justify-content: start;
  align-items: center;
  margin: 10px 0;
}
header nav a {
  margin: 0 20px;
  text-decoration: none;
}
header nav .socials {
  margin-left: auto;
  margin-right: 20px;
}
header nav .socials a {
  margin: 0;
}

footer {
  margin: 10px;
}
footer .copyright {
  text-align: right;
  color: #5a5a5a;
}

.paginator {
  height: 100%;
}
.paginator .content {
  display: flex;
  flex-direction: column;
  align-items: start;
  margin: 10px;
}
.paginator .footer {
  display: block;
  margin: 10px;
}
.paginator .footer .current {
  margin: auto;
  text-align: center;
  color: #7d7d7d;
}
.paginator .footer .previous {
  float: left;
  color: #ae88e7;
}
.paginator .footer .previous::after {
  display: inline-block;
  width: 1.2em;
  height: 1.2em;
  vertical-align: -0.125em;
  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ae88e7' d='M11.03 8.53a.75.75 0 1 0-1.06-1.06l-4 4a.75.75 0 0 0 0 1.06l4 4a.75.75 0 1 0 1.06-1.06l-2.72-2.72H18a.75.75 0 0 0 0-1.5H8.31z'/%3E%3C/svg%3E");
}
.paginator .footer .next {
  float: r right;
  color: #ae88e7;
}
.paginator .footer .next::after {
  display: inline-block;
  width: 1.2em;
  height: 1.2em;
  vertical-align: -0.125em;
  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ae88e7' d='M13.47 8.53a.75.75 0 0 1 1.06-1.06l4 4a.75.75 0 0 1 0 1.06l-4 4a.75.75 0 1 1-1.06-1.06l2.72-2.72H6.5a.75.75 0 0 1 0-1.5h9.69z'/%3E%3C/svg%3E");
}

.post {
  margin-top: 10px;
  width: 100%;
  border-radius: 0.5lh;
  padding: 0.7lh;
  border: 2px solid #5a5a5a;
  box-sizing: border-box;
  transition: all 0.4s cubic-bezier(0.33, 1, 0.68, 1);
}
.post .header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.post .header h2 {
  margin: 0;
}
.post .header .tags {
  font-size: 14px;
}
.post .header .tags p {
  margin: 0;
}
.post .description {
  margin: 10px 0 0 10px;
}
.post:hover {
  box-shadow: 0 2px 5px 3px #471c87;
  transform: translateY(-2px);
}

.tag {
  padding: 2px 0.5lh;
  margin: 0 3px;
  border-radius: 1lh;
  border-width: 2px;
  border-style: solid;
}
.tag a {
  color: inherit;
  text-decoration: none;
}
.tag .tag-count {
  color: #a8a8a8;
}