.icon-ghost, .icon-feed, .icon-twitter, .icon-google-plus, .icon-facebook{font-family: 'icons';speak: none;font-style: normal;font-weight: normal;font-variant: normal;text-transform: none;line-height: 1;-webkit-font-smoothing: antialiased;text-decoration: none;}
*{padding:0;margin:0;border:none;}
ul{list-style:none;}
a{text-decoration:none;}
html{font-size: 10px;}
body{min-width:320px;font-family: Georgia,Arial,"Hiragino Sans GB","Microsoft YaHei","微软雅黑","STHeiti","WenQuanYi Micro Hei",SimSun,sans-serif;font-size: 20px;line-height: 1.6em;color: #3A4145;background: #fdfdfd;}
main.content{
 overflow:hidden;}
::-moz-selection{color: #333;background: #C0DDFD;text-shadow: none;}
::selection{color: #333;background: #C0DDFD;text-shadow: none;}
h1, h2, h3,
h4, h5, h6{text-rendering: optimizeLegibility;line-height: 1;margin-top: 0;font-family: Tahoma,Arial,"Hiragino Sans GB","Microsoft YaHei","微软雅黑","STHeiti","WenQuanYi Micro Hei",SimSun,sans-serif;font-weight:normal;}
h1{font-size: 5rem;line-height: 1.2em;letter-spacing: -1px;text-indent: -3px;}
h2{font-size: 4rem;line-height: 1.2em;letter-spacing: -1px;text-indent: -2px;}
h3{font-size: 3.5rem;}
h4{font-size: 3rem;}
h5{font-size: 2.5rem;}
h6{font-size: 2rem;}
a{color: #005E99;transition: color ease 0.2s;}
p a{
 border-bottom: 1px dashed;}
a:hover{color: #009dff;}
h1 a, h2 a, h3 a,
h4 a, h5 a, h6 a{color: #253946;}

p, ul, ol{margin: 1.6em 0;}
ol ol, ul ul,
ul ol, ol ul{margin: 0.4em 0;}
hr{display: block;height: 1px;border: 0;border-top: 1px solid #efefef;margin: 3.2em 0;padding: 0;}
blockquote{-moz-box-sizing: border-box;box-sizing: border-box;margin: 1.6em 0 1.6em -2.2em;padding: 0 0 0 1.6em;border-left: #73CAFA 0.4em solid;}
blockquote p{margin: 0.8em 0;font-style: italic;}
blockquote small{display: inline-block;margin: 0.8em 0 0.8em 1.5em;;font-size:0.9em;color: #ccc;}
blockquote small:before { content: '\2014 \00A0'; }
blockquote cite{font-weight:bold;}
blockquote cite a { font-weight: normal; }

dl{margin: 1.6em 0;}
dl dt{float: left;width: 180px;overflow: hidden;clear: left;text-align: right;text-overflow: ellipsis;white-space: nowrap;font-weight: bold;margin-bottom: 1em}
dl dd{margin-left: 200px;margin-bottom: 1em}
mark{background-color: #ffc336;}
code, tt{padding: 1px 3px;font-family: Consolas, "Liberation Mono", Courier, monospace, sans-serif;margin: 0 5px;font-size: 0.85em;white-space: pre;border: 1px solid #d1caca;background: #F7FAFB;padding: 0 5px; border-radius: 4px;}
pre{-moz-box-sizing: border-box;box-sizing: border-box;margin: 1.6em 0;width: 100%;font-family: Inconsolata, monospace, sans-serif;font-size: 0.9em;white-space: pre;overflow: auto;border-radius: 5px;background-color:#692F2F;color: #fff;padding: 10px 20px;font-family: Consolas, "Liberation Mono", Courier, monospace;}
pre code, tt{font-size: inherit;white-space: -moz-pre-wrap;white-space: pre-wrap;background: transparent;border: none;padding: 0;font-family: Consolas, "Liberation Mono", Courier, monospace;}
kbd{display: inline-block;margin-bottom: 0.4em;padding: 1px 8px;border: #ccc 1px solid;color: #666;text-shadow: #fff 0 1px 0;font-size: 0.9em;font-weight: bold;background: #f4f4f4;border-radius: 4px;box-shadow: 
  0 1px 0 rgba(0, 0, 0, 0.2), 
  0 1px 0 0 #fff inset;}
table{-moz-box-sizing: border-box;box-sizing: border-box;margin: 1.6em 0;width:100%;max-width: 100%;background-color: transparent;}
table th,
table td{padding: 8px;line-height: 20px;text-align: left;vertical-align: top;border-top: 1px solid #efefef;}
table th { color: #000; }
table caption + thead tr:first-child th,
table caption + thead tr:first-child td,
table colgroup + thead tr:first-child th,
table colgroup + thead tr:first-child td,
table thead:first-child tr:first-child th,
table thead:first-child tr:first-child td{border-top: 0;}
table tbody + tbody { border-top: 2px solid #efefef; }
table table table { background-color: #fff; }
table tbody > tr:nth-child(odd) > td,
table tbody > tr:nth-child(odd) > th{background-color: #f7f7f7;}
table.plain{tbody > tr:nth-child(odd) > td,
 tbody > tr:nth-child(odd) > th{ background: transparent;}}
.copyright{float:left;}
.poweredby{float:right;}
.post-meta{padding-top:5px;}
.hidden{text-indent: -9999px;visibility: hidden;display: none;}
.inner{position: relative;width: 80%;max-width:800px;margin: 0 auto;}
.inner:after{content:' ';visibility: hidden;clear:both;height:0;display:block;}
.vertical{display: table-cell;vertical-align: middle;}

#site-head{position: relative;display: table;width: 100%;height: 90px;text-align: center;}
#site-head-content h1 a,#blog-logo{position:relative;color:#f65;text-shadow: 0px 0px 0px #fff;font-family: Georgia,'微软雅黑', serif;}
#site-head-content h1 a:hover,#blog-logo:hover{left:-1px;top:-1px;color:#f65;text-shadow: 2px 2px 0px #974545;}
#site-head-content h1 a:active,#blog-logo:active{left:0px;top:0px;color:#f65;text-shadow: 1px 1px 0px #974545;}
#site-head-content .subscribe{left:80%;top: 57px;}
#blog-logo img{display: block;max-height: 100px;width: auto;margin: 0 auto;line-height: 0;}
#back{color: rgba(0,0,0,0.2);position: fixed;top: 8px;left: 8px;padding: 6px;font-size: 16px;}
.blog-title{margin:0;font-size: 5rem;letter-spacing: -1px;}
.archive-template .blog-title a{color:#f65;}
.blog-description{margin: 0;font-size: 1.8rem;line-height: 1.5em;font-weight: 300;letter-spacing:1px;}
#blog-logo{
font-size: 5rem;
font-family: Georgia,'微软雅黑', serif;
font-weight: normal;
text-decoration: none;
line-height:43px;
color:#f65;}
.archive-template #site-head{height:80px;}
ul.nav{position:absolute;right:0;top:0;overflow:hidden;margin:0;font-family: Helvetica,Tahoma,'微软雅黑', sans-serif;}
ul.nav li{float:left;margin-left:5px;}
ul.nav li a{position:relative;top:-3px;display:block;background:#FF9E8E;color:#fff;line-height:28px;font-size:16px;padding:0 15px;-webkit-transition:all ease 0.2s;-moz-transition:all ease 0.2s;padding-top:2px;font-weight: 100;}
ul.nav li a:hover{top:0px;background:#FF6959;}

.post-template #site-head-content,.archive-template #site-head h2{display:none;}
#site-head-content h1{text-align: left;text-indent: 0px;}
.blog-title{-webkit-user-select:none;font-family: Georgia,'微软雅黑', sans-serif;}
.blog-title a{margin-left:-4px;line-height:90px;}
.blog-title a:hover>.logo{left:1px;top:6px;}
.blog-title a:active>.logo{left:0px;top:5px;}
.blog-title a:hover>.io{text-shadow:none;top:1px;left:1px;}
.blog-title a:active>.io{text-shadow:none;top:0px;left:0px;}
span.logo span{display:block;}
.logo span:after{content:'';visibility:hidden;height:0;display:block;clear:both;}
.logo{display:inline-block;display:none;width:40px;height:40px;-webkit-animation: rotate 10s ease-in-out 2s infinite normal;background: #FFF;padding:3.5px;position: relative;top:5px;margin-right:10px;}
.logo>span{margin-bottom:20%;height:20%;}
.logo>span:nth-child(3){margin:0;}
.logo>span>span{height:100%;-webkit-transition:-webkit-transform ease 1s;}
.logo>span>span:hover{-webkit-transform:rotate(180deg);}
.logo>span:nth-child(1)>span:nth-child(1){float:left;width:60%;background: #ED263A;}
.logo>span:nth-child(1)>span:nth-child(2){float:right;width:20%;background: #FFB85E;}
.logo>span:nth-child(2)>span:nth-child(1){background: #0084FF;}
.logo>span:nth-child(3)>span:nth-child(1){float:left;width:30%;background: #1CC975;}
.logo>span:nth-child(3)>span:nth-child(2){float:right;width:50%;background: #BA69F0;}
.io{color:#666;position:relative;}
@-webkit-keyframes rotate3{
 0%{-webkit-transform:perspective(100px) rotateX(0deg);}
 10%{-webkit-transform:perspective(100px) rotateX(360deg);}
 100%{-webkit-transform:perspective(100px) rotateX(360deg);}}
@-webkit-keyframes rotate{
 0%{-webkit-transform:rotate(0deg);}
 10%{-webkit-transform:rotate(360deg);}
 100%{-webkit-transform:rotate(360deg);}}
.post{position: relative;width:80%;max-width:800px;margin: 4rem auto;padding-bottom: 4rem;border-bottom: #EBF2F6 1px solid;word-break: break-word;hyphens: auto;}
.post:after{display: block;content: "";width: 7px;height: 7px;border: #E7EEF2 1px solid;position: absolute;bottom: -5px;left: 50%;margin-left: -5px;background: #fff;-webkit-border-radius: 100%;-moz-border-radius: 100%;border-radius: 100%;box-shadow: #fff 0 0 0 5px;}
.post-title{margin:0;}
.page .post-title{
	padding-top: 36px;
	font-size: 60px;}
.post-title a{text-decoration: none;}
.post-excerpt p{margin: 1.6rem 0 0 0;font-size: 20px;line-height: 1.6em;}
.post-excerpt br{
 display:none;}
.post-meta{line-height: 31px;display: inline-block;padding:5px 0;font-family:  sans-serif;font-size: 1.5rem;color: #B5D7F7;}
.post-meta a{color: #CAD3D8;text-decoration: none;}
.post-meta a:hover{text-decoration: underline;}
.user-meta{position: relative;padding: 0.3rem 40px 0 100px;min-height: 77px;}
.user-image{position: absolute;top: 0;left: 0;}
.user-name{display: block;font-weight: bold;}
.user-bio{display: block;max-width: 440px;font-size: 1.4rem;line-height: 1.5em;}
.publish-meta{position: absolute;top: 0;right: 0;padding: 4.3rem 0 4rem 0;text-align: right;}
.publish-heading{display: block;font-weight: bold;}
.publish-date{display: block;font-size: 1.4rem;line-height: 1.5em;}
.post-template .post{margin-top: 0;border-bottom: none;padding-bottom: 0;}
.post-template .post:after{display: none;}
.post-template .post-header{padding: 50px 0;margin:0;
position: absolute;
left: -250px;
top: 4px; }
main{min-height:calc(100vh - 200px)}
@-webkit-keyframes fadeRight{
 0%{opacity:0;left:-100px;}
 100%{opacity:1;left:-220px;}}
@-webkit-keyframes fadeDown{
 0%{opacity:0;-webkit-transform:translateY(-10px);}
 100%{opacity:1;-webkit-transform:translateY(0px);}}
.post-content img{display: block;max-width: 100%;margin: 0 auto;box-shadow: 0 0 35px rgba(0,0,0,0.3);
border-radius: 6px;}
.post-content ul{list-style:disc;padding-left: 1em;}
.post-footer{position: relative;margin: 4rem 0 0 0;padding: 4rem 0 0 0;border-top: #EBF2F6 1px solid;}
.post-footer h4{font-size: 1.8rem;margin: 0;}
.post-footer p{margin: 1rem 0;font-size: 1.4rem;line-height: 1.6em;}
.post-footer .author{margin-right: 180px;}
.post-footer .share{position: absolute;top: 4rem;right: 0;width: 140px;}
.post-footer .share a{font-size: 1.8rem;display: inline-block;margin: 1.4rem 1.6rem 1.6rem 0;color: #BBC7CC;}
.post-footer .share a:hover{color: #50585D;}
.gist table{margin: 0;font-size: 1.4rem;}
.gist .line-number{min-width: 25px;font-size: 1.1rem;}
.pagination{position: relative;width: 80%;max-width:800px;margin: 4rem auto;font-size: 1.3rem;color: #9EABB3;text-align: center;}
.pagination a{color: #9EABB3;}
.older-posts,
.newer-posts{position: absolute;display: block;height:32px;line-height:32px;padding:0 10px;text-decoration: none;transition: all ease 0.3s;padding-top:2px;}
.older-posts:hover,
.newer-posts:hover{
	color:#f44;}
.older-posts{right: 0;top:0;}
.page-number{display: inline-block;padding: 2px 0;}
.post-content{margin:1.6em 0 ;}
.newer-posts{left: 0;top:0;}
.older-posts:hover,
.newer-posts:hover{border-color: #9EABB3;}
.site-footer{position: relative;margin: 113px 0 0 0;padding: 3rem 0;border-top: 5px solid #eee;font-size: 1.3rem;line-height: 1.7em;color: #BBC7CC;text-align: center;background: #f7f7f7;font-family: Tahoma,'微软雅黑', sans-serif;}
.site-footer a{color: #BBC7CC;text-decoration: underline;font-family: Tahoma,'微软雅黑', sans-serif;}
.site-footer a:hover{color: #50585D;}
.poweredby .icon-ghost{text-decoration: none;color:#5892C7;font-weight: 700;}
.poweredby .linode{
 text-decoration: none;color:#489B77;font-weight: 700;-webkit-font-smoothing: antialiased;}
.copyright a{
	text-decoration: none;
	font-family: 'icons',Tahoma,'微软雅黑', sans-serif;}
.poweredby .icon-ghost:hover{text-decoration: none;}
.poweredby .icon-ghost:before{font-size: 1rem;margin-right: 0.2em;}
.subscribe{width: 28px;height: 28px;position: absolute;top: -18px;left: 50%;margin-left: -15px;border: #EBF2F6 1px solid;text-align: center;line-height: 2.4rem;border-radius: 50px;background: #fff;transition: box-shadow 0.5s;box-shadow: rgba(0,0,0,0.05) 0 0 0 2px;}
.subscribe:before{color: #D2DEE3;font-size: 10px;position: absolute;top: 2px;left: 9px;font-weight: bold;transition: color 0.5s ease;}
.subscribe:hover{box-shadow: rgba(0,0,0,0.05) 0 0 0 6px;transition: box-shadow 0.25s;}
.subscribe:hover:before{color: #50585D;}
.tooltip{opacity:0;display: none;padding: 4px 8px 5px 8px;position:absolute;top: -23px;left: -23px;color: rgba(255,255,255,0.9);font-size: 1.1rem;font-weight: bold;line-height: 1em;text-align: center;background: #50585D;border-radius:20px;box-shadow: 0 1px 4px rgba(0,0,0,0.1);transition: opacity 0.3s ease, top 0.3s ease;}
.tooltip:after{content:"";border-width:5px 5px 0 5px;border-style:solid;border-color: #50585D transparent;display:block;position:absolute;bottom:-4px;left:50%;margin-left:-5px;z-index: 220;width:0;}
.subscribe:hover .tooltip{opacity: 1;top: -33px;}
#site-head-content .follow.subscribe{left:86%;} 
.follow.icon-feed:before{content:'\e002';}
.follow .tooltip{left:-15px;}
.follow.subscribe:before{font-size:15px;text-indent:-2px;line-height:26px;}
a.more{color: #FF8E8E;display:inline-block;line-height:30px;font-size:17px;border-radius:4px;margin-top: 10px;border:none;}
a.more:hover{color: #FF5959;}
@media only screen and (max-width:1200px){
 .post-template .post-header{ padding: 40px 0; position: static;}}
@media only screen and (max-width: 900px) {
 blockquote{ margin-left: 0;}
 /*#site-head-content{overflow:auto;}*/
 #site-head-content .subscribe{ top:89px;}
 #site-head-content .follow.subscribe{left:90%;}
 #site-head-content h1{position:static; float:left;}
 #site-head-content h2{float:right; padding-top:30px;}
 #site-head{}
 .blog-title{ font-size: 5rem; letter-spacing: -1px;}
 .blog-description{ font-size: 1.7rem; line-height: 1.5em;}
 .post{ font-size: 0.9em; line-height: 1.6em;}
 .post-template .post{ padding-bottom: 1rem;}
 .post-template .post-header{ padding: 40px 0;}
 h1{ font-size: 4.8rem; text-indent: -2px;}
 h2{ font-size: 3.8rem;}
 h3{ font-size: 3.3rem;}
 h4{ font-size: 2.8rem;}}
@media only screen and (max-width: 500px) {
 #site-head-content .follow.subscribe{left:94%;}
 #blog-logo img{ max-height: 80px;}
 #site-head-content h1{position:static; float:left;}
 #site-head-content h2{padding-top:20px;}
 .inner, 
 .pagination{ width: auto; margin-left: 16px; margin-right: 16px;}
 .post{ width:auto; margin-left: 16px; margin-right: 16px; font-size: 0.8em; line-height: 1.6em;}
 #site-head{}
 .blog-title{ font-size: 5rem;}
 ul.nav{right:-16px;}
 ul.nav li{float:none;margin:0 0 2px 0;}
 ul.nav li a{top:0;right:-3px;}
 ul.nav li a:hover{right:0;}
 .blog-description{ font-size: 1.5rem;}

 h1, h2{ font-size: 3rem; line-height: 1.1em; letter-spacing: -1px;}
 h3{ font-size: 2.8rem;}
 h4{ font-size: 2.3rem;}
 .post-template .post{ padding-bottom: 0;}
 .post-template .post-header{ padding: 30px 0;}
 .post-meta{ font-size: 1.3rem;}
 .post-footer{ padding: 4rem 0; text-align: center;}
 .post-footer .author{ margin: 0 0 2rem 0; padding: 0 0 1.6rem 0; border-bottom: #EBF2F6 1px dashed;}
 .post-footer .share{ position: static; width: auto;}
 .post-footer .share a{ margin: 1.4rem 0.8rem 0 0.8rem;}
 .older-posts,
 .newer-posts{ position: static; margin: 10px 0;}
 .page-number{ display: block;}
 .site-footer{ margin-top: 6rem; font-size: 1.1rem;
 }}

/*

github.com style (c) Vasily Polovnyov <vast@whiteants.net>

*/

.hljs {display: block; padding: 0.5em 1em;
  color: #333;
  background: #EFF3F5}

.hljs-comment,
.hljs-template_comment,
.diff .hljs-header,
.hljs-javadoc {color: #998;
  font-style: italic}

.hljs-keyword,
.css .rule .hljs-keyword,
.hljs-winutils,
.javascript .hljs-title,
.nginx .hljs-title,
.hljs-subst,
.hljs-request,
.hljs-status {color: #333;
  font-weight: bold}

.hljs-number,
.hljs-hexcolor,
.ruby .hljs-constant {color: #099;}

.hljs-string,
.hljs-tag .hljs-value,
.hljs-phpdoc,
.tex .hljs-formula {color: #d14}

.hljs-title,
.hljs-id,
.coffeescript .hljs-params,
.scss .hljs-preprocessor {color: #900;
  font-weight: bold}

.javascript .hljs-title,
.lisp .hljs-title,
.clojure .hljs-title,
.hljs-subst {font-weight: normal}

.hljs-class .hljs-title,
.haskell .hljs-type,
.vhdl .hljs-literal,
.tex .hljs-command {color: #458;
  font-weight: bold}

.hljs-tag,
.hljs-tag .hljs-title,
.hljs-rules .hljs-property,
.django .hljs-tag .hljs-keyword {color: #000080;
  font-weight: normal}

.hljs-attribute,
.hljs-variable,
.lisp .hljs-body {color: #008080}

.hljs-regexp {color: #009926}

.hljs-symbol,
.ruby .hljs-symbol .hljs-string,
.lisp .hljs-keyword,
.tex .hljs-special,
.hljs-prompt {color: #990073}

.hljs-built_in,
.lisp .hljs-title,
.clojure .hljs-built_in {color: #0086b3}

.hljs-preprocessor,
.hljs-pragma,
.hljs-pi,
.hljs-doctype,
.hljs-shebang,
.hljs-cdata {color: #999;
  font-weight: bold}

.hljs-deletion {background: #fdd}

.hljs-addition {background: #dfd}

.diff .hljs-change {background: #0086b3}

.hljs-chunk {color: #aaa}