:root {
  --c0: #fff;
  --c1: #dca;
  --c2: #a98;
  --c3: #864;
  --c4: #432;
  --c5: #321;
}
html {
  width: 100vw;
  height: 100vh;
  font-family: monospace;
  color: var(--c5);
  background: var(--c1);
  background-attachment: fixed;
  & ::selection {
    color: var(--c1);
    background: var(--c3);
  }
}
body {
  margin: 10px auto;
  max-width: 800px;
  display: flex;
  flex-wrap: wrap;
}
a {
  color: var(--c3);
  text-decoration: none;
  &:hover {
    color: var(--c4);
  }
}
hr {
  border: none;
  border-bottom: 2px dashed var(--c3);
}
header#top {
  width: 100%;
  letter-spacing: 5px;
  text-align: center;
  color: var(--c4);
  border-bottom: 2px dashed var(--c3);
}
h3 {
  margin-left: -10px;
  padding-left: 5px;
  box-sizing: border-box;
  color: var(--c1);
  border-left: 2px dashed var(--c3);
  background: linear-gradient(to right, var(--c4), var(--c3), transparent);
}
nav {
  padding: 5px;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
  border-bottom: 2px dashed var(--c3);
}
nav a {
  margin: 5px 20px;
}
aside {
  padding-right: 5px;
  box-sizing: border-box;
  width: 100px;
  text-align: right;
  border-right: 2px dashed var(--c3);
  border-bottom: 2px dashed var(--c3);
}
aside a p {
  margin: 25px 0px;
}
main {
  padding: 5px;
  box-sizing: border-box;
  width: calc(100% - 100px);
  border-bottom: 2px dashed var(--c3);
}
article {
  margin-left: 10px;
  padding-left: 5px;
  box-sizing: border-box;
}
table tr th:first-child {
  text-align: right;
}
table tr th:last-child {
  text-align: left;
}
blockquote {
  margin-left: 10px;
  padding-left: 10px;
  box-sizing: border-box;
  border-left: 2px dashed var(--c3);
}
.tags {
  color: var(--c3);
  font-style: oblique;
}
footer {
  width: 100%;
  text-align: center;
}
 .adult:after {
  color: red;
  content: " "url('assets/18.png')" ";
}
@media screen and (min-width: 620px) {
  body {
  border: 2px dashed var(--c3);
  }
}