@font-face {
  font-family: 'icon';
  src: url('../font/icon.eot?13679905');
  src: url('../font/icon.eot?13679905#iefix') format('embedded-opentype'),
       url('../font/icon.woff?13679905') format('woff'),
       url('../font/icon.ttf?13679905') format('truetype'),
       url('../font/icon.svg?13679905#icon') format('svg');
  font-weight: normal;
  font-style: normal;
}
/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: 'icon';
    src: url('../font/icon.svg?13679905#icon') format('svg');
  }
}
*/
 
 [class^="icon-"]:before, [class*=" icon-"]:before {
  font-family: "icon";
  font-style: normal;
  font-weight: normal;
  speak: none;
 
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: .2em;
  text-align: center;
  /* opacity: .8; */
 
  /* For safety - reset parent styles, that can break glyph codes*/
  font-variant: normal;
  text-transform: none;
     
  /* fix buttons height, for twitter bootstrap */
  line-height: 1em;
 
  /* Animation center compensation - margins should be symmetric */
  /* remove if not needed */
  margin-left: .2em;
 
  /* you can be more comfortable with increased icons size */
  /* font-size: 120%; */
 
  /* Uncomment for 3D effect */
  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}
 
.icon-music:before { content: '\e80b'; } 
.icon-search:before { content: '\e80a'; } 
.icon-about:before {}
.icon-home:before { content: '\e804'; }
.icon-friends:before { content: '\e803'; } 
.icon-menu:before { content: '\e800'; } 
.icon-archive:before { content: '\e807'; } 
.icon-guestbook:before { content: '\e801'; }
.icon-rocket:before { content: '\e805'; } 
.icon-movie:before { content: '\e806'; } 
body,h1,h2,h3,h4,h5,h6,li,ol,p,ul{margin:0;padding:0}
body{font: 15px/1.5 "Microsoft Yahei","HanHei SC",PingHei,"PingFang SC",STHeitiSC-Light,"Helvetica Neue",Helvetica,Arial,sans-serif;color:#333;background: #ffffff;word-break:break-word;}
li,ol,ul{list-style:none}
a{outline:0;color: #333;text-decoration:none}
a:hover{color: #3cb371;text-decoration:underline;}
img{max-width:100%}
.container{max-width: 1200px;}

.article-list {width: 880px;}
.style02 .article-list{margin: 0 auto;float: inherit;width: 900px;}
.style02 .side-list{display:none;}
.logo{margin-top: -18px;}


.post {
    position: relative;
    overflow: hidden;
    margin-bottom: 20px;
    
    border-radius: 5px;
    
    -webkit-transition: all .4s ease;
    transition: all .4s ease;
height: 250px;}

.nobg {height: auto;background: #ebf5ff;position: initial;border: 1px solid #6ed5b7;box-shadow: 0 0 0 1px rgb(110 213 183), 0 2px 10px rgb(110 213 183 / 11%);}
.post.nobg .info-flow-zt {height: auto;}
    
    
    
position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;}
.post .mask-tags {
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 199;
}
.post .mask-tags a {
    display: block;
    padding: 3px 10px;
    border-radius: 0 0 5px 0;
    background: #6ed5b7;
    
    transition: all .3s cubic-bezier(.25,.1,.25,1);
    
color: #fff;}

.nobg .mask-tags {}
.post .info-flow-zt .img-pad {
    padding-bottom: 70%;
    background-position: 50%;
    background-size: cover;
    -webkit-transition: .7s;
    transition: .7s;
}
.post .info-flow-zt .background-cover {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 8;
    width: 100%;
    background-color: rgba(0,0,0,.4);
    content: " ";
}
.post .info-flow-zt .info {
    
    z-index: 9;
    padding: 0 1rem;
    
    position: absolute;
bottom: 2rem;color: #fff;}

.nobg .info-flow-zt .info {position: relative;border: 0;padding: 1rem;bottom: 0;color: #333;padding-top: 35px;}
.post .info-flow-zt .info .title {
    display: -webkit-box;
    overflow: hidden;
    margin-bottom: 10px;
    
    text-overflow: ellipsis;
    font-weight: 600;
    font-size: 24px;
    
    
    
}
.post .info-flow-zt .info .desc {
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 400;
    
    line-height: 22px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}


@media (max-width:768px){.container{padding: 0 10px;}

.article-list {max-width: 100%;}

#comment-form .textarea {max-width: 100%;}
}
#back-to-top{position:fixed;display:none;bottom:60px;right:40px;width:50px;height:50px;cursor:pointer;font-size:30px;color: #6ed5b7;-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg)}
.navbar{padding:20px 0;background: #6ed5b7;}
.navbar .container{height:30px;line-height:30px}
.navbar-header{float:left;height:30px;padding-right:50px}
.navbar-header a{color: #ffffff;font-weight: bold;font-size: 30px;}
#mobile-menu{position:relative;display:none;width:33px;height:28px;cursor:pointer;float:right;border: 1px solid #ffffff;}
#mobile-menu:active{box-shadow:inset 3px 3px 3px rgba(0,0,0,.05)}
#mobile-menu:before{position:absolute;top:30%;left:20%}
.navbar-inner{float:right;margin-right:65px}
.navbar-nav li{display:inline-block;margin-right:25px}
.navbar-nav li a{display:block;font-size: 16px;color: #ffffff;font-weight: bold;}
.navbar-nav li a:hover,.navbar-nav li.active a{text-decoration:none;}
.navbar-nav li.active a:after{content:"";display:block;height: 3px;background: #ffffff;width:100%;bottom:0;margin-top:18px;}
.navbar-nav li a:hover:after {content: "";display: block;height: 3px;
    background: #ffffff;width: 100%;bottom: 0;margin-top: 18px;}
.navbar-search{float:right;position:relative;padding-right:35px;border: 1px solid #ffffff;border-radius: 30px;padding-left:10px;color: #fff;background: #fff;}
.navbar-search .search-input{box-sizing:border-box;width:190px;border:none;outline:0;background:0 0;color: #fff;}
.navbar-search .search-submit{position:absolute;top:0;right:0;width:35px;height:30px;border:0;background:0 0;cursor:pointer}
.navbar-search .search-submit:hover{color: #ffffff;}
.col-offset-1{margin-left: 20px;}
@media (max-width:768px){.navbar-search,.navigator{display:none!important}
.navbar{background: #6ed5b7;padding-top:10px;padding-bottom:10px}
.navbar-nav li{display:block;margin-right:0}
#mobile-menu{display:block}

div#mobile-menu:before {;color: #fff;}
.navbar-inner{position:absolute;display:none;left:0;right:0;top:50px;background: #6ed5b7;box-shadow:0 3px 6px rgba(0,0,0,.2);width: 100%;z-index: 999;}
.navbar-inner a{padding:0 5%;height:36px;line-height:36px}
.navbar-inner a:active,.navbar-inner a:hover{background: #2becad;color: #fff!important;}

.navbar-nav li a:hover:after {display: none;}
.navbar-nav li.active a:after{content:"";display:none;height:3px;background:#0078ff;width:100%;bottom:0;margin-top:18px}
}
.navigator{position:relative}
.dropdown{display:none;position:absolute;padding-top:10px}
.navigator:hover .dropdown{display:block}
.dropdown-arrow1{border-color:transparent;border-style:dashed dashed solid;border-width:0 8px 8px;position:absolute;left:7px;z-index:1;height:0;width:0;border-bottom-color:#CCC;border-bottom-color:rgba(0,0,0,.2);top:2px}
.dropdown-arrow2{border-color:transparent;border-bottom-color:#fff;border-style:dashed dashed solid;border-width:0 8px 8px;position:absolute;left:7px;z-index:1;height:0;width:0;top:3px}
.submenu{left:0;top:44px;width:560px;padding:25px;background:#fff;border:1px solid #CCC;border-color:rgba(0,0,0,.2);box-shadow:0 2px 10px rgba(0,0,0,.2);overflow:hidden;-webkit-border-radius:2px;border-radius:2px}
td,th{vertical-align:top;text-align:left;font-weight:400}
.tdleft{width:45px;border-right:1px solid #eee}
.tdright{padding-left:20px;font-size:12px}
.tdright a{display:inline-block!important;line-height:180%;margin:0 10px 10px 0;padding:0 10px;background:#f5f5f5;font:13px/1.65 Arial,sans-serif;color:#333}
tr:first-child a{background:#fff}
.tdright a:hover{background-color:#5895be!important;color:#fff!important;text-decoration:none}
.content{padding-top:40px;padding-bottom:40px}
.distant{margin-bottom:20px;color: #999;font-size: 12px;}

.style01 .article-list {
    
    
    
    
    
    
    }
.distant a{text-decoration:underline;color: #999;}
.distant span{color:#aaa;padding:0 5px}
.article-list .article{margin-bottom:20px;padding: 10px 0;}
.article-list .article-content a{color:#5895be}
.article .article-title{font-size:17px;line-height:24px;margin-bottom: 10px;}

.article .meta {font-size: 12px;color: #999;border-bottom: 1px dotted #eee;padding-bottom: 5px;}

.article .meta a {color: #999;}
.article .article-title a{font-size: 20px;color: #6ed5b7;}
.article .article-title a:hover{border-bottom: 1px dotted #6ed5b7;text-decoration: none;padding-bottom: 3px;color: #3cb371;}
.article .article-meta{padding-bottom:20px;font-size:12px;color:#777}
.article .article-content{margin-top:15px;font-family: microsoft Yahei;font-size: 15px;}
.article .article-meta a{color:#777}
.article .article-meta a:hover{color:#5895be}
.article-meta ul li{display:inline-block}
.article-meta ul li span{color:#aaa;padding:0 5px}
.article-content p{margin: 10px 0;line-height: 30px;}
.article-content p img{margin:0 auto;text-align:center;border-radius: 5px;}
.article-content ul{margin:0 0 24px 30px}
.article-content ul li{margin-bottom:5px;list-style:square outside none;line-height:24px}
.article-tags{margin-top:10px;padding:15px 0;border-top:1px solid #ededed}
.article-near{padding:16px 0;border-top:1px solid #ededed;border-bottom:1px solid #ededed}
.article-near a,.article-tags a{}
.page-navigator{color:#4a4a4a;list-style:none;line-height:24px}
.page-navigator li{display:inline-block;margin:0 5px 2px 0;border:1px solid #DDD;color:#555;zoom:1}
.page-navigator li.current,.page-navigator li:hover{background:#f8f8f8;border-bottom-color:#c70000}
.page-navigator li a{display:block;padding:0 8px}
.side-list .article{margin-bottom:20px;border: 1px solid #6ed5b7;border-radius: 5px;background: #ebf5ff94;box-shadow: 0 0 0 1px rgb(110 213 183), 0 2px 10px rgb(110 213 183 / 11%);-webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);}
.side-list .article h3{color: #ffffff;text-transform:uppercase;font-weight: bold;font-size: 14px;padding: 5px;background: #6ed5b7;display: inline-block;border-radius: 0 0 5px 0;}
.side-list .article ul{padding: 10px;}
.side-list .article ul li{}
.side-list .article ul a{}
.side-list .article ul a:hover{}
.side-list .article.friend-list ul{list-style:none;padding:10px 0}
.side-list .article.friend-list ul li{display:inline-block;margin-right:10px;margin-bottom:5px}
#comments{padding-top:30px;padding-bottom:50px}
.new-comment{margin-bottom:30px;font:400 14px/1.8 Helvetica,Arial,sans-serif}
.new-comment .cancel-comment{float:right;margin-bottom:10px}
.new-comment p{margin-bottom:8px;}
.new-comment label{color:#777;font-size:14px;position:relative;left:-200px}
.new-comment input:focus,.new-comment textarea:focus{outline-offset:0}
.new-comment input{font:12px;width:140px;padding:3px 0 3px 50px;margin-right:10px;border:1px solid #ddd}
.new-comment textarea{min-height:70px;width:100%;resize:none;border:0;border-top:3px solid #f2f2f2;padding:4px 5px;box-sizing:border-box;vertical-align:middle}
.new-comment .clearfix{margin-top:8px}
..comment-author img{width:50px;height:50px}
.comment-author a,.comment-author cite{font-style:normal}
.comment-author a{}

.comment-reply a {border: 1px solid #6ed5b7;padding: 0px 5px;border-radius: 3px;color: #fff;background: #6ed5b7;}
.comment-parent{margin-bottom:24px;padding-bottom:24px;border-bottom:1px solid #ededed}
.comment-parent>.comment-children{position:relative;margin-left:70px}
.comment-children .comment-author img{width:30px;height:30px}
.comment-children:after,.comment-children:before{position:absolute;top:-15px;left:5px;z-index:99;width:0;border:solid transparent;content:""}
.comment-children:before{border-color:rgba(255,255,255,0);border-bottom-color:#fff;border-width:8px;z-index:100}
.comment-children:after{top:-17px;left:4px;border-color:rgba(255,255,255,0);border-width:9px;border-bottom-color:#e5e5e5}
.comment-children .comment-child{padding-bottom:10px;padding-top:10px;border-top:1px solid #ededed}
.footer{border-top: 1px solid #f7f7f7;padding:15px 0;background: #333333;}
.footer .copyright{color: #ffffff;line-height:35px;text-align:center;}
.footer .copyright a{color: #ffffff;}
.footer .copyright a:hover{}
code{font:400 14px/1.8 Helvetica,Arial,sans-serif;margin:0;overflow:auto}
pre{overflow:auto;max-height:400px}
#comment-form .form-infos p{width:200px;float:left;margin-right:20px}
.ui-form .textarea,.ui-form input.text{width:90%;border: 2px solid #6ed5b7;padding:10px 5%;border-radius:3px;}
.ui-form .form-control{margin:10px 0}
#comment-form .textarea{width: 100%;height:100px;padding:10px}
.btn{padding:14px 40px;border-radius:5px;font-weight:700;display:block;border:none;background: #6ed5b7;color:#fff}
.ui-form .form-control{margin:10px 0}
.btn:hover{background-color:#2becad;background:-moz-linear-gradient(left,#2becad,#0cc8e9);background:-webkit-linear-gradient(left top,#2becad,#0cc8e9);background:-o-linear-gradient(left,#2becad,#0cc8e9)}
.comment-meta a{color:#999;font-size: 10px;font-weight:100}
.comment-author{display:block;margin-bottom:0;color: #333;}
.comment-author .avatar{float:left;margin-right:10px;width:40px;height:40px;border-radius:5px}
.comment-author cite{font-weight:700;font-style:normal}
.post-title{font-size: 17px;line-height: 24px;}