html,
body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  position: relative;
}
a {
  color: #0e7cf1;
  transition: 0.1s;
}
a:hover {
  color: #0e88f1;
  text-shadow: 0 0 0.5em #fff;
}
body {
  background-color: #eee;
  font: 300 1em PingFang SC, Lantinghei SC, Microsoft Yahei, Hiragino Sans GB, Microsoft Sans Serif, WenQuanYi Micro Hei, sans;
  text-rendering: optimizelegibility;
}
.page {
  margin: auto;
  max-width: 800px;
}
.page .page-heading {
  text-align: center;
  font-size: 1.2em;
  padding-top: 1em;
}
.wrap {
  background-color: #fff;
  padding: 1em 0;
  min-height: 3em;
}
header {
  background-color: #eee;
  font-size: 1.1em;
  padding-top: 0.8em;
  position: relative;
  border-bottom: 1px solid #ccc;
  z-index: 100;
  height: 4em;
}
header .page {
  position: relative;
  width: 100%;
  height: 100%;
}
header nav {
  position: absolute;
  bottom: 0;
  padding: 0;
  width: 100%;
}
header nav:after {
  content: ' ';
  display: block;
  clear: both;
}
header nav ul {
  padding: 0;
  margin: 0;
}
header nav ul.brand {
  float: left;
}
header nav ul.brand a.on:after {
  width: 1em;
  height: 1em;
}
header nav ul.blog {
  float: left;
  color: #aaa;
}
header nav ul.blog:before {
  content: '{';
  display: inline-block;
  float: left;
  padding: 0.5em 0;
  line-height: 2;
}
header nav ul.blog:after {
  content: '}';
  display: inline-block;
  float: right;
  padding: 0.5em 0;
  line-height: 2;
}
header nav ul.brand li:hover a:after,
header nav ul.blog li:hover a:after {
  width: 1em;
  height: 1em;
}
header nav ul.brand li a.on,
header nav ul.blog li a.on {
  color: #0e7cf1;
  font-weight: bolder;
}
header nav ul.brand li a.on:hover,
header nav ul.blog li a.on:hover {
  color: #87ceeb;
}
header nav ul.brand li a.on:after,
header nav ul.blog li a.on:after {
  width: 1em;
  height: 1em;
}
header nav ul.social {
  float: right;
}
header nav ul.social li a {
  color: #acacac;
}
header nav ul.social li a:hover {
  color: #888;
}
header nav ul.social li a.fa-git:hover {
  color: #008000;
}
header nav ul.social li a.fa-github:hover {
  color: #222;
}
header nav ul.social li a.fa-weibo:hover {
  color: #f00;
}
header nav ul li {
  display: inline-block;
  position: relative;
  padding: 0.5em;
  line-height: 2;
}
header nav ul li a {
  text-decoration: none;
  color: #0e7cf1;
  transition: 1s;
}
header nav ul li a:after {
  content: ' ';
  width: 0em;
  height: 0em;
  position: absolute;
  left: 50%;
  bottom: -0.5em;
  transform: translate(-50%, 0) rotate(45deg);
  border-top: 1px solid #ccc;
  border-left: 1px solid #ccc;
  background-color: #fff;
  transition: 0.1s;
}
header nav ul li a:hover {
  color: #87ceeb;
}
footer {
  position: relative;
  background-color: #eee;
  color: #acacac;
  border-top: 1px solid #ccc;
  z-index: 100;
  height: 5em;
}
footer .page {
  position: relative;
  padding-top: 0.5em;
}
footer address.author {
  font-style: normal;
  position: relative;
  display: inline-block;
  padding-top: 0.5em;
}
footer a {
  color: #aaa;
}
footer a:hover {
  color: #888;
}
footer .rss {
  position: absolute;
  right: 0;
  bottom: 0;
}
footer .rss a {
  text-decoration: none;
  font-size: 2.5em;
}
.home {
  position: relative;
  background-size: cover;
  background-position: center;
}
.home .overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 0;
}
.home .page {
  position: relative;
}
.home .profile.card {
  text-align: center;
  font-family: 'HanziPen SC', fantasy;
}
.home .profile.card img {
  border-radius: 50%;
}
.archives .card {
  padding-top: 0.5em;
  padding-bottom: 1em;
  padding-left: 1.5em;
  padding-right: 1em;
}
.archives .card .heading {
  position: relative;
}
.archives .card .heading h1 {
  font-size: 1.5em;
}
.archives .card .heading a {
  text-decoration: none;
  color: #666;
}
.archives .card .heading .date {
  float: right;
  color: #ccc;
  font-size: 1.5em;
}
.archives .card .heading:before {
  content: '#';
  position: absolute;
  left: -1em;
  color: #87ceeb;
  font-size: 1.5em;
}
.archives .card .body {
  text-align: justify;
  color: #888;
}
.archives .card .body blockquote {
  background-color: #f1f1f1;
  border-left: 0.5em solid #ccc;
  margin: 0;
  padding: 0 0 0 1em;
}
.archives .card .meta .more {
  font-size: 0.9em;
  color: #888;
}
.archives .page-nav {
  margin: 0;
  padding: 0.5em 0;
  text-align: center;
}
.archives .page-nav span,
.archives .page-nav a {
  display: inline-block;
  padding: 0 0.2em;
  text-decoration: none;
}
.tag-list {
  text-align: center;
  padding: 1em 0;
  margin: auto;
  width: 50%;
}
.tag-list .tag-link {
  display: inline-block;
  background-color: #87ceeb;
  color: #fff;
  border-radius: 0.3em;
  padding: 0.4em;
  margin: 0.3em;
  text-decoration: none;
}
.tag-list .tag-link .tag-count {
  display: inline-block;
  border-radius: 50%;
  margin-left: 0.2em;
  width: 1.4em;
  height: 1.4em;
  background-color: #ffa500;
  color: #fff;
}
.tag-list:after {
  content: ' ';
  display: block;
  clear: both;
}
.post.wrap .post-heading {
  text-align: center;
  margin-top: 1.8em;
  margin-bottom: 0;
}
.post.wrap .post-heading h1 {
  font-size: 1.8em;
  font-weight: bolder;
  margin: 0;
}
.post.wrap .post-meta {
  text-align: right;
  border-radius: 0.5em;
  padding: 0.5em 19px;
  margin: 0.5em 0;
}
.post.wrap .post-meta .author a {
  text-decoration: none;
}
.post.wrap .post-meta .tag {
  background-color: #ffa500;
  border-radius: 0.3em;
  padding: 0 0.3em;
  margin-left: 0.2em;
  text-decoration: none;
  color: #fff;
  transition: 0.5s;
}
.post.wrap .post-meta .taghover {
  background-color: #fc6;
}
.post.wrap .post-body {
  margin-bottom: 3em;
  padding: 0 19px;
}
.post.wrap .post-body > p {
  text-align: justify;
}
.post.wrap .post-body blockquote {
  background-color: #f1f1f1;
  border-left: 0.5em solid #ccc;
  margin: 0;
  padding: 0em 0 0 1em;
}
.post.wrap .post-body a {
  color: #4183c4;
}
.post.wrap .post-body h1,
.post.wrap .post-body h2,
.post.wrap .post-body h3,
.post.wrap .post-body h4,
.post.wrap .post-body h5,
.post.wrap .post-body h6 {
  position: relative;
  margin-top: 1rem;
  margin-bottom: 1rem;
  font-weight: bold;
  line-height: 1.4;
  cursor: text;
}
.post.wrap .post-body h1 a.anchor,
.post.wrap .post-body h2 a.anchor,
.post.wrap .post-body h3 a.anchor,
.post.wrap .post-body h4 a.anchor,
.post.wrap .post-body h5 a.anchor,
.post.wrap .post-body h6 a.anchor,
.post.wrap .post-body h1:hover a.anchor,
.post.wrap .post-body h2:hover a.anchor,
.post.wrap .post-body h3:hover a.anchor,
.post.wrap .post-body h4:hover a.anchor,
.post.wrap .post-body h5:hover a.anchor,
.post.wrap .post-body h6:hover a.anchor {
  text-decoration: none;
  padding-right: 0.2em;
}
.post.wrap .post-body h1 tt,
.post.wrap .post-body h1 code {
  font-size: inherit;
}
.post.wrap .post-body h2 tt,
.post.wrap .post-body h2 code {
  font-size: inherit;
}
.post.wrap .post-body h3 tt,
.post.wrap .post-body h3 code {
  font-size: inherit;
}
.post.wrap .post-body h4 tt,
.post.wrap .post-body h4 code {
  font-size: inherit;
}
.post.wrap .post-body h5 tt,
.post.wrap .post-body h5 code {
  font-size: inherit;
}
.post.wrap .post-body h6 tt,
.post.wrap .post-body h6 code {
  font-size: inherit;
}
.post.wrap .post-body h1 {
  padding-bottom: 0.3em;
  font-size: 1.3em;
  line-height: 1.2;
  border-bottom: 1px solid #eee;
}
.post.wrap .post-body h2 {
  padding-bottom: 0.3em;
  font-size: 1.2em;
  line-height: 1.225;
  border-bottom: 1px solid #eee;
}
.post.wrap .post-body h3 {
  font-size: 1.1em;
  line-height: 1.43;
}
.post.wrap .post-body h4 {
  font-size: 1.05em;
}
.post.wrap .post-body h5 {
  font-size: 1em;
}
.post.wrap .post-body h6 {
  font-size: 1em;
  color: #777;
}
.post.wrap .post-body p,
.post.wrap .post-body blockquote,
.post.wrap .post-body ul,
.post.wrap .post-body ol,
.post.wrap .post-body dl,
.post.wrap .post-body table {
  margin: 0.8em 0;
}
.post.wrap .post-body li>ol,
.post.wrap .post-body li>ul {
  margin: 0 0;
}
.post.wrap .post-body hr {
  height: 4px;
  padding: 0;
  margin: 16px 0;
  background-color: #e7e7e7;
  border: 0 none;
  overflow: hidden;
  box-sizing: content-box;
  border-bottom: 1px solid #ddd;
}
.post.wrap .post-body > h2:first-child {
  margin-top: 0;
  padding-top: 0;
}
.post.wrap .post-body > h1:first-child {
  margin-top: 0;
  padding-top: 0;
}
.post.wrap .post-body > h1:first-child + h2 {
  margin-top: 0;
  padding-top: 0;
}
.post.wrap .post-body > h3:first-child,
.post.wrap .post-body > h4:first-child,
.post.wrap .post-body > h5:first-child,
.post.wrap .post-body > h6:first-child {
  margin-top: 0;
  padding-top: 0;
}
.post.wrap .post-body a:first-child h1,
.post.wrap .post-body a:first-child h2,
.post.wrap .post-body a:first-child h3,
.post.wrap .post-body a:first-child h4,
.post.wrap .post-body a:first-child h5,
.post.wrap .post-body a:first-child h6 {
  margin-top: 0;
  padding-top: 0;
}
.post.wrap .post-body h1 p,
.post.wrap .post-body h2 p,
.post.wrap .post-body h3 p,
.post.wrap .post-body h4 p,
.post.wrap .post-body h5 p,
.post.wrap .post-body h6 p {
  margin-top: 0;
}
.post.wrap .post-body li p.first {
  display: inline-block;
}
.post.wrap .post-body ul,
.post.wrap .post-body ol {
  padding-left: 30px;
}
.post.wrap .post-body ul:first-child,
.post.wrap .post-body ol:first-child {
  margin-top: 0;
}
.post.wrap .post-body ul:last-child,
.post.wrap .post-body ol:last-child {
  margin-bottom: 0;
}
.post.wrap .post-body blockquote {
  border-left: 4px solid #ddd;
  padding: 0 15px;
  color: #777;
}
.post.wrap .post-body blockquote blockquote {
  padding-right: 0;
}
.post.wrap .post-body table {
  width: 100%;
  padding: 0;
  margin: 0;
  border-collapse: collapse;
}
.post.wrap .post-body table tr {
  border-top: 1px solid #acacac;
  margin: 0;
  padding: 0;
}
.post.wrap .post-body table tr th {
  font-weight: bold;
  border: 1px solid #acacac;
  text-align: left;
  margin: 0;
  padding: 6px 13px;
  background: #acacac;
  color: #fff;
}
.post.wrap .post-body table tr td {
  border: 1px solid #acacac;
  text-align: left;
  margin: 0;
  padding: 6px 13px;
}
.post.wrap .post-body table tr th:first-child,
.post.wrap .post-body table tr td:first-child {
  margin-top: 0;
}
.post.wrap .post-body table tr th:last-child,
.post.wrap .post-body table tr td:last-child {
  margin-bottom: 0;
}
.post.wrap .post-body table tr:nth-child(2n) {
  background-color: #f8f8f8;
}
.resume.wrap .page {
  padding-left: 1.5em;
}
.resume.wrap .page h1 {
  font-size: 1.2em;
  position: relative;
}
.resume.wrap .page h1:not(:first-child) {
  padding-top: 1em;
}
.resume.wrap .page h1:before {
  content: "#";
  color: #0cf;
  position: absolute;
  left: -1em;
}
.resume.wrap .page table {
  width: 100%;
}
.resume.wrap .page table th {
  text-align: right;
}
.post-body pre,
.post-body .highlight {
  background: #fafafa;
  margin: 0;
  padding: 0;
  border-style: solid;
  border-color: #ddd;
  border-width: 1px 0;
  overflow: auto;
  color: #4d4d4c;
  line-height: 20.8px;
}
.post-body .highlight .gutter pre,
.post-body .gist .gist-file .gist-data .line-numbers {
  color: #8e908c;
  font-size: 0.85em;
}
.post-body pre,
.post-body code {
  font-family: "Source Code Pro", Consolas, Monaco, Menlo, Consolas, monospace;
}
.post-body code {
  background: #eee;
  border-radius: 0.2em;
  text-shadow: 0 1px #fff;
  padding: 0 0.3em;
}
.post-body pre code {
  background: none;
  text-shadow: none;
  padding: 0;
}
.post-body .highlight .code {
  border-width: 0 !important;
}
.post-body .highlight .gutter {
  border-width: 0 !important;
}
.post-body .highlight pre {
  border: none;
  margin: 0;
  padding: 0;
}
.post-body .highlight table {
  margin: 0 !important;
  width: auto !important;
}
.post-body .highlight table tr {
  border-top: none !important;
}
.post-body .highlight table td {
  border: none;
  padding: 0;
}
.post-body .highlight figcaption {
  font-size: 0.85em;
  color: #8e908c;
  line-height: 1em;
  margin-bottom: 1em;
}
.post-body .highlight figcaption a {
  float: right;
}
.post-body .highlight .gutter pre {
  text-align: right;
  padding-right: 20px;
}
.post-body .highlight .line {
  height: 20.8px;
}
.post-body .highlight .line.marked {
  background: #d6d6d6;
}
.post-body .gist {
  margin: 0;
  border-style: solid;
  border-color: #ddd;
  border-width: 1px 0;
  background: #fafafa;
  padding: 15px 0 15px 0;
}
.post-body .gist .gist-file {
  border: none;
  font-family: "Source Code Pro", Consolas, Monaco, Menlo, Consolas, monospace;
  margin: 0;
}
.post-body .gist .gist-file .gist-data {
  background: none;
  border: none;
}
.post-body .gist .gist-file .gist-data .line-numbers {
  background: none;
  border: none;
  padding: 0 20px 0 0;
}
.post-body .gist .gist-file .gist-data .line-data {
  padding: 0 !important;
}
.post-body .gist .gist-file .highlight {
  margin: 0;
  padding: 0;
  border: none;
}
.post-body .gist .gist-file .gist-meta {
  background: #fafafa;
  color: #8e908c;
  font: 0.85em "Helvetica Neue", Helvetica, Arial, sans-serif;
  text-shadow: 0 0;
  padding: 0;
  margin-top: 1em;
  margin-left: 20px;
}
.post-body .gist .gist-file .gist-meta a {
  color: #258fb8;
  font-weight: normal;
}
.post-body .gist .gist-file .gist-meta ahover {
  text-decoration: underline;
}
pre .comment,
pre .title {
  color: #8e908c;
}
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: #c82829;
}
pre .number,
pre .preprocessor,
pre .built_in,
pre .literal,
pre .params,
pre .constant {
  color: #f5871f;
}
pre .class,
pre .ruby .class .title,
pre .css .rules .attribute {
  color: #718c00;
}
pre .string,
pre .value,
pre .inheritance,
pre .header,
pre .ruby .symbol,
pre .xml .cdata {
  color: #718c00;
}
pre .css .hexcolor {
  color: #3e999f;
}
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: #4271ae;
}
pre .keyword,
pre .javascript .function {
  color: #8959a8;
}