/* reset  */
html, body, h1, h2, h3, h4, h5, h6,
hr, p, blockquote, dl, dt, dd, ul, ol, li,
pre, form, fieldset, legend, button, input, textarea, th, td,
a, div, span, i, b { 
box-sizing:border-box;
margin:0;padding:0;
}
body{
    color:#333;background:#fff;
    font:14px/1  "微软雅黑","华文细黑",Arial, Helvetica, sans-serif;
    font-size:14px;
    line-height:1;
    font-family: "微软雅黑","华文细黑",Arial, Helvetica, sans-serif;
}
a,input,div,textarea{outline:none;}
textarea{border-color:#CCCCCC;}
input,textarea,select{text-decoration:none;outline:0 none;resize:none;-webkit-tap-highlight-color:rgba(0,0,0,0); border-radius:0;}
ul,dl,ol{list-style:none;}
ul,li{list-style:none;}
fieldset,img{border:0;}
a{text-decoration:none;outline:0 none;}
button{ border:none; outline:none; background-color: transparent; cursor: pointer;}
button:hover{opacity: .8; }
img{display:inline-block; vertical-align: middle;}
a{color:inherit;  transition: all .3s linear;}
i{font-style: normal;}
b{font-weight: normal;}

.clear:after{ content:""; display:block;height: 0;overflow: hidden;visibility: hidden; clear:both;}
.clear{ zoom:1;}
.fl{ float: left;}
.fr{ float:right;}

/* reset END */

#main,
#footer,
#navigator {
	padding-right: 15px;
	padding-left: 15px;
	margin-right: auto;
	margin-left: auto
}

#footer {
	text-align: center;
	padding-bottom: 10px;
	margin-top: 20vh;
	margin-bottom: 4vh
}

@media(min-width:1200px) {

	#main,
	#footer,
	#navigator {
		width: 980px
	}

	.cd-top {
		display: block
	}
}

@media(min-width:992px) and (max-width:1200px) {

	#main,
	#footer,
	#navigator {
		width: 880px
	}

	a.github,
	#live2d-widget,
	#player {
		display: none
	}

	.cd-top {
		display: block
	}
}

@media(min-width:768px) and (max-width:992px) {

	#main,
	#footer,
	#navigator {
		width: 750px
	}

	a.github,
	#live2d-widget,
	#player {
		display: none
	}
}

@media only screen and (max-width:768px) {

	html,
	body {
		width: 100%;
		overflow-x: hidden
	}

	#blogTitle {
		height: 40vh;
		max-height: 40vh
	}

	a.github,
	#live2d-widget,
	#player {
		display: none
	}
}


#cnblogs_post_body p {
	font-size: 1rem
}

#blogTitle {
	background: url(https://img.xjh.me/random_img.php?type=bg&ctype=nature&return=302) center center / cover no-repeat #222;
	overflow: hidden;
	width: 100%;
	height: 40vh;
	max-height: 40vh;
	box-shadow: 0 1px 2px rgba(150, 150, 150, .7);
	text-align: center;
	display: table;
	margin-bottom: 1rem;
	color: #fff;
}

#blogTitle h1{
	margin-top: 10vh;
	margin-bottom: 15px;
	font-weight: normal;
}

#blogTitle h2{
	font-size: 18px;
	font-weight: normal;
}

#navList {
	text-align: center
}

#navList li {
	font-family: 'Josefin Sans Light', -apple-system, BlinkMacSystemFont, "Helvetica Neue", "PingFang SC", "'Hiragino Sans GB", STHeiti, "Microsoft Yahei", "Source Han Sans SC", "Noto Sans CJK SC", "WenQuanYi Micro Hei", Arial, Verdana, sans-serif;
	color: #95a5a6;
	display: inline-block;
	padding: 1rem;
	font-size: 1rem;
	text-align: center
}

#navList li a {
	text-shadow: 0 3px 6px rgba(0, 0, 0, 0.3)
}

#navList li a:hover {
	color: #2a6496;
	font-weight: 500
}