body {
  width: 100%;
}
body:before,
body:after {
  content: "";
  display: table;
}
body:after {
  clear: both;
}
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-weight: inherit;
  font-style: inherit;
  font-family: inherit;
  font-size: 100%;
  vertical-align: baseline;
}
body {
  line-height: 1;
  color: #000;
  background: #fff;
}
ol,
ul {
  list-style: none;
}
table {
  border-collapse: separate;
  border-spacing: 0;
  vertical-align: middle;
}
caption,
th,
td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle;
}
a img {
  border: none;
}
input,
button {
  margin: 0;
  padding: 0;
}
input::-moz-focus-inner,
button::-moz-focus-inner {
  border: 0;
  padding: 0;
}
@font-face {
  font-family: iconfont;
  font-style: normal;
  font-weight: normal;
  src: url("fonts/iconfont.eot?v=#4.0.3");
  src: url("fonts/iconfont.eot?#iefix&v=#4.0.3") format("embedded-opentype"), url("fonts/iconfont.woff?v=#4.0.3") format("woff"), url("fonts/iconfont.ttf?v=#4.0.3") format("truetype"), url("fonts/iconfont.svg#fontawesomeregular?v=#4.0.3") format("svg");
}
html,
body,
#container {
  height: 100%;
}
body {
  background: #fff;
  font: 14px "Helvetica Neue", Helvetica, Arial, "Hiragino Sans GB", "Hiragino Sans GB W3", "WenQuanYi Micro Hei", sans-serif;
  -webkit-text-size-adjust: 100%;
}
.left,
.alignleft {
  float: left;
}
.right,
.alignright {
  float: right;
}
.clear {
  clear: both;
}
#container {
  position: relative;
}
.mobile-nav-on {
  overflow: hidden;
}
#wrap {
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-transition: 0.2s ease-out;
  -moz-transition: 0.2s ease-out;
  -ms-transition: 0.2s ease-out;
  transition: 0.2s ease-out;
  z-index: 1;
  background: #fff;
}
.mobile-nav-on #wrap {
  left: 280px;
}
.outer {
  max-width: 920px;
  margin: 0 auto;
  padding: 0 20px;
}
.outer:before,
.outer:after {
  content: "";
  display: table;
}
.outer:after {
  clear: both;
}
@media screen and (min-width: 768px) {
  #main {
    width: 768px;
    padding-right: 50px;
    margin: 0 auto;
  }
}
.article-date,
.article-category-link,
.archive-year {
  text-decoration: none;
  color: #999;
  line-height: 1em;
}
.article-inner,
.archive-article-inner {
  background: #fff;
}
.article-entry h1,
#author-card h1 {
  font-size: 2em;
}
.article-entry h2,
#author-card h2 {
  font-size: 1.5em;
}
.article-entry h3,
#author-card h3 {
  font-size: 1.3em;
}
.article-entry h4,
#author-card h4 {
  font-size: 1.2em;
}
.article-entry h5,
#author-card h5 {
  font-size: 1em;
}
.article-entry h6,
#author-card h6 {
  font-size: 1em;
  color: #999;
}
.article-entry hr,
#author-card hr {
  border: 1px dashed #ddd;
}
.article-entry strong,
#author-card strong {
  font-weight: bold;
}
.article-entry em,
#author-card em,
.article-entry cite,
#author-card cite {
  font-style: italic;
}
.article-entry sup,
#author-card sup,
.article-entry sub,
#author-card sub {
  font-size: 0.75em;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
.article-entry sup,
#author-card sup {
  top: -0.5em;
}
.article-entry sub,
#author-card sub {
  bottom: -0.2em;
}
.article-entry small,
#author-card small {
  font-size: 0.85em;
}
.article-entry acronym,
#author-card acronym,
.article-entry abbr,
#author-card abbr {
  border-bottom: 1px dotted;
}
.article-entry ul,
#author-card ul,
.article-entry ol,
#author-card ol,
.article-entry dl,
#author-card dl {
  margin: 0 20px;
  line-height: 1.6em;
}
.article-entry ul ul,
#author-card ul ul,
.article-entry ol ul,
#author-card ol ul,
.article-entry ul ol,
#author-card ul ol,
.article-entry ol ol,
#author-card ol ol {
  margin-top: 0;
  margin-bottom: 0;
}
.article-entry ul,
#author-card ul {
  list-style: disc;
}
.article-entry ol,
#author-card ol {
  list-style: decimal;
}
.article-entry dt,
#author-card dt {
  font-weight: bold;
}
.article {
  margin: 50px 0;
  border-bottom: 1px dashed #d9d9d9;
}
.article-inner {
  overflow: hidden;
}
.article-meta:before,
.article-meta:after {
  content: "";
  display: table;
}
.article-meta:after {
  clear: both;
}
.article-date {
  float: left;
}
.article-category {
  float: left;
  line-height: 1em;
  color: #ccc;
  text-shadow: 0 1px #fff;
  margin-left: 8px;
}
.article-category:before {
  content: "#";
}
.article-category-link {
  margin: 0 5px 0 0;
}
.article-header {
  padding: 20px 0;
}
.article-title {
  text-decoration: none;
  font-size: 1.8em;
  font-weight: bold;
  color: #555;
  line-height: 1.1em;
  -webkit-transition: color 0.2s;
  -moz-transition: color 0.2s;
  -ms-transition: color 0.2s;
  transition: color 0.2s;
}
a.article-title:hover {
  color: #991a1a;
}
.article-entry {
  color: #555;
  padding: 0;
  padding-bottom: 20px;
}
.article-entry:before,
.article-entry:after {
  content: "";
  display: table;
}
.article-entry:after {
  clear: both;
}
.article-entry p,
.article-entry table {
  line-height: 1.6em;
  margin: 1.6em 0;
}
.article-entry h1,
.article-entry h2,
.article-entry h3,
.article-entry h4,
.article-entry h5,
.article-entry h6 {
  font-weight: bold;
}
.article-entry h1,
.article-entry h2,
.article-entry h3,
.article-entry h4,
.article-entry h5,
.article-entry h6 {
  line-height: 1.1em;
  margin: 1.1em 0;
}
.article-entry a {
  color: #991a1a;
  text-decoration: none;
}
.article-entry a:hover {
  text-decoration: underline;
}
.article-entry ul,
.article-entry ol,
.article-entry dl {
  margin-top: 1.6em;
  margin-bottom: 1.6em;
}
.article-entry img,
.article-entry video {
  max-width: 100%;
  height: auto;
  display: block;
  margin: auto;
}
.article-entry iframe {
  border: none;
}
.article-entry table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}
.article-entry th {
  font-weight: bold;
  border-bottom: 3px solid #ddd;
  padding-bottom: 0.5em;
}
.article-entry td {
  border-bottom: 1px solid #ddd;
  padding: 10px 0;
}
.article-entry blockquote {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1em;
  background: #f7f7f7;
  margin: 20px 0;
  padding: 10px 20px;
  border-left: 4px solid #991a1a;
}
.article-entry blockquote p {
  margin: 10px 0;
  word-break: break-word;
}
.article-entry blockquote footer {
  font-size: 14px;
  margin: 1.6em 0;
  font-family: "Helvetica Neue", Helvetica, Arial, "Hiragino Sans GB", "Hiragino Sans GB W3", "WenQuanYi Micro Hei", sans-serif;
}
.article-entry blockquote footer cite:before {
  content: "—";
  padding: 0 0.5em;
}
.article-entry .pullquote {
  text-align: left;
  width: 45%;
  margin: 0;
}
.article-entry .pullquote.left {
  margin-left: 0.5em;
  margin-right: 1em;
}
.article-entry .pullquote.right {
  margin-right: 0.5em;
  margin-left: 1em;
}
.article-entry .caption {
  color: #999;
  display: block;
  font-size: 0.9em;
  margin-top: 0.5em;
  position: relative;
  text-align: center;
}
.article-entry .video-container {
  position: relative;
  padding-top: 56.25%;
  height: 0;
  overflow: hidden;
}
.article-entry .video-container iframe,
.article-entry .video-container object,
.article-entry .video-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin-top: 0;
}
.article-entry .tag-list {
  padding: 20px 0;
  margin: 0 0 20px 0;
}
.article-entry .tag-list .tag-list-item {
  list-style: none;
  float: left;
  margin-right: 20px;
}
.article-entry .tag-list .tag-list-item a {
  padding-right: 5px;
}
.article-entry .tag-list .tag-list-item span.tag-list-count {
  color: #ccc;
}
.article-entry .tag-list .tag-list-item span.tag-list-count:before {
  content: '(';
}
.article-entry .tag-list .tag-list-item span.tag-list-count:after {
  content: ')';
}
.article-more-link a {
  display: inline-block;
  line-height: 1em;
  padding: 6px 0;
  border-radius: 15px;
  background: #fff;
  color: #991a1a;
  text-shadow: 0 1px #fff;
  text-decoration: none;
}
.article-more-link a:hover {
  color: #991a1a;
  text-decoration: none;
}
.article-footer {
  font-size: 0.85em;
  line-height: 1.6em;
  border-top: 1px solid #ddd;
  padding-top: 1.6em;
  margin: 0 20px 20px;
}
.article-footer:before,
.article-footer:after {
  content: "";
  display: table;
}
.article-footer:after {
  clear: both;
}
.article-footer a {
  color: #999;
  text-decoration: none;
}
.article-footer a:hover {
  color: #555;
}
.article-tag-list-item {
  float: left;
  margin-right: 10px;
}
.article-tag-list-link:before {
  content: "#";
}
#article-nav {
  position: relative;
}
#article-nav:before,
#article-nav:after {
  content: "";
  display: table;
}
#article-nav:after {
  clear: both;
}
@media screen and (min-width: 768px) {
  #article-nav {
    margin: 50px 0;
  }
  #article-nav:before {
    width: 8px;
    height: 8px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -4px;
    margin-left: -4px;
    content: "";
    border-radius: 50%;
    background: #ddd;
    -webkit-box-shadow: 0 1px 2px #fff;
    box-shadow: 0 1px 2px #fff;
  }
}
.article-nav-link-wrap {
  text-decoration: none;
  text-shadow: 0 1px #fff;
  color: #999;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin-top: 50px;
  text-align: center;
  display: block;
}
.article-nav-link-wrap:hover {
  color: #555;
}
@media screen and (min-width: 768px) {
  .article-nav-link-wrap {
    width: 50%;
    margin-top: 0;
  }
}
@media screen and (min-width: 768px) {
  #article-nav-newer {
    float: left;
    text-align: right;
    padding-right: 20px;
  }
}
@media screen and (min-width: 768px) {
  #article-nav-older {
    float: right;
    text-align: left;
    padding-left: 20px;
  }
}
.article-nav-caption {
  text-transform: uppercase;
  letter-spacing: 2px;
  color: #ddd;
  line-height: 1em;
  font-weight: bold;
}
#article-nav-newer .article-nav-caption {
  margin-right: -2px;
}
.article-nav-title {
  font-size: 0.85em;
  line-height: 1.6em;
  margin-top: 0.5em;
}
.article-share-box {
  position: absolute;
  display: none;
  background: #fff;
  -webkit-box-shadow: 1px 2px 10px rgba(0,0,0,0.2);
  box-shadow: 1px 2px 10px rgba(0,0,0,0.2);
  border-radius: 3px;
  margin-left: -145px;
  overflow: hidden;
  z-index: 1;
}
.article-share-box.on {
  display: block;
}
.article-share-input {
  width: 100%;
  background: none;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  font: 14px "Helvetica Neue", Helvetica, Arial, "Hiragino Sans GB", "Hiragino Sans GB W3", "WenQuanYi Micro Hei", sans-serif;
  padding: 0 15px;
  color: #555;
  outline: none;
  border: 1px solid #ddd;
  border-radius: 3px 3px 0 0;
  height: 36px;
  line-height: 36px;
}
.article-share-links {
  background: #fff;
}
.article-share-links:before,
.article-share-links:after {
  content: "";
  display: table;
}
.article-share-links:after {
  clear: both;
}
.article-gallery {
  background: #000;
  position: relative;
}
.article-gallery-photos {
  position: relative;
  overflow: hidden;
}
.article-gallery-img {
  display: none;
  max-width: 100%;
}
.article-gallery-img:first-child {
  display: block;
}
.article-gallery-img.loaded {
  position: absolute;
  display: block;
}
.article-gallery-img img {
  display: block;
  max-width: 100%;
  margin: 0 auto;
}
.article .fb-like-button {
  margin: auto;
  text-align: center;
  line-height: 1.6em;
  font-size: 0.85em;
  font-style: italic;
}
#author-card {
  color: #999;
  margin: auto;
  text-align: center;
  line-height: 1.6em;
  font-size: 0.85em;
  font-style: italic;
}
#author-card .avatar {
  margin: 1rem 0;
  width: 100px;
  border-radius: 50%;
}
#author-card .social-links {
  margin: 1.6em 0;
}
#author-card .social-links a {
  text-decoration: none;
  font-size: 22px;
  color: #000;
}
#comments {
  background: #fff;
  margin: 50px 0;
}
#comments a {
  color: #991a1a;
}
.archives-wrap {
  margin: 50px 0;
}
.archives:before,
.archives:after {
  content: "";
  display: table;
}
.archives:after {
  clear: both;
}
.archive-year-wrap {
  margin-bottom: 1em;
}
.archives {
  -webkit-column-gap: 10px;
  -moz-column-gap: 10px;
  column-gap: 10px;
}
@media screen and (min-width: 480px) and (max-width: 767px) {
  .archives {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
  }
}
@media screen and (min-width: 768px) {
  .archives {
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
  }
}
.archive-article {
  -webkit-column-break-inside: avoid;
  page-break-inside: avoid;
  overflow: hidden;
  break-inside: avoid-column;
}
.archive-article-inner {
  padding: 10px;
  margin-bottom: 15px;
}
.archive-article-title {
  text-decoration: none;
  font-weight: bold;
  color: #555;
  -webkit-transition: color 0.2s;
  -moz-transition: color 0.2s;
  -ms-transition: color 0.2s;
  transition: color 0.2s;
  line-height: 1.6em;
}
.archive-article-title:hover {
  color: #991a1a;
}
.archive-article-footer {
  margin-top: 1em;
}
.archive-article-date {
  color: #999;
  text-decoration: none;
  font-size: 0.85em;
  line-height: 1em;
  margin-bottom: 0.5em;
  display: block;
}
#page-nav {
  margin: 40px auto;
  background: #fff;
  text-align: center;
  color: #999;
  overflow: hidden;
}
#page-nav:before,
#page-nav:after {
  content: "";
  display: table;
}
#page-nav:after {
  clear: both;
}
#page-nav a,
#page-nav span {
  padding: 10px 10px;
  line-height: 1;
  height: 2ex;
}
#page-nav a {
  color: #999;
  text-decoration: none;
}
#page-nav a:hover {
  background: #991a1a;
  color: #fff;
}
#page-nav .prev {
  float: left;
}
#page-nav .next {
  float: right;
}
#page-nav .page-number {
  display: inline-block;
}
@media screen and (max-width: 479px) {
  #page-nav .page-number {
    display: none;
  }
}
#page-nav .current {
  color: #991a1a;
  font-weight: bold;
}
#page-nav .space {
  color: #ddd;
}
#footer {
  background: #fff;
  color: #999;
  padding: 30px 20px;
}
@media screen and (min-width: 768px) {
  #footer {
    width: 768px;
    margin: 0 auto;
    padding: 30px 0;
    padding-right: 50px;
  }
}
#footer a {
  color: #991a1a;
  text-decoration: none;
}
#footer a:hover {
  text-decoration: underline;
}
#footer-info {
  line-height: 1.6em;
  font-size: 0.85em;
  padding: 0;
  margin: 0;
}
.article-entry pre,
.article-entry .highlight {
  border-radius: 4px;
  background: #f7f7f7;
  margin: 0 -10px;
  padding: 10px 10px;
  overflow: auto;
  color: #666;
  line-height: 22.400000000000002px;
}
.article-entry .highlight .gutter pre {
  color: #666;
  font-size: 0.85em;
}
.article-entry pre,
.article-entry code {
  font-family: "Source Code Pro", Consolas, Monaco, Menlo, Consolas, monospace;
}
.article-entry code {
  background: #fff;
  text-shadow: 0 1px #fff;
  padding: 0 0.3em;
}
.article-entry pre code {
  background: none;
  text-shadow: none;
  padding: 0;
}
.article-entry .highlight pre {
  border: none;
  margin: 0;
  padding: 0;
}
.article-entry .highlight table {
  margin: 0;
  width: auto;
}
.article-entry .highlight td {
  border: none;
  padding: 0;
}
.article-entry .highlight figcaption {
  padding: 0 10px;
  font-size: 0.85em;
  color: #999;
  line-height: 1em;
  margin-bottom: 1em;
}
.article-entry .highlight figcaption:before,
.article-entry .highlight figcaption:after {
  content: "";
  display: table;
}
.article-entry .highlight figcaption:after {
  clear: both;
}
.article-entry .highlight figcaption a {
  float: right;
}
.article-entry .highlight .gutter pre {
  text-align: right;
  padding: 0 10px;
  border-right: 1px solid #ddd;
  margin-right: 10px;
  border-radius: 0;
}
.article-entry .highlight .line {
  height: 22.400000000000002px;
}
pre .comment,
pre .title {
  color: #999;
}
pre .variable,
pre .attribute,
pre .tag,
pre .regexp,
pre .ruby .constant,
pre .xml .tag .title,
pre .xml .pi,
pre .xml .doctype,
pre .html .doctype,
pre .css .id,
pre .css .class,
pre .css .pseudo {
  color: #f2777a;
}
pre .number,
pre .preprocessor,
pre .built_in,
pre .literal,
pre .params,
pre .constant {
  color: #f99157;
}
pre .class,
pre .ruby .class .title,
pre .css .rules .attribute {
  color: #9c9;
}
pre .string,
pre .value,
pre .inheritance,
pre .header,
pre .ruby .symbol,
pre .xml .cdata {
  color: #9c9;
}
pre .css .hexcolor {
  color: #6cc;
}
pre .function,
pre .python .decorator,
pre .python .title,
pre .ruby .function .title,
pre .ruby .title .keyword,
pre .perl .sub,
pre .javascript .title,
pre .coffeescript .title {
  color: #69c;
}
pre .keyword,
pre .javascript .function {
  color: #c9c;
}
@media screen and (max-width: 479px) {
  #mobile-nav {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 45px;
    background: #2a2a2a;
    z-index: 999;
  }
}
@media screen and (max-width: 479px) {
  .mobile-nav-link {
    float: left;
    color: #fff;
    text-decoration: none;
    text-align: center;
    line-height: 45px;
    padding: 0 20px;
  }
  .mobile-nav-link:hover {
    color: #fff;
  }
}
@media screen and (min-width: 480px) and (max-width: 767px) {
  #mobile-nav {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 45px;
    background: #2a2a2a;
    z-index: 999;
  }
}
@media screen and (min-width: 480px) and (max-width: 767px) {
  .mobile-nav-link {
    float: left;
    color: #fff;
    text-decoration: none;
    text-align: center;
    line-height: 45px;
    padding: 0 20px;
  }
  .mobile-nav-link:hover {
    color: #fff;
  }
}
#sidebar {
  display: none;
}
@media screen and (min-width: 768px) {
  #sidebar {
    display: block;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    width: 50px;
    height: 100%;
    background: #2a2a2a;
  }
  #sidebar a#go-top {
    position: absolute;
    bottom: 10px;
    left: 0;
    width: 50px;
    height: 50px;
    color: #fff;
    text-align: center;
    line-height: 50px;
    text-decoration: none;
  }
  #sidebar a#go-top i.icon {
    font-family: "iconfont" !important;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -webkit-text-stroke-width: 0.2px;
    -moz-osx-font-smoothing: grayscale;
    font-size: 20px;
  }
  #sidebar a#go-top i.icon.icon-up:before {
    content: "\e606";
  }
  #sidebar .menus {
    padding-top: 10px;
  }
  #sidebar .menus ul li a {
    display: block;
    width: 50px;
    height: 50px;
    margin-bottom: 5px;
    text-align: center;
    line-height: 50px;
    text-decoration: none;
    color: #fff;
  }
  #sidebar .menus ul li a:hover {
    color: #999;
  }
  #sidebar .menus ul li a i.icon {
    font-family: "iconfont" !important;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -webkit-text-stroke-width: 0.2px;
    -moz-osx-font-smoothing: grayscale;
    font-size: 20px;
  }
  #sidebar .menus ul li a i.icon.icon-home:before {
    content: "\e600";
  }
  #sidebar .menus ul li a i.icon.icon-fenlei:before {
    content: "\e603";
  }
  #sidebar .menus ul li a i.icon.icon-tag:before {
    content: "\e601";
  }
  #sidebar .menus ul li a i.icon.icon-github:before {
    content: "\e604";
  }
}
.gist {
  color: #000;
}
.gist div {
  padding: 0;
  margin: 0;
}
.gist .gist-file {
  border: 1px solid #dedede; /* gray */
  font-family: Monaco, 'Courier New', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', monospace;
  margin-bottom: 1em;
}
.gist .gist-file .gist-meta {
  overflow: hidden;
  font-size: 85%;
  padding: 0.5em 12px;
  color: #666;
  background-color: #f5f5f5;
  font-size: 12px;
}
.gist .gist-file .gist-meta a {
  color: #666;
}
.gist .gist-file .gist-meta a:visited {
  color: #991a1a;
}
.gist .gist-file .gist-data {
  overflow: auto;
  word-wrap: normal;
  background-color: #f8f8ff;
  border-bottom: 1px solid #ddd;
  font-size: 100%;
}
.gist .gist-file .gist-data pre {
  font-family: 'Bitstream Vera Sans Mono', 'Courier', monospace;
  background: transparent !important;
  margin: 0 !important;
  border: none !important;
  padding: 0.25em 0.5em 0.5em 0.5em !important;
}
.gist .gist-file .gist-data .gist-highlight {
  background: transparent !important;
}
.gist .gist-file .gist-data .gist-line-numbers {
  background-color: #ececec;
  color: #aaa;
  border-right: 1px solid #ddd;
  text-align: right;
}
.gist .gist-file .gist-data .gist-line-numbers span {
  clear: right;
  display: block;
}