@import url("//fonts.useso.com/css?family=Lato:400,400italic");
@font-face {
  font-family: 'FontAwesome';
  font-style: normal;
  font-weight: normal;
  src: url("font/fontawesome-webfont.eot?#iefix") format('embedded-opentype'), url("font/fontawesome-webfont.woff") format('woff'), url("font/fontawesome-webfont.ttf") format('truetype'), url("font/fontawesome-webfont.svg#FontAwesomeRegular") format('svg');
}
* {
  margin: 0;
  padding: 0;
}
body {
  background: #eee;
  color: #000;
  font-family: Georgia, 'Times New Roman', Times, 'Songti SC', SimSun, "Microsoft YaHei", serif;
  font-size: 16px;
  font-weight: 500;
  text-shadow: 0 0 2px transparent;
}
@media screen and (max-width: 1260px) {
  body {
    margin: 0 30px;
  }
}
@media screen and (max-width: 600px) {
  body {
    font-size: 13px;
  }
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: Helvetica Neue, Helvetica, Arial, "Hiragino Sans GB", sans-serif;
}
h1 {
  font-size: 1.8em;
}
h2 {
  font-size: 1.5em;
}
h3 {
  font-size: 1.3em;
}
a {
  text-decoration: none;
  color: #0085ff;
}
a:hover {
  color: #102b6a;
}
.alignleft {
  float: left;
}
.alignright {
  float: right;
}
.clearfix {
  zoom: 1;
}
.clearfix:before,
.clearfix:after {
  content: "";
  display: table;
}
.clearfix:after {
  clear: both;
}
.inner {
  width: 94%;
  margin: 0 auto;
}
@media screen and (max-width: 1260px) {
  .inner {
    width: 100%;
  }
}
#main-col {
  width: 75%;
}
@media screen and (max-width: 1260px) {
  #main-col {
    width: 100%;
    margin-right: -300px;
  }
}
@media screen and (max-width: 950px) {
  #main-col {
    margin-right: 0;
    float: none;
  }
}
#wrapper {
  margin-top: 30px;
}
@media screen and (max-width: 1260px) {
  #wrapper {
    margin-right: 300px;
  }
}
@media screen and (max-width: 950px) {
  #wrapper {
    margin-right: 0;
  }
}
body >header {
  width: 100%;
  -webkit-box-shadow: 2px 4px 5px rgba(3,3,3,0.2);
  box-shadow: 2px 4px 5px rgba(3,3,3,0.2);
  background: #2ca6cb;
  color: #fff;
  padding: 1em 0 0.8em;
}
@media only screen and (min-width: 1024px) {
  body >header {
    padding: 1.8em 0 1.5em;
  }
}
body >header >div {
  width: 95%;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
}
@media only screen and (min-width: 1024px) {
  body >header >div {
    width: 93%;
  }
}
body >header a {
  display: block;
  color: #fff;
}
#imglogo {
  float: left;
  width: 4em;
  height: 4em;
}
@media only screen and (min-width: 768px) {
  #imglogo {
    width: 5em;
  }
}
@media only screen and (min-width: 1024px) {
  #imglogo {
    width: 5.5em;
  }
}
#imglogo img {
  width: 4em;
}
@media only screen and (min-width: 768px) {
  #imglogo img {
    width: 5em;
  }
}
@media only screen and (min-width: 1024px) {
  #imglogo img {
    width: 5.5em;
  }
}
#textlogo {
  float: left;
  width: 75%;
  margin-left: 0.5em;
}
#textlogo h1.site-name {
  width: 86%;
  font-family: Georgia, 'Times New Roman', Times, 'Songti SC', SimSun, "Microsoft YaHei", serif;
  font-size: 210%;
  line-height: 1.5;
  -webkit-font-smoothing: ;
}
@media only screen and (min-width: 768px) {
  #textlogo h1.site-name {
    font-size: 240%;
  }
}
@media only screen and (min-width: 1024px) {
  #textlogo h1.site-name {
    font-size: 280%;
  }
}
#textlogo h2.blog-motto {
  font-size: 0.8em;
  font-weight: normal;
}
@media only screen and (min-width: 768px) {
  #textlogo h2.blog-motto {
    font-size: 100%;
  }
}
@media only screen and (min-width: 1024px) {
  #textlogo h2.blog-motto {
    font-size: 110%;
  }
}
.navbar {
  position: absolute;
  width: 2em;
  right: 0em;
  top: 1em;
  padding: 0.5em;
}
@media only screen and (min-width: 1024px) {
  .navbar {
    display: none;
  }
}
.navbutton::before {
  font-family: FontAwesome;
  -webkit-font-smoothing: ;
  content: "\f0c9";
}
.navmobile::before {
  padding-left: 1em;
}
header nav {
  float: left;
  width: 100%;
  font-size: 112.5%;
  padding-top: 0.5em;
  max-height: 0.01em;
  -webkit-transition: max-height 1s ease-out;
  -moz-transition: max-height 1s ease-out;
  -o-transition: max-height 1s ease-out;
  -ms-transition: max-height 1s ease-out;
  transition: max-height 1s ease-out;
}
@media only screen and (min-width: 568px) {
  header nav {
    width: 50%;
  }
}
@media only screen and (min-width: 1024px) {
  header nav {
    float: right;
    width: auto;
    margin-top: 1em;
    max-height: none;
  }
}
header nav ul {
  list-style: none;
}
@media only screen and (min-width: 1024px) {
  header nav ul {
    float: right;
  }
}
@media only screen and (min-width: 1024px) {
  header nav ul li {
    float: left;
  }
}
header nav ul li a {
  padding: 0.2em 0 0.2em 1em;
}
@media only screen and (min-width: 1024px) {
  header nav ul li a {
    padding: 0.2em 1.5em;
  }
}
header nav ul li a:hover {
  background: #1b7f9e;
  color: #e9cd4c;
}
.shownav {
  max-height: 40em;
}
.animated {
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  -o-animation-fill-mode: both;
  -ms-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-duration: 1s;
  -moz-animation-duration: 1s;
  -o-animation-duration: 1s;
  -ms-animation-duration: 1s;
  animation-duration: 1s;
}
article {
  -webkit-box-shadow: 0 1px 2px #bbb;
  box-shadow: 0 1px 2px #bbb;
  background: #fafafa;
}
article strong {
  font-weight: bolder;
}
article.page {
  padding-left: 20px;
}
article.page .icon {
  display: none;
}
article.post .icon:before {
  content: '\f016';
}
article.photo .icon:before {
  content: '\f030';
}
article.link .icon:before {
  content: '\f0c1';
}
article.link .title a:after {
  content: '\f08e';
  color: #777;
  font: 12px FontAwesome;
  padding-left: 10px;
  vertical-align: super;
}
article .post-content {
  padding: 20px 20px 15px 30px;
  margin-bottom: 50px;
  position: relative;
}
@media screen and (max-width: 600px) {
  article .post-content {
    padding-left: 20px;
  }
}
article .post-content:before {
  content: "";
  position: absolute;
  z-index: -1;
  bottom: 15px;
  left: 10px;
  width: 50%;
  height: 20%;
  -webkit-box-shadow: 0 15px 10px rgba(0,0,0,0.7);
  -moz-box-shadow: 0 15px 10px rgba(0,0,0,0.7);
  -webkit-box-shadow: 0 15px 15px rgba(0,0,0,0.7);
  box-shadow: 0 15px 15px rgba(0,0,0,0.7);
  -webkit-transform: rotate(-2deg);
  -moz-transform: rotate(-2deg);
  -o-transform: rotate(-2deg);
  -webkit-transform: rotate(-2deg);
  -moz-transform: rotate(-2deg);
  -o-transform: rotate(-2deg);
  -ms-transform: rotate(-2deg);
  transform: rotate(-2deg);
}
article .post-content:after {
  content: "";
  position: absolute;
  z-index: -1;
  bottom: 15px;
  left: 10px;
  width: 50%;
  height: 20%;
  -webkit-box-shadow: 0 15px 10px rgba(0,0,0,0.7);
  -moz-box-shadow: 0 15px 10px rgba(0,0,0,0.7);
  -webkit-box-shadow: 0 15px 15px rgba(0,0,0,0.7);
  box-shadow: 0 15px 15px rgba(0,0,0,0.7);
  -webkit-transform: rotate(-2deg);
  -moz-transform: rotate(-2deg);
  -o-transform: rotate(-2deg);
  -webkit-transform: rotate(-2deg);
  -moz-transform: rotate(-2deg);
  -o-transform: rotate(-2deg);
  -ms-transform: rotate(-2deg);
  transform: rotate(-2deg);
  right: 10px;
  left: auto;
  -webkit-transform: rotate(2deg);
  -moz-transform: rotate(2deg);
  -o-transform: rotate(2deg);
  -webkit-transform: rotate(2deg);
  -moz-transform: rotate(2deg);
  -o-transform: rotate(2deg);
  -ms-transform: rotate(2deg);
  transform: rotate(2deg);
}
article .gallery {
  overflow: hidden;
  position: relative;
}
article .gallery:hover .control {
  opacity: 1;
  -ms-filter: none;
  filter: none;
}
article .gallery img {
  min-width: 100%;
  max-width: 100%;
  height: auto;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
}
article .gallery .control {
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  -ms-transition: 0.3s;
  transition: 0.3s;
}
article .gallery .prev,
article .gallery .next {
  position: absolute;
  top: 0;
  width: 50%;
  height: 100%;
  cursor: pointer;
}
article .gallery .prev:before,
article .gallery .next:before {
  position: absolute;
  font: 24px/1 FontAwesome;
  text-align: center;
  width: 24px;
  text-shadow: 0 0 15px rgba(0,0,0,0.5);
  color: #fff;
  margin-top: -12px;
  top: 50%;
}
article .gallery .prev {
  left: 0;
}
article .gallery .prev:before {
  content: '\f053';
  left: 10px;
}
article .gallery .next {
  right: 0;
}
article .gallery .next:before {
  content: '\f054';
  right: 10px;
}
@media only screen and (min-width: 768px) {
  article header.article-info {
    border-bottom: 1px solid #dbdbdb;
  }
}
article header.article-info >h1 {
  font-size: 170%;
  line-height: 1.5;
  word-wrap: break-word;
  word-break: normal;
  -webkit-font-smoothing: antialiased;
}
@media only screen and (min-width: 1024px) {
  article header.article-info >h1 {
    font-size: 200%;
    padding-top: 0.3em;
  }
}
article header.article-info >p.article-author {
  padding: 0.3em 4% 0.3em 0;
  text-align: right;
  border-bottom: 1px solid #dbdbdb;
}
@media only screen and (min-width: 768px) {
  article header.article-info >p.article-author {
    float: right;
    border-bottom: none;
  }
}
article header.article-info >p.article-time {
  padding-top: 0.5em;
  font-size: 0.8em;
  text-align: center;
}
@media only screen and (min-width: 768px) {
  article header.article-info >p.article-time {
    float: right;
    margin-right: 1em;
    padding-top: 0.1em;
    font-size: 0.9em;
  }
}
article header.article-info >p.article-time:before {
  font-family: FontAwesome;
  font-size: 130%;
  content: "\f017";
  -webkit-font-smoothing: ;
}
article header .icon {
  width: 32px;
  height: 32px;
  margin-right: 25px;
  position: absolute;
  top: 20px;
  left: 20px;
  color: #0085ff;
}
@media screen and (max-width: 600px) {
  article header .icon {
    display: none;
  }
}
article header .icon:before {
  position: absolute;
  font: 32px FontAwesome;
  top: 0;
  left: 0;
  width: 32px;
  text-align: center;
}
article header .title {
  font-size: 170%;
  line-height: 1.5;
}
article header .title a {
  color: #000;
}
article header .title a:hover {
  color: #0085ff;
  text-decoration: none;
}
article .entry {
  text-align: justify;
  line-height: 1.6;
}
article .entry p,
article .entry blockquote,
article .entry ul,
article .entry ol,
article .entry dl,
article .entry table,
article .entry iframe,
article .entry h3,
article .entry h4,
article .entry h5,
article .entry h6,
article .entry .video-container {
  margin-top: 15px;
}
article .entry blockquote {
  background: #f6f6f6;
  border-left: 4px solid #999;
  font-style: normal;
  font-family: Georgia, 'Times New Roman', Times, STFangsong, KaiTi, serif;
  font-size: 1.2em;
  padding: 0 30px 15px;
  padding-top: 10px;
  padding-bottom: 30px;
}
article .entry blockquote footer {
  border-top: none;
  font-size: 0.8em;
  line-height: 1;
  margin: 20px 0 0;
  padding-top: 0;
}
article .entry blockquote footer cite:before {
  content: '—';
  color: #ccc;
  padding: 0 0.5em;
}
article .entry code,
article .entry pre {
  font-family: Monaco, Menlo, Consolas, Courier New, monospace;
}
article .entry code {
  background: #fbedeb;
  color: #e2678f;
  padding: 0 5px;
  margin: 0 2px;
  font-size: 0.9em;
  border-radius: 3px;
}
article .entry pre {
  background: #eee;
  border: 1px solid #ddd;
  margin-top: 15px;
  overflow: auto;
  padding: 7px 15px;
  border-radius: 2px;
}
article .entry pre code {
  background: none;
  padding: 0;
  color: #666;
  margin: 0;
  border: none;
  border-radius: 0;
}
article .entry ul,
article .entry ol,
article .entry dl {
  margin-left: 20px;
}
article .entry ul ul,
article .entry ol ul,
article .entry dl ul,
article .entry ul ol,
article .entry ol ol,
article .entry dl ol,
article .entry ul dl,
article .entry ol dl,
article .entry dl dl {
  margin-top: 0;
}
article .entry h1,
article .entry h2 {
  font-weight: bold;
  padding-bottom: 10px;
  margin-top: 20px;
}
article .entry h3,
article .entry h4,
article .entry h5,
article .entry h6 {
  font-weight: bold;
}
article .entry img,
article .entry video {
  max-width: 100%;
  height: auto;
  border: none;
}
article .entry iframe {
  border: none;
}
article .entry .caption {
  display: block;
  margin-top: 5px;
  color: #777;
  position: relative;
  font-size: 0.9em;
  padding-left: 25px;
}
article .entry .caption:before {
  content: '\f040';
  position: absolute;
  font: 1.3em FontAwesome;
  position: absolute;
  left: 0;
  top: 3px;
}
article .entry .video-container {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 30px;
  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 .pullquote {
  float: right;
  border: none;
  padding: 0;
  margin: 1em 0 0.5em 1.5em;
  text-align: left;
  width: 45%;
  font-size: 1.5em;
}
article footer {
  margin-top: 15px;
  padding-top: 10px;
  border-top: 1px solid #ddd;
  color: #777;
  font-size: 0.9em;
  line-height: 16px;
  position: relative;
  min-height: 16px;
}
article footer a {
  color: #777;
}
article footer a:hover {
  color: #0085ff;
  text-decoration: none;
}
article footer a:before {
  font: 1.1em FontAwesome;
  padding-right: 10px;
  vertical-align: middle;
}
article footer a.more-link:before {
  content: '\f054';
}
article footer a.comment-link:before {
  content: '\f075';
}
article footer .categories,
article footer .tags {
  position: relative;
  padding-left: 25px;
  margin: 5px 0;
}
article footer .categories:before,
article footer .tags:before {
  position: absolute;
  font: 1.1em FontAwesome;
}
article footer .categories:before {
  content: '\f07b';
  top: 2px;
  left: 1px;
}
article footer .tags:before {
  content: '\f02b';
  top: 3px;
  left: 2px;
}
article footer .addthis {
  margin-top: 15px;
}
article footer .addthis iframe {
  margin-top: 0;
}
.toc-article {
  float: right;
}
#toc {
  background: #eee;
  margin: 0 0 10px 20px;
  padding: 12px;
  line-height: 18px;
  font-size: 10px;
}
#toc strong {
  font-size: 15px;
}
#toc ol {
  margin-top: 5px;
  margin-left: 0;
}
#toc .toc {
  padding: 0;
}
#toc .toc li {
  list-style-type: none;
}
#toc .toc-child {
  padding-left: 20px;
}
.comments-count {
  color: #d6d6d6;
  float: right;
a
}
.icon-comment:before {
  font-family: FontAwesome;
  -webkit-font-smoothing: ;
  content: "\f075";
}
@media phonemax {
}
#comment {
  padding: 20px;
  background: #fafafa;
  -webkit-box-shadow: 1px 2px 3px #ddd;
  box-shadow: 1px 2px 3px #ddd;
  margin-bottom: 50px;
}
#comment .title {
  font-weight: normal;
  margin-bottom: 15px;
}
#pagination a {
  display: block;
  padding: 5px 10px;
  background: #ddd;
  color: #777;
  font-family: Helvetica Neue, Helvetica, Arial, "Hiragino Sans GB", sans-serif;
  text-shadow: 0 0 1px #fff;
  margin-bottom: 50px;
}
#pagination a:hover {
  background: #0085ff;
  color: #fff;
  text-decoration: none;
  text-shadow: none;
}
#pagination .prev:before {
  content: '\f053';
  padding-right: 10px;
  font-family: FontAwesome;
}
#pagination .next:after {
  content: '\f054';
  padding-left: 10px;
  font-family: FontAwesome;
}
.archive-title {
  color: #777;
  margin-bottom: 30px;
  font-weight: normal;
  text-shadow: 0 0 1px #fff;
}
.archive-title:before {
  font-family: FontAwesome;
  content: '\f073';
  padding-right: 15px;
}
.archive-title.tag:before {
  content: '\f02b';
}
.archive-title.category:before {
  content: '\f07b';
}
.archive {
  margin-bottom: 50px;
}
.archive article {
  -webkit-box-shadow: none;
  box-shadow: none;
}
.archive article .post-content {
  margin-bottom: 0;
}
#page-navs {
  zoom: 1;
  margin: block-margin auto;
  margin-bottom: 1em;
  background: #fff;
  -webkit-box-shadow: 1px 2px 3px #ddd;
  box-shadow: 1px 2px 3px #ddd;
  border: 1px solid #ddd;
  border-radius: 3px;
  text-align: center;
  color: color-grey;
  overflow: hidden;
}
#page-navs:before,
#page-navs:after {
  content: "";
  display: table;
}
#page-navs:after {
  clear: both;
}
#page-navs a,
#page-navs span {
  padding: 10px 20px;
  line-height: 3ex;
  height: 3ex;
}
#page-navs a {
  color: color-grey;
  text-decoration: none;
}
#page-navs a:hover {
  background: color-grey;
  color: #2ca6cb;
}
#page-navs .prev {
  float: left;
}
#page-navs .next {
  float: right;
}
#page-navs .page-number {
  display: inline-block;
}
@media mq-mobile {
  #page-navs .page-number {
    display: none;
  }
}
#page-navs .current {
  color: color-default;
  font-weight: bold;
}
#page-navs .space {
  color: #ddd;
}
#sidebar {
  width: 22%;
  margin-top: 30px;
  line-height: 1.8em;
}
@media screen and (max-width: 900px) {
  #sidebar {
    float: none;
    width: 100%;
  }
}
#sidebar .widget {
  background: #fafafa;
  -webkit-box-shadow: 1px 2px 3px #ddd;
  box-shadow: 1px 2px 3px #ddd;
  margin-bottom: 30px;
  word-wrap: break-word;
}
#sidebar .widget .title {
  padding: 15px 20px;
  font-size: 1em;
  border-bottom: 1px solid #ddd;
  font-weight: normal;
}
#sidebar .widget .entry {
  font-size: 0.9em;
  padding: 15px 20px;
}
#sidebar .widget ul,
#sidebar .widget ol,
#sidebar .widget dl {
  list-style: none;
}
#sidebar .widget ul ul,
#sidebar .widget ol ul,
#sidebar .widget dl ul,
#sidebar .widget ul ol,
#sidebar .widget ol ol,
#sidebar .widget dl ol,
#sidebar .widget ul dl,
#sidebar .widget ol dl,
#sidebar .widget dl dl {
  list-style: disc;
  margin-left: 20px;
}
#sidebar .search {
  margin-bottom: 30px;
}
#sidebar .search input {
  background: #fafafa;
  font-family: Helvetica Neue, Helvetica, Arial, "Hiragino Sans GB", sans-serif;
  font-style: italic;
  font-size: 1em;
  padding: 10px 15px;
  border: 1px solid #ddd;
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  color: #777;
}
#sidebar .search input:focus {
  color: #000;
}
#sidebar .tag small {
  margin-left: 15px;
  color: #777;
}
#sidebar .tag small:before {
  content: '(';
}
#sidebar .tag small:after {
  content: ')';
}
#sidebar .twitter li {
  border-bottom: 1px solid #ddd;
  padding: 15px 20px;
  font-size: 0.9em;
}
#sidebar .twitter li:last-of-type {
  border-bottom: none;
}
#sidebar .twitter small {
  display: block;
  margin-top: 10px;
  color: #777;
  line-height: 1;
}
#sidebar .tagcloud .entry {
  padding-right: 5px;
}
#sidebar .tagcloud a {
  margin-right: 10px;
  display: inline-block;
}
#authorInfo {
  overflow: hidden;
  text-align: center;
  padding-top: 2em;
  margin-bottom: 1.5em;
  border-bottom: 1px solid #ccc;
  background-position: left bottom;
  background-repeat: repeat-x;
  -webkit-background-size: 5px auto;
  -moz-background-size: 5px auto;
  background-size: 5px auto;
}
@media only screen and (min-width: 768px) {
  #authorInfo {
    padding-top: 0.5em;
  }
}
@media only screen and (min-width: 1024px) {
  #authorInfo {
    padding-top: 1em;
  }
}
.author-info {
  margin: 0.8em 0 0.2em;
  line-height: 28px;
}
.author-logo {
  width: 11em;
  height: 11em;
  margin: 0 auto;
  background: no-repeat url("../imgs/author.jpg") left top;
  -webkit-background-size: 11em 11em;
  -moz-background-size: 11em 11em;
  background-size: 11em 11em;
  border-radius: 5.5em;
  -webkit-transition: -webkit-transform 2s ease-out;
  -moz-transition: -moz-transform 2s ease-out;
  -o-transition: -o-transform 2s ease-out;
  -ms-transition: -ms-transform 2s ease-out;
  transition: transform 2s ease-out;
}
.author-logo:hover {
  -webkit-transform: rotateZ(360deg);
  -moz-transform: rotateZ(360deg);
  -o-transform: rotateZ(360deg);
  -ms-transform: rotateZ(360deg);
  transform: rotateZ(360deg);
}
@media only screen and (min-width: 768px) {
  .author-logo {
    margin: 0 1em 0 0;
    float: left;
  }
}
@media only screen and (min-width: 1024px) {
  .author-logo {
    float: none;
    width: 9.166666666666666em;
    height: 9.166666666666666em;
    -webkit-background-size: 9.166666666666666em 9.166666666666666em;
    -moz-background-size: 9.166666666666666em 9.166666666666666em;
    background-size: 9.166666666666666em 9.166666666666666em;
    border-radius: 4.583333333333333em;
    margin: 0 auto;
  }
}
.info-logo {
  font-family: Georgia, 'Times New Roman', Times, 'Songti SC', SimSun, "Microsoft YaHei", serif;
  -webkit-font-smoothing: ;
  font-size: 150%;
  line-height: 1.3em;
  width: 90%;
  margin: 0 auto;
  color: #fff;
}
@media only screen and (min-width: 768px) {
  .info-logo {
    margin: 4.5em 0 2em 0;
    float: left;
    width: 75%;
  }
}
.social-list {
  width: 100%;
  margin: 50 auto;
  overflow: hidden;
  float: left;
  text-align: center;
}
@media only screen and (min-width: 1024px) {
  .social-list {
    float: none;
    width: auto;
    padding: 0;
    backgroun: #343434;
  }
}
.social-list a {
  display: inline-block;
  color: #343434;
  font-size: 180%;
  margin: 0.5em;
}
@media only screen and (min-width: 768px) {
  .social-list a {
    float: none;
    margin: 0;
    padding: 0.3em;
  }
}
@media only screen and (min-width: 1024px) {
  .social-list a {
    float: none;
    padding: 0.3em;
  }
}
.social-list a:hover:before {
  color: #2ca6cb;
}
.social-list a[title="weibo"]::before,
.social-list a[title="twitter"]::before,
.social-list a[title="github"]::before,
.social-list a[title="facebook"]::before,
.social-list a[title="zhihu"]::before {
  font-family: FontAwesome;
  -webkit-font-smoothing: ;
}
.social-list a[title="weibo"]::before {
  content: "\f18a";
}
.social-list a[title="twitter"]::before {
  content: "\f099";
}
.social-list a[title="github"]::before {
  content: "\f09b";
}
.social-list a[title="facebook"]::before {
  content: "\f09a";
}
.social-list a[title="zhihu"]::before {
  content: "\f1d6";
}
#footer {
  width: 96%;
  margin: 0 auto;
  overflow: hidden;
  padding: 0 2% 0.5em;
  position: relative;
  background: #1f1f1f;
}
#footer .line {
  width: 100%;
  height: 14em;
  margin: 0 auto;
}
@media only screen and (min-width: 768px) {
  #footer .line {
    width: 10em;
    float: left;
    position: relative;
  }
}
#footer .line span {
  display: block;
  width: 0.5em;
  height: 6.25em;
  border-right: 0.125em solid #fff;
  margin: 0 auto;
}
@media only screen and (min-width: 768px) {
  #footer .line span {
    position: absolute;
    left: 3em;
    margin: 0 0 1.5em;
  }
}
.author {
  width: 6.875em;
  height: 6.875em;
  margin: 0 auto;
  background: no-repeat url("../imgs/author.jpg") left top;
  -webkit-background-size: 6.875em 6.875em;
  -moz-background-size: 6.875em 6.875em;
  background-size: 6.875em 6.875em;
  border-radius: 3.4375em;
  -webkit-transition: -webkit-transform 2s ease-out;
  -moz-transition: -moz-transform 2s ease-out;
  -o-transition: -o-transform 2s ease-out;
  -ms-transition: -ms-transform 2s ease-out;
  transition: transform 2s ease-out;
}
.author:hover {
  -webkit-transform: rotateZ(360deg);
  -moz-transform: rotateZ(360deg);
  -o-transform: rotateZ(360deg);
  -ms-transform: rotateZ(360deg);
  transform: rotateZ(360deg);
}
@media only screen and (min-width: 768px) {
  .author {
    position: absolute;
    top: 6em;
    margin: 0 0 1.5em;
  }
}
.info {
  font-family: Georgia, 'Times New Roman', Times, 'Songti SC', SimSun, "Microsoft YaHei", serif;
  font-size: 130%;
  line-height: 1.3em;
  width: 90%;
  margin: 0 auto;
  color: #fff;
}
@media only screen and (min-width: 768px) {
  .info {
    margin: 4.5em 0 2em 0;
    float: left;
    width: 75%;
  }
}
.social-font {
  width: 100%;
  margin: 0 auto;
  float: left;
  padding-left: 3%;
}
@media only screen and (min-width: 568px) {
  .social-font {
    padding-left: 20%;
  }
}
@media only screen and (min-width: 768px) {
  .social-font {
    width: 18em;
    position: absolute;
    right: -3em;
    top: 3em;
  }
}
.social-font a {
  float: left;
  display: block;
  width: 14%;
  color: #fff;
  font-size: 180%;
  padding: 0.5em;
}
@media only screen and (min-width: 1024px) {
  .social-font a {
    padding: 0.3em;
  }
}
.social-font a:hover:before {
  color: #2ca6cb;
}
.social-font a[title="weibo"]::before,
.social-font a[title="twitter"]::before,
.social-font a[title="github"]::before,
.social-font a[title="facebook"]::before,
.social-font a[title="linkedin"]::before {
  font-family: FontAwesome;
  -webkit-font-smoothing: ;
}
.social-font a[title="weibo"]::before {
  content: "\f18a";
}
.social-font a[title="twitter"]::before {
  content: "\f099";
}
.social-font a[title="github"]::before {
  content: "\f09b";
}
.social-font a[title="facebook"]::before {
  content: "\f09a";
}
.social-font a[title="linkedin"]::before {
  content: "\f08c";
}
.icon-email:before {
  font-family: FontAwesome;
  -webkit-font-smoothing: ;
  content: "\f003";
}
.copyright {
  font-family: Georgia, 'Times New Roman', Times, 'Songti SC', SimSun, "Microsoft YaHei", serif;
  font-size: 0.8em;
  width: 100%;
  color: #fff;
  text-align: center;
}
@media only screen and (min-width: 768px) {
  .copyright {
    float: left;
  }
}
.copyright a {
  color: #fff;
}
.copyright a:hover {
  color: #2ca6cb;
}
.entry .gist {
  background: #eee;
  border: 1px solid #ddd;
  margin-top: 15px;
  padding: 7px 15px;
  border-radius: 2px;
  text-shadow: 0 0 1px #fff;
  line-height: 1.6;
  overflow: auto;
  color: #666;
}
.entry .gist .gist-file {
  border: none;
  font-family: inherit;
  margin: 0;
  font-size: 0.9em;
}
.entry .gist .gist-file .gist-data {
  background: none;
  border-bottom: none;
}
.entry .gist .gist-file .gist-data pre {
  padding: 0 !important;
  font-family: Monaco, Menlo, Consolas, Courier New, monospace;
}
.entry .gist .gist-file .gist-meta {
  background: none;
  color: #777;
  margin-top: 5px;
  padding: 0;
  text-shadow: 0 0 1px #fff;
  font-size: 100%;
}
.entry .gist .gist-file .gist-meta a {
  color: #0085ff;
}
.entry .gist .gist-file .gist-meta a:visited {
  color: #0085ff;
}
figure.highlight {
  background: #eee;
  border: 1px solid #ddd;
  margin-top: 15px;
  padding: 7px 15px;
  border-radius: 2px;
  text-shadow: 0 0 1px #fff;
  line-height: 1.6;
  overflow: auto;
  position: relative;
  font-size: 0.9em;
}
figure.highlight figcaption {
  color: #777;
  margin-bottom: 5px;
  text-shadow: 0 0 1px #fff;
}
figure.highlight figcaption a {
  position: absolute;
  right: 15px;
}
figure.highlight pre {
  border: none;
  padding: 0;
  margin: 0;
}
figure.highlight table {
  margin-top: 0;
  border-spacing: 0;
}
figure.highlight .gutter {
  color: #777;
  padding-right: 15px;
  border-right: 1px solid #ddd;
  text-align: right;
}
figure.highlight .code {
  padding-left: 15px;
  border-left: 1px solid #fff;
  color: #666;
}
pre .comment,
pre .template_comment,
pre .diff .header,
pre .doctype,
pre .pi,
pre .lisp .string,
pre .javadoc {
  color: #93a1a1;
  font-style: italic;
}
pre .keyword,
pre .winutils,
pre .method,
pre .addition,
pre .css .tag,
pre .request,
pre .status,
pre .nginx .title {
  color: #859900;
}
pre .number,
pre .command,
pre .string,
pre .tag .value,
pre .phpdoc,
pre .tex .formula,
pre .regexp,
pre .hexcolor {
  color: #2aa198;
}
pre .title,
pre .localvars,
pre .chunk,
pre .decorator,
pre .built_in,
pre .identifier,
pre .vhdl,
pre .literal,
pre .id {
  color: #268bd2;
}
pre .attribute,
pre .variable,
pre .lisp .body,
pre .smalltalk .number,
pre .constant,
pre .class .title,
pre .parent,
pre .haskell .type {
  color: #b58900;
}
pre .preprocessor,
pre .preprocessor .keyword,
pre .shebang,
pre .symbol,
pre .symbol .string,
pre .diff .change,
pre .special,
pre .attr_selector,
pre .important,
pre .subst,
pre .cdata,
pre .clojure .title {
  color: #cb4b16;
}
pre .deletion {
  color: #dc322f;
}
.ds-recent-comments li.ds-comment:first-child {
  border-top: none !important;
}