@import url(https://fonts.googleapis.com/css?family=Open+Sans:300);
.header-menu-link,.search-container .search-item .search-content,.search-container .search-item .search-title{
	-o-text-overflow:ellipsis;
	text-overflow:ellipsis;
	overflow:hidden;
	white-space:nowrap
}
.tag-wrap{
	margin:3px 2px;
	padding:.5rem .825rem;
	line-height:1.825rem;
	font-size:.825rem;
	border:1px solid #d5dce5;
	border-radius:999em;
	-webkit-transition:all .2s ease;
	-o-transition:all .2s ease;
	transition:all .2s ease
}
.tag-wrap:active,.tag-wrap:link,.tag-wrap:visited{
	color:#727272
}
.tag-wrap:hover{
	background:hsla(0,0%,100%,.2);
	color:#e26d6d;
	border:1px solid #e26d6d
}
.article .article-bottom .article-readmore:hover,.article .article-header .article-meta>.article-tag:hover,.pf-right>.pf-paginator a:hover,.post-meta>a:hover{
	border:1px solid hsla(0,67%,66%,.5)
}
.article .article-header .article-meta>.article-tag,.post-meta>a{
	display:inline-block;
	padding:3px 6px;
	border:1px solid #eee;
	border-radius:4px;
	background:hsla(0,0%,100%,.3);
	margin:0 3px;
	font-size:.825rem
}
.pf-right>.pf-paginator a{
	position:relative
}
.pf-right>.pf-paginator a:hover:after,.pf-right>.pf-paginator a:hover:before{
	position:absolute;
	-webkit-animation-fill-mode:forwards;
	animation-fill-mode:forwards;
	-webkit-animation-name:tipsAnimation;
	animation-name:tipsAnimation;
	-webkit-animation-duration:.2s;
	animation-duration:.2s
}
.pf-right>.pf-paginator a:hover:before{
	content:" ";
	border:8px solid transparent;
	border-top:8px solid #565656;
	top:-30%;
	left:50%;
	margin-left:-4px;
	margin-top:-2px;
	width:0;
	height:0
}
.pf-right>.pf-paginator a:hover:after{
	content:attr(data-hover);
	bottom:130%;
	left:50%;
	padding:8px 6px;
	width:160px;
	margin-left:-80px;
	font-size:16.5px;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
	color:#fff!important;
	background:#40484a;
	text-shadow:0 -1px 0 #000;
	border-radius:4px;
	text-align:center
}
@-webkit-keyframes tipsAnimation{
	0%{
		-webkit-transform:translateY(10px);
		transform:translateY(10px);
		opacity:.8
	}
	to{
		-webkit-transform:translateY(-4px);
		transform:translateY(-4px);
		opacity:1
	}
}
@keyframes tipsAnimation{
	0%{
		-webkit-transform:translateY(10px);
		transform:translateY(10px);
		opacity:.8
	}
	to{
		-webkit-transform:translateY(-4px);
		transform:translateY(-4px);
		opacity:1
	}
}
h1,h2,h3,h4,h5,h6{
	color:#111;
	word-spacing:.5px;
	font-weight:300
}
h1{
	margin:1.4em 0;
	font-size:26px
}
h2,h3{
	margin:1.3em 0;
	font-size:23px
}
h4,h5,h6{
	margin:1.2em 0;
	font-size:18px
}
.article-excerpt p,.post-content p{
	font-weight:300;
	margin:1em 0;
	line-height:2;
	font-size:.88rem
}
strong{
	font-weight:500
}
blockquote{
	display:block;
	letter-spacing:.4px;
	font-size:15px;
	padding:0 12px;
	margin:2rem 0
}
blockquote p{
	margin:0;
	padding-left:10px;
	border-left:3px solid #eee
}
hr{
	margin:1em 0;
	opacity:.2;
	border:.2px solid #eee
}
ol,ul{
	margin-left:22px;
	padding-left:0
}
ol p,ul p{
	margin:0
}
li{
	font-size:15px;
	margin:8px 0;
	list-style-type:none;
	position:relative
}
li:before{
	position:absolute;
	left:-12px;
	top:0;
	content:" ";
	width:2px;
	height:2px
}
table{
	border-collapse:collapse;
	border-spacing:0;
	margin:28px 0
}
table,th{
	font-size:14px
}
td,th{
	border:1px solid #ddd;
	padding:.4rem 1rem;
	font-weight:300;
	margin:28px 0
}
.article-excerpt h1,.article-excerpt h2,.article-excerpt h3,.article-excerpt h4,.article-excerpt h5,.article-excerpt h6{
	margin:.8em 0
}
.article-excerpt p{
	margin:0 0 .8em
}
.article-excerpt a,.post-content a{
	font-size:.9rem;
	color:#e26d6d!important;
	text-decoration:underline;
	font-family:LXGWWenKaiGBScreen
}
.article-excerpt a:hover,.post-content a:hover{
	color:#727272!important
}
.post-content img{
	margin:1.2em 0
}
.fadeIn{
	-webkit-animation-fill-mode:forwards;
	animation-fill-mode:forwards;
	-webkit-animation-name:fadeIn;
	animation-name:fadeIn;
	-webkit-animation-duration:1.2s;
	animation-duration:1.2s
}
.slideUp{
	-webkit-animation-fill-mode:forwards;
	animation-fill-mode:forwards;
	-webkit-animation-name:slideUp;
	animation-name:slideUp;
	-webkit-animation-duration:.5s;
	animation-duration:.5s
}
.slideDown{
	-webkit-animation-fill-mode:forwards;
	animation-fill-mode:forwards;
	-webkit-animation-name:slideDown;
	animation-name:slideDown;
	-webkit-animation-duration:.5s;
	animation-duration:.5s
}
.slideDownMin{
	-webkit-animation-fill-mode:forwards;
	animation-fill-mode:forwards;
	-webkit-animation-name:slideDownMin;
	animation-name:slideDownMin;
	-webkit-animation-duration:.4s;
	animation-duration:.4s
}
.sildeUpMin{
	-webkit-animation-fill-mode:forwards;
	animation-fill-mode:forwards;
	-webkit-animation-name:sildeUpMin;
	animation-name:sildeUpMin;
	-webkit-animation-duration:.4s;
	animation-duration:.4s
}
.menuSlideIn{
	-webkit-animation-fill-mode:forwards;
	animation-fill-mode:forwards;
	-webkit-animation-name:menuSlideIn;
	animation-name:menuSlideIn;
	-webkit-animation-duration:.5s;
	animation-duration:.5s
}
.menuSlideOut{
	-webkit-animation-fill-mode:forwards;
	animation-fill-mode:forwards;
	-webkit-animation-name:menuSlideOut;
	animation-name:menuSlideOut;
	-webkit-animation-duration:.4s;
	animation-duration:.4s
}
.scrollIn{
	-webkit-animation-fill-mode:forwards;
	animation-fill-mode:forwards;
	-webkit-animation-name:scrollIn;
	animation-name:scrollIn;
	-webkit-animation-duration:.6s;
	animation-duration:.6s
}
.leftIn{
	-webkit-animation-fill-mode:forwards;
	animation-fill-mode:forwards;
	-webkit-animation-name:leftIn;
	animation-name:leftIn;
	-webkit-animation-duration:.8s;
	animation-duration:.8s
}
.rightOut{
	-webkit-animation-fill-mode:forwards;
	animation-fill-mode:forwards;
	-webkit-animation-name:rightOut;
	animation-name:rightOut;
	-webkit-animation-duration:.8s;
	animation-duration:.8s
}
@-webkit-keyframes fadeIn{
	0%{
		opacity:0
	}
	to{
		opacity:1
	}
}
@keyframes fadeIn{
	0%{
		opacity:0
	}
	to{
		opacity:1
	}
}
@-webkit-keyframes slideUp{
	0%{
		-webkit-transform:translateY(0);
		transform:translateY(0)
	}
	to{
		-webkit-transform:translateY(-100px);
		transform:translateY(-100px)
	}
}
@keyframes slideUp{
	0%{
		-webkit-transform:translateY(0);
		transform:translateY(0)
	}
	to{
		-webkit-transform:translateY(-100px);
		transform:translateY(-100px)
	}
}
@-webkit-keyframes slideDown{
	0%{
		-webkit-transform:translateY(-100px);
		transform:translateY(-100px)
	}
	to{
		-webkit-transform:translateY(0);
		transform:translateY(0)
	}
}
@keyframes slideDown{
	0%{
		-webkit-transform:translateY(-100px);
		transform:translateY(-100px)
	}
	to{
		-webkit-transform:translateY(0);
		transform:translateY(0)
	}
}
@-webkit-keyframes slideDownMin{
	0%{
		-webkit-transform:translateY(-30px);
		transform:translateY(-30px);
		opacity:0
	}
	to{
		-webkit-transform:translateY(0);
		transform:translateY(0);
		opacity:1
	}
}
@keyframes slideDownMin{
	0%{
		-webkit-transform:translateY(-30px);
		transform:translateY(-30px);
		opacity:0
	}
	to{
		-webkit-transform:translateY(0);
		transform:translateY(0);
		opacity:1
	}
}
@-webkit-keyframes sildeUpMin{
	0%{
		-webkit-transform:translateY(30px);
		transform:translateY(30px);
		opacity:0
	}
	to{
		-webkit-transform:translateY(0);
		transform:translateY(0);
		opacity:1
	}
}
@keyframes sildeUpMin{
	0%{
		-webkit-transform:translateY(30px);
		transform:translateY(30px);
		opacity:0
	}
	to{
		-webkit-transform:translateY(0);
		transform:translateY(0);
		opacity:1
	}
}
@-webkit-keyframes menuSlideIn{
	0%{
		-webkit-transform:translateX(-200px);
		transform:translateX(-200px)
	}
	to{
		-webkit-transform:translateX(0);
		transform:translateX(0)
	}
}
@keyframes menuSlideIn{
	0%{
		-webkit-transform:translateX(-200px);
		transform:translateX(-200px)
	}
	to{
		-webkit-transform:translateX(0);
		transform:translateX(0)
	}
}
@-webkit-keyframes menuSlideOut{
	0%{
		-webkit-transform:translateX(0);
		transform:translateX(0)
	}
	to{
		-webkit-transform:translateX(-200px);
		transform:translateX(-200px)
	}
}
@keyframes menuSlideOut{
	0%{
		-webkit-transform:translateX(0);
		transform:translateX(0)
	}
	to{
		-webkit-transform:translateX(-200px);
		transform:translateX(-200px)
	}
}
@-webkit-keyframes scrollIn{
	0%{
		-webkit-transform:translateY(50px);
		transform:translateY(50px);
		opacity:0
	}
	to{
		-webkit-transform:translateY(0);
		transform:translateY(0);
		opacity:1
	}
}
@keyframes scrollIn{
	0%{
		-webkit-transform:translateY(50px);
		transform:translateY(50px);
		opacity:0
	}
	to{
		-webkit-transform:translateY(0);
		transform:translateY(0);
		opacity:1
	}
}
@-webkit-keyframes leftIn{
	0%{
		-webkit-transform:translateX(100px);
		transform:translateX(100px);
		opacity:0
	}
	to{
		-webkit-transform:translateX(0);
		transform:translateX(0);
		opacity:1
	}
}
@keyframes leftIn{
	0%{
		-webkit-transform:translateX(100px);
		transform:translateX(100px);
		opacity:0
	}
	to{
		-webkit-transform:translateX(0);
		transform:translateX(0);
		opacity:1
	}
}
@-webkit-keyframes rightOut{
	0%{
		-webkit-transform:translateX(0);
		transform:translateX(0);
		opacity:1
	}
	to{
		-webkit-transform:translateX(100px);
		transform:translateX(100px);
		opacity:0
	}
}
@keyframes rightOut{
	0%{
		-webkit-transform:translateX(0);
		transform:translateX(0);
		opacity:1
	}
	to{
		-webkit-transform:translateX(100px);
		transform:translateX(100px);
		opacity:0
	}
}
body{
	width:100%
}
.highlight,pre{
	overflow:auto;
	margin:20px 0;
	padding:0;
	font-size:13.5px;
	color:#4d4d4c;
	background:#fcfdfd
}
code,pre{
	font-family:consolas
}
code{
	padding:2px 4px;
	word-wrap:break-word;
	font-size:13.5px
}
pre{
	padding:10px
}
pre code{
	padding:0;
	color:#4d4d4c;
	background:none;
	text-shadow:none
}
.highlight{
	border-radius:6px;
	text-shadow:1px 2px 1px rgba(0,0,0,.009);
	-webkit-box-shadow:0 1px 2px rgba(0,0,0,.05);
	box-shadow:0 1px 2px rgba(0,0,0,.05)
}
.highlight pre{
	border:none;
	margin:0;
	padding:10px 0
}
.highlight table{
	margin:0;
	width:auto;
	border:none
}
.highlight td{
	border:none;
	padding:0
}
.highlight figcaption{
	font-size:1em;
	color:#4d4d4c;
	line-height:1em;
	margin-bottom:1em
}
.highlight figcaption:after,.highlight figcaption:before{
	content:" ";
	display:table
}
.highlight figcaption:after{
	clear:both
}
.highlight figcaption a{
	float:right;
	color:#4d4d4c
}
.highlight figcaption a:hover{
	border-bottom-color:#4d4d4c
}
.highlight .gutter pre{
	margin:0;
	text-align:right;
	font-size:12px;
	color:#606a6d;
	font-family:Arial,"sans-serif"
}
.highlight .code pre,.highlight .gutter pre{
	padding-left:10px;
	padding-right:10px;
	background-color:#fcfdfd
}
.highlight .code pre{
	width:100%
}
.highlight .line{
	display:inline-block;
	padding:2px 0;
	height:20px;
	border:none
}
.highlight .marked{
	width:100%;
	border-left:2px solid #727272;
	margin:.5em 0;
	padding-left:.5em
}
.gutter{
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select:none
}
.gist table{
	width:auto
}
.gist table td{
	border:none
}
pre .deletion{
	background:#fdd
}
pre .addition{
	background:#dfd
}
pre .meta{
	color:#8959a8
}
pre .comment{
	color:#8e908c
}
pre .attribute,pre .css .class,pre .css .id,pre .css .pseudo,pre .html .doctype,pre .regexp,pre .ruby .constant,pre .tag,pre .variable,pre .xml .doctype,pre .xml .pi,pre .xml .tag .title{
	color:#e24c38
}
pre .built_in,pre .command,pre .constant,pre .literal,pre .number,pre .params,pre .preprocessor{
	color:#e78c45
}
pre .css .rules .attribute,pre .formula,pre .header,pre .inheritance,pre .number,pre .ruby .class .title,pre .ruby .symbol,pre .special,pre .string,pre .value,pre .xml .cdata{
	color:#718c00
}
pre .css .hexcolor,pre .title{
	color:#3e999f
}
pre .coffeescript .title,pre .function,pre .javascript .title,pre .perl .sub,pre .python .decorator,pre .python .title,pre .ruby .function .title,pre .ruby .title .keyword{
	color:#4271ae
}
pre .javascript .function,pre .keyword{
	color:#e24c38
}
.highlight{
	position:relative;
	width:100%
}
.highlight:after{
	position:absolute;
	top:0;
	right:0;
	color:#ccc;
	content:"Code";
	font-size:12px;
	padding:5px 10px 0;
	height:15px
}
.highlight.html.highlight:after{
	content:"HTML"
}
.highlight.javascript.highlight:after,.highlight.js.highlight:after{
	content:"JS"
}
.highlight.bash.highlight:after{
	content:"Shell"
}
.highlight.css.highlight:after{
	content:"CSS"
}
.highlight.sass.highlight:after{
	content:"SASS"
}
.highlight.less.highlight:after{
	content:"LESS"
}
.highlight.styl.highlight:after{
	content:"Styl"
}
.highlight.java.highlight:after{
	content:"Java"
}
.highlight.c++.highlight:after{
	content:"C++"
}
.highlight.c.highlight:after{
	content:"C"
}
.highlight.yml.highlight:after{
	content:"YML"
}
.highlight.php.highlight:after{
	content:"PHP"
}
p code{
	padding:2px 8px;
	text-shadow:1px 2px 1px rgba(0,0,0,.02);
	-webkit-box-shadow:0 2px 2px rgba(0,0,0,.05);
	box-shadow:0 2px 2px rgba(0,0,0,.05);
	font-size:13.5px;
	color:#4d4d4c;
	background:#fcfdfd
}
@font-face{
	font-family:iconfont;
	src:url(fonts/iconfont.e3ee.eot);
	src:url(fonts/iconfont.e3ee.eot?#iefix) format("embedded-opentype"),url(fonts/iconfont.e0fd.woff) format("woff"),url(fonts/iconfont.55e5.ttf) format("truetype"),url(fonts/iconfont.8b30.svg#iconfont) format("svg")
}
.iconfont{
	font-family:iconfont!important;
	font-size:.95rem;
	font-style:normal;
	-webkit-font-smoothing:antialiased;
	-webkit-text-stroke-width:.2px;
	-moz-osx-font-smoothing:grayscale
}
.icon-menu-search{
	font-size:18px;
	cursor:pointer
}
.icon-menu-search:before{
	content:"\E6AC"
}
.icon-menu{
	font-size:1.25rem
}
.icon-menu:before{
	content:"\E6AB"
}
.icon-no-menu{
	font-size:1.25rem
}
.icon-no-menu:before{
	content:"\E7A4"
}
.icon-tag-inner{
	font-size:15px
}
.icon-tag-inner:before{
	content:"\E7A2"
}
.icon-date{
	font-size:.8rem
}
.icon-date:before{
	content:"\E60D"
}
.icon-words{
	font-size:1.1rem
}
.icon-words:before{
	content:"\E696"
}
.icon-eye{
	font-size:1.1rem
}
.icon-eye:before{
	content:"\E66B"
}
.icon-tag:before{
	content:"\E624"
}
.icon-category:before{
	content:"\E612"
}
.icon-category,.icon-tag{
	font-size:.9rem
}
.icon-posts{
	font-size:1.2rem
}
.icon-posts:before{
	content:"\E6B4"
}
.icon-open:before{
	content:"\E62E"
}
.icon-close:before{
	content:"\E62D"
}
.icon-close,.icon-open{
	font-size:.8em
}
.icon-search{
	font-size:15px
}
.icon-search:before{
	content:"\E681"
}
.icon-cancel{
	cursor:pointer
}
.icon-cancel:before{
	content:"\E7A3"
}
.icon-share:before{
	content:"\E98B"
}
.icon-donate:before{
	content:"\E613"
}
.icon-donate,.icon-share{
	font-size:.9rem
}
.icon-donate-wechat:before{
	content:"\E644"
}
.icon-donate-alipay:before{
	content:"\E616"
}
.icon-donate-alipay,.icon-donate-wechat{
	font-size:1.6rem
}
.icon-pv:before{
	content:"\E67B"
}
.icon-uv:before{
	content:"\E650"
}
.icon-pv,.icon-uv{
	font-size:1.2em
}
.icon-backtotop{
	font-size:2.2rem
}
.icon-backtotop:before{
	content:"\E697"
}
.icon-location{
	font-size:.825rem;
	margin:0 5px
}
.icon-location:before{
	content:"\E63F"
}
.icon-Github:before{
	content:"\E667"
}
.icon-Zhihu:before{
	content:"\E6D1"
}
.icon-Weibo:before{
	content:"\E74E"
}
.icon-SegmentFault:before{
	content:"\E74D"
}
.icon-Facebook:before{
	content:"\E6E2"
}
.icon-Twitter:before{
	content:"\E629"
}
.icon-Instagram:before{
	content:"\E607"
}
.icon-LinkedIn:before{
	content:"\E64B"
}
.icon-Others:before{
	content:"\E617"
}
.icon-share-qq:before{
	content:"\E61E"
}
.icon-share-weixin:before{
	content:"\E63E"
}
.icon-share-weibo:before{
	content:"\E74E"
}
.icon-share-douban:before{
	content:"\E7A1"
}
.icon-share-facebook:before{
	content:"\EE75"
}
.icon-share-twitter:before{
	content:"\E606"
}
.icon-share-tumblr:before{
	content:"\E87B"
}
.icon-share-google:before{
	content:"\E611"
}
.icon-nofound:before{
	content:"\E67A"
}
.icon-star:before{
	color:rgba(0,0,0,.4);
	content:"\E608";
	font-size:2px;
	padding:0 5px;
	margin-bottom:5px
}
.icon-left{
	font-size:12px
}
.icon-left:before{
	content:"\E660"
}
.icon-right{
	font-size:12px
}
.icon-right:before{
	content:"\E65F"
}
*{
	-webkit-box-sizing:border-box;
	box-sizing:border-box
}
body,html{
	height:100%;
	width:100%;
	background:#fff;
	letter-spacing:.4px;
	margin:0;
	padding:0
}
body{
	overflow-x:hidden;
	font:300 14px -apple-system,BlinkMacSystemFont,Open Sans,Microsoft YaHei,Arial,"sans-serif"
}
@media screen and (max-width:479px){
	html{
		font-size:15.5px
	}
}
@media screen and (min-width:480px) and (max-width:768px){
	html{
		font-size:16px
	}
}
@media screen and (min-width:769px) and (max-width:1023px){
	html{
		font-size:16.5px
	}
}
@media screen and (min-width:1024px) and (max-width:1599px){
	html{
		font-size:17px
	}
}
@media screen and (min-width:1600px){
	html{
		font-size:17.5px
	}
}
a{
	text-decoration:none;
	-webkit-transition:all .2s ease-in-out;
	-o-transition:all .2s ease-in-out;
	transition:all .2s ease-in-out
}
a:active,a:link,a:visited{
	color:rgba(0,0,0,.75)
}
a:hover{
	color:#e26d6d
}
img{
	display:block;
	max-width:100%;
	margin:15px auto;
	opacity:.95;
	border-radius:2px
}
time{
	font-size:.825rem
}
time:hover{
	color:#e26d6d
}
.page-title{
	display:block;
	text-align:center;
	margin-bottom:1.5rem;
	font-size:1.15rem;
	letter-spacing:.6px;
	color:rgba(0,0,0,.5)
}
.mask{
	display:none;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:998;
	background-color:rgba(0,0,0,.04)
}
#backTop{
	opacity:0;
	position:fixed;
	cursor:pointer;
	z-index:999;
	bottom:8%;
	right:2%;
	padding:2px 8px;
	border-radius:50%;
	width:2.4rem;
	height:2.4rem;
	text-align:center
}
#backTop:hover{
	color:#e26d6d
}
@media screen and (max-width:479px){
	#backTop{
		right:1rem;
		bottom:56px;
		right:28px
	}
}
.container{
	margin-top:2rem;
	padding:0 1.8rem;
	min-height:50vh
}
.main{
	margin:0 auto;
	width:54%
}
@media screen and (min-width:769px) and (max-width:1023px){
	.main{
		width:68%
	}
}
.header{
	width:100%
}
.header-nav{
	margin:0 auto;
	max-width:58%;
	height:4rem;
	line-height:4rem;
	-webkit-box-align:center;
	-ms-flex-align:center;
	align-items:center
}
.header-menu,.header-nav{
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-pack:end;
	-ms-flex-pack:end;
	justify-content:flex-end
}
.header-menu{
	white-space:nowrap
}
.header-menu-link{
	margin:0 .85rem;
	font-size:.9rem;
	display:inline-block;
	letter-spacing:1px
}
.header-static{
	position:static;
	background-color:#fff
}
.header-fixed{
	position:fixed;
	z-index:999;
	top:0;
	left:0;
	opacity:.8;
	background-color:#fff;
	-webkit-transition:all .6s;
	-o-transition:all .6s;
	transition:all .6s
}
.header-menu-active{
	color:#e26d6d!important
}
.header-title{
	font-size:1.4rem
}
.slide-right{
	-webkit-transform:translateX(200px);
	-ms-transform:translateX(200px);
	transform:translateX(200px)
}
.slide-left,.slide-right{
	-webkit-transition:.5s;
	-o-transition:.5s;
	transition:.5s
}
.slide-left{
	-webkit-transform:translateX(0);
	-ms-transform:translateX(0);
	transform:translateX(0)
}
.mobile-toggle{
	display:none;
	position:relative;
	float:left;
	margin-left:12px
}
.mobile-menu{
	display:none;
	position:fixed;
	left:0;
	top:0;
	width:200px;
	height:100%;
	background-color:#fff;
	z-index:999;
	padding-top:46px;
	text-align:center
}
.mobile-menu-link{
	display:block;
	padding:18px 16px;
	line-height:1
}
.mobile-menu-icon{
	margin:30px auto;
	width:40px;
	padding:4px;
	border:1px solid #eee;
	border-radius:5px
}
#comment{
	margin-bottom:4rem;
	padding-bottom:1rem;
	position:relative;
	border:none
}
.col-60,.power,.vempty{
	visibility:hidden
}
.veditor,.vempty,.vmail,.vnick,.vsubmit{
	font-family:LXGWWenKaiGBScreen,-apple-system,BlinkMacSystemFont,Open Sans,Microsoft YaHei,Arial,"sans-serif";
	font-size:1rem;
	border:none!important
}
.vsubmit{
	background-color:#f5f6fa!important;
	border:0!important;
	padding:0 3px!important;
	color:rgba(0,0,0,.5)!important;
	font-weight:300!important;
	letter-spacing:.3px
}
.vsubmit:hover{
	color:#e26d6d!important
}
.vcard{
	padding:5px 0 0 20px!important
}
.post-header{
	position:relative;
	margin-top:3rem;
	padding:10px 0;
	border-bottom:1px solid #eee
}
.post-header>.post-title{
	font-size:2rem;
	margin:0 0 1rem;
	color:rgba(0,0,0,.9)
}
.post-header>.meta-info>span{
	margin-right:12px
}
.post-content{
	min-height:18vh;
	margin:1rem 0 2rem
}
.donate-btn,.share-btn{
	cursor:pointer;
	margin:0 14px
}
.donate-btn:hover,.share-btn:hover{
	color:#e26d6d
}
#donate-box{
	position:fixed;
	width:460px;
	height:400px;
	top:50%;
	left:50%;
	margin-top:-200px;
	margin-left:-230px;
	border-radius:4px;
	z-index:999;
	background:#fff;
	display:none;
	padding:20px 0;
	text-align:center;
	border-radius:10px;
	-webkit-box-shadow:0 5px 10px 0 rgba(0,0,0,.05);
	box-shadow:0 5px 10px 0 rgba(0,0,0,.05)
}
.donate-cancel{
	position:absolute;
	top:12px;
	right:24px;
	width:12px;
	font-size:18px
}
.donate-img-box{
	width:260px;
	margin:0 auto
}
.donate-img{
	margin-top:0
}
.donate-word{
	display:inline-block;
	font-weight:300;
	font-size:.9rem
}
.donate-list{
	height:auto;
	overflow:hidden
}
.donate-active{
	color:#e26d6d
}
.-mob-share{
	position:fixed;
	width:340px;
	height:240px;
	top:50%;
	left:50%;
	margin-top:-120px;
	margin-left:-170px;
	border-radius:4px;
	z-index:999;
	background:#fff;
	display:none;
	padding:20px 0;
	text-align:center;
	border-radius:10px;
	-webkit-box-shadow:0 5px 10px 0 rgba(0,0,0,.05);
	box-shadow:0 5px 10px 0 rgba(0,0,0,.05)
}
.-mob-share a{
	padding:4px;
	font-size:1.28rem;
	display:inline-block;
	min-width:80px;
	padding:4px 6px;
	margin:4px;
	border-radius:4px;
	cursor:pointer
}
.-mob-share a:hover{
	color:#e26d6d
}
.-mob-share-weixin-qrcode-bg{
	background-color:rgba(0,0,0,.13)!important
}
.-mob-share-weixin-qrcode-content{
	border:1px solid #eee!important
}
.post-meta{
	margin:5rem 0 1rem
}
.post-footer{
	width:100%;
	height:160px;
	position:relative;
	border:.5px solid #eee;
	border-radius:4px;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-pack:justify;
	-ms-flex-pack:justify;
	justify-content:space-between;
	-webkit-box-align:center;
	-ms-flex-align:center;
	align-items:center;
	padding:20px 11px;
	margin-bottom:4rem;
	margin-bttom:8rem;
	text-align:right;
	-webkit-box-sizing:content-box;
	box-sizing:content-box
}
.post-footer>div{
	width:50%;
	height:100%
}
.pf-avatar{
	width:90px;
	height:90px;
	padding:1px;
	border:1px solid #eee;
	border-radius:50%;
	-webkit-box-shadow:0 2px 2px rgba(0,0,0,.06);
	box-shadow:0 2px 2px rgba(0,0,0,.06)
}
.pf-left{
	text-align:center
}
.pf-left>.pf-des{
	color:rgba(0,0,0,.65);
	font-size:.95rem;
	overflow:hidden
}
.pf-left>.pf-avatar{
	width:90px;
	height:90px;
	padding:1px;
	border:1px solid #eee;
	border-radius:50%;
	-webkit-box-shadow:0 2px 2px rgba(0,0,0,.06);
	box-shadow:0 2px 2px rgba(0,0,0,.06)
}
.pf-right{
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-orient:vertical;
	-webkit-box-direction:normal;
	-ms-flex-direction:column;
	flex-direction:column
}
.pf-right>div,.pf-right>nav{
	width:100%;
	height:50%
}
.pf-right>.pf-paginator{
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-pack:center;
	-ms-flex-pack:center;
	justify-content:center;
	-webkit-box-align:end;
	-ms-flex-align:end;
	align-items:flex-end
}
.pf-right>.pf-paginator a{
	border-radius:4px;
	padding:6px 12px;
	border:1px solid #eee;
	margin:0 6px;
	font-size:16px
}
.profile{
	border-bottom:.5px solid #eee;
	margin-bottom:40px;
	padding-bottom:8px;
	text-align:center
}
.profile .avatar{
	display:block;
	width:90px;
	height:90px;
	padding:1px;
	border:1px solid #eee;
	border-radius:50%;
	-webkit-box-shadow:0 2px 2px rgba(0,0,0,.06);
	box-shadow:0 2px 2px rgba(0,0,0,.06);
	-webkit-transition:all .1s ease-in;
	-o-transition:all .1s ease-in;
	transition:all .1s ease-in;
	cursor:pointer
}
.profile .avatar:hover{
	opacity:.85
}
.profile>.author{
	margin:0;
	text-align:center;
	font-size:16px;
	color:rgba(0,0,0,.85)
}
.profile>.social a{
	padding-right:1.5px
}
.profile>.social a i{
	font-size:1.35rem
}
.article{
	opacity:0;
	margin-bottom:48px;
	padding:14px 0
}
.article:after{
	content:"";
	position:absolute;
	left:1%;
	bottom:-16px;
	width:98%;
	height:1px;
	background-color:#f5f5f5
}
.article .article-header{
	padding:1rem 1.5rem 0
}
.article .article-header span{
	color:rgba(0,0,0,.7);
	font-size:.825rem
}
.article .article-header .article-title{
	display:block;
	margin-bottom:6px;
	font-size:1.75rem
}
.article .article-header .article-meta{
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	height:50px;
	-webkit-box-align:center;
	-ms-flex-align:center;
	align-items:center;
	font-size:.75rem
}
.article .article-header .article-meta>span{
	display:inline-block;
	padding:8px 6px
}
.article .article-header .article-meta>.article-tag{
	font-size:.75rem
}
.article .article-excerpt{
	margin:1rem 1.2rem
}
.article .article-bottom{
	text-align:center;
	margin:4rem auto 0;
	height:44px
}
.article .article-bottom .article-readmore{
	font-size:.85rem;
	padding:8px 12px;
	border-radius:40px;
	border:1px solid #eee;
	-webkit-box-sizing:content-box;
	box-sizing:content-box;
	text-align:center
}
.thumb{
	margin:0 .8rem;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex
}
@media screen and (max-width:479px){
	.thumb{
		-ms-flex-wrap:wrap;
		flex-wrap:wrap;
		margin:.5rem
	}
}
.banner{
	position:relative;
	left:-1%;
	width:102%;
	height:22.5rem;
	background-size:cover;
	background-position:50%;
	background-repeat:no-repeat;
	border-radius:3px
}
@media screen and (max-width:479px){
	.banner{
		width:100%;
		max-height:12rem
	}
}
.gallery-thumb{
	margin:0 .8rem;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex
}
@media screen and (max-width:479px){
	.gallery-thumb{
		-ms-flex-wrap:wrap;
		flex-wrap:wrap;
		margin:.5rem
	}
}
.gallery{
	border-radius:2px;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
	width:25%;
	margin:0 .1rem;
	background-size:cover;
	background-position:50%;
	background-repeat:no-repeat
}
.gallery:before{
	content:"";
	display:inline-block;
	padding-bottom:100%
}
@media screen and (max-width:479px){
	.gallery{
		width:45%;
		margin-bottom:.1rem
	}
}
.tag-wrap{
	display:inline-block;
	margin:.4rem .3rem;
	padding:2px 12px
}
.tag-wrap>.tag-name{
	font-size:.9rem
}
.tag-wrap>.tag-count{
	font-size:.825rem
}
.archive-part{
	margin:1.5rem 1rem 0;
	text-align:right
}
.archive-part>.archive-part-item{
	border:1px solid #eee;
	padding:6px 7px;
	border-radius:3px;
	font-size:.825rem;
	color:rgba(0,0,0,.65);
	cursor:pointer;
	-webkit-transition:all .2s ease-in-out;
	-o-transition:all .2s ease-in-out;
	transition:all .2s ease-in-out
}
.archive-part>.archive-part-item:hover{
	border:1px solid #e26d6d;
	color:#e26d6d
}
.archive-item{
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	position:relative;
	-webkit-box-align:center;
	-ms-flex-align:center;
	align-items:center;
	padding:8px 60px
}
.archive-item:after{
	content:"";
	position:absolute;
	left:10%;
	bottom:0;
	width:80%;
	height:1px;
	background-color:#f5f5f5
}
.archive-item>.archive-time{
	width:40%;
	font-size:.825rem;
	color:rgba(0,0,0,.65);
	text-align:center;
	margin:10px 0
}
.archive-item>.archive-title{
	width:60%;
	font-size:1.05rem;
	display:inline-block;
	text-align:left;
	margin:14px 0
}
.sidebar{
	display:none;
	padding:1.8em 0;
	position:absolute;
	width:250px;
	height:100%;
	top:18%;
	left:79%;
	overflow:hidden
}
@media screen and (max-width:479px){
	.sidebar{
		display:none
	}
}
.toc-title{
	display:block;
	text-align:center;
	font-size:1rem;
	color:rgba(0,0,0,.5);
	cursor:pointer
}
.toc-title:hover{
	color:#e26d6d
}
.toc-fixed{
	position:fixed;
	top:2%;
	left:79%;
	height:86%
}
.toc-active{
	color:#e26d6d
}
.item{
	margin:2rem 0;
	padding:0 1rem;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-pack:center;
	-ms-flex-pack:center;
	justify-content:center;
	-webkit-box-align:center;
	-ms-flex-align:center;
	align-items:center;
	min-height:20px
}
.item-date{
	width:25%;
	font-size:.85rem;
	text-align:center;
	color:#000
}
.item-title{
	width:70%;
	font-size:1rem
}
.item-title:hover{
	color:#e26d6d
}
.search-container{
	display:none;
	position:fixed;
	left:50%;
	top:80px;
	z-index:999;
	width:740px;
	max-height:620px;
	margin-left:-370px;
	overflow-x:hidden;
	overflow-y:auto;
	-webkit-box-sizing:content-box;
	box-sizing:content-box;
	background-color:#fff;
	border-radius:3px;
	-webkit-box-shadow:0 5px 10px 0 rgba(0,0,0,.05);
	box-shadow:0 5px 10px 0 rgba(0,0,0,.05)
}
.search-container .search-input{
	caret-color:#000;
	margin:20px 0 0 20px;
	padding:4px 0 20px 20px;
	width:90%;
	border:none;
	font-size:.85rem;
	color:rgba(0,0,0,.75);
	background-color:#fff;
	border-bottom:1px solid #eee;
	outline:none
}
.search-container .search-cancel{
	height:30px;
	font-size:20px
}
.search-container .search-result{
	padding:16px 12px;
	margin:3px 0;
	height:auto;
	overflow:hidden
}
.search-container .search-item{
	margin:16px 4px 14px;
	border-bottom:1px solid #eee
}
.search-container .search-item .search-title{
	display:block;
	font-size:1rem;
	padding-left:12px
}
.search-container .search-item .search-content{
	padding:8px 12px 16px;
	font-size:.825rem;
	color:rgba(0,0,0,.7)
}
.search-container .search-item .search-keyword{
	font-size:.9rem;
	color:#e26d6d
}
.search-empty{
	margin:30px 0;
	font-size:1.1rem;
	text-align:center
}
.paginator{
	position:relative;
	margin:8rem 0;
	padding:0 20px;
	text-align:center;
	font-size:.825rem;
	color:#727272;
	height:40px
}
.paginator>.next,.paginator>.prev{
	display:inline-block;
	padding:4px 12px;
	border-radius:4px;
	position:absolute
}
.paginator>.prev{
	left:2px
}
.paginator>.next{
	right:2px
}
.paginator>.page-number{
	display:inline-block;
	min-width:100px;
	height:100%;
	padding:6px 2px;
	font-size:14px;
	line-height:30px
}
.paginator>.page-number>strong{
	font-size:16px;
	color:#e26d6d
}
#footer{
	margin-top:10vh;
	padding:50px 0 0;
	text-align:center;
	font-family:Arial
}
#footer .footer-copyright{
	color:rgba(0,0,0,.35);
	line-height:22px;
	font-size:12px;
	margin-bottom:26px
}
#footer .footer-copyright a{
	color:#e26d6d!important
}
@media screen and (max-width:479px){
	h1,h2,h3{
		margin:28px 0
	}
	h4,h5,h6{
		margin:14px 0
	}
	h1{
		font-size:24px
	}
	h2{
		font-size:20px
	}
	h3,h4{
		font-size:16px
	}
	h5,h6{
		font-size:12px
	}
	p{
		margin:12px 0;
		font-size:16px
	}
	.container{
		display:block
	}
	.container,.main{
		clear:both;
		width:100%;
		margin:1rem 0;
		padding:0 10px
	}
	#header{
		width:100%
	}
	.header-nav{
		max-width:100%;
		height:50px;
		position:relative;
		-webkit-box-pack:start;
		-ms-flex-pack:start;
		justify-content:flex-start
	}
	.header-menu{
		display:none
	}
	.mobile-toggle{
		display:inline
	}
	.profile .author{
		margin:.5em 0
	}
	.post-title{
		font-size:1.45rem;
		margin:-1rem 0 1.8rem
	}
	.post-info{
		width:100%;
		margin:0
	}
	#donate-box{
		width:94%;
		top:50%;
		left:3%;
		margin-left:0;
		border-radius:6px
	}
	.article{
		margin:10px 0 36px;
		padding:0
	}
	.article>.article-header{
		margin:0;
		padding:0;
		text-align:left
	}
	.article>.article-header time{
		font-size:14px
	}
	.article>.article-title{
		margin:12px 0;
		font-size:22px
	}
	.article>.article-excerpt{
		margin:1.5rem 0 0;
		padding:0
	}
	.article>.article-excerpt p{
		margin:12px 0
	}
	.item{
		margin:.5rem 8px;
		padding:0
	}
	.item-date,.item-title{
		width:100%;
		display:block;
		clear:both;
		text-align:left
	}
	.item-title{
		max-width:100%;
		width:100%;
		margin:8px 0
	}
	.meta-name{
		margin:1em 0
	}
	.archive-item{
		padding:.5rem 0
	}
	.archive-item>.archive-time{
		width:30%
	}
	.archive-item>.archive-title{
		width:70%;
		display:block;
		margin:1rem 0
	}
	.archive-item>.archive-title a{
		font-size:1.1rem
	}
	.cate-inner{
		margin:0 .5rem 1rem
	}
	.cate-info{
		margin-left:0
	}
	.tag-wrap{
		margin:3px 0 8px
	}
	.meta-info{
		text-align:left;
		width:100%;
		display:-webkit-box;
		display:-ms-flexbox;
		display:flex;
		-webkit-box-align:center;
		-ms-flex-align:center;
		align-items:center;
		-ms-flex-wrap:wrap;
		flex-wrap:wrap
	}
	.meta-info *{
		font-size:.8rem;
		margin:0 .5rem 0 0
	}
	.search-container{
		position:fixed;
		margin:0 auto;
		left:0;
		top:0;
		width:100%;
		min-height:100%
	}
	.search-input{
		width:80%
	}
}
@media screen and (min-width:480px) and (max-width:768px){
	.container{
		margin:0;
		padding:0
	}
	.header-nav{
		max-width:94%;
		-webkit-box-orient:vertical;
		-webkit-box-direction:normal;
		-ms-flex-direction:flex-end;
		flex-direction:flex-end
	}
	.profile{
		margin-top:34px
	}
	.main,.post{
		width:98%
	}
	#toc{
		display:none
	}
	.thumb{
		margin:0
	}
}
.inactive-item,.inactive-item:active,.inactive-item:link,.inactive-item:visited{
	color:#747474!important
}
.gContainer{
	position:fixed;
	left:0;
	top:0;
	width:100%;
	height:100%;
	z-index:999999;
	background-color:hsla(0,0%,100%,.9)
}
.gBox{
	background:#fff;
	padding:4px;
	border-radius:4px;
	overflow:hidden
}
.gBox,.gImg{
	position:absolute;
	left:50%;
	top:50%;
	width:0;
	height:0;
	margin-left:0;
	margin-top:0
}
.gImg{
	display:block;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
	border:none
}
.gSlideDown{
	-webkit-animation-fill-mode:forwards;
	animation-fill-mode:forwards;
	-webkit-animation-name:gSlideDown;
	animation-name:gSlideDown;
	-webkit-animation-duration:.2s;
	animation-duration:.2s;
	-webkit-animation-iteration-count:1;
	animation-iteration-count:1;
	-webkit-animation-delay:0s;
	animation-delay:0s
}
@-webkit-keyframes gSlideDown{
	0%{
		-webkit-transform:translateY(-15px);
		transform:translateY(-15px);
		opacity:.7
	}
	to{
		opacity:1;
		-webkit-transform:translateY(0);
		transform:translateY(0)
	}
}
@keyframes gSlideDown{
	0%{
		-webkit-transform:translateY(-15px);
		transform:translateY(-15px);
		opacity:.7
	}
	to{
		opacity:1;
		-webkit-transform:translateY(0);
		transform:translateY(0)
	}
}
