body {
  background: #333;
  color: #eee;
  margin: 0px;
  padding: 0px;
  font-family: 'Open Sans', sans-serif;
  font-size: 16px; }

.navigation {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  line-height: 1.5;
  width: 200px;
  padding: 10px;
  border: 1px solid #4d4d4d;
  border-radius: 3px;
  margin-top: 40px; }
  .navigation ul, .navigation li {
    margin: 0;
    padding: 0;
    list-style: none; }
  .navigation li {
    margin-bottom: 5px; }
    .navigation li:last-child {
      margin-bottom: 0; }

.responsive_column {
  max-width: 650px;
  padding: 0 40px; }
  @media (max-width: 600px) {
    .responsive_column {
      padding: 0 20px; } }

p, li {
  line-height: 1.5; }

a {
  color: #A3FF57;
  text-decoration: none;
  border-bottom: 1px dotted #A3FF57; }
  a:hover {
    color: #BDFF87;
    border-bottom-color: #BDFF87; }

pre {
  background: rgba(0, 0, 0, 0.5);
  border-radius: 8px;
  padding: 8px;
  color: white;
  font-size: 14px; }

p > code, li > code {
  font-size: 14px;
  background: #444;
  border-radius: 4px;
  padding: 2px 4px; }

.footer {
  text-align: center;
  font-size: 10px;
  color: #aaa;
  margin-bottom: 100px; }

.highlight {
  /* builtins */
  /* strings */
  /* proper names, self */
  /* true, false, nil */
  /* function lit, braces, parens  */
  /* operators */
  /* keywords */ }
  .highlight .nb, .highlight .cp {
    color: #F69385; }
  .highlight .s, .highlight .s1, .highlight .s2, .highlight .se {
    color: #F1BF8E; }
  .highlight .nc, .highlight .vc, .highlight .bp {
    color: #99CBCA; }
  .highlight .kc {
    color: #B3EFE5; }
  .highlight .nf, .highlight .kt, .highlight .na {
    color: #B0D89C; }
  .highlight .o, .highlight .si {
    color: #F277A1; }
  .highlight .nv {
    color: #F277A1; }
  .highlight .k, .highlight .kd, .highlight .nt {
    color: #BB84B4; }
  .highlight .c1, .highlight .c2, .highlight .c {
    color: #929292; }
  .highlight .m, .highlight .mi, .highlight .mf, .highlight .mh {
    color: #9D8FF2; }

.page_columns {
  text-align: center; }
  .page_columns .navigation, .page_columns .responsive_column {
    display: inline-block;
    text-align: left;
    vertical-align: top; }
    @media (max-width: 960px) {
      .page_columns .navigation, .page_columns .responsive_column {
        display: block;
        margin-left: auto;
        margin-right: auto; } }