/* general */
* {
  box-sizing: border-box;
}
body {
  margin: 10px 0px 100px;
}

p, hr, blockquote, h1, h2, h3, h4, div, ul, ol, pre, header, footer {
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}
@media (max-width:840px) {
body > p, body > hr, body > blockquote, body > h1, body > h2, body > h3, body > h4,
body > div, body > ul, body > ol, body > pre, header, footer {
  max-width: 100%;
  margin-left: 10px;
  margin-right: 10px;
}
}

img {
  border: 1px solid #aaa;
  margin: 20px 0 30px;
  max-width: 100%;
}
.xlarge, .xlarge img {
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}
.noborder {
  border: none;
}
cite {
  font-size: 0.9em;
}

.cf:before,
.cf:after {
  content: " "; /* 1 */
  display: table; /* 2 */
}

.cf:after {
  clear: both;
}

/* blog */
.link-index li {
  margin-bottom: 5px;
}
.fun img {
  margin: 0;
}
.fun article {
  margin-top: 20px;
  margin-bottom: 20px;
}
.fun h2 a {
  color: black;
}
.fun h2 .date {
  font-weight: normal;
  font-size: 16px;
}
.highlight {
  padding: 10px;
}
.highlight pre {
  margin: 0;
}
.citation {
  margin-top: -25px;
  margin-bottom: 30px;
}

/* nav */
header {
  margin-top: 10px;
  margin-bottom: 15px;
}
footer {
  margin-top: 10px;
}