.gutter pre {
    color: #999;
  }
  pre {
    color: #525252;
  }
  pre .function .keyword,
  pre .constant {
    color: #0092db;
  }
  pre .keyword,
  pre .attribute {
    color: #e96900;
  }
  pre .number,
  pre .literal {
    color: #ae81ff;
  }
  pre .tag,
  pre .tag .title,
  pre .change,
  pre .winutils,
  pre .flow,
  pre .lisp .title,
  pre .clojure .built_in,
  pre .nginx .title,
  pre .tex .special {
    color: #2973b7;
  }
  pre .class .title {
    color: #fff;
  }
  pre .symbol,
  pre .symbol .string,
  pre .value,
  pre .regexp {
    color: #42b983;
  }
  pre .title {
    color: #a6e22e;
  }
  pre .tag .value,
  pre .string,
  pre .subst,
  pre .haskell .type,
  pre .preprocessor,
  pre .ruby .class .parent,
  pre .built_in,
  pre .sql .aggregate,
  pre .django .template_tag,
  pre .django .variable,
  pre .smalltalk .class,
  pre .javadoc,
  pre .django .filter .argument,
  pre .smalltalk .localvars,
  pre .smalltalk .array,
  pre .attr_selector,
  pre .pseudo,
  pre .addition,
  pre .stream,
  pre .envvar,
  pre .apache .tag,
  pre .apache .cbracket,
  pre .tex .command,
  pre .prompt {
    color: #42b983;
  }
  pre .comment,
  pre .java .annotation,
  pre .python .decorator,
  pre .template_comment,
  pre .pi,
  pre .doctype,
  pre .deletion,
  pre .shebang,
  pre .apache .sqbracket,
  pre .tex .formula {
    color: #b3b3b3;
  }
  pre .coffeescript .javascript,
  pre .javascript .xml,
  pre .tex .formula,
  pre .xml .javascript,
  pre .xml .vbscript,
  pre .xml .css,
  pre .xml .cdata {
    opacity: 0.5;
  }
  .post {
    position: relative;
    padding-bottom: 30px;
    margin-bottom: 30px;
    border-bottom: 1px solid #e6e6e6;
  }
  .post h1,
  .post h2 {
    text-transform: uppercase;
  }
  .post h1 a:hover,
  .post h2 a:hover {
    border-bottom: 3px solid #666;
  }
  .post h1 {
    font-size: 32px;
    margin: 0 0 45px;
    letter-spacing: 1px;
  }
  .post h2 {
    font-size: 24px;
    margin: 60px 0 30px;
    position: relative;
  }
  .post h2:before {
    content: '';
    border-left: 5px solid #f66;
    position: absolute;
    left: -15px;
    height: 75%;
    top: 12%;
  }
  .post h3 {
    margin: 30px 0 15px;
  }
  .post .date {
    font-family: "Montserrat", "Helvetica Neue", "Hiragino Sans GB", "LiHei Pro", Arial, sans-serif;
    font-size: 13px;
    color: #999;
    margin: 0 0 30px;
    letter-spacing: 1px;
  }
  .post .page-content {
    text-align: left;
    line-height: 1.8em;
  }
  .post .page-content p,
  .post .page-content ul,
  .post .page-content ol {
    margin: 1em 0 1.5em;
  }
  .post .page-content strong {
    font-weight: 600;
    color: #444;
  }
  .post .page-content ol {
    padding-left: 1.6em;
  }
  .post .page-content ul {
    padding-left: 15px;
    list-style-type: none;
  }
  .post .page-content ul li:before {
    position: absolute;
    font-weight: 600;
    content: " · ";
    margin: 0;
    left: 0;
  }
  .post .page-content a {
    color: #f66;
    border-bottom: 2px solid transparent;
  }
  .post .page-content a:hover {
    color: #f33;
    border-bottom-color: #f33;
  }
  .post .page-content .highlight,
  .post .page-content .highlight table {
    margin: 0;
    width: 100%;
  }
  .post .page-content .highlight {
    overflow-x: auto;
  }
  .post .page-content .highlight table,
  .post .page-content .highlight tr,
  .post .page-content .highlight td {
    padding: 0;
    border-collapse: collapse;
  }
  .post .page-content code {
    font-family: "Roboto Mono", "Menlo", "Consolas", monospace;
    font-size: 13px;
    background-color: #f6f6f6;
    padding: 3px 10px;
    margin: 0 5px;
    border-radius: 2px;
  }
  .post .page-content pre {
    font-family: "Roboto Mono", "Menlo", "Consolas", monospace;
    font-size: 13px;
    overflow-x: auto;
    text-align: left;
    padding: 15px 25px;
    background-color: #f6f6f6;
    line-height: 1.5em;
  }
  .post .page-content .code pre {
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;
  }
  .post .page-content .gutter pre {
    padding: 15px 0 15px 15px;
    color: #75715e;
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px;
  }
  .post .page-content blockquote {
    margin: 2em 0;
    padding-left: 30px;
    border-left: 5px solid #e6e6e6;
  }
  .post .page-content blockquote p {
    font-size: 17px;
    font-style: italic;
    line-height: 1.8em;
    color: #999;
  }
  .post img {
    display: block;
    max-width: 100%;
  }
  .blog-nav {
    position: fixed;
    bottom: 20px;
    height: 20px;
    line-height: 20px;
    font-family: "Montserrat", "Helvetica Neue", "Hiragino Sans GB", "LiHei Pro", Arial, sans-serif;
    font-size: 15px;
    color: #999;
    text-decoration: none;
    cursor: pointer;
    letter-spacing: 1px;
    border-bottom: 3px solid transparent;
  }
  .blog-nav:hover {
    color: #333;
    border-bottom-color: #333;
  }
  #newer {
    left: 40px;
  }
  #older {
    right: 40px;
  }
  .show-comments {
    font-family: "Montserrat", "Helvetica Neue", "Hiragino Sans GB", "LiHei Pro", Arial, sans-serif;
    text-align: center;
  }
  .show-comments a {
    color: #999;
    cursor: pointer;
  }
  .show-comments a:hover {
    color: #666;
  }
  @media screen and (max-width: 900px) {
    .post {
      padding-bottom: 80px;
    }
    .blog-nav {
      position: absolute;
      bottom: 30px;
    }
    #newer {
      left: 0;
    }
    #older {
      right: 0;
    }
  }
  @media screen and (max-width: 420px) {
    .main {
      margin-top: 32px;
    }
    .post h1 {
      font-size: 24px;
      margin: 0 0 30px;
    }
    .post h2 {
      font-size: 20px;
      margin: 30px 0 15px;
    }
    .post h3 {
      font-size: 16px;
      line-height: 1.3em;
    }
    .post .date {
      font-size: 12px;
      margin: 0 0 20px;
    }
    .post .page-content {
      font-size: 15px;
    }
    .post .page-content pre {
      font-size: 12px;
    }
    .post .page-content blockquote p {
      font-size: 16px;
    }
    .blog-nav {
      font-size: 14px;
      color: #444;
    }
  }