/* reset css start*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, main, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {margin: 0;padding: 0;border: 0;outline: 0;font-size: 100%;vertical-align: baseline;background: transparent;}
body {line-height: 1;}
main, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
nav, ul {list-style: none;outline: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: none;}
a {margin: 0;padding: 0;font-size: 100%;vertical-align: baseline;background: transparent;}
ins {background-color: #ff9;color: #000;text-decoration: none;}
mark {background-color: #ff9;padding: 0 4px;color: #666;font-size: 14px;}
del {text-decoration: line-through;}
abbr[title], dfn[title] {border-bottom: 1px dotted;cursor: help;}
table {border-collapse: collapse;border-spacing: 0;}
hr {display: block;height: 1px;border: 0;border-top: 1px solid #cccccc;margin: 1em 0;padding: 0;}
input, select {vertical-align: middle;outline: none;}
/* reset css end*/
body {font-size: 12px;color: #444;position: relative;}
a {color: #333;text-decoration: none;transition: all .2s ease-in-out;}
a:hover {color: #0c8999;}
a.active {color: #0c8999;}
a .num {font-size: 12px;color: #999;display: inline-block;}
textarea {outline: none}
.left {float: left;}
.right {float: right;}
.btn {display: inline-block;padding: 6px 12px 4px;margin-bottom: 0;font-size: 12px;line-height: 20px;text-align: center;vertical-align: middle;cursor: pointer;border: 0;border-radius: 0;}
.btn-primary {color: #ffffff;background-color: #0c8999}
.btn-danger {color: #ffffff;background-color: #d9534f}
.btn:hover, .btn:focus {text-decoration: none}
.btn:focus {outline: thin dotted #333;outline-offset: -2px;}
.btn.btn-small {padding: 3px 9px;border-radius: 2px;}
a.btn:hover {color: #ffffff;background-color: #d9534f}
.icon {width: 1em;height: 1em;vertical-align: -0.15em;fill: currentColor;overflow: hidden;}
.clear {clear: both;}
::-webkit-scrollbar {width: 0;height: 0;background: 0 0}
::-webkit-scrollbar-thumb {background: rgba(0, 0, 0, 1)}
.gray {color: gray;}
.red {color: red;}
.blue {color: #06f;}
.main {width: 100%;height: 100%;}
.wrap {width: 100%;height: 100%;overflow-y: auto;position: relative;}
.box { padding: 0 30px;}
.sidebar {width: 300px;background: #FBFBFB;position: fixed;left: 0;top: 0; bottom: 0;border-right: 1px solid #eee;}
.sidebar .navbar-header { text-align: center; margin-top: 20px; line-height: 100%;}
.sidebar .navbar-header img.img-avatar {height: 80px;width: 80px;display: block;margin: 0 auto;}
.sidebar .navbar-header .name {font-size: 16px;color: #0c8999;text-shadow: 1px 2px 3px rgba(121, 7, 7, 0.1);margin-top: 10px;border-bottom: 1px solid #e6e6e6;padding-bottom: 20px;}
.sidebar .navbar-header .title {font-size: 14px;color: #333;text-shadow: 1px 2px 3px rgba(121, 7, 7, 0.1);margin-top: 20px;overflow: hidden;height: 30px;line-height: 30px;}
.sidebar .navbar-header .location {font-size: 12px;color: #999;text-shadow: 1px 2px 3px rgba(121, 7, 7, 0.1);margin-top: 10px;border-bottom: 1px solid #e6e6e6;padding-bottom: 20px;}
.sidebar .navbar-header .map-link {font-size: 16px;color: #333;margin-top: 20px;border-bottom: 1px solid #e6e6e6;padding-bottom: 20px;}
.sidebar .navbar-header .map-link a {display: block;}
.sidebar .navbar-header .map-link:hover a { transition: all 0.3s ease-in-out;color: #0c8999;}
.sidebar .menu {padding: 20px 0;}
.sidebar .menu .menu-item {font-size: 16px;line-height: 50px;text-align: center;}
.sidebar .menu .menu-item a {color: #000;display: block;}
.sidebar .menu .menu-item.active {background: #fff;cursor: pointer; transition: all 0.3s ease-in-out;}
.sidebar .menu .menu-item:hover a, .sidebar .menu .menu-item.active a {color: #0c8999;}
.content {position: fixed;left: 301px;right: 400px;top: 0;bottom: 0;}
.content .wrap .head {border-bottom: 1px solid #e0e0e0;font-size: 16px;height: 50px;line-height: 50px;}
.content .wrap .item {border-bottom: 1px solid #eee;}
.content .wrap .item .title {font-size: 18px;font-weight: normal;color: #000;padding: 30px 0 12px 0;}
.content .wrap .meta {font-size: 12px;color: #999;padding: 0 0 15px 0;}
.content .wrap .meta p {display: inline-block;margin-right: 15px;}
.content .wrap .item .article-title { font-size: 30px;font-weight: normal;color: #000;padding: 40px 0 15px 0; }
.content .wrap .md-viewer {font-size: 14px;}
.content .wrap .fill-foot {height: 50px;}
.content .wrap .footer {margin: 20px 0;background: #F0F9F0;border: 1px dashed #999;height: 50px;line-height: 50px;padding: 0 20px;color: #999;overflow: hidden;font-size: 14px;}
.content .wrap .footer .prev { width: 50%;float: left;overflow: hidden;}
.content .wrap .footer .next { width: 50%;float: right;overflow: hidden;text-align: right;}
.content .wrap .more {line-height: 40px;font-size: 14px;text-align: center;margin-top: 20px;}
.content .wrap .tip {border: 1px dashed #999;line-height: 36px;height: 36px;overflow: hidden;background: #F0F9F0;margin: 20px 0;padding: 0 10px;border-radius: 3px;color: #d9534f;font-size: 14px;}
.content .wrap .article-header {margin-top: 30px;margin-bottom: 20px;font-size: 14px;color: #666;}
.content .wrap .article-header .title { font-weight: 500;font-size: 26px;line-height: 50px;color: #000;margin-bottom: 10px;}
.content .wrap .article-header .text-muted { line-height: 30px;height: 30px;}
.content .wrap .article-header .search { line-height: 30px;height: 30px;position: absolute;right: 30px;top: 40px;}
.content .wrap .nav {font-size: 16px;}
.content .wrap .nav a {display: inline-block;padding-right: 8px;}
.content .panel {margin-top: 10px;line-height: 32px;font-size: 16px;}
.content .panel .panel-title { font-weight: 500;font-size: 20px;height: 50px;line-height: 50px;color: #000;}
.content .panel .num { color: #999;display: inline-block;font-size: 13px;}
.content .panel .panel-body .date {color: #999;display: inline-block;margin-right: 20px;}
.aside {position: fixed;width: 398px;background: #FBFBFB;right: 0;top: 0;bottom: 0;border-left: 1px solid #eee;}
.widget {margin: 20px 0;line-height: 180%;font-size: 14px;padding: 0 20px;}
.widget .widget-title {font-size: 18px;color: #000;font-weight: 500;margin-bottom: 10px;}
.widget .label {font-weight: 400;background-color: #e0e0e0;border-radius: 5px;display: inline-block;padding: 0 6px;color: #666;font-size: 12px;}
.widget .num {font-size: 12px;color: #999;}
.widget .list-square li:before {color: #ccc;content: "▪";font-size: 12px;margin-right: 6px;transition: .2s ease;}
.copyright {font-size: 12px;position: absolute;bottom: 10px;left: 0;width: 300px;height: 30px;line-height: 30px;text-align: center;color: #999;}
/*当页面宽度小于1000px的时候执行<1000*/
@media screen and (max-width: 1000px) {
  .sidebar {width: 150px;!important}
  .content {left: 151px;right: 0;!important}
  .aside {width: 0;!important}
  .copyright {width: 150px;!important}
}
/*当页面宽度大于1000px且小于1200px的时候执行，1000-1280*/
@media screen and (min-width: 1000px) and (max-width: 1280px) {
  .sidebar {width: 150px;!important}
  .content {left: 151px;right: 200px;!important}
  .aside {width: 200px;!important}
  .copyright {width: 150px;!important}
}
/*当页面宽度大于1280px且小于1366px的时候执行,1280-1366*/
@media screen and (min-width: 1280px) and (max-width: 1440px) {
  .sidebar {width: 200px;!important}
  .content {left: 201px;right: 250px;!important}
  .aside {width: 250px;!important}
  .copyright {width: 200px;!important}
}
/*当页面宽度大于1440px且小于1600px的时候执行,1440-1600*/
@media screen and (min-width: 1440px) and (max-width: 1600px) {
  .sidebar {width: 300px;!important}
  .content {left: 301px;right: 320px;!important}
  .aside {width: 320px;!important}
  .copyright {width: 300px;!important}
}
.pagination {background: #fff; line-height: 24px; margin: 8px 0; font-size: 12px; padding: 0 0 8px;}
.pagination .page-item {text-decoration: none; border: 1px solid #E0E0E0; color: #666;border-radius: 3px;display: inline-block; margin-right: 5px; padding: 0 8px;}
.pagination .page-item:hover {background: #f0f0f0;}
.pagination .current {color: red;background: #f6f6f6;}
.search-input {border: 1px solid #E0E0E0;height: 24px;line-height: 24px;padding: 0 8px;border-radius: 3px;}
.search-input:focus {border-color: #c9ccd5;background: #f6f6f6;}
.search-btn {height: 26px;padding: 0 8px;background: #eee8d5;border: 1px solid #eee8d5;outline: none;cursor: pointer;border-radius: 3px;}
.search-btn:hover {background: #b6a981;border: 1px solid #eee8d5;}
.markdown-wrap {position: relative;}
.markdown-wrap .toc-wrap {position: fixed;top: 36px;right: 300px;width: 300px;border: 1px solid #eee;padding: 10px 0 10px 10px;z-index: 99999;background: #f6f7f8;}
.toc-wrap .toc-title {font-size: 16px;color: #000;font-weight: 500;margin-bottom: 10px;}
.toc-wrap .toc-list {line-height: 30px;font-size: 14px;padding-left: 5px;}
.toc-wrap .toc-list a {color: #333 !important;text-decoration: none !important;}
.toc-wrap .toc-list a:hover {color: #0c8999 !important;}
.toggle-toc {position: absolute;top: 50px;right: 0;width: 50px;height: 50px;line-height: 50px;text-align: center;background: #0c8999;color: #fff;cursor: pointer;z-index: 99999;}