/* 
	Theme Name:Loostrive
	Theme URL:http://www.loome.net/wordpress-theme/loostrive/
	Description:Loostrive主题是是一款功能更强大的响应式主题，获得此主题使用帮助 <a href="http://www.loome.net/wordpress-theme/loostrive/">Loostrive发布页</a>
	Author:Loome洛米
	Author URI:http://www.loome.net/
	Tags:Loostrive,Loome
	Version:2.1.2
*/
body { background: #eee; color: #333; font: 13px 微软雅黑, Verdana, Arial, Helvetica, sans-serif; line-height: 1; }
::selection { color: #fff; background: #16A085; }
::-moz-selection {color:#fff;background:#16A085;}
a:link, a:visited { color: #474747; text-decoration: none; -webkit-transition: background-color .15s linear, color .15s linear; -moz-transition: background-color .15s linear, color .15s linear; -o-transition: background-color .15s linear, color .15s linear; -ms-transition: background-color .15s linear, color .15s linear; transition: background-color .15s linear, color .15s linear; }
a:hover { color: #16A085; }
.clear { clear: both; }
.box { background: #fff; border: solid 1px #e3e3e3 \9; border-bottom: solid 1px #ccc \9;  -webkit-box-shadow: 0 2px 4px 0 #d9d9d9;-moz-box-shadow: 0 2px 4px 0 #d9d9d9;box-shadow: 0 2px 4px 0 #d9d9d9;}
h2 { font-size: 16px; font-weight: bold; line-height: 1.5em; padding-bottom: 10px; }
h3 { font-size: 15px; line-height: 36px; height: 36px; }
.container { max-width: 980px; margin: 0 auto; }
strong { font-weight: bold; }
blockquote, pre { padding: 5px 10px 5px 40px; margin: 10px 0; background: #F7F7F7 url(../../images/quotebg.gif) no-repeat 10px 10px; border: 1px solid #EBEBEB; color: #16A085; font-size: 12px; }
blockquote p, pre p { text-indent: 0 !important }
center { margin: 0 auto; text-align: center }
@-webkit-keyframes fadeInUp{
	0%{opacity:0;-webkit-transform:translateY(20px)}
	100%{opacity:1;-webkit-transform:translateY(0)}
}
@-moz-keyframes fadeInUp{
0%{opacity:0;-moz-transform:translateY(20px)}
100%{opacity:1;-moz-transform:translateY(0)}
}
/*header*/
.mainbar { background:#fff; border-bottom:1px solid #ddd \9; width:100%; height:32px; -webkit-box-shadow: 0 2px 4px 0 #d9d9d9;-moz-box-shadow: 0 2px 4px 0 #d9d9d9;box-shadow: 0 2px 4px 0 #d9d9d9;}
#topbar { height: 30px; line-height: 30px; float: left; overflow: hidden; }
#topbar ul { list-style: none; }
#topbar ul li { height: 33px; line-height: 33px; float: left; padding: 0 20px 0 0; text-align: center; font-size:12px }
#topbar ul li a{ color:#999}
#topbar ul li a:hover{ color:#16A085}
#topbar ul ul { display: none; }
.toolbar { height: 30px; line-height: 30px; float: left; }
#rss { float: right; }
#rss ul li { margin: 4px 0 0 14px; float: right }
.icon1, .icon1 span.hover, .icon2, .icon2 span.hover, .icon3, .icon3 span.hover, .icon4, .icon4 span.hover, .icon5, .icon5 span.hover, .icon6, .icon6 span.hover { display: block; width: 24px; height: 24px; background: url(../../images/social_icon.gif) no-repeat; }
.icon1 { background-position: 0 -48px; }
.icon1 span.hover { background-position: 0 -72px; }
.icon2 { background-position: 0 -192px; }
.icon2 span.hover { background-position: 0 -216px; }
.icon3 { background-position: 0 -240px; }
.icon3 span.hover { background-position: 0 -264px; }
.icon4 { background-position: 0 -96px; }
.icon4 span.hover { background-position: 0 -120px; }
.icon5 { background-position: 0 -144px; }
.icon5 span.hover { background-position: 0 -168px; }
.icon6 { background-position: 0 0; }
.icon6 span.hover { background-position: 0 -24px; }
#blogname { outline: none; overflow: hidden; }
#blogname h1 { text-indent: -9999px; height: 0; width: 0; }
.search_phone { display: none }
/*loading*/
#main_loading { position: fixed !important; position: absolute; top: 0; left: 0; height: 100px; width: 200px; z-index: 999; background: #16A085 url(../../images/loading.gif) no-repeat center; opacity: 0.6; filter: alpha(opacity=60); font-size: 14px; line-height: 20px; top: 50%; left: 50%; margin-top: -50px; margin-left: -100px; border-radius: 5px; }
#loading-one { color: #fff; position: absolute; top: 50%; left: 50%; margin: 50px 0 0 -50px; padding: 3px 10px; }
/*nav*/
.mainmenus { background: #363636; }
.home { float: left; height: 48px; width: 54px; background: #16A085 url(../../images/icon.png) no-repeat 5px -148px; text-indent: -9999px;}
.home_none { float: left; height: 48px; width: 54px; background: url(../../images/icon.png) no-repeat 5px -148px; text-indent: -9999px; }
.home_none:hover { background: #16A085 url(../../images/icon.png) no-repeat 5px -148px; }
.topnav { height: 48px; font-size: 14px; font-weight: bold; text-align: center; position:relative }
.topnav a { color: #fff; height: 48px; line-height: 48px; }
.topnav ul { z-index: 999; }
.topnav li { height: 48px; float: left; position: relative; width: auto; }
.topnav li a{ float: left; position: relative; padding: 0 20px; display: block; }
.topnav li a:hover, .topnav .current_page_item ,.topnav .current-menu-item,.topnav .current-post-parent{ background: #16A085; float: left; position: relative; }
.topnav ul ul { display: none; position: absolute; top: 48px; z-index: 999; left: 0;-webkit-animation:fadeInUp .3s .2s ease both;-moz-animation:fadeInUp .3s .2s ease both; }
.topnav ul ul li { font-size: 13px; color: #363636; display: block; position: relative; height: 36px; line-height: 36px;border-top: #444 solid 1px; left: -28px; }
.topnav ul ul li a { font-size: 13px; color: #fff; display: block; position: relative; width: 150px; height: 36px; line-height: 36px; text-align: left; background: #363636; font-weight: normal; }
.topnav ul ul li a:hover { font-size: 13px; color: #fff; display: block; position: relative; width: 150px; height: 36px; line-height: 36px; text-align: left; background: #16A085; font-weight: normal; }
.topnav ul ul ul { display: none; position: absolute; top: -1px; left: 190px; z-index: 999; }
.topnav ul ul ul li { font-size: 13px; color: #363636; display: block; position: relative; height: 36px; line-height: 36px; text-align: center; }
.topnav ul ul ul li a { font-size: 13px; color: #fff; display: block; position: relative; width: 150px; height: 36px; line-height: 36px; text-align: left; background: #363636; font-weight: normal; }
.topnav ul ul ul li a:hover { font-size: 13px; color: #fff; display: block; position: relative; width: 150px; height: 36px; line-height: 36px; text-align: left; background: #16A085; font-weight: normal; }
.topnav .menu-button {display:none; position: absolute; top:8px; right:54px; cursor: pointer; }
.topnav .menu-button.active{background:rgba(0,0,0,0.2); border-radius:5px;}
.topnav .menu-button i{ display:block; width:40px; height:33px; background:url(../../images/icon.png) no-repeat -2px -236px}
.topnav .menu-right{ position:absolute; right:0; top:0}
.topnav .menu-right .menu-search{ position:relative;}
.topnav .menu-right #menu-search{ width:14px;background: url(../../images/icon.png) no-repeat 5px -193px;}
.topnav .menu-right .menu-search .menu-search-form{ width: 200px; display:none; position:absolute; top:48px; right:0; background:#16A085; padding:15px; z-index:900}
.topnav .menu-right .menu-search .menu-search-form .button{border: none; background:#363636; color: #fff; padding: 6px 12px;}
.topnav .menu-right .current_page_item .menu-search-form{ display:block}

.subsidiary { background: #fff; height: 34px; padding: 0 10px; margin-bottom: 20px;}
.bulletin { overflow: hidden; height: 24px; margin: 5px 0; line-height: 24px; }
.bulletin span { width: 70px; }
.bulletin marquee { color: #16A085; }
.full-width .textwidget{width: 100%;margin: 0;}
.full-width .textwidget img{max-width: 100%;}
/*************************侧边栏***********************/
#sidebar { width: 316px; margin-left: 16px; float: right; }
#sidebar-follow { width: 316px; }
.widget { padding: 10px; }
.widget h3 { padding: 0; margin-bottom: 10px; height: 30px; line-height: 30px; border-bottom: #16A085 solid 3px; font-size: 15px; font-weight: bold; }
.widget span { color: #16A085; }
.widget em { color: #666; font-style: normal; margin-right: 20px; float: right; }
.widget ul { padding: 1px 0 1px 0; }
.widget ul li { line-height: 1.5em; border-bottom: dashed 1px #f3f3f3; padding: 5px 0 }
/*文本*/
.textwidget { margin: -3px; overflow: hidden; width: 300px; }
.textwidget img { max-width: 300px; height: auto }
.inter-top .textwidget { margin:0; overflow: hidden; width: auto; }
.inter-top .textwidget img { max-width: inherit; height: auto }
/*文章tab*/
#tabnav { display: block; clear: both; zoom: 1; }
#tabnav li { float: left; width: 98px; border-bottom: #ccc solid 3px; text-align: center; cursor: pointer; list-style: none; font-weight: bold; font-size: 15px; padding-bottom: 5px; margin-bottom: 5px; }
#tabnav .selected { position: relative; background-color: #fff; color: #16A085; cursor: default; border-bottom: #16A085 solid 3px; }
#tab-content .hide { display: none; }
#tab-content ul { overflow: hidden; list-style: none }
#tab-content ul li { float: left; width: 100%; border-bottom: dashed 1px #f3f3f3; background: url(../../images/zt_con_li_green.gif) no-repeat left 12px;text-indent: 0.8em; }
#tab-content ul li a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block }
/*搜索*/
.search { }
.search_site .searchform .search-s { display: block; height: 22px; *height:20px;padding: 10px; width: 250px; border: none; box-shadow: none; line-height: 22px; }
.search_site .searchform label{display:block;height:40px;position:relative; width:250px}
.search_site .searchform span{position:absolute;float:left;line-height:40px;left:10px;color:#BCBCBC;cursor:text;z-index:10}
.search_site .searchform input::placeholder{color:#BCBCBC}
.search_site .searchform .searchsubmit { border: none; cursor: pointer; display: block; height: 42px; padding: 0; text-indent: -9999px; width: 44px; background: #ccc url(../../images/icon.png) no-repeat 0 -195px; float: right; }
.search_site .searchform .searchsubmit:hover { background: #16A085 url(../../images/icon.png) no-repeat 0 -195px;}
.baidusearch .searchform .searchsubmit:hover{background:#1915d2 url(images/baidulogo.png);background-size: cover; }
/*评论*/
.r_comment { position: relative; overflow: hidden; height: auto; }
.r_comment ul { list-style: none; overflow: hidden; position: relative; }
.r_comment li { line-height: 22px !important; clear: both; height: 48px; margin-bottom: 5px; overflow: hidden; border-bottom: dashed 1px #f3f3f3;padding:0 !important; }
.r_comment li:hover { border-right: #16A085 solid 3px; background: #f8f8f8; }
.r_comment ul li img.avatar { height: 35px; width: 35px; float: left; margin: 4px 8px 0 0; background: #fff; border: 1px solid #ddd; border-radius: 5px; }
/*登录*/
#loginform p { line-height: 26px; margin-bottom: 5px; }
#loginform input.login { width: 140px; padding: 2px; color: #444; border: 1px solid #dfdfdf; box-shadow: inset 2px 3px 5px #eee; }
#loginform input.denglu { width: 70px; margin-top: 5px; height: 63px; color: #444; text-align: center; border: 1px solid #dfdfdf; font-size: 16px; }
#loginform input.denglu:hover { background: #16A085; color: #fff; }
.loginl { float: left; margin: 5px 10px 5px 0; }
.loginl label { margin-right: 10px; }
#loginform label input[type="checkbox"]{ vertical-align:middle; margin-right:3px}
#loginform input:focus { border: 1px solid #ccc; }
.register { margin: 0 10px 0 50px; }
.v_avatar { margin: 5px; float: left; width: 64px; }
.v_avatar img { border-radius: 5px;height: auto;}
.v_li li { list-style-type: none; float: left; width: 100px; padding: 5px; }
/*标签*/
.tagcloud { height: auto; overflow: hidden; }
.tagcloud a:link, tagclouda:visited {display:inline-block; padding: 3px 8px; background-color: #F3F3F3; margin: 2px; line-height: 24px; -moz-border-radius: 3px; border-radius: 3px; white-space: nowrap; -webkit-transition: background-color .15s linear, color .15s linear; -moz-transition: background-color .15s linear, color .15s linear; -o-transition: background-color .15s linear, color .15s linear; -ms-transition: background-color .15s linear, color .15s linear; transition: background-color .15s linear, color .15s linear; }
.tagcloud a:hover { background-color: #16A085; color: #FFF; }
.tagcloud a span{padding:0 3px;color: #ccc;background-color:#fff;margin-left:6px;border-radius:2px}
.tagcloud a:hover span{background-color:#ffffff30;color:#ffffff}
.action { border-top: solid 1px #F3F3F3; margin-top: 5px; padding-top: 5px; text-align: right; }
.action a { color: #CCCCCC; }
/*图文*/
.imglist{ margin-left:-10px}
.imglist li{ float:left; width:142px; margin-left:10px;border-bottom:none !important; padding:0 !important;}
.imglist li h4{ margin:8px 0 10px 0;height:34px; overflow:hidden;word-break:break-all;}
.imglist li img{ width:142px;}
/*日历*/
#wp-calendar{width: 100%;border-collapse: collapse;border-spacing: 0;  magrin:0 auto;       }
#wp-calendar #today{font-weight: 900; color: #990099; display:block;background-color: #F3F3F3; text-align:center;} 
#wp-calendar thead{font-size:14px;} 
#wp-calendar tfoot td{border-top:1px solid #F3F3F3;background-color:white; }
#wp-calendar tfoot td a{ color:#CCCCCC;} 
#wp-calendar caption{font-size:15px;border-bottom: #16A085 solid 3px;padding:5px 0;margin-bottom:10px;} 
#wp-calendar thead th{text-align:center;}
#wp-calendar tbody td{text-align:center;padding: 7px 0;}    
#wp-calendar a {color: #990099; text-decoration: none; cursor:pointer;} 
#wp-calendar a:hover {color:#16A085 ; text-decoration:none;font-weight:900;}
/*菜单*/
.widget .menu li,.blogroll li{display: inline-block;margin-right: 10px;background: url(../../images/zt_con_li_green.gif) no-repeat left 12px;padding-left: 7px !important;}
.widget .menu li.menu-item-has-children{display: block;}
.widget .menu li>ul li{border-bottom: none;}
/*首页文章列表*/
.mainleft { width: auto; overflow: hidden; }
#post_container { margin-left: -16px; position:relative }
#post_container li { width: 314px; margin-left: 16px; float: left;-webkit-animation:fadeInUp .3s .2s ease both;-moz-animation:fadeInUp .3s .2s ease both;}
.thumbnail { max-height: 500px; overflow: hidden; }
.thumbnail a { display: block; margin: 7px 7px 0 7px; }
.thumbnail a:hover img {transform: scale(1.05, 1.05)}
.thumbnail img { width: 300px; height: auto; transition: all .5s ease;}
.article { padding: 15px 10px 0; position:relative }
.article h2 {word-break:break-all;}
.info { background-color: #f8f8f8; font-size: 12px;color: #999; word-break: break-all;white-space: nowrap; text-overflow: ellipsis; position: relative;  border-top: 1px solid #eee; line-height: 35px; padding: 0 5px; text-align: center; height: 35px;overflow: hidden}
.info span { height: 20px; line-height: 17px; }
.info span a { color: #999; }
.info span a:hover { color: #16A085; }
.info_ico { background: url(../../images/info.png) no-repeat; padding: 0 5px 0 20px; }
.info_category { background-position: 0 -21px; }
.info_date { background-position: 0 -1px; }
.info_views { background-position: 0 -62px; }
.info_comment { background-position: 0 -43px; }
.info_author { background-position: 0 -82px; }
.entry_post { line-height: 22px; color: #999; margin-bottom: 10px; word-break: break-all; }
.sticky { background: #16A085; height: 25px; width: 45px; position: absolute; z-index: 20; top: -1px; right: -1px; color: #fff; font-weight: bold; text-align: center; line-height: 25px;border-radius: 0 0 0 5px; }
.zoom { width: auto; height: auto; display: block; position: relative; overflow: hidden; background: none; }
.zoomOverlay {transition: all .5s ease; opacity: 0; position: absolute; top: 0; left: 0; bottom: 0; right: 0;  background-image: url(../../images/zoom.png); background-repeat: no-repeat; background-position: center; }
.zoom:hover .zoomOverlay{filter:alpha(Opacity=50);-moz-opacity:0.5;opacity: 0.5;display: block; background-color:#16A085;}
#post_container .fixed-hight h2 a{ display:block;white-space: nowrap;text-overflow:ellipsis; overflow:hidden;}
#post_container .fixed-hight .entry_post{overflow: hidden;height: 42px;}
#post_container .fixed-hight .info{ overflow:hidden; height:35px;}
#post_container li:hover h2 a{color: #16A085;}
/*分页*/
.pagination{display: block;text-align: center;}
.pagination a,.pagination span { width:40px; text-align: center; height:40px; line-height: 40px; margin: 10px 0 10px 4px; display: inline-block; text-decoration: none; border: 1px #dfdfdf solid; background: #fff; color: #888;-webkit-box-shadow: 0 2px 4px 0 #d9d9d9;-moz-box-shadow: 0 2px 4px 0 #d9d9d9;box-shadow: 0 2px 4px 0 #d9d9d9; }
.pagination a.extend { padding: 0 5px }
.pagination .current { height: 40px; width: 40px; color: #fff; background: #333;  }
.pagination a:hover { height: 40px; width: 40px; color: #fff; text-decoration: none; background: #333; }
.pagination .page_previous, .pagination .prev { width: 54px; height: 40px; text-align: center; }
.pagination .page_previous:hover, .pagination .prev:hover { width: 54px; height: 40px; text-align: center; }
.pagination .page_next, .pagination .next, .pagination .page_next:hover, .pagination .next:hover { width: 54px; height: 40px; text-align: center; }
.pagination .fir_las, .pagination .fir_las:hover { width: 34px; height: 40px; text-align: center; }
#ajax-load-posts {text-align: center;}
/*single*/
.article_container { padding: 10px; }
.article_container h1 { font-size: 18px; margin-top: 5px; font-weight: bold; line-height: 1.5em; padding-bottom: 10px; }
.article_info { padding: 10px 0; border-top: #16A085 solid 5px; line-height: 1.5em; color: #999; font-size:12px;}
.article_info a { color: #999 }
.article_info a:hover { text-decoration: underline }
.context { overflow: hidden; }
#post_content{ padding:0 15px;word-break:break-all;}
#post_content a{ text-decoration:underline}
.context, .context p, .context a, .context pre { line-height: 2em; font-size: 14px; }
.context ol, .context ul { margin-left: 40px; }
.context ol li, .context ul li { line-height: 2em; }
.context ol li { list-style-type: decimal; }
.context ul li { list-style: url(../../images/zt_con_li_green.gif);}
.context h3,.context h4,.context h5{border-bottom:#eee 1px solid;padding-bottom:5px;margin-bottom:20px}
.context h2{font-size:16px;font-weight:normal;padding:10px 20px 9px 20px;line-height:18px;border-left:4px solid #16A085;background-color:#f3f3f3}
.context p embed, .context object { margin: 0 auto }
.context code { background: #FFF8DF; color: #9C2E0E; font-style: italic; padding: 2px 3px; line-height: 2em; }
.context table{border-top:solid 1px #ddd;border-left:solid 1px #ddd;width:100%;margin-bottom:16px}
.context table th{background-color:#f9f9f9;text-align:center}
.context table td,.article-content table th{border-bottom:solid 1px #ddd;border-right:solid 1px #ddd;padding:5px 10px}
.context .alignleft{float:left;text-align:left;margin-right:10px}
.context .aligncenter{margin: 0 auto;text-align: center;display: block;}
.context .alignright{float:right;text-align:right;margin-left:10px}
.context .wp-caption {border: solid 1px #eee;border-radius: 2px;padding:5px;box-shadow: 2px 2px 0 #fbfbfb;margin-bottom: 15px; max-width:100%;}
.context .wp-caption:hover {border-color: #ddd;}
.context .wp-caption-text {margin:  5px -5px -5px;border-radius: 0 0 2px 2px;background-color: #fbfbfb;border-top: 1px solid #eee;padding: 5px;color: #999;}
.context .article_tags { font-size: 12px; line-height: 40px; margin-top: 15px; text-align: center;}
.context .img-responsive{display:block;height:auto;max-width:100%}
#authorarea { position: relative; float: left; width: 100px; }
#authorarea img{height: auto;}
.author_arrow { position: absolute; float: left; border-style: solid; border-width: 10px; border-color: transparent #fff transparent transparent; height: 0; width: 0; font-size: 0; top: 42px; left: 80px; }
.authorinfo { height: 80px; padding-left: 110px; }
.authorinfo h4{font-size: 16px;margin-bottom: 10px;}
.post-navigation { clear: both; overflow: hidden; }
.post-navigation div { display: block; position: relative; font-size: 14px; color: #999; }
.post-next { float: right; text-align: right; padding-right: 40px; }
.post-previous { float: left; padding-left: 40px; }
.post-navigation div a:after { position: absolute; color: #CCC; font-size: 56px; margin-top: -11px; height: 22px; line-height: 22px; top: 34%; }
.post-previous a:after { content: '«'; left: 0px; }
.post-next a:after { content: '»'; right: 0px; }
.related { overflow: hidden;}
.related ul { margin-left: -1px; }
.related_box { float: left; width: 24.8%; border-left: 1px #eee solid }
.related_box:hover { background: #16A085; }
.related_box a:hover { color: #fff; }
.related_box .r_title { padding: 0 8px; text-align: center; }
.related_box .r_pic { margin: 8px auto; width: 140px;}
.related_box .r_pic img { width: 140px;}
#content table, #content button { margin: 10px auto; }
#content p { margin: 0 0 20px 0 }
#content .content_post ol li { list-style: decimal inside; color: #272727; line-height: 26px; font-size: 13px }
#content .content_post ul li { background: url(../../images/zt_con_li_black.gif) no-repeat; text-indent: 1.3em; color: #272727; line-height: 26px; font-size: 13px }
#content b, #content strong { font-weight: bold }
#content i, #content em, #content var, #content dfn { font-style: italic }
#content th, #content td { display: table-cell; vertical-align: inherit; padding: 1px; line-height: 2em }
#content th { font-weight: 700; padding: 1px }
#content td { text-align: inherit; padding: 1px }
#content .pagelist { padding-top: 10px; background: #f3f3f3; text-align: center; margin-top: 20px }
#content .pagelist>span,#content .pagelist>a{display: inline-block;background-color: #fff ;border: 1px#ddd solid ;color: #000;margin-left: 5px;padding: 4px 10px ;text-transform: uppercase;margin-bottom:10px}
#content .pagelist>a:hover,#content .pagelist>span{background-color: #363636;color: #fff !important;}
.alignleft { float: left; margin: 5px 15px 5px 0 }
.alignright { float: right; margin: 5px 0 5px 15px }
/*comments*/
#comments { font-size: 15px; font-weight: bold; margin-left: 10px; height:auto; padding-top: 5px; }
#comments_box .navigation{ margin-top:-50px; margin-right:10px; font-size:12px}
#comments_box .pagination a,#comments_box .pagination span,#comments_box .pagination .current{ line-height:20px; height:20px}
#respond_box .tip{padding-left: 15px;}
#respond { margin: 10px 10px 20px 10px; border-top: 5px solid #16A085; padding-top: 10px; }
#respond p { line-height: 30px;margin-bottom: 0;}
#respond h3 { font-size: 14px; font-weight: bold;}
.comt-box { border: solid 1px #DDD; border-color: #C6C6C6 #CCC #CCC #C6C6C6; border-radius: 3px; padding: 8px; box-shadow: inset 2px 0 2px #F2F2F2, inset 0 2px 2px #EEE, 0 2px 0 #F8F8F8, 2px 0 0 #F8F8F8; background-color: white; clear: right; }
.comt-area { _margin-top: -35px; border: 0; background: none; width: 100%; font-size: 12px; color: #666; margin-bottom: 5px; min-height: 70px; box-shadow: none; }
.comt-ctrl { position: relative; margin: 0 -8px -8px; _margin-right: -10px; height: 32px; line-height: 32px; border-radius: 0 0 3px 3px; border-top: solid 1px #DDD; background-color: #FBFBFB; box-shadow: inset 0 1px 0 #FBFBFB; color: #999; }
.comt-submit {font-family: "微软雅黑"; position: absolute; right: -1px; top: -1px; border: solid 1px #CCC; height: 34px; width: 120px; cursor: pointer; font-weight: bold; color: #666; font-size: 12px; border-radius: 0 0 3px 0; background-image: -webkit-linear-gradient(#F6F6F6, #E2E2E2); text-shadow: 0 -1px 0 white; }
#comment-author-info { margin-bottom: 10px; height: 27px; }
#comment-author-info label { margin-left: 5px; }
#comment-author-info input { width: 20.5%; margin-left: -4px; margin-top: -5px \9; vertical-align: middle \9; }
.comment_input { margin-left: 27px; }
#real-avatar { float: left; width: 27px; }
#real-avatar img { width: 27px; height: 27px; }
.comt-addsmilies, .comt-addcode { float: left; color: #888; padding: 0 10px; }
.comt-smilies { display: none; position: absolute; top: 0; left: 40px; height: 30px; background-color: #FBFBFB; overflow: hidden; }
.comt-smilies a { float: left; padding: 8px 1px 0px; }
.wp-smiley{height: 16px !important;max-height:16px !important;}
.comt-num { font-size: 12px; color: #999; float: right; margin-right: 140px; }
.comt-num em { font-weight: bold; font-size: 14px; }
.commentlist .comment { list-style: none; border-top: 1px solid #eee; }
.commentlist li.comment ul.children { margin-left: 20px; }
.commentlist .depth-1 { margin: 0; }
.commentlist li { position: relative; }
.commentlist .thread-even { background: #fafafa; }
.commentlist .comment-body { padding: 10px; border-left: 5px solid transparent; }
.commentlist .comment-body:hover { background: #f5f5f5; border-left: 5px solid #16A085; }
.commentlist .comment-body p { margin: 5px 0!important; line-height: 22px;word-break: break-all;}
.reply a:link, .reply a:visited { text-align: center; font-size: 12px; }
.datetime { font-size: 12px; color: #aaa; text-shadow: 0px 1px 0px #fff;}
.commentmetadata { font-size: 12px; color: #aaa; text-shadow: 0px 1px 0px #fff; margin-left: 50px; }
ol.commentlist li div.vcard img.avatar { width: 40px; height: 40px; position: relative; float: left; margin: 4px 10px 0 0; border-radius: 5px; }
ol.commentlist li div.floor { float: right; color: #bbb }
.children li.comment-author-admin { border-top: #16A085 solid 2px; }
.cancel-comment-reply{float: right;margin-top: -20px;}
/*footer*/
#footnav a, #friendlink a { color: #888 }
#footnav a:hover, #friendlink a:hover { color: #16A085 }
#footer { text-align: center; background: #222; padding: 20px 0 15px 0; font-size: 12px; color: #888; line-height: 1.5em; margin-top: 50px;  border-top: 5px solid #16A085; }
#footer p { text-align: center; }
.footnav { line-height: 30px; font-size: 14px; }
.footnav ul { list-style: none; text-align: center; }
.footnav ul li { height: 30px; line-height: 30px; display: inline; padding: 0 10px 0 0; }
.footnav ul ul { display: none; }
.copyright { color: #666;}
.copyright p{ line-height:2em }
.copyright a { color: #666;}
.copyright a:hover { color: #16A085 }
#footer p.author a { color: #444; }
#footer p.author a:hover { text-decoration: underline }
/*幻灯*/
.slider { width: 645px; overflow: hidden;-webkit-box-shadow: 0 2px 4px 0 #d9d9d9;-moz-box-shadow: 0 2px 4px 0 #d9d9d9;box-shadow: 0 2px 4px 0 #d9d9d9; }
#focus { width: 100%; height: 370px; overflow: hidden; position: relative; }
#focus ul { height: 430px; position: absolute; }
#focus ul li { float: left; width: 645px; height: 370px; overflow: hidden; position: relative; background: #ccc; }
#focus ul li div { position: absolute; overflow: hidden; }
#focus .button { position: absolute; width: 645px; height: 10px; padding: 5px 10px; right: 0; bottom: 0; text-align: right;bottom: 10px; }
#focus .button span { display: inline-block; _display: inline; _zoom: 1; width: 25px; height: 10px; _font-size: 0; margin-left: 5px; cursor: pointer; background: #fff; }
#focus .button span.on { background: #fff; }
#focus .preNext { width: 45px; height: 100px; position: absolute; top: 50%;margin-top: -50px; background: url(images/sprite.png) no-repeat 0 0; cursor: pointer; }
#focus .pre { left: 0; }
#focus .next { right: 0; background-position: right top; }
#focus ul li a { display: block; overflow: hidden; }
#focus ul li a img { width: 650px; height: auto; }
.flex-caption { max-width: 610px; right: 0; bottom: 30px; background: #16A085; opacity: 0.8; color: #fff; padding: 10px 20px; }
.flex-caption a { color: #fff; }
.flex-caption:hover { opacity: 1; }
.flex-caption .btn { display: none; }
.slides_entry { display: none; }
/*读者墙*/
.readers-list { line-height: 19px !important; text-align: left; overflow: hidden; _zoom: 1;text-align: center;margin-bottom: 30px !important;}
.readers-list li { width: 200px; display: inline-block; *margin-right:-1px}
.readers-list a, .readers-list a:hover strong { background-color: #f2f2f2; }
.readers-list a { font-size:12px;  line-height:19px !important; position: relative; display: block; height: 36px; margin: 4px; padding: 4px 4px 4px 44px; color: #999; overflow: hidden; border: #eee 1px solid; border-radius: 2px; box-shadow: #eee 0 0 2px }
.readers-list img, .readers-list em, .readers-list strong { -webkit-transition: all .2s ease-out; -moz-transition: all .2s ease-out; transition: all .2s ease-out }
.readers-list img { width: 36px; height: 36px; float: left; margin: 0 8px 0 -40px; border-radius: 2px }
.readers-list em { color: #666; font-style: normal; margin-right: 10px }
.readers-list strong { color: #ddd; width: 40px; text-align: right; position: absolute; right: 6px; top: 4px; font: bold 14px/16px microsoft yahei }
.readers-list a:hover {background-color: #fff;}
.readers-list a:hover img { opacity: .6; margin-left: 0 }
.readers-list a:hover em { color: #16A085; font: bold 12px/36px microsoft yahei }
.readers-list a:hover strong { color: #16A085; right: 150px; top: 0; text-align: center; height: 44px; line-height: 40px }
.readers-list span.name{word-break:break-all; max-width:120px; display:block}
/*文章归档*/
.articles_all { line-height: 35px;}
#archives_page .al_year{line-height: 48px; font-size: 18px; color: #16A085;height:auto;border-bottom:1px solid #eee;margin-bottom:16px;}
#archives_page .al_mon{cursor:pointer;fotn-weight:700}
#archives_page .al_post_list li span,#archives_page .al_post_list li em,#archives_page p em{color:#999}
#archives_page .al_post_list li a{word-break: break-all;}
#archives_page p{float:right;margin-top:-50px;}
/*友情链接*/
.flink{ list-style: none; }
.flink .linkcat {}
.flink .blogroll{margin: 0 0 20px;}
.flink .blogroll li{  margin:0 10px 10px 0;background: none;padding-left:0 !important;}
.flink .blogroll li a{display: inline-block;padding: 8px 20px;border: 1px solid #eee;background: #f8f8f8;line-height: 16px;}
.flink .blogroll li a:hover{background: #16A085;color: #fff;}
.flink .blogroll li a img{width: 16px;padding: 0 5px 0 0;}
/*页面*/
.page_title{border-bottom: #16A085 solid 5px;margin-bottom: 15px;}
.cont_none ul, .cont_none ul li { list-style: none; margin: 0; }

/*Responsive Structure*/
@media only screen and (max-width: 640px) {
.container { max-width:360px;}
#blogname a{display:block;text-align:center}
#sidebar,.subsidiary, .slider, #rss, .article_related { display: none !important; }
.mainleft { margin: 0 auto; overflow:visible}
#post_container li { max-width: 316px; }
#comment-author-info { height: auto; }
#comment-author-info input { width: 70.5%; margin-bottom: 5px; }
.search_phone { display: block }
#post_container{ margin-left:-10px}
#post_container li{ width:47%; margin-left:10px; max-width:100%;-webkit-animation:none;-moz-animation:none}

#post_container li .article h2{font-size: 14px;}
#post_container li .article h2 a{white-space:normal}
#post_container li .article .entry_post{display: none;}
#post_container li .info{clear: both;}
#post_container li .info_views,#post_container li .info_comment{display: none;}
#post_container li .sticky{right: 0;}
#post_container li .zoomOverlay{ display:none !important}
.topnav{overflow: visible;}
.topnav .menu-button{ display:block}
.topnav .menu{ display:none; padding:48px 15px 0}
.topnav .menu.open{ display:block; -webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; -ms-transition: all .5s ease-in-out; transition: all .5s ease-in-out;}
.topnav .menu li{ height:auto;width:100% !important}
.topnav .menu li a{width:90% !important; padding:0 5% !important }
.topnav li .sub-menu{ position:relative; display:block !important; top:0; left:20px}
.topnav ul ul{-webkit-animation:none;-moz-animation:none}
.navigation .pagination{text-align: center}
.navigation .nav{text-align:center;margin-top: 10px;}
.navigation .nav a{display:inline-block;line-height:64px;padding:0 15%;}

}
@media only screen and (min-width:640px) and (max-width:980px) {
.container { max-width: 640px; }
.mainmenus { margin-bottom: 1.5em; }
#sidebar, .subsidiary, .slider { display: none !important; }
#post_container { margin-left: -7px !important; }
#post_container li { width: 314px; margin-left: 7px !important; }
#tbox { right: 10px !important; }
}
@media only screen and (min-width:1330px) {
.container { max-width: 1312px !important; }
.slider { width: 980px !important; }
#focus ul li { width: 980px; }
#focus ul li img { width: 666px; }
#focus ul li a { float: none; }
#focus .button { width: 980px; }
.slides_entry { display: block !important; margin-top: 10px; font-size: 14.7px; line-height: 1.5em; }
.flex-caption { width: 292px; bottom: 0 !important; height: 350px; }
.flex-caption h2 { line-height: 1.5em; margin-bottom: 20px; padding: 10px 0 20px 0; font-size: 18px; font-weight: bold; border-bottom: 1px #fff dashed; }
.flex-caption .btn { display: block !important; margin-top: 30px; width: 55px; }
.flex-caption .btn a { color: #16A085; }
#focus ul li a img { width: 650px !important; }
.related_box{ width:158px !important}
}

/* Xiaozhe 2026 visual refresh: presentation only, legacy layout remains intact. */
:root {
	--xz-primary: #16A085;
	--xz-primary-dark: #117864;
	--xz-ink: #19211f;
	--xz-text: #4f5d59;
	--xz-muted: #7b8784;
	--xz-line: #dfe6e3;
	--xz-paper: #fff;
	--xz-canvas: #f3f6f5;
	--xz-night: #161b1a;
	--xz-radius: 6px;
}

*, *:before, *:after { box-sizing: border-box; }
html { background: var(--xz-canvas); }
body {
	background: var(--xz-canvas) !important;
	color: var(--xz-ink);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
	font-size: 14px;
	line-height: 1.65;
	letter-spacing: 0;
	-webkit-font-smoothing: antialiased;
}
body > canvas { display: none !important; }
a:link, a:visited { color: var(--xz-ink); transition: color .16s ease, background-color .16s ease, border-color .16s ease; }
a:hover { color: var(--xz-primary); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible {
	outline: 3px solid rgba(22, 160, 133, .24);
	outline-offset: 2px;
}
.container { width: min(calc(100% - 40px), 1312px); }
.box { border: 1px solid var(--xz-line); border-radius: var(--xz-radius); box-shadow: none; }

/* Brand header */
#head { margin-bottom: 0; background: var(--xz-night); }
.mainbar {
	height: 38px;
	border: 0;
	border-bottom: 1px solid rgba(255, 255, 255, .08);
	background: #0e1211;
	box-shadow: none;
}
.mainbar .container { height: 38px; }
#topbar { height: 38px; line-height: 38px; }
#topbar ul { display: flex; gap: 24px; margin: 0; }
#topbar ul li { height: 38px; padding: 0; line-height: 38px; }
#topbar ul li a { color: #aeb8b5; font-size: 12px; }
#topbar ul li a:hover { color: #fff; }
#rss ul { margin: 0; }
#rss ul li { margin-top: 7px; }
#head > .container { display: flex; align-items: center; justify-content: space-between; min-height: 112px; }
#blogname.third { float: none; width: auto; margin: 0; }
#blogname a { display: block; }
#blogname img { display: block; width: 230px; height: auto; }

/* Navigation */
.mainmenus.container {
	position: relative;
	z-index: 900;
	width: min(calc(100% - 40px), 1312px);
	margin: 0 auto 24px;
	background: var(--xz-paper);
	border: 1px solid var(--xz-line);
	border-top: 0;
	border-radius: 0 0 var(--xz-radius) var(--xz-radius);
	box-shadow: 0 8px 26px rgba(19, 31, 27, .07);
}
.topnav { height: 56px; color: var(--xz-ink); font-size: 13px; font-weight: 650; }
.topnav a { height: 56px; color: var(--xz-ink); line-height: 56px; }
.home, .home_none {
	height: 56px;
	background-color: rgba(22, 160, 133, .09);
	background-position: 5px -144px;
}
.home_none:hover { background-color: rgba(22, 160, 133, .14); background-position: 5px -144px; }
.topnav li { height: 56px; }
.topnav li a { padding: 0 16px; }
.topnav li a:hover,
.topnav .current_page_item,
.topnav .current-menu-item,
.topnav .current-post-parent { color: var(--xz-primary); background: transparent; }
.topnav > .menu > li > a { position: relative; }
.topnav > .menu > li > a:after {
	position: absolute;
	right: 16px;
	bottom: 0;
	left: 16px;
	height: 3px;
	background: var(--xz-primary);
	content: "";
	opacity: 0;
	transform: scaleX(.35);
	transition: opacity .18s ease, transform .18s ease;
}
.topnav > .menu > li:hover > a:after,
.topnav > .menu > .current-menu-item > a:after,
.topnav > .menu > .current-post-parent > a:after { opacity: 1; transform: scaleX(1); }
.topnav ul ul {
	top: 56px;
	min-width: 188px;
	padding: 8px;
	background: var(--xz-night);
	border-radius: 0 0 var(--xz-radius) var(--xz-radius);
	box-shadow: 0 18px 36px rgba(0, 0, 0, .2);
}
.topnav ul ul li { left: 0; width: 100%; height: 38px; border: 0; }
.topnav ul ul li a,
.topnav ul ul li a:hover {
	width: 100%;
	height: 38px;
	padding: 0 12px;
	border-radius: 4px;
	background: transparent;
	color: #d9dfdd;
	font-size: 12px;
	line-height: 38px;
}
.topnav ul ul li a:hover { background: var(--xz-primary); color: #fff; }
.topnav .menu-right #menu-search { height: 56px; background-color: transparent; background-position: 5px -189px; }
.topnav .menu-right .menu-search .menu-search-form { top: 56px; padding: 14px; border-radius: 0 0 var(--xz-radius) var(--xz-radius); background: var(--xz-night); }
.topnav .menu-right .menu-search .menu-search-form .button { border-radius: 3px; background: var(--xz-primary); }

/* Notice, cards, and sidebar */
.subsidiary {
	height: 42px;
	margin-bottom: 20px;
	padding: 0 14px;
	border-left: 3px solid var(--xz-primary);
	background: var(--xz-paper);
}
.bulletin { height: 32px; line-height: 32px; }
.bulletin span { color: var(--xz-primary); font-size: 12px; font-weight: 700; }
#sidebar { width: 300px; margin-left: 20px; }
#sidebar-follow { width: 300px; }
.widget {
	margin-bottom: 16px;
	padding: 17px;
	background: var(--xz-paper);
}
.widget h3 {
	height: auto;
	margin-bottom: 10px;
	padding: 0 0 10px;
	border-bottom: 1px solid var(--xz-line);
	font-size: 14px;
	line-height: 1.55;
}
.widget h3:before { display: inline-block; width: 4px; height: 14px; margin-right: 8px; border-radius: 1px; background: var(--xz-primary); content: ""; vertical-align: -2px; }
.widget ul li { padding: 7px 0; border-bottom: 1px solid #edf1ef; line-height: 1.55; }
.widget ul li:last-child { border-bottom: 0; }
.widget ul li a { color: var(--xz-text); }
.widget ul li a:hover { color: var(--xz-primary); }
.textwidget { width: auto; margin: 0; }
.textwidget img { display: block; width: 100%; max-width: none; height: auto; border-radius: 4px; }
#tabnav { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; }
#tabnav li { width: auto; margin: 0 0 8px; padding: 6px 2px; border: 0; border-radius: 3px; background: #edf2f0; color: var(--xz-muted); font-size: 12px; }
#tabnav .selected { border: 0; background: var(--xz-primary); color: #fff; }
#tab-content ul li { background: none; text-indent: 0; }
.tagcloud a:link, .tagcloud a:visited { margin: 3px 2px; padding: 3px 8px; border: 1px solid var(--xz-line); border-radius: 3px; background: #f8faf9; color: var(--xz-text); }
.tagcloud a:hover { border-color: var(--xz-primary); background: var(--xz-primary); color: #fff; }

#post_container { margin-left: -16px; }
#post_container li {
	margin-bottom: 18px;
	overflow: hidden;
	border: 1px solid var(--xz-line);
	border-radius: var(--xz-radius);
	background: var(--xz-paper);
	box-shadow: 0 2px 0 rgba(25, 33, 31, .02);
	transform: none;
	transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
#post_container li:hover {
	border-color: #bdc9c5;
	box-shadow: 0 12px 28px rgba(25, 33, 31, .1);
	transform: translateY(-3px);
}
.thumbnail { max-height: none; background: #e8edeb; }
.thumbnail a { margin: 0; }
.thumbnail img { display: block; width: 100%; height: auto; }
.thumbnail a:hover img { transform: none; }
.zoomOverlay { display: none !important; }
.article { padding: 17px 17px 13px; }
.article h2 { margin: 0; padding: 0; font-size: 17px; font-weight: 680; line-height: 1.55; }
.entry_post { margin: 9px 0 0; color: var(--xz-text); font-size: 13px; line-height: 1.75; }
.entry_post p { margin: 0; }
.info {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	height: 42px;
	padding: 0 14px;
	border-top: 1px solid var(--xz-line);
	background: #f8faf9;
	color: var(--xz-muted);
	font-size: 10px;
	line-height: 42px;
	text-align: left;
}
.info span { height: auto; line-height: 1.4; }
.info span a { color: var(--xz-primary); font-weight: 700; }
.info_ico { padding-left: 18px; }
.sticky { top: 10px; right: 10px; width: auto; height: 24px; padding: 0 9px; border-radius: 3px; background: #d88c31; box-shadow: 0 4px 10px rgba(0, 0, 0, .14); font-size: 10px; line-height: 24px; }

/* Existing slider, refined without changing its geometry. */
.slider { overflow: hidden; border: 1px solid var(--xz-line); border-radius: var(--xz-radius); box-shadow: none; }
#focus { background: #e9eeec; }
#focus ul li { background: #dfe6e3; }
.flex-caption { background: rgba(22, 160, 133, .94); }
.flex-caption h2 { color: #fff; }
.flex-caption .btn { border: 0; box-shadow: none; text-shadow: none; }

/* Pagination, content pages, and footer */
.pagination a, .pagination span { width: 38px; height: 38px; border: 1px solid var(--xz-line); border-radius: 4px; background: #fff; box-shadow: none; line-height: 38px; }
.pagination .current, .pagination a:hover { width: 38px; height: 38px; border-color: var(--xz-primary); background: var(--xz-primary); color: #fff; }
.article_container { padding: 26px; border-radius: var(--xz-radius); background: var(--xz-paper); }
.article_container h1 { font-size: 28px; line-height: 1.45; }
.article_info { border-top: 3px solid var(--xz-primary); }
.context, .context p, .context a, .context pre { font-size: 16px; line-height: 1.9; }
.context h2 { border-left-color: var(--xz-primary); background: #f2f6f4; }
#footer { margin-top: 50px; padding: 30px 0 24px; border-top: 4px solid var(--xz-primary); background: var(--xz-night); color: #84908d; }
#footer .copyright, #footer .copyright a { color: #95a19e; }
#footer a:hover { color: #fff; }

@media only screen and (max-width: 980px) {
	.container, .mainmenus.container { width: min(calc(100% - 28px), 640px); }
	#head > .container { min-height: 94px; }
	#blogname img { width: 205px; }
	.mainmenus.container { margin-bottom: 18px; }
	#post_container li { transform: none; }
	#post_container li:hover { transform: none; }
}

@media only screen and (max-width: 640px) {
	body { font-size: 13px; }
	.container, .mainmenus.container { width: calc(100% - 20px); max-width: none; }
	.mainbar .container { width: calc(100% - 20px); overflow-x: auto; }
	#topbar ul { width: max-content; gap: 18px; }
	#head > .container { min-height: 80px; justify-content: center; }
	#blogname img { width: 186px; }
	.mainmenus.container { border-radius: 0 0 5px 5px; }
	.topnav, .topnav a, .topnav li { height: 52px; }
	.topnav a { line-height: 52px; }
	.topnav .menu-button { top: 7px; }
	.topnav .menu { padding-top: 52px; }
	.topnav .menu-right #menu-search { height: 52px; background-position: 5px -191px; }
	.topnav .menu-right .menu-search .menu-search-form { top: 52px; }
	#post_container { margin-left: -8px; }
	#post_container li { width: calc(50% - 8px); margin: 0 0 8px 8px; border-radius: 5px; }
	.article { padding: 12px 11px 10px; }
	.article h2 { font-size: 14px; line-height: 1.55; }
	#post_container li .article .entry_post { display: block; max-height: 54px; overflow: hidden; font-size: 11px; line-height: 1.6; }
	.info { display: grid; grid-template-columns: 1fr auto; gap: 3px 6px; height: auto; min-height: 40px; padding: 7px 10px; line-height: 1.4; white-space: normal; }
	#post_container li .info_views { display: inline-block; }
	.info_category { grid-column: 1 / -1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
	.info_ico { padding-left: 0; background: none; }
	.article_container { padding: 18px 14px; }
	.article_container h1 { font-size: 23px; }
	.context, .context p, .context a, .context pre { font-size: 15px; }
}

@media (prefers-reduced-motion: reduce) {
	*, *:before, *:after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

@media only screen and (min-width:1644px) {
	.container { max-width: 1644px !important; }
	.slider { width: 1312px !important; }
	#focus{height: 480px;}
	#focus ul li { width: 1312px;height: 480px; }
#focus ul li img { width: 980px; }
#focus ul li a { float: none; }
#focus .button { width: 1312px; }
#focus ul li a img { width: 980px !important; }
.flex-caption { width: 292px; bottom: 0 !important; height: 460px; }
}

/* Keep editorial proportions on wide monitors. */
@media only screen and (min-width:1644px) {
	.container { max-width: 1312px !important; }
	.slider { width: 975px !important; }
	#focus { height: 370px; }
	#focus ul li { width: 975px; height: 370px; }
	#focus ul li img,
	#focus ul li a img { width: 650px !important; }
	#focus .button { width: 975px; }
	.flex-caption { left: 650px !important; width: 292px; height: 350px; bottom: 0 !important; }
}

/* Editorial masonry: image labels and typographic covers. */
.card-media { position: relative; isolation: isolate; }
.card-categories {
	position: absolute;
	z-index: 5;
	top: 12px;
	left: 12px;
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
	max-width: calc(100% - 24px);
}
.card-categories a,
.card-categories a:link,
.card-categories a:visited {
	display: block;
	max-width: 150px;
	height: 26px;
	padding: 0 9px;
	overflow: hidden;
	border: 1px solid rgba(255, 255, 255, .38);
	border-radius: 3px;
	background: var(--xz-primary);
	box-shadow: 0 4px 12px rgba(12, 26, 22, .14);
	color: #fff;
	font-size: 10px;
	font-weight: 750;
	line-height: 24px;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.card-categories a:hover { background: var(--xz-primary-dark); color: #fff; }
.has-image .thumbnail:after {
	position: absolute;
	z-index: 2;
	right: 0;
	bottom: 0;
	left: 0;
	height: 3px;
	background: var(--xz-primary);
	content: "";
	opacity: .9;
}

.text-thumbnail {
	min-height: 224px;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: #202725;
}
.text-thumbnail:before {
	position: absolute;
	z-index: 0;
	top: 18px;
	right: 18px;
	color: rgba(255, 255, 255, .12);
	font-family: Georgia, "Times New Roman", serif;
	font-size: 88px;
	font-weight: 700;
	line-height: .8;
	content: "“";
}
.text-thumbnail:after {
	position: absolute;
	z-index: 0;
	right: 24px;
	bottom: 24px;
	width: 46px;
	height: 46px;
	border-right: 1px solid rgba(255, 255, 255, .2);
	border-bottom: 1px solid rgba(255, 255, 255, .2);
	content: "";
}
.text-thumbnail__link {
	position: relative;
	z-index: 1;
	display: flex !important;
	flex-direction: column;
	justify-content: flex-end;
	width: 100%;
	height: 100%;
	min-height: 224px;
	margin: 0 !important;
	padding: 60px 22px 20px;
}
.text-thumbnail__copy {
	display: -webkit-box;
	overflow: hidden;
	color: #fff;
	font-family: "Songti SC", "STSong", "SimSun", serif;
	font-size: 20px;
	font-weight: 650;
	line-height: 1.55;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 5;
}
.text-thumbnail__mark {
	display: block;
	margin-top: 14px;
	color: rgba(255, 255, 255, .55);
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: 9px;
	font-weight: 700;
}
.is-text-card.tone-0 .text-thumbnail { background: #202725; }
.is-text-card.tone-1 .text-thumbnail { background: var(--xz-primary); }
.is-text-card.tone-2 .text-thumbnail { background: #b86545; }
.is-text-card .card-categories a {
	border-color: rgba(255, 255, 255, .5);
	background: rgba(255, 255, 255, .94);
	box-shadow: none;
	color: var(--xz-ink);
}
.is-text-card .card-categories a:hover { background: #fff; color: var(--xz-primary-dark); }
.is-text-card .article { padding-top: 15px; }
.is-text-card .article h2:before {
	display: block;
	width: 28px;
	height: 3px;
	margin-bottom: 10px;
	background: var(--xz-primary);
	content: "";
}
.is-text-card .info { justify-content: flex-start; }

@media only screen and (max-width: 640px) {
	.card-categories { top: 8px; left: 8px; gap: 3px; max-width: calc(100% - 16px); }
	.card-categories a,
	.card-categories a:link,
	.card-categories a:visited { max-width: 100px; height: 22px; padding: 0 6px; font-size: 9px; line-height: 20px; }
	.text-thumbnail { min-height: 176px; aspect-ratio: 4 / 5; }
	.text-thumbnail:before { top: 14px; right: 12px; font-size: 60px; }
	.text-thumbnail:after { right: 14px; bottom: 14px; width: 30px; height: 30px; }
	.text-thumbnail__link { min-height: 176px; padding: 44px 12px 14px; }
	.text-thumbnail__copy { font-size: 14px; line-height: 1.55; -webkit-line-clamp: 6; }
	.text-thumbnail__mark { margin-top: 9px; font-size: 8px; }
	.is-text-card .article { padding-top: 11px; }
}

/* Xiaohongshu-inspired compact content stream, adapted for blog metadata. */
.card-categories { display: none; }
.has-image .thumbnail:after { display: none; }
#post_container { margin-left: -12px; }
#post_container li {
	margin-left: 12px;
	margin-bottom: 20px;
	overflow: visible;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}
#post_container li:hover { border-color: transparent; box-shadow: none; transform: translateY(-2px); }
.thumbnail,
.text-thumbnail {
	overflow: hidden;
	border-radius: 8px;
	box-shadow: 0 1px 0 rgba(25, 33, 31, .05);
}
.thumbnail a { border-radius: 8px; }
.article { padding: 11px 3px 7px; }
.article h2 {
	display: -webkit-box;
	min-height: 44px;
	overflow: hidden;
	font-size: 15px;
	font-weight: 650;
	line-height: 1.48;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}
.entry_post {
	display: -webkit-box;
	margin-top: 6px;
	overflow: hidden;
	color: #6c7774;
	font-size: 11px;
	line-height: 1.55;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}
.is-text-card .article { padding: 11px 3px 7px; }
.is-text-card .article h2:before { display: none; }
.text-thumbnail { min-height: 190px; aspect-ratio: 4 / 3; }
.text-thumbnail__link { min-height: 190px; padding: 42px 18px 17px; }
.text-thumbnail__copy { font-size: 16px; font-weight: 620; line-height: 1.55; -webkit-line-clamp: 5; }
.text-thumbnail__mark { margin-top: 10px; }

.card-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	min-width: 0;
	padding: 0 3px;
	color: #929b98;
	font-size: 10px;
	line-height: 1.4;
}
.card-taxonomy {
	display: flex;
	flex: 1 1 auto;
	gap: 4px;
	min-width: 0;
	overflow: hidden;
}
.card-taxonomy a,
.card-taxonomy a:link,
.card-taxonomy a:visited {
	flex: 0 1 auto;
	max-width: 92px;
	padding: 2px 6px;
	overflow: hidden;
	border-radius: 3px;
	background: rgba(22, 160, 133, .09);
	color: var(--xz-primary-dark);
	font-size: 10px;
	font-weight: 650;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.card-taxonomy a:before { content: "#"; opacity: .55; }
.card-taxonomy a:hover { background: rgba(22, 160, 133, .16); color: var(--xz-primary-dark); }
.card-stats {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	gap: 7px;
	white-space: nowrap;
}
.card-stats .info_date { color: #a1aaa7; }
.card-stats .info_views { color: #7d8885; }

@media only screen and (min-width: 981px) and (max-width: 1329px) {
	#post_container li { width: calc(50% - 12px); }
}

@media only screen and (min-width: 1330px) and (max-width: 1643px) {
	#sidebar { width: 280px; margin-left: 20px; }
	#sidebar-follow { width: 280px; }
	#post_container li { width: calc(25% - 12px); }
}

@media only screen and (min-width: 1644px) {
	.container { max-width: 1644px !important; }
	#sidebar { width: 280px; margin-left: 20px; }
	#sidebar-follow { width: 280px; }
	.mainleft { min-width: 0; }
	#post_container li { width: calc(20% - 12px); }
	.slider { width: 1344px !important; height: 300px; }
	#focus,
	#focus ul li { height: 300px; }
	#focus ul li > a { float: left; width: 72%; height: 300px; }
	#focus ul li a img { width: 100% !important; height: 300px; object-fit: cover; }
	#focus .button { width: 1344px; }
	.flex-caption { right: 0; bottom: 0 !important; left: auto !important; width: 28%; height: 300px; padding: 28px; }
}

@media only screen and (max-width: 640px) {
	#post_container { margin-left: -8px; }
	#post_container li { width: calc(50% - 8px); margin: 0 0 16px 8px; }
	.thumbnail,
	.text-thumbnail { border-radius: 6px; }
	.article { padding: 8px 2px 5px; }
	.article h2 { min-height: 40px; font-size: 13px; line-height: 1.5; }
	#post_container li .article .entry_post { display: none; }
	.text-thumbnail { min-height: 166px; aspect-ratio: 4 / 5; }
	.text-thumbnail__link { min-height: 166px; padding: 38px 11px 12px; }
	.text-thumbnail__copy { font-size: 13px; line-height: 1.5; -webkit-line-clamp: 6; }
	.card-footer { display: block; padding: 0 2px; }
	.card-taxonomy { margin-bottom: 5px; }
	.card-taxonomy a,
	.card-taxonomy a:link,
	.card-taxonomy a:visited { max-width: 100%; padding: 1px 5px; font-size: 9px; }
	.card-stats { justify-content: space-between; gap: 4px; font-size: 9px; }
}

/* Card proportion refinements. */
#post_container { margin-left: -20px; }
#post_container li {
	margin-left: 20px;
	margin-bottom: 24px;
	border-radius: 12px;
}
.thumbnail,
.thumbnail a,
.text-thumbnail { width: 100%; border-radius: 12px; }
.text-thumbnail,
.text-thumbnail__link { box-sizing: border-box; }
.article,
.is-text-card .article {
	width: calc(100% - 18px);
	margin: 0 auto;
	padding: 10px 0 4px;
}
.article h2 {
	min-height: 0;
	margin: 0;
	line-height: 1.45;
}
.entry_post { display: none !important; }
.card-footer {
	width: calc(100% - 18px);
	margin: 0 auto;
	padding: 0;
}
.card-taxonomy { margin: 0; }

@media only screen and (min-width: 981px) and (max-width: 1329px) {
	#post_container li { width: calc(50% - 20px); }
}
@media only screen and (min-width: 1330px) and (max-width: 1643px) {
	#post_container li { width: calc(25% - 20px); }
}
@media only screen and (min-width: 1644px) {
	#post_container li { width: calc(20% - 20px); }
}
@media only screen and (max-width: 640px) {
	#post_container { margin-left: -12px; }
	#post_container li { width: calc(50% - 12px); margin: 0 0 18px 12px; border-radius: 9px; }
	.thumbnail,
	.thumbnail a,
	.text-thumbnail { border-radius: 9px; }
	.article,
	.is-text-card .article,
	.card-footer { width: calc(100% - 10px); }
	.article,
	.is-text-card .article { padding: 8px 0 3px; }
}

/* Airier text covers and media-level view counts. */
.card-views {
	position: absolute;
	z-index: 6;
	right: 10px;
	bottom: 10px;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	height: 24px;
	padding: 0 7px;
	border-radius: 12px;
	background: rgba(15, 20, 19, .52);
	color: #fff;
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: 10px;
	font-weight: 650;
	line-height: 24px;
	pointer-events: none;
}
.card-views svg {
	width: 14px;
	height: 14px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}
.text-thumbnail {
	min-height: 220px;
}
.text-thumbnail:before {
	top: 24px;
	right: auto;
	left: 22px;
	font-size: 76px;
}
.text-thumbnail__link {
	justify-content: center;
	min-height: 220px;
	padding: 68px 24px 38px;
}
.text-thumbnail__copy {
	width: 82%;
	font-size: 16px;
	line-height: 1.68;
	-webkit-line-clamp: 4;
}
.text-thumbnail__mark { margin-top: 16px; }
.is-text-card .article,
.is-text-card .card-footer { width: calc(100% - 30px); }

@media only screen and (max-width: 640px) {
	.card-views { right: 7px; bottom: 7px; height: 21px; padding: 0 6px; gap: 3px; font-size: 9px; line-height: 21px; }
	.card-views svg { width: 12px; height: 12px; }
	.text-thumbnail { min-height: 188px; }
	.text-thumbnail:before { top: 18px; left: 12px; font-size: 54px; }
	.text-thumbnail__link { min-height: 188px; padding: 54px 14px 32px; }
	.text-thumbnail__copy { width: 86%; font-size: 13px; line-height: 1.65; -webkit-line-clamp: 5; }
	.text-thumbnail__mark { margin-top: 12px; }
	.is-text-card .article,
	.is-text-card .card-footer { width: calc(100% - 18px); }
}

/* Text covers keep a strict portrait 3:4 frame with balanced copy margins. */
.text-thumbnail {
	width: 100%;
	min-height: 0;
	aspect-ratio: 3 / 4;
}
.text-thumbnail__link {
	box-sizing: border-box;
	justify-content: center;
	width: 100%;
	height: 100%;
	min-height: 0;
	padding: 36px 20px 26px;
}
.text-thumbnail__copy {
	width: 100%;
	font-size: 14px;
	line-height: 1.5;
	-webkit-line-clamp: 6;
}
.text-thumbnail__mark { display: none !important; }
.text-thumbnail:before { top: 14px; left: 18px; }

@media only screen and (max-width: 640px) {
	.text-thumbnail { min-height: 0; aspect-ratio: 3 / 4; }
	.text-thumbnail__link { min-height: 0; padding: 22px 10px 18px; }
	.text-thumbnail__copy { width: 100%; font-size: 11px; line-height: 1.45; -webkit-line-clamp: 6; }
	.text-thumbnail:before { top: 9px; left: 8px; font-size: 42px; }
}

/* Portrait cover composition inspired by editorial quote cards. */
#post_container li,
.thumbnail,
.thumbnail a,
.text-thumbnail { border-radius: 16px; }
.text-thumbnail__link {
	justify-content: center;
	padding: 92px 30px 44px;
}
.text-thumbnail__copy {
	width: 100%;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
	font-size: 18px;
	font-weight: 720;
	line-height: 1.55;
}
.text-thumbnail:before {
	top: 28px;
	right: auto;
	left: 28px;
	font-size: 74px;
	line-height: .8;
}
.text-thumbnail:after {
	right: 28px;
	bottom: 28px;
	width: 28px;
	height: 4px;
	border: 0;
	background: rgba(255, 255, 255, .24);
}

@media only screen and (max-width: 640px) {
	#post_container li,
	.thumbnail,
	.thumbnail a,
	.text-thumbnail { border-radius: 16px; }
	.text-thumbnail__link { padding: 54px 16px 26px; }
	.text-thumbnail__copy { font-size: 18px; line-height: 1.5; -webkit-line-clamp: 5; }
	.text-thumbnail:before { top: 16px; left: 16px; font-size: 52px; }
	.text-thumbnail:after { right: 16px; bottom: 16px; width: 20px; height: 3px; }
}

/* Keep quote copy geometrically centered within the portrait cover. */
.text-thumbnail__link { justify-content: center; padding-top: 48px; padding-bottom: 48px; }
@media only screen and (max-width: 640px) {
	.text-thumbnail__link { padding-top: 28px; padding-bottom: 28px; }
}

/* Unified hover feedback without resizing masonry media. */
.thumbnail img,
.thumbnail a:hover img,
#post_container .has-image:hover .thumbnail img {
	transform: none !important;
}
.thumbnail .zoomOverlay,
.thumbnail .zoom:hover .zoomOverlay {
	display: block !important;
	background: #000 !important;
	background-image: none !important;
	opacity: 0 !important;
	pointer-events: none;
	transition: opacity .18s ease;
}
#post_container .has-image:hover .zoomOverlay { opacity: .12 !important; }
.text-thumbnail__link:after {
	position: absolute;
	z-index: 4;
	inset: 0;
	border-radius: 16px;
	background: #000;
	content: "";
	opacity: 0;
	pointer-events: none;
	transition: opacity .18s ease;
}
#post_container .is-text-card:hover .text-thumbnail__link:after { opacity: .12; }

/* Explicit click-to-load pagination. */
#ajax-load-posts { clear: both; margin: 20px auto 8px; text-align: center; }
#ajax-load-posts a,
#ajax-load-posts span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 132px;
	height: 42px;
	padding: 0 20px;
	border: 1px solid var(--xz-line);
	border-radius: 21px;
	background: #fff;
	color: var(--xz-ink);
	font-size: 13px;
	font-weight: 650;
}
#ajax-load-posts a:hover { border-color: var(--xz-primary); color: var(--xz-primary); }
#ajax-load-posts.is-loading a { cursor: wait; opacity: .62; }
#ajax-load-posts.is-finished span { color: var(--xz-muted); }

/* Preserve intrinsic image ratios in narrowed cards and sidebar widgets. */
#post_container .thumbnail img,
#sidebar .widget img {
	display: block;
	max-width: 100%;
	height: auto !important;
	object-fit: contain;
}
#sidebar .widget > img { width: 100%; }

/* Media counters sit at the top-right; sticky state moves clear of them. */
.card-views {
	top: 10px;
	right: 10px;
	bottom: auto;
}
.sticky {
	top: 10px;
	right: auto;
	left: 10px;
}
@media only screen and (max-width: 640px) {
	.card-views { top: 7px; right: 7px; bottom: auto; }
	.sticky { top: 7px; right: auto; left: 7px; }
}

/* Random recommendations masquerade as the fifth masonry card. */
.random-recommendation__cover {
	position: relative;
	width: 100%;
	aspect-ratio: 3 / 4;
	padding: 22px 18px;
	overflow: hidden;
	border-radius: 16px;
	background: #202725;
}
.random-recommendation__cover:after {
	position: absolute;
	z-index: 1;
	inset: 0;
	background: #000;
	content: "";
	opacity: 0;
	pointer-events: none;
	transition: opacity .18s ease;
}
.random-recommendation-card:hover .random-recommendation__cover:after { opacity: .12; }
.random-recommendation__list {
	position: relative;
	z-index: 2;
	display: grid;
	grid-template-rows: repeat(10, minmax(0, 1fr));
	height: 100%;
	margin: 0;
	counter-reset: random-post;
}
.random-recommendation__list li {
	display: grid;
	grid-template-columns: 20px minmax(0, 1fr);
	align-items: center;
	width: auto !important;
	margin: 0 !important;
	padding: 0;
	border: 0;
	border-bottom: 1px solid rgba(255, 255, 255, .09);
	border-radius: 0 !important;
	box-shadow: none !important;
	counter-increment: random-post;
	transform: none !important;
}
.random-recommendation__list li:last-child { border-bottom: 0; }
.random-recommendation__list li:before {
	color: rgba(255, 255, 255, .38);
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: 9px;
	content: counter(random-post, decimal-leading-zero);
}
.random-recommendation__list a {
	display: block;
	overflow: hidden;
	color: rgba(255, 255, 255, .88);
	font-size: 11px;
	line-height: 1.45;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.random-recommendation__list a:hover { color: #fff; }
.random-recommendation-card .article h2 { -webkit-line-clamp: 2; }
.random-recommendation-card .card-taxonomy span {
	display: block;
	padding: 2px 6px;
	border-radius: 3px;
	background: rgba(22, 160, 133, .09);
	color: var(--xz-primary-dark);
	font-size: 10px;
	font-weight: 650;
}

@media only screen and (max-width: 640px) {
	.random-recommendation__cover { padding: 14px 10px; border-radius: 16px; }
	.random-recommendation__list li { grid-template-columns: 16px minmax(0, 1fr); }
	.random-recommendation__list li:before { font-size: 8px; }
	.random-recommendation__list a { font-size: 9px; }
}

/* Sidebar shares the same 16px card language as the masonry stream. */
#sidebar .widget {
	overflow: hidden;
	border: 1px solid var(--xz-line);
	border-radius: 16px;
	background: var(--xz-paper);
	box-shadow: none;
	transition: border-color .18s ease, box-shadow .18s ease;
}
#sidebar .widget:hover {
	border-color: #c7d1ce;
	box-shadow: 0 8px 22px rgba(25, 33, 31, .06);
}
#sidebar .widget:has(> img) { padding: 0; }
#sidebar .widget > img {
	width: 100%;
	border-radius: 16px;
}
#sidebar .tagcloud a:link,
#sidebar .tagcloud a:visited { border-radius: 8px; }
#sidebar select,
#sidebar input[type="text"],
#sidebar input[type="password"] { border-radius: 8px; }
#sidebar .widget h3:before { border-radius: 2px; }

@media only screen and (max-width: 640px) {
	#sidebar .widget,
	#sidebar .widget > img { border-radius: 16px; }
}