Website/assets/css/main.css

html {
  background-color: #282828;
}
body {
  background-color: #282828;
  color: #fbf1c7;
  display: flex;
  flex-direction: row-reverse;
  flex-wrap: wrap-reverse;
  justify-content: center;
  max-width: 80em;
  margin: 0 auto;
  padding-top: 4em;
}
@media (min-width: 50em) {
  body {
    flex-wrap: nowrap;
  }
}
aside {
  margin: 1em;
  margin-bottom: 3em;
  min-width: 12em;
}
main {
  margin: 1em;
  width: 65em;
  max-width: 95%;
}
@media (min-width: 50em) {
  main {
    max-width: 70%;
  }
}
pre {
  overflow: auto;
}
article {
  background-color: #3c3836;
  margin: 1em;
  padding: 1em;
  border-radius: 1em;
}
img {
  max-width: 100%;
}
.blog-name {
  font-size: 2em;
  font-weight: 400;
  margin-bottom: 0.8em;
  display: block;
}
.blog-name a,
.blog-name a:visited,
.blog-name a:hover,
.blog-name a:active {
  color: inherit;
  text-decoration: none;
}
.article-details {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
ul.tags {
  list-style: none;
  padding: 0;
  margin: 0;
}
ul.tags li {
  display: inline-block;
  margin: 0 1em;
  padding: 0;
}
a,
a:visited {
  color: #8ec07c;
}
a:active,
a:hover {
  color: #689d6a;
}
*:first-child {
  margin-top: 0;
}
*:last-child {
  margin-bottom: 0;
}
p code {
  display: inline-block;
  background-color: #504945;
  padding: 0.2em;
}
code {
  white-space: pre-wrap;
}
span.smallcaps {
  font-variant: small-caps;
}
span.underline {
  text-decoration: underline;
}
div.column {
  display: inline-block;
  vertical-align: top;
  width: 50%;
}
div.hanging-indent {
  margin-left: 1.5em;
  text-indent: -1.5em;
}
ul.task-list {
  list-style: none;
}
pre > code {
  white-space: pre;
  position: relative;
}
pre > code.sourceCode {
  white-space: pre;
  position: relative;
}
pre > code.sourceCode > span {
  display: inline-block;
  line-height: 1.25;
}
pre > code.sourceCode > span:empty {
  height: 1.2em;
}
code.sourceCode > span {
  color: inherit;
  text-decoration: inherit;
}
div.sourceCode {
  margin: 1em 0;
}
pre.sourceCode {
  margin: 0;
}
@media screen {
  div.sourceCode {
    overflow: auto;
  }
}
@media print {
  pre > code.sourceCode {
    white-space: pre-wrap;
  }
  pre > code.sourceCode > span {
    text-indent: -5em;
    padding-left: 5em;
  }
}
pre.numberSource code {
  counter-reset: source-line 0;
}
pre.numberSource code > span {
  position: relative;
  left: -4em;
  counter-increment: source-line;
}
pre.numberSource code > span > a:first-child::before {
  content: counter(source-line);
  position: relative;
  left: -1em;
  text-align: right;
  vertical-align: baseline;
  border: none;
  display: inline-block;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  padding: 0 4px;
  width: 4em;
  color: #aaaaaa;
}
pre.numberSource {
  margin-left: 3em;
  border-left: 1px solid #aaaaaa;
  padding-left: 4px;
}
@media screen {
  pre > code.sourceCode > span > a:first-child::before {
    text-decoration: underline;
  }
}
code span.al {
  color: #ff0000;
  font-weight: bold;
}
/* Alert */
code span.an {
  color: #60a0b0;
  font-weight: bold;
  font-style: italic;
}
/* Annotation */
code span.at {
  color: #7d9029;
}
/* Attribute */
code span.bn {
  color: #40a070;
}
/* BaseN */
code span.bu {
  color: #83a598;
}
/* BuiltIn */
code span.cf {
  color: #007020;
  font-weight: bold;
}
/* ControlFlow */
code span.ch {
  color: #4070a0;
}
/* Char */
code span.cn {
  color: #880000;
}
/* Constant */
code span.co {
  color: #60a0b0;
  font-style: italic;
}
/* Comment */
code span.cv {
  color: #60a0b0;
  font-weight: bold;
  font-style: italic;
}
/* CommentVar */
code span.do {
  color: #ba2121;
  font-style: italic;
}
/* Documentation */
code span.dt {
  color: #902000;
}
/* DataType */
code span.dv {
  color: #40a070;
}
/* DecVal */
code span.er {
  color: #ff0000;
  font-weight: bold;
}
/* Error */
code span.ex {
  color: #458588;
}
/* Extension */
code span.fl {
  color: #40a070;
}
/* Float */
code span.fu {
  color: #458588;
}
/* Function */
/* Import */
code span.in {
  color: #60a0b0;
  font-weight: bold;
  font-style: italic;
}
/* Information */
code span.kw {
  color: #98971a;
  font-weight: bold;
}
/* Keyword */
code span.op {
  color: #666666;
}
/* Operator */
code span.ot {
  color: #007020;
}
/* Other */
code span.pp {
  color: #bc7a00;
}
/* Preprocessor */
code span.sc {
  color: #4070a0;
}
/* SpecialChar */
code span.ss {
  color: #bb6688;
}
/* SpecialString */
code span.st {
  color: #d79921;
}
/* String */
code span.va {
  color: #cc241d;
}
/* Variable */
code span.vs {
  color: #4070a0;
}
/* VerbatimString */
code span.wa {
  color: #60a0b0;
  font-weight: bold;
  font-style: italic;
}
/* Warning */