@media (prefers-color-scheme: light) {
  :root {
    --bg: rgb(238, 238, 238);
    --accent-bg: rgb(238, 238, 238);
  }
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #1D1B22;
    --accent-bg: #1D1B22;
  }
}

body > header > :only-child {
  margin: 0;
}

body > header {
  padding: 0;
}

#propic {
  size: 50%;
  border: none;
  background-color: var(--bg);
}

ul.posts {
  list-style-type: none;
}

ul.posts > li {
  padding: 0.4rem 0.8rem;
  border-inline-start: 0.35rem solid var(--border);
}

ul.posts > li:hover {
  padding: 0.4rem 0.8rem;
  border-inline-start: 0.35rem solid var(--accent);
}

ul.posts > li > a {
  display: block;
}

img.icon {
  height: 4rem;
  margin-right: 0.8rem;
  vertical-align: top;
  max-width: none;
}

article.project {
  border-width: 0.2rem;
}

article.project > aside {
  width: 15%;
  border: none;
}

article.project:hover {
  border-color: var(--accent)
}