@charset "utf-8";
@font-face {
  font-family: 'iconfont';  /* Project id 5176508 */
  src: url('//at.alicdn.com/t/c/font_5176508_uu2lcsec8f.woff2?t=1778666078648') format('woff2'),
       url('//at.alicdn.com/t/c/font_5176508_uu2lcsec8f.woff?t=1778666078648') format('woff'),
       url('//at.alicdn.com/t/c/font_5176508_uu2lcsec8f.ttf?t=1778666078648') format('truetype');
}
::selection {background: #33363b;color: #fff;text-shadow: none}
*{box-sizing: border-box;}
html {background-color: #fff;}
body {font-family: "Source Sans Pro","Hiragino Sans GB","Microsoft Yahei",SimSun,Helvetica,Arial,Sans-serif,"iconfont";font-size: 14px;color: #333;background-color: transparent}
.h1,.h2,.h3,.h4,.h5,.h6 {margin: 0}
.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6 {font-weight: 400}
.h1, h1 {font-size: 26px}
p {word-break: break-all;margin: 0 0 10px;}
hr {margin: 1.5em auto;border-top: 2px dotted #eee}
a {color: inherit;text-decoration: none;cursor: pointer;word-break: break-all}
a:focus,a:hover {color: inherit;text-decoration: none}
img{border: 0;vertical-align: middle;}
input{font: inherit;margin: 0;}
table {width: 100%;overflow: hidden;font-size: 14px;border-collapse: collapse;}
table th {font-weight: 600;background: #f6f7f9;padding: 4px 12px;}
table td {padding: 4px 12px;border-bottom: 1px solid #f0f0f0;}
table tr:nth-child(2n) {background: #fcfcfc;}
table tr:hover {background: #f0f0f0;}
@media(max-width:767px) {
    table { margin-bottom: 0}
}
.iconfont{ font-family:"iconfont" !important; font-size:16px;font-style:normal; -webkit-font-smoothing: antialiased; -webkit-text-stroke-width: 0.2px; -moz-osx-font-smoothing: grayscale;}
.entry-title{word-break: break-all;}
.no-padder{padding:0!important}
.font-thin{font-weight: 300}
.m-n{margin: 0!important;}
.text {color: #666}
.text-md{font-size:16px}
.text-muted{font-size: 13px;}

.overflow-y-auto {overflow-y: auto!important}
.small-scroll-bar::-webkit-scrollbar-track-piece {background: #eee}
.small-scroll-bar::-webkit-scrollbar {width: 8px;	height: 6px}
.small-scroll-bar::-webkit-scrollbar-thumb {border-radius: 4px;background-color: #cbcbcb}
.small-scroll-bar::-webkit-resizer {background-color: #cbcbcb}
.small-scroll-bar::-webkit-scrollbar-corner {background-color: #cbcbcb}
.small-scroll-bar::-webkit-scrollbar-thumb:hover {background-color: #bbb}

button::-webkit-scrollbar {display: none}
button {-ms-overflow-style: none;overflow: -moz-scrollbars-none}
.scroll-x,.scroll-y{overflow:hidden;-webkit-overflow-scrolling:touch}
.scroll-y{overflow-y:auto}
.scroll-x{overflow-x:auto}
.scroll-hide::-webkit-scrollbar {display: none}
.scroll-hide {-ms-overflow-style: none;overflow: -moz-scrollbars-none;overflow: -moz-scrollbars-none;scrollbar-color: transparent transparent;scrollbar-track-color: transparent;-ms-scrollbar-track-color: transparent;scrollbar-width: none}

blockquote {border-color: #dee5e7;line-height: 1.5em;margin-top: 20px;border-left: 2px solid #009a61;background: rgba(87,173,106,.06);color: #555;font-size: 1em;padding: 10px 20px}
label {font-weight: 400}
.small,small {font-size: 13px}
.alert .close i{display:block;font-size:12px;font-weight:400}
.form-control{border-color:#cfdadd;border-radius:2px;resize:vertical}
.form-control,.form-control:focus{-webkit-box-shadow:none;box-shadow:none}
.form-control:focus{border-color:#0ca565}
.form-horizontal .control-label.text-left{text-align:left}
.padder{padding-right:15px;padding-left:15px}
.rounded{border-radius:500px}
.transparent{background:0 0}
.bg-white-pure{background:#fff}
.panel{transition:all .2s ease}
.clear{display:block;overflow:hidden}
.tooltip {position: absolute;z-index: 9999;padding: 5px 10px;background: rgba(30, 30, 30, 0.9);color: #fff;font-size: 12px;border-radius: 4px;white-space: nowrap;display: none;pointer-events: none;line-height: 1.4;}


body,html{margin: 0;padding: 0;}
.container {margin: auto;width: 100%;box-shadow: 0 0 4px 3px rgba(0, 0, 0, .05);}
.header-fixed {padding-top: 50px;}
.header-fixed .navbar{position: fixed;top: 0;width: 100%;}
.navbar{height: 50px;margin:0;position: sticky;top: 0;z-index: 1020;}
.navbar-header{float: left;background-color: #0ca565;}
  .mhead-menu,.mhead-search{display: none;padding: 10px 17px;font-size: 16px;line-height: 30px;text-decoration: none;background-color: transparent;border: none;}
  .mhead-menu{float: left;}
  .mhead-search{float: right;}
  .navbar-logo{display: inline-block;padding: 0 30px;line-height: 50px;}
  .navbar-logo img{display: inline;max-height: 35px;max-width: 160px;margin-top: -4px;vertical-align: middle;}
.navbar-collapse{display: block;height: 50px; margin-left: 220px;background-color: #f9f9f9; padding-right: 15px;padding-left: 15px;box-shadow: 0 4px 6px rgba(0, 0, 0, .08);}
  .navbar-form{float: left;display: flex;margin: 10px 0;align-items: center;}
  #searchershu .form-group {display: flex;align-items: center;height: 30px;border-radius: 15px;position: relative;box-shadow: 1px 1px 10px rgba(0, 0, 0, .08);}
  #searchershu .search_input {height: 30px;line-height: 30px;padding: 0 12px;padding-right: 35px;border: 0;border-radius: 15px;outline: none;font-size: 12px;transition: all 0.05s ease; width: 200px;}
  #searchershu .search_input:focus {border: 2px solid #0ca565;background: #fff;box-shadow: 0 0 0 2px rgba(92, 156, 247, 0.15);}
  #searchershu #search_submit {position: absolute;right: 8px;top: 0;height: 30px; display: flex; align-items: center;justify-content: center;}
  #searchershu .btn {background: transparent;border: none; outline: none; cursor: pointer; padding: 0; width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; color: #888;transition: color 0.2s;}
  #searchershu .btn:hover {color: #0ca565;}

  .navbar-right{float: right;margin: 10px 0;}
  .navbar-right li{list-style: none;}
  .navbar-right .dropdown{background-color: #eee;border-radius: 30px;width: 30px;height: 30px;line-height: 30px;text-align: center;font-weight: bold; margin-right: 20px;}
  .navbar-right .dropdown:hover{border-radius:0}



.aside{position: fixed;height: 100%; width: 220px;overflow: hidden;background-color: #33363b; color: #ccc;float: left;}
.aside-wrap{height: 100%;overflow: hidden;}
[layout]{display:-webkit-flex;display:-moz-flex;display:-ms-flexbox;display:flex}
[layout=column]{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;overflow:hidden}
[flex]{-webkit-flex:1;-ms-flex:1;flex:1}

.navi-wrap .navi{padding-bottom: 100px;}
.navi-wrap .navi .nav {padding-left: 0;margin-bottom: 0;list-style: none;}
.navi-wrap .navi .nav>li {position: relative;display: block;}
.navi ul.nav>li>a {position: relative;display: flex;padding: 10px 20px;font-weight: 400;text-transform: none;gap: 10px;}
.navi ul.nav>li>a:hover{background-color: #0ca565; color: #fff;}
.navi ul.nav li a span {opacity: .9;}
.navi-wrap .navi .nav-icon {position: relative;width: 40px;height: 40px;display: inline-flex;align-items: center;justify-content: center;float: left;margin: -10px -10px;margin-right: 5px;overflow: hidden;line-height: 40px;text-align: center;}
.navi-wrap .navi .nav-line{background-color: #222;width: 100%;height: 1px;margin: 10px 0;overflow: hidden;font-size: 0;}
.navi-wrap .navi .select{background-color: #0ca565; color: #fff;}

.navi-footer{position: absolute;width: 100%;bottom: 50px;display: flex;justify-content: space-between;align-items: center;text-align: center;height: 50px;background-color: #494c54;}
.navi-footer .col {flex: 1;}
.navi-footer .col a:hover{color: #fff;}
.navi-footer .left-bottom-icons{display: block;}


#content{margin-left: 220px;height: 100%;}
#content:after,.app-content:before{display:table;content:" "}
#content:after{clear:both}
#content .content-body{float: left;width: 100%;}
#content .hbox{display: table;width: 100%;height: 100%;border-spacing: 0;table-layout: fixed;min-height: calc(100vh - 90px);}
#content .hbox .col {display: table-cell;float: none;height: 100%;vertical-align: top;}
#post-panel {padding-bottom: 50px;background: #fff;}
#post-panel>.wrapper-md{padding: 20px;}

.post-list{display: flex;flex-flow: row wrap;gap: 0 15px;align-items: center;}
.single-post{display: flex;margin-bottom: 20px; border-radius: 6px;transition: all .2s ease; overflow: hidden;background: #fff; position: relative;width: 100%;height: auto;align-content: stretch;flex-wrap: wrap;flex: 50 580px;box-shadow: 1px 1px 10px rgba(0, 0, 0, .08);}
.post-list .single-post:hover{transform: translateY(-2px);box-shadow: 0 16px 38px #1118271a;}
.post-img{position: relative;flex: 1 160px;}
  .item-thumb {height: 100%;position: relative;display: block;background-repeat: no-repeat;background-size: cover;background-position: center;}
  .post-pic{position: absolute;left: 0;right: 0;top: 0;bottom: 0;width: 100%;height: 100%;object-fit: cover;transition: transform .3s, box-shadow .3s;}
  .post-pic:hover{transform: scale(1.05);box-shadow: 0 10px 30px 0 rgba(0, 0, 0, .1), 0 4px 9px rgba(0, 0, 0, .1);}
.post-meta{float: left; width: 70%;position: relative;flex: 10; min-width: 0;padding: 30px;}
  .post-title{margin-top: 0;margin-bottom: 10px;color: #555;font-size: 20px;padding-bottom: 1px;display: block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
  .summary{height: 140px;overflow: hidden;line-height: 2em;color: #555;}
  .post-foot{font-size: 12px;background: #fafafa;padding: 6px;border-radius: 5px;display: block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;list-style: none;margin: 0;}
  .list-item{display: inline-block; padding-right: 5px; padding-left: 5px;color: #666;}
  .list-item span{margin-right: 10px;}


.navigator{text-align: center;}
.page-navigator{display:inline-block;padding-left:0;margin:20px 0;border-radius:4px}
.page-navigator>li{display:inline}
.page-navigator>li>a{position:relative;float:left;padding:6px 12px;margin-left:-1px;line-height:1.42857143;color:#111;text-decoration:none;background-color:#fff;border: 1px solid #ddd;font-size: 12px;}
.page-navigator>.current>a,.page-navigator>.current>a:focus,.page-navigator>.current>a:hover{z-index:3;color:#fff;cursor:default;background-color:#111;border-color:#111}
.page-navigator>li>a:focus,.page-navigator>li>a:hover{z-index:2;color:#111;background-color:#eee;border-color:#ddd}
.page-navigator>li:first-child>a{border-top-left-radius:4px;border-bottom-left-radius:4px}
.page-navigator>li:last-child>a{border-top-right-radius:4px;border-bottom-right-radius:4px}



.asidebar{width: 240px;background-color: #f9f9f9;}

.tablist{position: relative;width: 100%;border-bottom: 0;padding-left: 0;margin-bottom: 0;list-style: none;margin-top: 0;}
.tablist>li{position: relative;display: table-cell;width: 1%;float: none;}
.tablist>li>a{position: relative;display: block;font-size: 12px;padding: 10px;border: 1px solid transparent;text-align: center;margin-bottom: 0;margin-right: 0;border-bottom: 1px solid #ddd;background: 0 0 !important;border-radius: 0;}
.tablist>li .sidebar-icon{padding: 5px;}
.tablist>li.active>a {border-bottom-color: #0ca565 !important;}

.tab-content > .tab-pane {padding: 20px;display: none;opacity: 0;transition: opacity 0.15s linear;}
.tab-content > .tab-pane.show {display: block;opacity: 1;visibility: visible;}
.widget-title{margin-top: 0;margin-bottom: 10px;}
.tab-content .list-group{margin: 0;padding: 0;border-width: 0;}
.tab-content li{position: relative;display: block;padding: 10px 0px;margin-bottom: -1px;border: none;overflow: hidden;border-top-left-radius: 4px;border-top-right-radius: 4px;}
.tab-content li>a{display: inline-block;width: 40px;height: auto;margin-right: 15px;float: left !important;}
.tab-content li img{border: 2px solid #fff;width: 40px;box-shadow: 2px 2px 3px #e1e1e1;}
.tab-content li h4{font-size: 12px;}
.tab-content li h4:hover{color: #0ca565;}
.tab-content li small{color: #666;}
.tab-content .right-small-icons{margin-right: 5px;font-size:16px;font-style:normal;-webkit-font-smoothing: antialiased;-webkit-text-stroke-width: 0.2px;-moz-osx-font-smoothing: grayscale;}
.tab-content .meta-value{font-weight: 400;font-size: 12px;}

#sidebar .wrapper-md{padding: 20px;}
#tag_cloud .tags {margin-bottom: 20px;background-color: #fff;border: 1px solid transparent;border-radius: 4px;box-shadow: 1px 1px 10px rgba(0, 0, 0, .05);padding: 10px;line-height: 2em;}
#tag_cloud .label{display: inline-block;min-width: 10px;padding: 3px 7px;font-size: 12px;font-weight: 400;color: #666;line-height: 1;text-align: center;white-space: nowrap;vertical-align: middle;background-color: #fafafa;border-radius: 4px;}
#tag_cloud .tags a:hover{background-color: #0ca565;color: #fff;}


.footer{display: block;margin-left: 220px;background-color: #33363b;box-shadow: 0 0 4px 3px rgba(0, 0, 0, .05);}
.footer .wrapper{font-size: 13px;color: #666;padding: 0 15px; height: 50px; line-height: 50px;}
.footer .text{float: right;display: block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;color: #666;}
.footer .copyright{display: block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}


.topButton {position: fixed;bottom: 130px;right: -240px;z-index: 99;width: 240px;transition: all .2s;}
.rightSettingBtn {display: none;border: none;background: #0ca565;border-top-right-radius: 0;border-bottom-right-radius: 0;left: -40px;padding: 10px 12px;position: absolute;color: #fff;border-top-left-radius: 30%;border-bottom-left-radius: 30%;cursor: pointer;}

/* POST article */
.meta{color: #666;margin-top: 10px;padding-left: 0;list-style: none;margin-left: -5px;}
.meta>li {display: inline-block;padding-right: 5px;padding-left: 5px;}
.meta .post-icons{margin-right: 5px;}
.meta .sr-only{position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip: rect(0, 0, 0, 0);border: 0;}
  .breadcrumb {padding: 8px 15px;margin-top: 0;margin-bottom: 20px;list-style: none;background-color: #f5f5f5;border-radius: 4px;}
  .breadcrumb>li {display: inline-block;}
  .breadcrumb>li+li:before {padding: 0 5px;color: #ccc;content: "/\00a0";}
  .breadcrumb>.active {color: #666;}
  .breadcrumb .home-icons{padding-right: 5px; font-weight: bold;}
#post-content {font-size: 14px;line-height: 2em;text-align: justify;letter-spacing: .05em;padding: 30px;}
#post-content p {margin-bottom: 8px;}
#post-content img {cursor: pointer;margin: 10px auto;max-width: 250px;}
#post-pic img{display: block;}
#post-content h2{font-size:20px;background:linear-gradient(to bottom,transparent 60%,rgba(200,200,200,.3) 0) no-repeat;width:auto;display:inline;color:#666;line-height:1.4;font-weight:700;margin:30px 0 10px 0}
#post-content h2:before{display:block;content:"";margin-top:30px}
#post-content h2:nth-of-type(1)::before{display:block;margin-top:10px}
#post-content h2:after{display:block;content:"";margin-bottom:10px}
#post-content .download{max-width: 100%;background-color: #27c24c;border-color: #27c24c;color: #fff;margin: 10px 0;padding: 4px 10px;border-radius: 4px;display: inline-block;}
#post-content .download:before {content: "\e8e5";position: relative;float: left;width: 36px;height: 36px;margin: -4px -10px;margin-right: 12px;line-height: 36px;text-align: center;background-color: rgba(0, 0, 0, .1);border-radius: 4px 0 0 4px;font-style: normal;}
#post-content .download:hover{background-color: #23ad44;border-color: #20a03f;}
.show-foot{margin:40px 0 10px}
.show-foot .notebook{font-size:12px;color:#9b9b9b}
.show-foot .copyright{float:right;font-size:12px;color:#9b9b9b}
.show-foot .modal-wrap{float:right;margin-top:5px;margin-right:20px;font-size:12px;line-height:1.7}
.show-foot .modal-wrap>a{color:#9b9b9b}
.notebook{display:inline}
.pager {padding-left: 0;margin: 20px 0;text-align: center;list-style: none;}
.pager li {display: inline;}
.pager li>a {display: inline-block;padding: 5px 14px;background-color: #fff;border: 1px solid #ddd;border-radius: 15px;}
.pager .next>a {float: right;}
.pager .previous>a {float: left;}
.pager li>a:focus, .pager li>a:hover {text-decoration: none;background-color: #eee;}
.box-shadow {box-shadow: 1px 1px 10px rgba(0, 0, 0, .08);}

.tocify-header {background: #fff;box-shadow: 1px 1px 10px rgba(0, 0, 0, .05);}
#tag_toc li, #tag_toc ul {list-style: none;margin: 0;padding: 0;line-height: 25px;}
#tag_toc li{padding: 5px 10px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
#tag_toc a{display: block;padding: 2px 2px;border-radius: 4px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
#tag_toc a:hover{background-color: rgba(0,0,0,.05);}
#tag_toc.fixed{position: fixed;top: 55px;}
#tag_toc.fixed ul{width: 200px;max-height: calc(78vh);overflow-x: hidden;position: relative;}


/* Mobile Scream */

/* ≥1200px 容器宽度 */
@media (min-width: 1200px) {
  .container {width: 1170px}
}
/* 992px ~ 1199px */
@media (max-width: 1199px) and (min-width: 992px) {
  .container {width: 970px}
  .post-img {flex: 1 120px;}
  .post-meta{padding:15px 40px}
  .summary {height: 80px;}
}
/* 768px ~ 991px */
@media (max-width: 991px) and (min-width: 768px) {
  .container {width: 750px}
  #content .hbox .col {display: block;width: auto;height: auto;}
  .post-img {flex: 1 120px;}
  .post-meta{padding:15px 40px}
  .post-title {font-size: 17px;}
  .summary {height: 80px;}
}
/* ＜768px 手机端：自适应 100%，不固定宽度 */
@media (max-width: 767px) {
    body,html {overflow-x: hidden!important}
    .navbar-header{float: none;}
    .navbar-logo{display: block; text-align: center;}
    .navbar-collapse{display: none;margin-left: 0;}
    .mhead-menu, .mhead-search{display: block;}
    #content .hbox .col {display: block;width: auto;height: auto;}
    .aside{display: none;z-index: 1010;}
    #content{margin: 0;}
    .post-img {flex: 1 100px;}
    .post-meta{padding:15px 40px}
    .post-title {font-size: 17px;}
    .summary {height: 80px;}
    .footer{margin-left: 0;}
}