* {
  background-color: rgb(250, 250, 249);
}

body {
  font-family: monospace;
  margin: 0;
  padding: 0;
  width: 800px;
  margin: 0px auto;
  line-height: 22px;
}

header,
nav,
main,
footer {
}
header {
  padding: 1rem;
}
nav {
  padding: 1rem;
  padding-left: 0px;
  padding-top: 0px;
}
main {
  display: flex;
  margin: 1rem;
}
article {
  flex: 3;
  margin-right: 1rem;
  padding-top: 1rem;
}

p .full-article-link {
  background-color: rgb(253 242 252);
  border: 1px solid rgb(197 188 205);
  border-radius: 5px;
  padding-left: 5px;
  padding-right: 5px;
  padding-bottom: 2px;
  padding-top: 1px;
  text-decoration: none;
  font-size: 11px;
}

article ul li h4,
article ol li h4,
article ul li p,
article ol li p {
  margin: 0px;
  padding: 0px;
}

article ul li p,
article ol li p {
  padding-bottom: 1rem;
}

article code {
  background: transparent;
  border: 0px;
  white-space: pre-wrap;
  padding: 0px;
  margin: 0px;
}

article pre {
  white-space: pre-wrap;
  background-color: rgb(245, 245, 244);
  padding: 10px;
  border-radius: 5px;
  border: 1px solid rgb(215 215 215);
}

article img {
  width: 800px;
  max-width: 800px;
}

code,
cite {
  background-color: rgb(245, 245, 244);
  border: 1px solid rgb(214, 211, 209);
  border-radius: 5px;
  padding-left: 5px;
  padding-right: 5px;
  padding-bottom: 2px;
  padding-top: 1px;
  font-size: 11px;
  font-style: normal;
}

time {
  position: absolute;
  width: 126px;
  /* height: 30px; */
  margin-top: -42px;
  margin-left: -159px;
  border-bottom: 1px solid black;
  padding: 5px;
  /* line-height: 10px; */
  /* border-radius: 5px; */
  font-size: 12px;
  text-align: right;
}

time:after {
  position: absolute;
  content: var(--date);
  left: 44px;
  top: 26px;
  text-align: right;
  width: 86px;
  font-size: 10px;
  border: 1px solid white;
  border-radius: 3px;
  padding: 3px;
}

aside {
  flex: 1;
  padding: 1rem;
}
footer {
  text-align: left;
  padding: 1rem;
  padding-left: 0px;
}

h2 {
  margin-top: 16px;
  margin-bottom: 16px;
}

nav ul {
  list-style: none;
  padding: 0px;
}

nav ul li {
  display: flex;
  flex-flow: row;
  align-items: center;
  flex-wrap: wrap;
}

nav ul li::before {
  padding-right: 12px;
}
nav ul li:first-child::before {
  color: rgb(116, 6, 206);
  content: url("data:image/svg+xml;charset=UTF-8,<svg xmlns='http://www.w3.org/2000/svg' height='20' viewBox='0 0 16 16' width='20' aria-hidden='true' ><path fill='currentColor' d='M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z'></path></svg>");
}
nav ul li:nth-child(2)::before {
  content: url("data:image/svg+xml;charset=UTF-8,<svg xmlns='http://www.w3.org/2000/svg' class='svg-icon' height='21' width='21' viewBox='0 0 1024 1024' version='1.1'><path d='M663.8 382.4c10.2 74.6-9.4 158-71.8 201.4-44.6 31-105.6 28.2-141.6 11.4-74.2-34.6-99-117.2-93.6-194.4 8.6-121.8 81.8-175.8 150.6-175 93.8-0.4 143.6 63.6 156.4 156.6zM960 176v672c0 61.8-50.2 112-112 112H176c-61.8 0-112-50.2-112-112V176c0-61.8 50.2-112 112-112h672c61.8 0 112 50.2 112 112zM724 626.4s-0.2-68-0.2-434.6h-58v80.6c-1.6 0.6-2.4-1-3.2-2.4-19.2-41.4-71.8-92.6-152-92-103.8 0.8-174.4 62.4-201.2 155.6-8.6 29.8-11.6 60.2-11 91.2 3.4 155.8 90.2 235.6 224.8 230.4 57.8-2.2 109-34 138-90.4 1-2 2.2-3.8 3.4-5.8 0.4 0.2 0.8 0.2 1.2 0.4 0.6 7.6 0.4 61.4 0.2 69-0.4 29.6-4 59-14.4 87-15.6 42-44.6 69.4-89 79-35.6 7.8-71.2 7.6-106.4-2.4-43-12.2-73-38-82.2-83.6-0.6-3.2-2.6-2.6-4.6-2.6h-53.6c1.6 21.2 6.4 40.6 17 58.4 48.4 81 165.4 97 256.4 74.8 99.8-24.6 134.6-109.8 134.8-212.6z' fill=''/></svg>");
}
nav ul li:nth-child(3)::before {
  content: url("data:image/svg+xml;charset=UTF-8,<svg height='20' width='20' version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 310 310' xml:space='preserve'><g id='XMLID_801_'><path id='XMLID_802_' d='M72.16,99.73H9.927c-2.762,0-5,2.239-5,5v199.928c0,2.762,2.238,5,5,5H72.16c2.762,0,5-2.238,5-5V104.73C77.16,101.969,74.922,99.73,72.16,99.73z'/><path id='XMLID_803_' d='M41.066,0.341C18.422,0.341,0,18.743,0,41.362C0,63.991,18.422,82.4,41.066,82.4c22.626,0,41.033-18.41,41.033-41.038C82.1,18.743,63.692,0.341,41.066,0.341z'/><path id='XMLID_804_' d='M230.454,94.761c-24.995,0-43.472,10.745-54.679,22.954V104.73c0-2.761-2.238-5-5-5h-59.599c-2.762,0-5,2.239-5,5v199.928c0,2.762,2.238,5,5,5h62.097c2.762,0,5-2.238,5-5v-98.918c0-33.333,9.054-46.319,32.29-46.319c25.306,0,27.317,20.818,27.317,48.034v97.204c0,2.762,2.238,5,5,5H305c2.762,0,5-2.238,5-5V194.995C310,145.43,300.549,94.761,230.454,94.761z'/></g></svg>");
}