html {
  box-sizing: border-box;
  font-family: sans-serif;
  line-height: 1.15;
  font-size: 14px;
}
body {
  margin: 0;
  height: 100vh;
  width: 100vw;
  overflow: hidden;
}
body>header {
  height: 30px;
  padding: 10px;
  z-index: 10;
  background-color: white;
  display: flex;
}
body>header input[type=search] {
  padding: 5px 10px;
  border-radius: 100px;
  border: 1px solid hsl(0, 0%, 90%);
  min-width: 300px;
}
main {
  display: flex;
}

section {
  overflow-y: auto;
  height: calc(100vh - 50px);
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
  width: calc(100% - 400px);
  justify-content: space-around;
}

aside {
  width: 400px;
  background-color: aliceblue;
  overflow-y: auto;
  height: calc(100vh - 50px);
  padding: 10px;
  box-sizing: border-box;
}

article {
  position: relative;
  border-radius: 6px;
  background-color: hsl(0, 0%, 95%);
  padding: 10px;
  margin: 5px 0 5px 30px;
  width: 400px;
}
article.selected {
  background-color: hsl(180, 44%, 89%);
}

h3 {
  color: hsl(0, 0%, 50%);
  text-align: center;
}
dd, .text {
  max-width: 100%;
  white-space: pre-wrap;
}
dt {
  font-weight: bold;
}
dd {
  margin-bottom: 10px;
}
a[target=_blank]::after {
  content: '→';
}

time {
  font-size: smaller;
  color: hsl(0, 0%, 50%);
}

img {
  max-width: 100%;
}

blockquote {
  margin: 0 0 10px;
  padding: 10px;
  border: 1px solid hsl(0, 0%, 50%);
}

q {
  color: green;
}

.counter {
  position: absolute;
  left: -30px;
}
img.contain {
  object-fit: contain;
  background: hsl(0, 0%, 95%);
  margin-right: 20px;
}
.source_4chan_pol_anon {
  border-left: 2px solid hsl(12, 48%, 59%);
}
.source_4chan_pol {
  border-left: 2px solid hsl(136, 43%, 74%);
}
.source_8chan_pol {
  border-left: 2px solid hsl(254, 100%, 83%);
}
.source_8chan_cbts {
  border-left: 2px solid hsl(198, 100%, 83%);
}
.deleted {
  background-color: hsl(0, 50%, 85%);
}
article header {
  margin-bottom: 10px;
  display: flex;
  flex-wrap: wrap;
}
article header>*{
  margin-right: 10px;
  display: inline-block;
}
.name {
  font-weight: bold;
}
.email {
  color: hsl(359, 82%, 36%);
}
.filename {
  display: block;
  font-size: smaller;
  color: grey;
}
