@charset "utf-8";
html {
    --theme: #409eff;--background: #fff;--main: #303133;--routine: #606266;--minor: #909399;--seat: #c0c4cc;--classA: #dcdfe6;--classB: #e4e7ed;--classC: #ebeef5;--classD: #f2f6fc;--classE: #f2f2f2;--classF: #f9f9f9;--radius-wrap: 8px;--radius-inner: 4px;--text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);--box-shadow: 0px 0px 20px -5px rgba(158, 158, 158, 0.22)}

html[data-night='night'] body {
    --theme: #54b5db;--background: #232323;--main: #999;--routine: #888;--minor: #777;--seat: #666;--classA: #515253;--classB: #454545;--classC: #414243;--classD: #303030;--classE: #3e3e3e;--classF: #26262a;--text-shadow: none;--box-shadow: none}
html {-moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased }
html,body,h1,h2,h3,h4,h5,h6,div,dl,dt,dd,ul,ol,li,p,blockquote,pre,hr,figure,table,caption,th,td,form,fieldset,legend,input,button,textarea,menu {box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box }
* {margin: 0; padding: 0; list-style: none }
h1,h2 {font-size: 18px; font-weight: 700; margin-bottom: 10px }
img {vertical-align: middle; border-style: none; }
body {background: #f7f7f7 url(../images/bg.png) repeat; /*font-family:'Source Sans Pro','Helvetica Neue',Helvetica,'Microsoft Yahei',Arial,sans-serif;*/ font-family: "Microsoft YaHei","微软雅黑","Arial",sans-serif; font-size: 14px; -webkit-font-smoothing: antialiased; -webkit-overflow-scrolling: touch; line-height: 1.5 }
html[data-night='night'] body{
    background: #121212;
}
h1, h2, h3, h4, h5, h6 {font-weight: 500; }
.text-center {text-align:center; }
blockquote {margin: 1em 0; padding-left: 1.5em; border-left: 4px solid #1e9fff; color: var(--routine);padding: 10px;    background: var(--classD);}
table th {word-break: keep-all;white-space:nowrap;   }
h1,h2,h3,h4,h5,h6 {font-family: "Helvetica Neue",Helvetica,Arial,"PingFang SC","Hiragino Sans GB","WenQuanYi Micro Hei","Microsoft Yahei",sans-serif; }
input[type="text"],input[type="email"],input[type="url"],input[type="password"],textarea {padding: 5px; border: 1px solid #E9E9E9; width: 100%; border-radius: 2px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
textarea {resize: vertical; }
.text-gray {color: var(--main)}
a.text-gray:hover {color: #3b3b3b}
.img-circle {border-radius: 50%;}
.layui-icon {margin-right: 2px;}
.pr{position:relative;}
.pa{position:absolute;}
.clearfix:after,
.clearfix:before {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}
::-webkit-scrollbar {width: 6px; }
::-webkit-scrollbar-button {display: none; }
::-webkit-scrollbar-track {background-color: #ddd; }
::-webkit-scrollbar-track-piece {background-color: #f3f3f3; -webkit-border-radius: 3px; }
::-webkit-scrollbar-thumb {background-color: #ccc; border: solid 1px #c0c0c0; border-radius: 3px; }
::-webkit-scrollbar-corner {background-color: #f3f3f3; }
::-webkit-resizer {background-repeat: no-repeat; background-position: bottom right; }
::-webkit-scrollbar-thumb:hover {background-color: #bbb; }

/* 头部 */
.wv-lt-col-5[data-v-351d2054] {display: none !important;}
#he-plugin-simple{position:relative;left:220px;top:8px;max-width:150px;}
#top-grrk {background: url(../images/HorseRaceLamp.gif); height: 2px; width: 100%; Z-index: 10000; }
.layui-content {}
#header_bg {background-image: url(../images/bg_pic.jpg); height: 200px; background-size: cover; background-position: top; position: relative; overflow-x: hidden; }
.header{position: fixed; top:0px; z-index: 10000; width: 100%; background-color: rgba(0, 0, 0, 0.5); }
.header a {color: #fff; }
.logo{position: absolute; left: 10px; top: 16px; font-size: 1.4em; }
.logo img{width: 82px; height: 31px; }
.header .layui-nav{position: absolute; right: 0;top: 0; padding: 0; background: none; }
.header .layui-nav .layui-nav-item{margin: 0 5px; }
.header .layui-nav .layui-nav-item:after,.header .layui-nav .layui-nav-bar{height: 3px; background-color: #1e9fff; }
.header .layui-nav .layui-nav-item a{color: #fff; padding: 0 16px; }
.header .layui-nav .layui-nav-item a:hover{color: #1e9fff; }
.header .layui-nav .layui-nav-item[mobile]{display: none; }
.header .layui-nav .layui-nav-more {margin-top: -4px; border-color: #212220 transparent transparent; }
.header .layui-nav .layui-nav-mored {margin-top: -12px; border-style: dashed dashed solid; border-color: transparent transparent #212220; }
.layui-container .main{margin: 10px auto; }
.layui-badge:empty {display: none; }
.map {margin-bottom: 10px; }

/* 面板 */
.list-card {border-radius: 6px; margin-bottom: 10px; }
.list-card .list-pic {width: 150px; height: 150px; line-height: 150px; float: left; text-align: center; overflow: hidden; margin-right: 25px }
.list-card .list-pic img {max-width: 100% }
.list-card p {display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;height: 80px; }
.title-article {background:var(--background); overflow: hidden; padding: 20px 20px 10px 20px; position: relative;}
.item-box{border: 1px solid var(--classC);transition: All 0.3s ease-in-out; -webkit-transition: All 0.3s ease-in-out; -moz-transition: All 0.3s ease-in-out; -o-transition: All 0.3s ease-in-out; }
.item-box:hover {border: 1px solid #1ca9f6; -webkit-box-shadow: 0 10px 20px rgba(0,0,0,0.1); box-shadow: 0 10px 20px rgba(0,0,0,0.1); position: relative; z-index: 2; }
.myself{position:absolute;right:0px;top:0px;}
.title-article h1 {padding-bottom: 10px ;    color: var(--main);text-align: center;}
.title-article h2{color: #999}
.title-article p {margin-bottom: 10px; color: #666 }
.title-article p span {margin-right: 10px }
.title-article .titlepic {background: #fff; width: 150px; height: 150px; line-height: 150px; float: left; text-align: center }
.title-article .titlepic img {max-width: 110px; max-height: 110px }
.title-article .title-msg {margin-bottom: 10px }
.title-article .title-msg span {color: #999; margin-right: 10px }
.title-article .title-msg span a {color: inherit }
.title-article .title-msg span a:hover {color: #1e9fff }
.title-article .title-right {position: absolute; top: 20px; right: 15px; background: #f5f5f5; padding: 10px; overflow: hidden }
.title-article .title-right img {max-width: 120px !important; max-height: 120px !important }
.title-sidebar {border-bottom: 1px solid var(--classC); width: 100%; color: var(--main); font-weight: 600; padding-bottom: 10px; margin-bottom: 10px; overflow: hidden; }
.title-sidebar i {color: var(--main); margin: 5px }
.title-sidebar h3 {font-weight: 600 }
.text,.reward,.copy-text,.relates,.user-text,.comment-text,.tags-text,.time-text {background: var(--background); padding: 20px; }
.text {padding-top: 0; padding-bottom: 0; line-height: 2; overflow: hidden }
.text .tab-content {padding-top: 15px; padding-bottom: 15px; margin-bottom: 10px; height: 500px; overflow-y: scroll }
.text img:not([class]) {max-width: 80% !important; height: auto !important; /*margin: 20px auto;*/ display: block; }
.time-text{font-size: 12px; color: #999; text-align: right; }
.the-end {padding: 40px 0 60px;background:var(--background);}
.the-end img {width: 92px;height: 11px;display: block;margin: 0 auto;}

/* 版权说明 */
.copy-text {color: #666;border-top: 1px solid #f3f3f3; }
.copy-text div {position: relative; font-size: 12px; background: #f4f5f7 url(../images/blockquote.png) 1px 3px no-repeat; padding: 13px 26px 13px 40px; border-radius: 4px; overflow: hidden; line-height: 2 }
.copy-text div:after {content: ""; display: block; width: 31px; height: 27px; position: absolute; background: url(../images/blockquote.png) 0 0 no-repeat; right: 2px; bottom: 3px; background-size: 100%; z-index: 26; transform: rotateZ(180deg); }

/*上下页*/
.page-text {margin-bottom: 10px; font-size: 14px; overflow: hidden;margin-top:15px;background:var(--background);padding:5px;}
.page-text .previous {border-right: 1px solid var(--classC); }
.page-text .nav-span {float: left; width: 50%; text-align: center; padding: 10px 20px; white-space: nowrap; word-wrap: normal; text-overflow: ellipsis; overflow: hidden;color: var(--main); }
.page-text .d-block {display: block; }

/* 搜索框 */
.component {background: var(--background); padding: 15px; margin-bottom: 15px; border-radius: 6px; overflow: hidden ;color: var(--routine);}
.component .layui-input {width: 185px; height: 30px; padding-left: 12px; font-size: 12px;background:var(--background);border: 1px solid var(--classC); }
.component .layui-btn-primary{background:var(--background);color: var(--routine);border: 1px solid var(--classC); }

/*日历*/
.calendar{margin-bottom:15px;}
#post-calendar {
    width: 100%;
    padding-top: 20px;
    padding-bottom: 20px;
    height: 225px;
    border-radius: 8px 8px 0 0;
    background: var(--background);
}

/* 搜索不到内容 */
.post {background: #fff; padding: 15px; margin-bottom: 15px; border-radius: 6px; overflow: hidden }
.post .post-title {text-align:center; }

/* 分类 */
.column {background: var(--background); padding: 15px; margin-bottom: 15px; border-radius: 6px; overflow: hidden } 
.column ul {overflow: hidden }
.column ul li {padding: 5px 10px;color:var(--main);}
.column ul li a{color:var(--main);}
.column ul span {float: right; color: #999 }
.column ul i {color: var(--main);}
.column .layui-bg-gray{background: var(--classD) !important;}

/* 个人信息 */
.my-info{background: var(--background); margin-bottom: 15px; border-radius: 6px; overflow: hidden; }
.my-info::after {display: none;content: '';position: absolute;top: 0;left: 0;width: 100%;height: 273px;background: url(../images/snow.gif) no-repeat;background-size: cover; z-index: 3;pointer-events: none;}
.my-info:hover::after {display: block;}
.my-info .background {border-radius: 4px 4px 0 0; overflow: hidden; }
.my-info .background img {width: 100%; height: 100px; object-fit: cover; vertical-align: middle; }
.my-info .user-info {position: relative; margin-bottom: 15px; }
.my-info .user-info .avatar {width: 70px; height: 70px; margin: -50px auto 13px; }
.my-info .user-info .avatar img {border-radius: 50%; width: 100%; height: 100%; box-shadow: 0 5px 10px rgba(0,0,0,.2);     transition: -webkit-transform 0.75s;
    transition: transform 0.75s;
    transition: transform 0.75s, -webkit-transform 0.75s; }
.my-info .user-info .avatar:hover img{ -webkit-transform: rotate(360deg);transform: rotate(360deg)}
.my-info .user-info .title {text-align: center;     color: var(--main);}
.my-info .user-info .title a{ color: var(--main);}
.my-info .web-info {display: flex; flex-wrap: wrap; margin: 0; padding: 4px; white-space: nowrap; }
.my-info .web-info li {flex-basis: 0; flex-grow: 1; text-align: center; border-right: 1px solid var(--classC);     color: var(--main);}
.my-info .web-info li span {color: #1ca1f3; }
.my-info .web-info li:last-child {border-right: 0; }

/* 博主动态 */
.dynamic {background: var(--background); padding: 15px; margin-bottom: 15px; border-radius: 6px; overflow: hidden }
.dynamic ul {padding-left: 10px; padding-right: 10px; height: 350px; overflow: scroll; overflow-x: hidden }
.dynamic ul li {position: relative; padding: 10px 10px 0 20px; border-left: 2px solid #c0c0c0 }
.dynamic ul li span {position: absolute; left: -12px; top: 10px; padding: 2px; border: 5px solid var(--background)}
.dynamic ul li a {color: #3f3f3f }
.dynamic ul li p {margin-top: 5px; padding-bottom: 14px; color: #666; border-bottom: 1px solid var(--classC) }
.dynamic ul li small {display: inherit; color: #999; margin-top: 10px }
.dynamic ul li img {width: 50% }
.dynamic ul li:hover span {background: #888 !important }
.dynamic ul li:hover a {color: #3280fc }
.dynamic ul li:hover p {color: #303030 }

/* 标签云 */
.tags {background: var(--background); padding: 15px; margin-bottom: 15px; border-radius: 6px; overflow: hidden }
.tags div a {margin: 0 6px 5px 0 !important; white-space: nowrap; text-overflow: ellipsis; overflow: hidden }
.tags .layui-btn-primary{background: var(--background)}
.tags-text  {color: var(--main) }
.tags-text i {color: var(--main) }
.tags-text a {color: var(--main) }
.tags div a:nth-child(8n){color: #6044bf; }
.tags div a:nth-child(8n+1) {color: #249d66; }
.tags div a:nth-child(8n+2) {color: #0b98d7; }
.tags div a:nth-child(8n+3){color: #c6194b; }
.tags div a:nth-child(8n+4){color: #daa629; }
.tags div a:nth-child(8n+5){color: #dccff2; }
.tags div a:nth-child(8n+6){color: #e51a4f; }
.tags div a:nth-child(8n+7){color: #3d9037; }

/* 广告 */
.ads {background: #fff; padding: 15px; margin-bottom: 15px; border-radius: 6px; overflow: hidden }

/* 友情链接 */
.link {background: var(--background); padding: 15px; margin-bottom: 15px; border-radius: 6px; overflow: hidden }
.link div a {display: inline-block; text-align: center; width: 45%; margin: 0 6px 5px 0 !important; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; border: none; border-bottom: 1px solid var(--classC); height: 22px; line-height: 22px; font-size: 12px; background-color: background: var(--background); color: var(--main); }
.link i {color: var(--main) }

/* 页码 */
.pagination{display:inline-block;}
.page-navigator {padding: 15px; margin-left: auto; margin-right: auto; text-align: center; display: inherit }
.page-navigator a:hover {background: #393d49; color: #fff }
.page-navigator .current {background: #333742; color: #fff }
.page-navigator li{display: inline;}
.page-navigator li a,.page-navigator li span{ padding: 0px 12px;height: 30px;line-height: 30px;float: left;font-size:14px;border: 1px solid var(--classC);margin-left: 5px;background-color: var(--background);color: var(--routine);border-radius: 3px;}
.page-navigator li span{ background-color: var(--background);color: var(--routine);}
.page-navigator li.active span{ background: #333742;color:#fff;cursor: default;}
.page-navigator li.disabled span{ cursor: not-allowed;}

/* 底部 */
.footer {margin-top: 15px; padding-top: 15px; padding-bottom:15px; }
.footer span {color: #999;}
.footer .layui-breadcrumb a {color: #999 !important; }
.footer .layui-breadcrumb span[lay-separator] {color: #999;margin: 0 8px;}
.footer .t-copy {text-align: center; }
.footer a {text-decoration: none;color: #666;}
    
/* 编辑器内容 */
.layui-table {color: var(--main);background-color: var(--background);}
.layui-table tbody tr:hover, .layui-table thead tr, .layui-table-click, .layui-table-header, .layui-table-hover, .layui-table-mend, .layui-table-patch, .layui-table-tool, .layui-table-total, .layui-table-total tr, .layui-table[lay-even] tr:nth-child(even) {
    background-color:var(--classE);
}
.layui-table td, .layui-table th, .layui-table-col-set, .layui-table-fixed-r, .layui-table-grid-down, .layui-table-header, .layui-table-page, .layui-table-tips-main, .layui-table-tool, .layui-table-total, .layui-table-view, .layui-table[lay-skin=line], .layui-table[lay-skin=row] {
    border-color: var(--classC);
}
.markdown-body{    color: var(--main);}
.markdown-body h2{font-weight: 700; }
.markdown-body h2:before {content: "#"; margin-right: 5px; color: #FF6D6D; }
.markdown-body a{color: #58666e; border-bottom-color: #222; border-bottom: 1px solid #999; word-wrap: break-word; word-break: break-all; }
.markdown-body table a{    word-wrap: normal;
    word-break: normal;}
.md_content li { list-style: none; }
.md_content ol, .md_content ul {padding-left:12px;counter-reset: ol-li; }
.md_content img{cursor: zoom-in;}
.md_content ol li:before {display: block;float: left;width: 1.3rem;height: 1.3rem;line-height: 1.3rem;margin: 4px 12px 0 0;color: #fff;font-size: 14px;font-weight: 500;font-style: normal;background-color: #1e9fff;border-radius: 50%;text-align: center;transition: all .5s;}
.md_content code:not(.code){font-family: Menlo,Monaco,courier,monospace,"Lucida Console",'Source Code Pro',"Microsoft YaHei",Helvetica,Arial,sans-serif,'Ubuntu';padding: 2px;margin: 0px 2px;vertical-align: center;border-radius: 2px;border: 1px solid #1e9fff;background:#e8f4fd;}

/* 动态页 */
.mylife {background: var(--background);padding: 20px; margin-bottom: 10px; overflow: hidden; clear: both }
.mylife .t-p {float: left; height: auto }
.mylife .t-p img {width: 42px; height: 42px; border-radius: 200px; /*box-shadow: 2px 5px 25px #efefef*/ }
.mylife .t-r {margin-left: 50px; padding-bottom: 15px; margin-bottom: 15px; border-bottom: 1px var(--classC) solid; color:var(--main) }
.mylife .t-r a{color:var(--main) }
.mylife .t-r strong {font-size: 16px }
.mylife .t-r p {margin-top: 5px; margin-bottom: 5px }
.mylife .t-r p img {max-width: 200px; margin-top: 10px; display: inherit }
.mylife .t-r p video {background: #222 }
.mylife .t-r span {font-size: 12px }
.about-life {height: 180px; background: var(--background); overflow: hidden }
.about-life .t-w {background: var(--classA); padding-left: 15px; padding-right: 15px; height: 65% }
.about-life .t-u {float: left; margin-top: 30px }
.about-life .t-u img {border-radius: 200px }
.about-life .t-t {margin-left: 150px; padding-top: 20px }
.about-life .t-t h1{color: var(--main)}
.about-life .t-t h1 span {font-size: 12px;  }
.about-life .t-t h1 span i {margin-right: 6px; margin-left: 8px }
.about-life .t-d {color: var(--main) }
.about-life .t-i i {font-size: 12px !important }
.about-life .t-i a {background: #aaa; margin: 0; display: inline-block; color: #fff; white-space: nowrap; text-align: center; height: 30px; line-height: 30px; padding: 0 10px; font-size: 12px; border-radius: 100px; }
.title-life {clear: both;background: var(--background); width: 100%; float: left; padding-left: 20px; padding-right: 20px; margin-top: 10px; border-bottom: 1px var(--classC) solid; line-height: 48px; box-sizing:border-box;color:var(--main); }
.title-life h3 {float: left; font-weight: 600 }
.title-life span {float: right; font-size: 12px; color: #666 }

/* 归档 */
.archives {padding: 15px; background:var(--background); color: #666 }
.archives legend {font-size: 16px }
.archives a {color: var(--main) !important; line-height: 2 }
.archives h3 a {line-height: 0 }
.archives small {display: block; margin-bottom: 20px; color: #999 }
.title-page {margin-bottom: 15px; color: var(--main); line-height: 2.4 }
.title-page h3 {color: var(--main) }

/* 新归档 */
.timeline-header {display: block; width: 12em; margin-right: 2px; margin-left: 2px; text-align: center }
.timeline-header .layui-btn {height: 30px; line-height: 30px; }
.timeline-header .layui-btn-primary{background:var(--background);color:var(--main);}
.timeline-header h2 {padding: 0px; margin: 0px; font-size: 14px; font-weight: normal; line-height: 30px; }
.timeline-item {display: block }
.timeline-item:after, .timeline-item:before {box-sizing: border-box; display: table; content: " "}
.timeline-wrap {border-color: #bfbfbf; display: block; padding: 10px 0 5px 20px; margin-left: 6em; border-style: solid; border-width: 0 0 0 1px; margin-bottom: 0px !important; }
.timeline-wrap:after, .timeline-wrap:before {box-sizing: border-box; display: table; content: " "}
.timeline-wrap:before {top: 4px; float: left; width: 10px; height: 10px; margin-left: -26px; background: #edf1f2; border-color: inherit; border-style: solid; border-width: 3px; border-radius: 50%; content: ""; box-shadow: 0 0 0 4px #f0f3f4; transition: all .3s ease; }
.timeline-wrap:hover:before {border-color: #1e87f0; }
.timeline-date {display: block; float: left; width: 4.5em; margin-left: -7.5em; text-align: right ;color:var(--main)}
.timeline-content {display: inline-block; border-radius: 2px; }
.timeline-content, .timeline-date, .timeline-wrap:before {position: relative; }
.timeline-content a {line-height:1.5; color:var(--main);}
.timeline-content a:hover {text-decoration: none; color: #1e87f0 !important; }
.timeline-text {padding: 5px; border-bottom: 0px !important; }
.timeline-text a:before, .timeline-content a:before {content: ""; padding: 0px; box-sizing: border-box; }
.timeline-menu {background: #fff; padding: 15px; margin-bottom: 15px; border-radius: 6px; overflow: hidden; }
.timeline-menu ul {padding-left: 10px; padding-right: 10px; max-height: 500px; overflow: scroll; overflow-x: hidden }
.timeline-menu-fixed {position: fixed; top: 10px; }
.timeline-menu .active {background: rgba(175, 167, 167, 0.1); }

/* 密码保护美化 */
.protected p {text-align:center; }
.protected input[type="password"] {width: 50%; }
.protected .submit {display: inline-block; height: 38px; line-height: 38px; padding: 0 18px; background-color: #1E9FFF; color: #fff; white-space: nowrap; text-align: center; font-size: 14px; border: none; border-radius: 2px; cursor: pointer; }

/*标签*/
.page_tags a {display: inline-block; margin: 0 0px 10px 0; color: #fff; background-color: #eee; padding: 5px 10px; font-size: 12px; border-radius: 2px; text-decoration: none; }
.page_tags a em {font-style: normal; font-size: 11px; margin-left: 5px; }
.page_tags a:hover {color: #fff; }
.page_tags a:nth-child(8n) {background-color: #00a2ca; }
.page_tags a:nth-child(8n+1) {background-color: #5CB85C; }
.page_tags a:nth-child(8n+2) {background-color: #D9534F; }
.page_tags a:nth-child(8n+3) {background-color: #FF6600; }
.page_tags a:nth-child(8n+4) {background-color: #B433FF; }
.page_tags a:nth-child(8n+5) {background-color: #00ABA9; }
.page_tags a:nth-child(8n+6) {background-color: #B37333; }
.page_tags a:nth-child(8n+7) {background-color: #5CB85C; }

/*导航*/
.panel {background-color: var(--classF);border-radius: 6px;padding: 20px 20px;margin-bottom: 20px;}
.main-navbar .main-navbar-tips{margin: 5px;    color: #98a6ad;}
.main-navbar .panel-title {position: relative;margin-bottom: 10px;font-size: 12px;color: #666;}
.main-navbar .panel-title h4{font-size:17px;line-height:25px;}
.main-navbar .panel-title span{font-size:14px;position:absolute;right:0;top:0;line-height:25px;    color: #d6d4d4;}
.main-navbar .card{position: relative;height: 72px;cursor: pointer;border-radius: 4px;padding: 15px;background-color:var(--background);border-radius: 4px;border: 1px solid #e4ecf3;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all 0.3s ease;}
.main-navbar .card .card-body{color:var(--main);}
.main-navbar .card-book{position: relative;/*height: 60px;*/cursor: pointer;padding: 10px;background-color: var(--background);border: 1px solid #e4ecf3;}
.main-navbar .card-book a{color:var(--main);}
.main-navbar .card .iconnew1{position:absolute;top:0;right:0;font-size:36px;line-height:36px;height:36px;    color: #fe4300;}
.main-navbar .card-book .iconnew1{position:absolute;top:0;right:0;font-size:36px;line-height:36px;height:36px;    color: #fe4300;}
.main-navbar .card-book .star{margin-top:5px;}
.main-navbar .card-book:hover{border-color:#000;}
.allstar50, .allstar45, .allstar40, .allstar35, .allstar30, .allstar25, .allstar20, .allstar15, .allstar10, .allstar05, .allstar00{
    display: inline-block;
    *display: inline;
    zoom: 1;
    background: url(../images/ic_rating_s.png) no-repeat;
    background: -webkit-image-set(url(../images/ic_rating_s.png) 1x, url(../images/ic_rating_s@2x.png) 2x) no-repeat;
    background: -moz-image-set(url(../images/ic_rating_s.png) 1x, url(../images/ic_rating_s@2x.png) 2x) no-repeat;
    background: -o-image-set(url(../images/ic_rating_s.png) 1x, url(../images/ic_rating_s@2x.png) 2x) no-repeat;
    background: -ms-image-set(url(../images/ic_rating_s.png) 1x, url(../images/ic_rating_s@2x.png) 2x) no-repeat;
    width: 55px;
    height: 11px;
    margin: 0 3px 0 0;
    overflow: hidden;
}
.allstar50 {background-position: 0 0px}
.allstar45 {background-position: 0 -11px}
.allstar40 {background-position: 0 -22px}
.allstar35 {background-position: 0 -33px}
.allstar30 {background-position: 0 -44px}
.allstar25 {background-position: 0 -55px}
.allstar20 {background-position: 0 -66px}
.allstar15 {background-position: 0 -77px}
.allstar10 {background-position: 0 -88px}
.allstar05 {background-position: 0 -99px}
.allstar00 {background-position: 0 -110px}


.main-navbar .items{padding-top:10px;}
.main-navbar .hidden{height: 270px;overflow: hidden;position: relative;transition: height .24s;}
.main-navbar .hidden:after{content: "";position: absolute;bottom: 0;display: block;width: 100%;height: 50px; background: -moz-linear-gradient(to bottom,rgba(255,255,255,0),#fff); background: -webkit-linear-gradient(to bottom,rgba(255,255,255,0),#fff); background: linear-gradient(to bottom,rgba(255,255,255,0),#fff);}
html[data-night='night'] .main-navbar .hidden:after {
    background: -moz-linear-gradient(to bottom,rgba(0,0,0,0),#26262a);
    background: -webkit-linear-gradient(to bottom,rgba(0,0,0,0),#26262a);
    background: linear-gradient(to bottom,rgba(0,0,0,0),#26262a);
}
.main-navbar .card:hover {transform: translateY(-6px); -webkit-transform: translateY(-6px); -moz-transform: translateY(-6px); box-shadow: 0 5px 15px -5px rgba(0, 36, 100, 0.3); -webkit-box-shadow: 0 5px 15px -5px rgba(0, 36, 100, 0.3); -moz-box-shadow: 0 5px 15px -5px rgba(0, 36, 100, 0.3); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
.main-navbar .card a{display:block;}
.main-navbar .card-icon{float: left;display: block;margin-right: 10px;}
.main-navbar .card-body p {font-size: 12px;color: #999;margin-bottom: 0px;line-height:18px;height:18px;}
.overflowClip_1 {overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;}
.overflowClip_2 {overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;white-space: nowrap;}
.more-nav-btn{display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;cursor: pointer;    padding-bottom: 15px;padding-top: 10px;color:var(--main);}
.main-navbar .sousuo {padding: 35px 0 25px 0;}
.main-navbar .search {position: relative;width: 100%;margin: 0 auto;}
.main-navbar .search-box {position: relative;}
.main-navbar .search-icon{position: absolute; left: 3px; top: 5px; width: 40px; height: 40px; overflow: hidden; border-radius: 25px; cursor: pointer; opacity: 0; }
.main-navbar .search-input {width: 100%; height: 50px; line-height: 50px; font-size: 16px; color: #999; border: none; outline: none; padding-left: 45px; border: 1px solid #e6e6e6; border-radius: 10px; }
.main-navbar .search-btn {position: absolute; right: 0; top: 0; width: 50px; line-height: 48px; background: transparent; border: none; font-size: 25px; color: #ddd; font-weight: bold; outline: none; padding: 0 10px; }
.main-navbar .search-input:focus{outline: none; border: 1px solid #2188ff; -webkit-box-shadow: 0 0 5px 0px rgba(71, 158, 245, 0.5); box-shadow: 0 0 5px 0px rgba(71, 158, 245, 0.5); }
.main-navbar input::-webkit-input-placeholder{font-size: 14px; letter-spacing: 1px; color: #ccc; }
.main-navbar #search-clear {font-weight: bold;font-size: 20px;position: absolute;top: 24px;right: 43px;width: 20px;height: 20px;line-height: 20px;text-align: center;margin-top: -10px;color: #e5dfdd;cursor: pointer;}
.main-navbar #search-clear:hover {color: #6b7184; }
.main-navbar .search-btn{cursor: pointer;}
.main-navbar .search-btn i {    font-size: 24px;margin: 0;}
.main-navbar .search-btn:hover {color: #6b7184; }
.main-navbar .search-engine{position: absolute; top: 60px; left: 0; width: 100%; background: #FFF; padding: 15px 0 0 15px; border-radius: 5px; box-shadow: 0px 5px 20px 0px #d8d7d7; transition: all 0.3s; -moz-transition: all 0.3s;-webkit-transition: all 0.3s;-o-transition: all 0.3s;display: none;z-index: 999}
.main-navbar .search-engine-head {overflow: hidden; margin-bottom: 10px; padding-right: 15px; }
.main-navbar .search-engine-tit{float: left; margin: 0; font-size: 14px; color: #999; }
.main-navbar .search-engine-tool{float: right; font-size: 12px; color: #999; }
.main-navbar .search-engine ul::before{content: ''; width: 0px; height: 0px; position: absolute; top: -15px; border-top: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 8px solid #fff; border-left: 8px solid transparent; }
.main-navbar .search-engine-list::after{content: ''; width: 90px; height: 20px; position: absolute; top: -20px; left: 1px; }
.main-navbar .search-engine-list li{float: left; width: 30%; line-height: 30px; font-size: 14px; padding: 5px 10px 5px 10px; margin: 0 10px 10px 0; background: #f9f9f9; color: #999; cursor: pointer }
.main-navbar .search-engine-list li:hover{background:#c7c7c7;color:#fff;}
.main-navbar .search-engine-list li span{width: 25px; height: 25px; border-radius: 15px; float: left; margin-right: 5px; margin-top: 2.5px; }
.main-navbar .search-hot-text {position: absolute;z-index: 100;width: 100%;border-radius: 0 0 10px 10px;background: #FFF;box-shadow: 0px 4px 5px 0px #cccccc94;overflow: hidden;}
.main-navbar .search-hot-text ul {margin: 0;padding: 5px 0;}
.main-navbar .search-hot-text ul li{border-top: 1px solid #f2f2f2;line-height: 30px;font-size: 14px;padding: 0px 25px;color: #777;cursor: pointer;}
.main-navbar .search-hot-text ul li.current{background: #f1f1f1;color: #2196f3;}
.main-navbar .search-hot-text ul li:hover{background: #f1f1f1;color: #2196f3;cursor: pointer;}
.main-navbar .search-hot-text ul li span{display: inline-block;width: 20px;height: 20px;font-size: 12px;line-height: 20px;text-align: center;background: #e5e5e5;margin-right: 10px;border-radius: 10px;color: #999;}

/*工具*/
.joe_action {position: fixed;bottom: 90px;right: 30px;z-index: 333}
.joe_action_item {position: relative;display: flex;align-items: center;justify-content: center;width: 40px;height: 40px;background: var(--background);border-radius: 50%;cursor: pointer;margin-top: 15px;box-shadow: 0 0 10px rgba(0,0,0,0.1),0 5px 20px rgba(0,0,0,0.2)}
.joe_action_item svg {position: absolute;width: 25px;height: 25px;fill: var(--theme)}
.joe_action_item.scroll {visibility: hidden;-webkit-transform: scale(0);transform: scale(0);transition: visibility 0.35s, -webkit-transform 0.35s;transition: visibility 0.35s, transform 0.35s;transition: visibility 0.35s, transform 0.35s, -webkit-transform 0.35s}
.joe_action_item.scroll.active {visibility: visible;-webkit-transform: scale(1);transform: scale(1)}
.joe_action_item.mode svg {-webkit-transform: scale(0);transform: scale(0);opacity: 0;transition: opacity 0.85s, -webkit-transform 0.85s;transition: transform 0.85s, opacity 0.85s;transition: transform 0.85s, opacity 0.85s, -webkit-transform 0.85s}
.joe_action_item.mode svg.active {-webkit-transform: scale(1);transform: scale(1);opacity: 1}

/*昼夜交换*/
#sky {content:"";position:fixed;left:0;right:0;top:0;bottom:0;z-index: 999999999;background-image: linear-gradient(to top, #fddb92 0, #d1fdff 80%) }
#sky:before {content:""; position: fixed; left: 0; right: 0; top: 0; bottom: 0; background-image  : linear-gradient(to top, #30cfd0 0, #330867 100%); opacity: 0; transition:opacity 2s ease-out; }
html[data-night='night'] #sky:before {opacity: 1; }
#sky .planet {position: fixed; left: -50%;top:-50%; width:200%;height: 200%;-webkit-animation: rotate 2s cubic-bezier(.7, 0, 0, 1); animation: rotate 2s cubic-bezier(.7, 0, 0, 1);transform-origin:center bottom }
@-webkit-keyframes rotate {
    from {transform: rotate(0)}
    to {transform: rotate(360deg)}
}
@keyframes rotate {
    from {transform: rotate(0)}
    to {transform: rotate(360deg)}
}
@-webkit-keyframes slideUpBigIn {
    0% {opacity: 0;transform: translateY(80px)}
    100% {opacity: 1;transform: translateY(0)}
}
@keyframes slideUpBigIn {
    0% { opacity: 0;transform: translateY(80px)}
    100% {opacity: 1;transform: translateY(0)}
}

html[data-night='night'] #sky .sun {opacity: 0 }
html[data-night='night'] #sky .moon {opacity: 1 }
#sky .moon, #sky .sun {position: absolute; border-radius: 100%; left: 40%; top: 35% }
#sky .sun {height: 64px; width: 64px; background: #ffee94; box-shadow: 0 0 40px #ffee94; opacity   : 1 }
#sky .moon {position: absolute; border-radius: 100%; height: 50px; width: 50px; box-shadow   : -1.3em 0.5em 0 0.3em #fff; opacity: 0 }
#sky .body {display: block;position: absolute;bottom: -20px;height: 140px;width: 135px;left: 50%;margin-left: -70px;background: #777;transition: all .25s ease-in-out;-webkit-animation: slideUpBigIn 1s;animation: slideUpBigIn 1s;}
#sky .body:after,#sky .body:before {position: absolute; content: "";width: 0;height: 0;border-bottom: 20px solid #777;top: -20px;transition: all .25s ease-in-out}
#sky .body:before {border-left: 0 solid transparent;border-right: 30px solid transparent;left: 0}
#sky .body:after {border-right: 0 solid transparent;border-left: 30px solid transparent;right: 0}
#sky .body .eyes {display: block;position: absolute;background: #ffee94;height: 40px;width: 40px;border-radius: 100%;bottom: 80px}
#sky .body .eyes.left {left: 12px}
#sky .body .eyes.right {right: 12px}
#sky .body .eyes .pupil,#sky .body .nose {display: block;position: relative;background: #ffb399;border-radius: 100%;margin: 0 auto;}
#sky .body .eyes .pupil {height: 100%;width: 5px;transition: width 1s .5s ease-in-out;}
#sky .body .nose {top: 45px;height: 10px;width: 10px}
html[data-night='night'] #sky .body {
    background: #444
}
html[data-night='night'] #sky .body:before {
    border-bottom: 20px solid #444
}
html[data-night='night'] #sky .body:after {
    border-bottom: 20px solid #444
}
html[data-night='night'] #sky .body .eyes .pupil {
    height: 90%;
    width: 34px;
    margin: 5% auto
}



/* 自适应布局 */
@media (min-width: 1200px) {

}
@media (min-width: 768px) {
   .main-navbar .search {width: 700px;}
   .main-navbar .search-engine-list li {width: 122px;margin: 0 15px 15px 0;}
   .main-navbar .search-hot-text {width: calc(100% - 20px);margin-left: 10px;}
}
@media (max-width: 1200px) {
    .layui-main {width: 100%; }
    .component .layui-input {width: 140px; } }

@media (max-width: 992px) {
    .layui-main {width: 100%; }
    .component .input {width: 82%; }
    .component .layui-input {width: 100%; }
}
@media (max-width: 768px) {
    #he-plugin-simple{display:none;}
    .header .layui-nav .layui-nav-more {display: none!important; }
    .header .layui-nav .layui-nav-mored {display: none!important; }
    .header .layui-nav .layui-nav-item i{font-size:24px; }
    .header .layui-nav .layui-nav-item dl dd a {color:#000; padding-left: 10px; padding-right: 10px }
    .nav-btn .layui-nav-child {left: auto; right: 0; }
    .list-card .list-pic {width: 100%; /* height: 100%; */ line-height: 200px; margin-bottom: 10px }
    .tags-text {font-size: 12px }
    .page-text a {margin-top: 10px }
    .title-article {padding: 15px }
    .title-article .title-right {position: initial; height: 100% !important; text-align: center; margin-top: 10px; margin-bottom: 10px; background: none }
    .title-article .title-msg span {font-size: 12px }
    .relates ul li {width: 100% }
    .about-life .t-u {margin-top: 50px }
    .about-life .t-u img {height: 100px }
    .about-life .t-t {margin-left: 116px }
    .about-life .t-t h1 {margin: 0 }
    .about-life .t-d {display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; max-height: 60px }
    .about-life .t-i {margin: 0 }
    .table-box {max-width: 100%;overflow-x: auto;}
}