/* This stylesheet is automatically generated using Stylus.  See the
   original source at <https://code.s.zeid.me/site-design/src/main/styles/site.styl>. */
@import url("https://fonts.googleapis.com/css?family=Ubuntu:light,lightitalic,regular,italic,medium,mediumitalic,bold,bolditalic");
@import url("https://fonts.googleapis.com/css?family=Ubuntu+Mono:normal,bold,italic,bolditalic");
@import url("https://fonts.googleapis.com/css?family=Material+Icons");
@import url("https://fonts.s.zeid.me/latin-modern/mono.css");
@import url("syntax.css");
body {
  margin: 0;
  padding: 0;
  line-height: 1.25em;
  background: #f8f8f8;
  color: #222;
}
@media print {
  body {
    background: #fff;
    color: #000;
  }
}
html,
body,
button,
input,
select,
textarea {
  font-family: "Ubuntu", "Droid Sans", "Trebuchet MS", "DejaVu Sans", "Bitstream Vera Sans", "Verdana", sans-serif;
  font-size: 12pt;
}
html.monospace-style,
html.monospace-style body,
html.monospace-style button,
html.monospace-style input,
html.monospace-style select,
html.monospace-style textarea {
  font-family: "Latin Modern Mono", "Droid Sans Mono", "DejaVu Sans Mono", "Consolas", "Courier New", "Courier", monospace;
  font-size: 10pt;
}
pre,
code,
kbd,
samp,
var,
tt {
  font-family: "Ubuntu Mono", "Droid Sans Mono", "DejaVu Sans Mono", "Consolas", "Courier New", "Courier", monospace;
  font-size: 12pt;
  font-size-adjust: 0.5;
}
html.monospace-style pre,
html.monospace-style code,
html.monospace-style kbd,
html.monospace-style samp,
html.monospace-style var,
html.monospace-style tt {
  font-family: "Latin Modern Mono", "Droid Sans Mono", "DejaVu Sans Mono", "Consolas", "Courier New", "Courier", monospace;
  font-size: 10pt;
  font-size-adjust: none;
}
blockquote,
pre {
  background: #efefef;
  margin: 0.5em 0 0 0;
  padding: 0.5em;
  overflow-x: auto;
}
blockquote blockquote,
pre blockquote,
blockquote pre,
pre pre {
  background: #f8f8f8;
}
blockquote blockquote blockquote,
pre blockquote blockquote,
blockquote pre blockquote,
pre pre blockquote,
blockquote blockquote pre,
pre blockquote pre,
blockquote pre pre,
pre pre pre {
  background: #efefef;
}
blockquote blockquote blockquote blockquote,
pre blockquote blockquote blockquote,
blockquote pre blockquote blockquote,
pre pre blockquote blockquote,
blockquote blockquote pre blockquote,
pre blockquote pre blockquote,
blockquote pre pre blockquote,
pre pre pre blockquote,
blockquote blockquote blockquote pre,
pre blockquote blockquote pre,
blockquote pre blockquote pre,
pre pre blockquote pre,
blockquote blockquote pre pre,
pre blockquote pre pre,
blockquote pre pre pre,
pre pre pre pre {
  background: #f8f8f8;
}
blockquote blockquote blockquote blockquote blockquote,
pre blockquote blockquote blockquote blockquote,
blockquote pre blockquote blockquote blockquote,
pre pre blockquote blockquote blockquote,
blockquote blockquote pre blockquote blockquote,
pre blockquote pre blockquote blockquote,
blockquote pre pre blockquote blockquote,
pre pre pre blockquote blockquote,
blockquote blockquote blockquote pre blockquote,
pre blockquote blockquote pre blockquote,
blockquote pre blockquote pre blockquote,
pre pre blockquote pre blockquote,
blockquote blockquote pre pre blockquote,
pre blockquote pre pre blockquote,
blockquote pre pre pre blockquote,
pre pre pre pre blockquote,
blockquote blockquote blockquote blockquote pre,
pre blockquote blockquote blockquote pre,
blockquote pre blockquote blockquote pre,
pre pre blockquote blockquote pre,
blockquote blockquote pre blockquote pre,
pre blockquote pre blockquote pre,
blockquote pre pre blockquote pre,
pre pre pre blockquote pre,
blockquote blockquote blockquote pre pre,
pre blockquote blockquote pre pre,
blockquote pre blockquote pre pre,
pre pre blockquote pre pre,
blockquote blockquote pre pre pre,
pre blockquote pre pre pre,
blockquote pre pre pre pre,
pre pre pre pre pre {
  background: #efefef;
}
code {
  display: inline-block;
}
::selection {
  background: #800;
  color: #f8f8f8;
  text-shadow: none !important;
}
::-moz-selection {
  background: #800;
  color: #f8f8f8;
  text-shadow: none !important;
}
a {
  color: #800;
  text-decoration: none;
}
a.darker {
  color: #600;
}
a:hover,
a:focus {
  outline: none;
  text-decoration: underline;
}
a img {
  border-style: none;
}
em em {
  font-style: normal;
}
em em em {
  font-style: italic;
}
h1,
.h1 {
  font-size: 2em;
  margin: 0.5em 0 0.25em 0;
  line-height: 1.25em;
  font-weight: normal;
  text-transform: uppercase;
  letter-spacing: 0.25em;
}
@media (min-resolution: 97dpi) {
  h1,
  .h1 {
    font-weight: lighter;
  }
}
h1.plain,
.h1.plain {
  font-weight: bold;
  text-transform: none;
  letter-spacing: normal;
}
@media (min-resolution: 97dpi) {
  h1.plain,
  .h1.plain {
    font-weight: bold;
  }
}
h2,
.h2 {
  font-size: 1.5em;
  margin: 0.67em 0 0.33em 0;
  line-height: 1.25em;
  font-weight: normal;
  text-transform: uppercase;
  letter-spacing: 0.33em;
}
@media (min-resolution: 97dpi) {
  h2,
  .h2 {
    font-weight: lighter;
  }
}
h2.plain,
.h2.plain {
  font-weight: bold;
  text-transform: none;
  letter-spacing: normal;
}
@media (min-resolution: 97dpi) {
  h2.plain,
  .h2.plain {
    font-weight: bold;
  }
}
h3,
.h3 {
  font-size: 1.25em;
  margin: 0.8em 0 0.4em 0;
  line-height: 1.25em;
  font-weight: normal;
  text-transform: uppercase;
  letter-spacing: 0.4em;
}
@media (min-resolution: 97dpi) {
  h3,
  .h3 {
    font-weight: lighter;
  }
}
h3.plain,
.h3.plain {
  font-weight: bold;
  text-transform: none;
  letter-spacing: normal;
}
@media (min-resolution: 97dpi) {
  h3.plain,
  .h3.plain {
    font-weight: bold;
  }
}
h4,
.h4 {
  font-size: 1em;
  margin: 1em 0 0.5em 0;
  line-height: 1.25em;
  font-weight: normal;
  text-transform: uppercase;
  letter-spacing: 0.5em;
}
@media (min-resolution: 97dpi) {
  h4,
  .h4 {
    font-weight: lighter;
  }
}
h4.plain,
.h4.plain {
  font-weight: bold;
  text-transform: none;
  letter-spacing: normal;
}
@media (min-resolution: 97dpi) {
  h4.plain,
  .h4.plain {
    font-weight: bold;
  }
}
h5,
.h5 {
  font-size: 0.8em;
  margin: 1.25em 0 0.63em 0;
  line-height: 1.25em;
  font-weight: normal;
  text-transform: uppercase;
  letter-spacing: 0.63em;
}
@media (min-resolution: 97dpi) {
  h5,
  .h5 {
    font-weight: lighter;
  }
}
h5.plain,
.h5.plain {
  font-weight: bold;
  text-transform: none;
  letter-spacing: normal;
}
@media (min-resolution: 97dpi) {
  h5.plain,
  .h5.plain {
    font-weight: bold;
  }
}
h6,
.h6 {
  font-size: 0.67em;
  margin: 1.5em 0 0.75em 0;
  line-height: 1.25em;
  font-weight: normal;
  text-transform: uppercase;
  letter-spacing: 0.75em;
}
@media (min-resolution: 97dpi) {
  h6,
  .h6 {
    font-weight: lighter;
  }
}
h6.plain,
.h6.plain {
  font-weight: bold;
  text-transform: none;
  letter-spacing: normal;
}
@media (min-resolution: 97dpi) {
  h6.plain,
  .h6.plain {
    font-weight: bold;
  }
}
hr,
hr.fancy,
.fancy-hr hr,
.plain-hr .fancy-hr hr,
.plain-hr hr.fancy {
  border-style: none;
  margin: 1em 0;
}
hr:after,
hr.fancy:after,
.fancy-hr hr:after,
.plain-hr .fancy-hr hr:after,
.plain-hr hr.fancy:after {
  content: '\2022                                     \2022                                     \2022                                     \2022 ';
  display: block;
  margin: 0;
  cursor: default;
  white-space: pre;
  text-align: center;
  line-height: 0.25em;
  letter-spacing: 0;
  color: #555;
  opacity: 0.75;
}
@media (max-width: 575px), (max-device-width: 575px), handheld, tv {
  hr:after,
  hr.fancy:after,
  .fancy-hr hr:after,
  .plain-hr .fancy-hr hr:after,
  .plain-hr hr.fancy:after {
    content: '\2022                     \2022                     \2022                     \2022 ';
  }
}
@media (max-width: 359px), (max-device-width: 359px) {
  hr:after,
  hr.fancy:after,
  .fancy-hr hr:after,
  .plain-hr .fancy-hr hr:after,
  .plain-hr hr.fancy:after {
    content: '\2022                 \2022                 \2022                 \2022 ';
  }
}
@media (max-width: 319px), (max-device-width: 319px) {
  hr:after,
  hr.fancy:after,
  .fancy-hr hr:after,
  .plain-hr .fancy-hr hr:after,
  .plain-hr hr.fancy:after {
    content: '\2022             \2022             \2022             \2022 ';
  }
}
@media (max-width: 219px), (max-device-width: 219px) {
  hr:after,
  hr.fancy:after,
  .fancy-hr hr:after,
  .plain-hr .fancy-hr hr:after,
  .plain-hr hr.fancy:after {
    content: '\2022         \2022         \2022         \2022 ';
  }
}
hr.plain,
.plain-hr hr {
  border-style: none;
  border-top: 1px solid transparent;
  border-bottom: 1px solid #555;
  opacity: 0.75;
  margin: 1em 3em;
}
hr.plain:after,
.plain-hr hr:after {
  content: "";
  display: none;
}
img.left {
  float: left;
}
img.right {
  float: right;
}
ol,
ul,
menu,
dir {
  margin: 0.5em 0 0 0;
  padding-left: 1.5em;
}
p,
p + table {
  margin: 0.6em 0 0 0;
}
.hide {
  display: none;
}
.inline-block {
  display: inline-block;
}
body > h1:first-child,
body > .h1:first-child {
  margin-top: 0;
}
body > h2:first-child,
body > .h2:first-child {
  margin-top: 0;
}
body > h3:first-child,
body > .h3:first-child {
  margin-top: 0;
}
body > h4:first-child,
body > .h4:first-child {
  margin-top: 0;
}
body > h5:first-child,
body > .h5:first-child {
  margin-top: 0;
}
body > h6:first-child,
body > .h6:first-child {
  margin-top: 0;
}
main {
  clear: both;
}
main > article > :first-child,
main article:first-child > :first-child,
main blockquote > :first-child,
main > article > :first-child > :first-child,
main article:first-child > :first-child > :first-child,
main blockquote > :first-child > :first-child {
  margin-top: 0;
}
main > article img,
main article:first-child img,
main blockquote img {
  max-width: 100%;
}
main article header:not(.freecomment-header) p,
main article header:not(.freecomment-header) div,
main article header:not(.freecomment-header) section {
  font-size: smaller;
  color: #555;
}
html.monospace-style main article header:not(.freecomment-header) p,
html.monospace-style main article header:not(.freecomment-header) div,
html.monospace-style main article header:not(.freecomment-header) section {
  font-size: 0.9em;
}
nav li time {
  display: block;
  font-size: smaller;
  color: #555;
}
html.monospace-style nav li time {
  font-size: 0.9em;
}
html.monospace-style .freecomment-time {
  font-size: 0.9em;
}
body > footer {
  font-size: 0.8em;
}
html.monospace-style body > footer {
  font-size: 0.9em;
}
body > footer > aside {
  display: inline-block;
  margin-bottom: 0.5em;
}
form {
  display: table;
  margin-top: 1em;
}
form section {
  display: table-row;
}
form section label,
form section select,
form section textarea,
form section input {
  margin: 0.5em 0.5em 0 0;
}
form section label,
form section select,
form section textarea,
form section input[type="text"],
form section input[type="password"],
form section input[type="file"] {
  width: 25em;
}
form section input[type="text"],
form section input[type="password"],
form section input[type="file"] {
  -moz-transform: translateY(0px); /* send halp pls (Gecko bug) */
/* you would think *not* translating it by +1px would be the *default*... */
}
form section input[type="text"],
form section input[type="password"],
form section input[type="file"],
form section select {
  height: 1.45em;
}
form section select {
  position: relative;
  top: 2px;
}
html.monospace-style form section select {
  top: 0;
}
form section textarea {
  margin-top: 0.54em;
}
form section textarea {
  height: 12em;
}
form section input[type="text"],
form section input[type="password"],
form section select,
form section textarea {
  font-size: 12pt;
  border-width: 0 0 1px 0;
  border-style: none none solid none;
  border-color: #aaa;
  background: #f8f8f8;
}
html.monospace-style form section input[type="text"],
html.monospace-style form section input[type="password"],
html.monospace-style form section select,
html.monospace-style form section textarea {
  font-size: 10pt;
}
form section input[type="submit"],
form section input[type="reset"],
form section input[type="button"] {
  padding-top: 0;
}
form section label {
  position: relative;
  top: -0.16em;
  line-height: 1.65em;
}
form section label:first-child,
form section span:first-child {
  position: static;
  top: 0;
  display: table-cell;
  width: auto;
  padding: 0.5em 1em 0 0;
  vertical-align: top;
}
.freecomment-time {
  color: #555;
}
.liquid-render-error {
  display: none;
}
#lightbox {
  font-family: inherit !important;
}
html,
body,
button,
input,
select,
textarea {
  font-weight: normal;
}
@media (min-resolution: 97dpi) {
  html,
  body,
  button,
  input,
  select,
  textarea {
    font-weight: lighter;
  }
}
html b,
body b,
button b,
input b,
select b,
textarea b,
html strong,
body strong,
button strong,
input strong,
select strong,
textarea strong,
html th,
body th,
button th,
input th,
select th,
textarea th {
  font-weight: bold;
}
@media (min-resolution: 97dpi) {
  html b,
  body b,
  button b,
  input b,
  select b,
  textarea b,
  html strong,
  body strong,
  button strong,
  input strong,
  select strong,
  textarea strong,
  html th,
  body th,
  button th,
  input th,
  select th,
  textarea th {
    font-weight: bold;
  }
}
@media (min-resolution: 97dpi) {
  html,
  body,
  button,
  input,
  select,
  textarea {
    font-size: 11.6pt;
  }
}
body {
  background: #f8f8f8;
}
main > article nav.subpage {
  margin-top: 0.5em;
}
main > article nav.subpage ul {
  display: table;
  margin: 0;
  padding-left: 0;
}
main > article nav.subpage ul > li {
  display: table-row-group;
  list-style: none;
}
main > article nav.subpage ul > li > a,
main > article nav.subpage ul > li > span,
main > article nav.subpage ul > li > p {
  display: table-row;
}
main > article nav.subpage ul > li > a > a,
main > article nav.subpage ul > li > span > a,
main > article nav.subpage ul > li > p > a,
main > article nav.subpage ul > li > a > span,
main > article nav.subpage ul > li > span > span,
main > article nav.subpage ul > li > p > span {
  display: table-cell;
  vertical-align: middle;
}
main > article nav.subpage ul > li > a > a:hover + span > a,
main > article nav.subpage ul > li > span > a:hover + span > a,
main > article nav.subpage ul > li > p > a:hover + span > a,
main > article nav.subpage ul > li > a > span:hover + span > a,
main > article nav.subpage ul > li > span > span:hover + span > a,
main > article nav.subpage ul > li > p > span:hover + span > a {
  text-decoration: underline;
}
main > article nav.subpage ul > li > a,
main > article nav.subpage ul > li > span {
  line-height: 2em;
  font-weight: bold;
}
@media (min-resolution: 97dpi) {
  main > article nav.subpage ul > li > a,
  main > article nav.subpage ul > li > span {
    font-weight: bold;
  }
}
main > article nav.subpage ul > li > a img,
main > article nav.subpage ul > li > span img {
  margin-right: 0.5em;
}
main > article nav.subpage ul > li:not(:last-child) > p > span {
  padding-bottom: 0.5em;
}
header > nav ul > li > a img,
main > article nav.subpage ul > li > a img,
header > nav ul > li > span img,
main > article nav.subpage ul > li > span img {
  min-width: 16px;
  min-height: 16px;
  max-width: 16px;
  max-height: 16px;
}
header > nav ul > li > a .material-icons,
main > article nav.subpage ul > li > a .material-icons,
header > nav ul > li > span .material-icons,
main > article nav.subpage ul > li > span .material-icons {
  position: relative;
  right: 0.05em;
  top: 0.164em;
  font-size: 18px;
  color: #222;
  opacity: 0.8;
}
@media (min-resolution: 160dpi), handheld, (max-width: 480px), (max-device-width: 480px) {
  header > nav ul > li > a img,
  main > article nav.subpage ul > li > a img,
  header > nav ul > li > span img,
  main > article nav.subpage ul > li > span img {
    min-width: 22px;
    min-height: 22px;
    max-width: 22px;
    max-height: 22px;
  }
  header > nav ul > li > a .material-icons,
  main > article nav.subpage ul > li > a .material-icons,
  header > nav ul > li > span .material-icons,
  main > article nav.subpage ul > li > span .material-icons {
    font-size: 24px;
  }
}
header > nav ul > li > a .material-icons,
header > nav ul > li > span .material-icons {
  left: 0.325em;
  margin-right: 0.1em;
  color: inherit;
  opacity: 0.85;
}
body > main + hr {
  display: block;
  -ms-flex: 1 0 0%;
  -webkit-flex: 1 0 0%;
  flex: 1 0 0%;
  border-style: none;
  height: 0;
  margin: 0;
}
body > main + hr:before,
body > main + hr:after {
  content: "";
  display: none;
}