*, *:after, *:before {
  -webkit-box-sizing:border-box;
     -moz-box-sizing:border-box;
          box-sizing:border-box;
  }

input,
body {
  background:#202020;
  color:#fff;
  font:16px/22px 'Helvetica Neue', sans-serif;
  margin:0;
  padding:0;
  }
input[type='text'] {
  vertical-align:top;
  width:100%;
  display:inline-block;
  height:40px;
  margin:0;
  color:rgba(0,0,0,.5);
  padding:10px;
  background-color:#fff;
  border:none;
  -webkit-appearance:none;
  border-radius:2px;
  }

a {
  color:#8a2c26;
  font-weight:500;
  text-decoration:none;
  border-bottom:1px solid currentColor;
  }
  a:hover { color:rgba(0,0,0,0,0.75); }

header {
  background:#202020;
  color:#fff;
  padding:100px 0 40px 0;
  }
  header a { color:#f57348; }
  header a:hover { color:#f6957a; }
  header p { color:rgba(255,255,255,0.5); }

section {
  background:#f57348;
  color:rgba(0,0,0,0.75);
  }
h1,h2,h3,h4,h5,h6 {
  font-weight:500;
  margin:0;
  }
h1 {
  font-size:38px;
  margin-bottom:20px;
  }
h2 {
  font-size:22px;
  margin-bottom:20px;
  }
h3 {
  font-size:16px;
  font-weight:600;
  margin-bottom:10px;
  }
pre {
  background:rgba(255,255,255,1);
  color:rgba(0,0,0,0.65);
  padding:3px;
  }
pre {
  display:block;
  padding:10px;
  font-size:14px;
  word-break:break-all;
  word-wrap:break-word;
  white-space:pre;
  white-space:pre-wrap;
  -moz-tab-size:4;
  tab-size:4;
  margin:0;
  border-radius:2px;
  }

.limiter {
  width:83.3333%;
  max-width:800px;
  margin-left:auto;
  margin-right:auto;
  }
.contain {
  position:relative;
  }

.pad8y { padding-top:80px; padding-bottom:80px; }
.pad4y { padding-top:40px; padding-bottom:40px; }

.space-bottom2 { margin-bottom:20px; }
.space-bottom4 { margin-bottom:40px; }

@media screen {
  .com { color: #999988; }  /* a comment */
  .lit, .typ { color: #445588; } /* literal, type */
  .tag { color: navy; } /* tag */
  .atv, str { color: #dd1144; } /* attribute, string */
  .dec, .clo, .opn, .pun, .kwd { color: #333333; } /* a declaration, close bracket, open bracket, punctuation, keyword */
  .var, .atn { color: teal; } /* variable, markup attribute */
  .fun { color: #990000; } /* functione */
}
/* Use higher contrast and text-weight for printable form. */
@media print, projection {
  .str { color: #060; }
  .kwd { color: #006; font-weight: bold; }
  .com { color: #600; font-style: italic; }
  .typ { color: #404; font-weight: bold; }
  .lit { color: #044; }
  .pun, .opn, .clo  { color: #440; }
  .tag { color: #006; font-weight: bold; }
  .atn { color: #404; }
  .atv { color: #060; }
}