博客定制CSS代码

*,.Cal{padding:0}::-webkit-scrollbar{width:3px}::-webkit-scrollbar-track{width:3px;background-color:#f9f9f9}::-webkit-scrollbar-thumb{background-color:#999;background-clip:padding-box;min-height:100px}::-webkit-scrollbar-thumb:hover{background-color:#555}#blogTitle h1 a:hover,a:active{color:#5c8ec6}#mainContent,#sideBar,#topics{text-overflow:ellipsis;overflow:hidden}#BlogPostCategory a{background:#e8a258}#EntryTag{margin-top:20px}#EntryTag a{background:#6fa3ef}#EntryTag a span,#BlogPostCategory a span{margin-right:3px}.topicListFooter{text-align:right;margin-right:10px;margin-top:10px}#navList a,.dayTitle,button{text-align:center}#home,.inner{margin:0 auto}#divRefreshComments{margin-right:10px;font-size:9pt}*{margin:0}html{height:100%;font-size:62.5%;-webkit-tap-highlight-color:transparent}body{background-color:#fff;font-size:12px;font-family:Merriweather,"Open Sans","Microsoft Jhenghei","Microsoft Yahei",sans-serif;color:#3a4145;-moz-font-feature-settings:'kern' 1;-o-font-feature-settings:'kern' 1;overflow:hidden}::-moz-selection{background:#d6edff}::selection{background:#d6edff}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}li{list-style:none}a{outline:0;color:#5c8ec6}a:link,a:visited{color:#5c8ec6;text-decoration:none}a:hover{color:#f60;text-decoration:none}a:active{text-decoration:none}.clear{clear:both}button{width:auto;display:inline-block;padding:.1rem 1.5rem;cursor:pointer;outline:0;text-decoration:none;color:#fff;font-family:'Open Sans',sans-serif;font-size:11px;line-height:13px;font-weight:300;letter-spacing:1px;text-transform:uppercase;text-shadow:none;border-radius:.3rem;border:.1em solid rgba(0,0,0,.05);background:#5ba4e5}b{font-weight:400}#home{width:70%;max-width:900px;background-color:rgba(255,255,255,.9);padding:0 20px 30px;box-shadow:0 0 20px 10px rgba(220,220,220,.3)}#header{padding-bottom:5px;margin-top:10px}#blogTitle{height:60px;clear:both}#blogTitle h1{font-size:26px;font-weight:700;line-height:1.5em;margin-top:20px}#blogTitle h1 a{color:#515151}#blogTitle h2{font-weight:400;font-size:13px;line-height:1.846153846;color:#757575;float:left}#blogLogo{float:right}#navigator{font-size:13px;border-bottom:1px solid #ededed;border-top:1px solid #ededed;height:50px;clear:both;margin-top:25px}#blog-calendar td,#blog-calendar th,.Cal,.btn_my_zzk,.dayTitle{font-size:12px}#navList{min-height:30px;float:left}#navList li{float:left;margin:0 40px 0 0}#navList a{display:block;width:5em;height:22px;float:left;padding-top:19px}#navList a:active,#navList a:link,#navList a:visited{color:#6a6a6a;font-weight:700}#navList a:hover{color:#000;text-decoration:none}.blogStats{float:right;color:#757575;margin-top:19px;margin-right:2px;text-align:right}#main{margin-top:30px}#main{width:100%;text-align:left}#mainContent .forFlow{float:none;width:auto}#mainContent{min-height:200px;padding:0 0 10px;-o-text-overflow:ellipsis;float:none;margin:auto;width:100%}.day,.entrylistItem:not(:last-of-type){min-height:10px;border-bottom:#e9e9e9 1px solid}.day:after,.entrylistItem:not(:last-of-type):after{content:"";width:7px;height:7px;bottom:-5px;left:50%}.day{position:relative;margin:3.5rem auto;padding-bottom:3.3rem;word-wrap:break-word}.c_b_p_desc_readmore{display:block;background:0;border:0;border-bottom:2px solid #666;font-size:16px;padding:0;transition-property:border;font-weight:600;width:85px;text-align:center;color:#555!important;margin-top:20px}.btn_my_zzk,.day:after,.dayTitle{position:absolute}.day:after{display:block;border:1px solid #e9e9e9;margin-left:-5px;background:#FFF;border-radius:100%;box-shadow:rgba(255,255,255,.7) 0 0 0 5px}.dayTitle{display:none;border:1px solid #5c8ec6;background:azure;border-radius:50%;height:65px;line-height:1.5;margin:15px 15px 15px -100px;width:63px;clear:both;top:-15px}.entrylistPostSummary,.postCon{font-feature-settings:'liga' 1,'onum' 1,'kern' 1;line-height:1.7em;word-wrap:break-word}.dayTitle a{display:inline-block;color:#5c8ec6;margin-top:15px;width:60px}.postCon,.postDesc,.postSeparator,.postTitle{width:100%;clear:both}.postTitle{font-size:20px;float:right}.postTitle a:active,.postTitle a:visited{color:#4a4a4a;transition:color .3s ease}.postTitle a:link{background-color:rgba(0,0,0,0);color:#4a4a4a;font-family:"Open Sans","Microsoft Jhenghei","Microsoft Yahei",sans-serif;font-size:3.1rem;font-weight:700;letter-spacing:-1px;transition-delay:0s;transition-duration:.3s;transition-property:color;transition-timing-function:ease;word-wrap:break-word;-webkit-tap-highlight-color:transparent}#topics .postTitle a:link{text-shadow:0 3px 6px rgba(0,0,0,.3)}.postTitle a:hover{color:#000}.postCon,.entrylistPostSummary{padding:25px 0 10px 0;color:#3a4145;font-family:Noto Sans SC,serif;margin:0;text-align:justify;font-size:1.45em;display:block;-webkit-margin-before:0;-webkit-margin-after:0;-webkit-margin-start:0;-webkit-margin-end:0}.postMeta{font-size:14px;color:#888;position:relative;top:10px;display:inline-block}.postMeta>i{font-size:15px;margin:0 5px}.postMeta>i:not(:first-child){margin-left:10px}.postDesc{float:left;text-align:left;padding-right:5px;margin:0;font-family:"Open Sans",sans-serif;font-size:1.4rem;line-height:2.2rem;color:#9eabb3;display:none}p.article-info-text>.postMeta{font-size:16px;font-weight:700;color:rgba(255,255,255,.8);font-family:Noto Sans SC,serif;text-shadow:0 3px 6px rgba(0,0,0,.5)}p.article-info-text>.postMeta i{font-size:16px}.postDesc a:active,.postDesc a:link,.postDesc a:visited{color:#666}.postDesc a:hover{color:#5c8ec6;text-decoration:none}.postSticky{display:inline-block;background:#6fa3ef;font-size:14px;color:#fff;padding:1px 3px;border-radius:3px;position:relative;top:-6px}.postSeparator{height:1px;float:right;margin:0 auto 15px}#sideBar{margin-top:-15px;width:230px;padding:0 0 0 5px;float:right;-o-text-overflow:ellipsis}#sideBar a{color:#757575}#sideBar a:hover{color:#5c8ec6;text-decoration:underline}.div_my_zzk{width:175px;position:relative;margin-top:10px}#btnZzk{background:url(images/blog_search.png) 5px 5px no-repeat}#widget_my_google input[type=button]{background:url(images/google_search.png) 5px 5px no-repeat}.input_my_zzk{border:1px solid #3b3b3b;border-radius:3px;width:90%;height:30px;padding-left:5px;outline:0;background:#000;color:#ccc}#sb_widget_my_zzk{width:100%;text-align:center}.btn_my_zzk{width:25px;height:25px;color:transparent;border:0;cursor:pointer;top:1px;right:-35px}.input_my_zzk:focus,.input_my_zzk:hover{border:1px solid #666}.input_my_zzk:hover{transition:all .4s linear 0s}.catList,.catListArticleArchive,.catListArticleCategory,.catListBlogRank,.catListComment,.catListEssay,.catListFeedback,.catListImageCategory,.catListLink,.catListNoteBook,.catListPostArchive,.catListPostCategory,.catListTag,.catListView,.mySearch,.newsItem{background:#fff;margin-bottom:35px;word-wrap:break-word}#blog-calendar{margin:10px 5px 5px 10px;visibility:hidden}#blog-calendar td{font-family:"Comic Sans MS";text-align:center}#calendar{width:228px;padding-bottom:5px;margin-bottom:35px;border:1px solid #ededed;box-shadow:0 1px 3px #ccc}.calendar{border:0 solid #000}#calendar .Cal{width:100%;line-height:1.5em}#calendar td{font-family:"Comic Sans MS";background:#FFF;padding-top:2px}.Cal{border:0;color:#666;width:100%;font-family:arial}.CalOtherMonthDay,.CalWeekendDay{padding-top:4px;padding-bottom:4px}#calendar table a:active,#calendar table a:link,#calendar table a:visited{font-weight:700}#calendar table a:hover{color:#fff;text-decoration:none}.CalTodayDay{color:#b8b8b8;font-weight:700;background:#2d2d2b}.CalWeekendDay{background:#111}.CalOtherMonthDay{color:#3c3c3c}#calendar .CalNextPrev a:active,#calendar .CalNextPrev a:link,#calendar .CalNextPrev a:visited{font-weight:700;padding-left:10px;padding-right:15px}.CalDayHeader{font-weight:700;background:#111;padding-bottom:5px}.CalTitle{background:#6293bb;width:100%;height:30px;text-align:center;font-size:14px;font-weight:700;padding:5px 0}.CalTitle td{background:#000;font-family:verdana;font-size:12px;font-weight:700}.Cal td{height:20px;font-size:10px}.Cal a:active,.Cal a:link,.Cal a:visited{color:#ff9;text-decoration:underline}.Cal a:hover{text-decoration:none}.CalSelector{background:#efefef}.catListTitle{font-weight:700;line-height:1.2;font-size:110%;margin-top:15px;margin-bottom:10px;text-align:left}#sideBarMain ul,.catListComment,.page-description,.pfl_feedback_area_title{line-height:1.5em}.divRecentComment{text-indent:2em;color:#494949;margin-bottom:20px}#sideBarMain li{line-height:1.8}#topics{width:100%;min-height:200px;padding:0 0 10px;-o-text-overflow:ellipsis;margin:4rem auto;font-family:-apple-system,SF UI Text,Arial,PingFang SC,Hiragino Sans GB,Microsoft YaHei,WenQuanYi Micro Hei,sans-serif;margin-top:15px}#topics .postTitle{border:0;font-size:130%;font-weight:700;line-height:1.5;width:100%;padding-left:5px}#BlogPostCategory,#BlogPostCategory a:active,#BlogPostCategory a:link,#BlogPostCategory a:visited,#EntryTag,#EntryTag a:active,#EntryTag a:link,#EntryTag a:visited{color:#666}#BlogPostCategory a,#EntryTag a{height:20px;line-height:20px;color:#fff!important;padding:3px 5px;border-radius:3px;margin:2px 5px 0;text-decoration:none;font-size:14px}#BlogPostCategory a:hover,#EntryTag a:hover{transition:all .3s linear 0s;opacity:.8}#topics .postDesc{padding-left:0;width:100%;text-align:left;color:#666;margin-top:5px;background:0}.feedback_area_title{font:normal normal 16px/35px "Microsoft YaHei";margin:10px 0 30px}.louzhu{margin:0 2px}.feedbackListSubtitle a:active,.feedbackListSubtitle a:link,.feedbackListSubtitle a:visited{color:#777;font-weight:700}.feedbackListSubtitle a:hover{color:#5c8ec6;text-decoration:underline}.feedbackListSubtitle b{color:#5c8ec6}.feedbackListSubtitle:before{position:absolute;top:11px;right:100%;left:-16px;display:block;width:0;height:0;pointer-events:none;content:" ";border-color:transparent;border-style:solid solid outset;border-width:8px;border-right-color:#d1d5da}.feedbackListSubtitle:after,.feedbackListSubtitle-louzhu:after{position:absolute;top:11px;right:100%;left:-16px;display:block;width:0;height:0;pointer-events:none;content:" ";border-color:transparent;border-style:solid solid outset;margin-top:1px;margin-left:2px;border-width:7px}.feedbackListSubtitle:after{border-right-color:#f6f8fa}.feedbackListSubtitle-louzhu:after{border-right-color:#f1f8ff!important}.feedbackManage{width:200px;text-align:right;float:right}.feedbackCon{padding:10px 20px;min-height:35px;line-height:1.5;border:1px solid #d1d5da;border-top:0;background:#fff;position:relative}.feedbackListSubtitle-louzhu{background-color:#f1f8ff!important;border-bottom-color:#c0d3eb!important}.feedbackItem{position:relative;padding:15px 0 15px 60px;margin:0;font-size:13px}.feedbackItem:before{position:absolute;top:0;bottom:0;left:90px;display:block;z-index:0;width:2px;content:"";background-color:#e1e4e8}.feedbackAvatar{position:absolute;left:1px}.feedbackAvatar img{width:40px;height:40px;border:1px solid #d1d5da;padding:2px;border-radius:3px}div#tbCommentBodyPreview{border:0}#divRefreshComments{text-align:right;margin-bottom:10px}.commenttb{padding:8px;margin-bottom:10px;color:#555;border:1px solid #ddd;border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;width:320px}.commentTextBox:hover,.commenttb:hover{color:#333;border-color:rgba(82,168,236,.8);transition:all .4s linear 0s}.commenttb:hover{outline:0;-webkit-box-shadow:inset 1px 1px 1px rgba(0,0,0,.075),0 0 4px rgba(82,168,236,.6);-moz-box-shadow:inset 1px 1px 1px rgba(0,0,0,.075),0 0 4px rgba(82,168,236,.6);box-shadow:inset 1px 1px 1px rgba(0,0,0,.075),0 0 4px rgba(82,168,236,.6)}#Profile1_panelAdd input[type=text]:hover,#Profile1_txtContent:hover,.commentTextBox:hover{-webkit-box-shadow:inset 1px 1px 1px rgba(0,0,0,.075),0 0 4px rgba(82,168,236,.6);-moz-box-shadow:inset 1px 1px 1px rgba(0,0,0,.075),0 0 4px rgba(82,168,236,.6);outline:0}.commentTextBox{width:410px!important;margin-top:10px;margin-bottom:10px}.commentTextBox:hover{box-shadow:inset 1px 1px 1px rgba(0,0,0,.075),0 0 4px rgba(82,168,236,.6)}#AjaxHolder_PostComment_btnSubmit{padding:8px 20px;text-align:center;font-size:14px;color:#fff;border:0;background:#5c8ec6;border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;-webkit-transition:all .4s ease;-moz-transition:all .4s ease;-o-transition:all .4s ease;-ms-transition:all .4s ease;transition:all .4s ease;cursor:pointer;display:inline-block;vertical-align:middle;outline:0;text-decoration:none}#AjaxHolder_PostComment_btnSubmit:hover{background:#333}#AjaxHolder_PostComment_divCommnentArea tr{margin-top:10px;margin-bottom:10px}.comment_vote{padding-right:10px}.comment_vote a{color:#999}.comment_vote a:hover{color:#5c8ec6}#commentform_title{font:normal normal 16px/35px "Microsoft YaHei";margin:0;background-image:none;padding:0}#comment_form_container .author{padding-left:10px;color:#555;border:1px solid #ddd;border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;width:320px;height:20px;background-image:none}#comment_form_container p{font-size:14px;margin-bottom:20px}.commentbox_title_left{font-size:14px}#comment_form_container .comment_textarea{font-size:13px;padding:8px;margin-bottom:10px;color:#555;border:1px solid #ddd;border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;min-height:250px;width:100%;height:100%}#comment_form_container .comment_textarea:hover{border-color:#5c8ec6;outline:0;transition:all .4s linear 0s}#comment_form_container .comment_textarea:focus{outline:0}.commentbox_tab:hover,.commentbox_tab.active{border-bottom:0;color:#5c8ec6}.comment_btn{border:0;background-color:#5c8ec6}.comment_btn:hover{background:#71ace5}.PostListTitle,.entrylistTitle,.thumbTitle{height:38px;line-height:38px;font:normal normal 16px/35px "Microsoft YaHei";margin:10px 0 30px;background-image:none;padding:0}.dev__developer,.entrylistPosttitle a:active,.entrylistPosttitle a:link,.entrylistPosttitle a:visited{font-family:"Open Sans","Microsoft Jhenghei","Microsoft Yahei",sans-serif}.entrylistDescription{color:#666;text-align:right;padding-top:5px;padding-bottom:5px;padding-right:10px;margin-bottom:10px}.entrylistItem{position:relative;margin:3.5rem auto;padding-bottom:3.3rem;word-wrap:break-word}.entrylistItem:after{display:block;border:1px solid #e7eef2;position:absolute;margin-left:-5px;background:#FFF;border-radius:100%;box-shadow:#FFF 0 0 0 5px}.entrylistPosttitle{font-size:20px;width:100%}.entrylistPosttitle a:active,.entrylistPosttitle a:link,.entrylistPosttitle a:visited{transition:all .4s linear 0s;background-color:rgba(0,0,0,0);color:#4a4a4a;font-size:3.2rem;font-weight:700;letter-spacing:-1px;transition-delay:0s;transition-duration:.3s;transition-property:color;transition-timing-function:ease;word-wrap:break-word;-webkit-tap-highlight-color:transparent}.entrylistPosttitle a:hover{color:#000}.entrylistItemPostDesc,.sb-title{font-family:"Open Sans",sans-serif}.entrylistItemPostDesc{float:left;width:100%;clear:both;text-align:left;padding-right:5px;margin:0;font-size:1.4rem;line-height:2.2rem;color:#9eabb3;display:none}.entrylistItemPostDesc a:active,.entrylistItemPostDesc a:link,.entrylistItemPostDesc a:visited{color:#666}.entrylistItemPostDesc a:hover{color:#5c8ec6}.entrylist .postSeparator{clear:both;width:100%;font-size:0;line-height:0;margin:0;padding:0;height:0;border:0}.divPhoto,.pager{margin-right:10px}.divRecentCommentAticle a{color:#000}.pager{text-align:right;font-size:12px;color:#9eabb3}#nav_next_page a,.pager a{display:inline-block;min-width:18px;text-align:center;border:1px solid #bfc8cd;text-decoration:none;border-radius:4px;color:#9eabb3!important;transition:all .2s ease}#nav_next_page a:active,#nav_next_page a:link,#nav_next_page a:visited,.pager a:active,.pager a:link,.pager a:visited{color:#9eabb3!important}.pager a{padding:0 5px}#nav_next_page a{padding:3px 5px}#nav_next_page a:hover,.pager a:hover{background:#fff;color:#889093;border-color:#98a0a4}.PostList{border-bottom:1px dashed #e9e9e9;clear:both;min-height:1.5em;padding-top:20px;margin-bottom:20px;padding-bottom:20px}.postTitl2{float:left;padding-top:10px;padding-bottom:10px;font-size:14px}.postDesc2{color:#666;float:right}.postText2{clear:both;color:#757575}.pfl_feedback_area_title{text-align:right;font-weight:700;margin-bottom:10px}.pfl_feedbackItem{border:1px dashed #ccc;padding:10px;border-radius:3px;margin-bottom:20px}.pfl_feedbacksubtitle{width:100%;height:1.5em}.pfl_feedbackname{float:left}.commentbox_title_right,.pfl_feedbackManage{float:right}.pfl_feedbackname a{color:#5c8ec6;font-weight:700}.pfl_feedbackCon{color:#000;padding-top:5px;padding-bottom:5px}.pfl_feedbackAnswer{color:#F40;text-indent:2em}.tdSentMessage{text-align:right}.errorMessage{width:300px;float:left}#Profile1_panelAdd input[type=text],#Profile1_txtContent{padding:8px;margin-bottom:10px;color:#555;border:1px solid #ddd;border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px}#Profile1_panelAdd input[type=text]:hover,#Profile1_txtContent:hover{color:#333;border-color:rgba(82,168,236,.8);box-shadow:inset 1px 1px 1px rgba(0,0,0,.075),0 0 4px rgba(82,168,236,.6);transition:all .4s linear 0s}#Profile1_panelAdd input[type=text]:focus,#Profile1_txtContent:focus{outline:0;border-color:rgba(82,168,236,.8)}#Profile1_panelAdd input[type=submit]{padding:8px 20px;text-align:center;font-size:14px;color:#fff;border:0;background:#5c8ec6;border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;-webkit-transition:all .4s ease;-moz-transition:all .4s ease;-o-transition:all .4s ease;-ms-transition:all .4s ease;transition:all .4s ease;cursor:pointer;display:inline-block;vertical-align:middle;outline:0;text-decoration:none}#Profile1_panelAdd input[type=submit]:hover{background:#333}.feedbackListSubtitle{clear:both;align-items:center;color:#586069;flex-direction:row-reverse;background-color:#f6f8fa;border:1px solid #d1d5da;border-bottom:1px solid #d1d5da;border-top-left-radius:3px;border-top-right-radius:3px;padding:10px 20px;position:relative;white-space:nowrap;text-overflow:ellipsis}.divPhoto{border:1px solid #ccc;padding:2px}.thumbDescription{color:#757575;text-align:right;padding-top:5px;padding-bottom:5px;padding-right:10px;margin-bottom:30px}#footer{min-height:100px;position:absolute;margin:20vh 0 0;left:0;right:0;padding:15px 0;color:#888;font-size:12px;line-height:1.5}.my-face{animation:my-face 5s infinite ease-in-out;display:inline-block;margin:0 5px}@-moz-keyframes my-face{2%,24%,80%{-webkit-transform:translate(0,1.5px) rotate(1.5deg);-moz-transform:translate(0,1.5px) rotate(1.5deg);-ms-transform:translate(0,1.5px) rotate(1.5deg);-o-transform:translate(0,1.5px) rotate(1.5deg);transform:translate(0,1.5px) rotate(1.5deg)}4%,68%,98%{-webkit-transform:translate(0,-1.5px) rotate(-.5deg);-moz-transform:translate(0,-1.5px) rotate(-.5deg);-ms-transform:translate(0,-1.5px) rotate(-.5deg);-o-transform:translate(0,-1.5px) rotate(-.5deg);transform:translate(0,-1.5px) rotate(-.5deg)}38%,6%{-webkit-transform:translate(0,1.5px) rotate(-1.5deg);-moz-transform:translate(0,1.5px) rotate(-1.5deg);-ms-transform:translate(0,1.5px) rotate(-1.5deg);-o-transform:translate(0,1.5px) rotate(-1.5deg);transform:translate(0,1.5px) rotate(-1.5deg)}8%,86%{-webkit-transform:translate(0,-1.5px) rotate(-1.5deg);-moz-transform:translate(0,-1.5px) rotate(-1.5deg);-ms-transform:translate(0,-1.5px) rotate(-1.5deg);-o-transform:translate(0,-1.5px) rotate(-1.5deg);transform:translate(0,-1.5px) rotate(-1.5deg)}10%,72%{-webkit-transform:translate(0,2.5px) rotate(1.5deg);-moz-transform:translate(0,2.5px) rotate(1.5deg);-ms-transform:translate(0,2.5px) rotate(1.5deg);-o-transform:translate(0,2.5px) rotate(1.5deg);transform:translate(0,2.5px) rotate(1.5deg)}12%,64%,78%,96%{-webkit-transform:translate(0,-.5px) rotate(1.5deg);-moz-transform:translate(0,-.5px) rotate(1.5deg);-ms-transform:translate(0,-.5px) rotate(1.5deg);-o-transform:translate(0,-.5px) rotate(1.5deg);transform:translate(0,-.5px) rotate(1.5deg)}14%,54%{-webkit-transform:translate(0,-1.5px) rotate(1.5deg);-moz-transform:translate(0,-1.5px) rotate(1.5deg);-ms-transform:translate(0,-1.5px) rotate(1.5deg);-o-transform:translate(0,-1.5px) rotate(1.5deg);transform:translate(0,-1.5px) rotate(1.5deg)}16%{-webkit-transform:translate(0,-.5px) rotate(-1.5deg);-moz-transform:translate(0,-.5px) rotate(-1.5deg);-ms-transform:translate(0,-.5px) rotate(-1.5deg);-o-transform:translate(0,-.5px) rotate(-1.5deg);transform:translate(0,-.5px) rotate(-1.5deg)}18%,22%{-webkit-transform:translate(0,.5px) rotate(-1.5deg);-moz-transform:translate(0,.5px) rotate(-1.5deg);-ms-transform:translate(0,.5px) rotate(-1.5deg);-o-transform:translate(0,.5px) rotate(-1.5deg);transform:translate(0,.5px) rotate(-1.5deg)}20%,36%,46%{-webkit-transform:translate(0,-1.5px) rotate(2.5deg);-moz-transform:translate(0,-1.5px) rotate(2.5deg);-ms-transform:translate(0,-1.5px) rotate(2.5deg);-o-transform:translate(0,-1.5px) rotate(2.5deg);transform:translate(0,-1.5px) rotate(2.5deg)}26%,50%{-webkit-transform:translate(0,.5px) rotate(.5deg);-moz-transform:translate(0,.5px) rotate(.5deg);-ms-transform:translate(0,.5px) rotate(.5deg);-o-transform:translate(0,.5px) rotate(.5deg);transform:translate(0,.5px) rotate(.5deg)}28%{-webkit-transform:translate(0,.5px) rotate(1.5deg);-moz-transform:translate(0,.5px) rotate(1.5deg);-ms-transform:translate(0,.5px) rotate(1.5deg);-o-transform:translate(0,.5px) rotate(1.5deg);transform:translate(0,.5px) rotate(1.5deg)}30%,40%,62%,76%,88%{-webkit-transform:translate(0,-.5px) rotate(2.5deg);-moz-transform:translate(0,-.5px) rotate(2.5deg);-ms-transform:translate(0,-.5px) rotate(2.5deg);-o-transform:translate(0,-.5px) rotate(2.5deg);transform:translate(0,-.5px) rotate(2.5deg)}32%,34%,66%{-webkit-transform:translate(0,1.5px) rotate(-.5deg);-moz-transform:translate(0,1.5px) rotate(-.5deg);-ms-transform:translate(0,1.5px) rotate(-.5deg);-o-transform:translate(0,1.5px) rotate(-.5deg);transform:translate(0,1.5px) rotate(-.5deg)}42%{-webkit-transform:translate(0,2.5px) rotate(-1.5deg);-moz-transform:translate(0,2.5px) rotate(-1.5deg);-ms-transform:translate(0,2.5px) rotate(-1.5deg);-o-transform:translate(0,2.5px) rotate(-1.5deg);transform:translate(0,2.5px) rotate(-1.5deg)}44%,70%{-webkit-transform:translate(0,1.5px) rotate(.5deg);-moz-transform:translate(0,1.5px) rotate(.5deg);-ms-transform:translate(0,1.5px) rotate(.5deg);-o-transform:translate(0,1.5px) rotate(.5deg);transform:translate(0,1.5px) rotate(.5deg)}48%,74%,82%{-webkit-transform:translate(0,-.5px) rotate(.5deg);-moz-transform:translate(0,-.5px) rotate(.5deg);-ms-transform:translate(0,-.5px) rotate(.5deg);-o-transform:translate(0,-.5px) rotate(.5deg);transform:translate(0,-.5px) rotate(.5deg)}52%,56%,60%{-webkit-transform:translate(0,2.5px) rotate(2.5deg);-moz-transform:translate(0,2.5px) rotate(2.5deg);-ms-transform:translate(0,2.5px) rotate(2.5deg);-o-transform:translate(0,2.5px) rotate(2.5deg);transform:translate(0,2.5px) rotate(2.5deg)}58%{-webkit-transform:translate(0,.5px) rotate(2.5deg);-moz-transform:translate(0,.5px) rotate(2.5deg);-ms-transform:translate(0,.5px) rotate(2.5deg);-o-transform:translate(0,.5px) rotate(2.5deg);transform:translate(0,.5px) rotate(2.5deg)}84%{-webkit-transform:translate(0,1.5px) rotate(2.5deg);-moz-transform:translate(0,1.5px) rotate(2.5deg);-ms-transform:translate(0,1.5px) rotate(2.5deg);-o-transform:translate(0,1.5px) rotate(2.5deg);transform:translate(0,1.5px) rotate(2.5deg)}90%{-webkit-transform:translate(0,2.5px) rotate(-.5deg);-moz-transform:translate(0,2.5px) rotate(-.5deg);-ms-transform:translate(0,2.5px) rotate(-.5deg);-o-transform:translate(0,2.5px) rotate(-.5deg);transform:translate(0,2.5px) rotate(-.5deg)}92%{-webkit-transform:translate(0,.5px) rotate(-.5deg);-moz-transform:translate(0,.5px) rotate(-.5deg);-ms-transform:translate(0,.5px) rotate(-.5deg);-o-transform:translate(0,.5px) rotate(-.5deg);transform:translate(0,.5px) rotate(-.5deg)}94%{-webkit-transform:translate(0,2.5px) rotate(.5deg);-moz-transform:translate(0,2.5px) rotate(.5deg);-ms-transform:translate(0,2.5px) rotate(.5deg);-o-transform:translate(0,2.5px) rotate(.5deg);transform:translate(0,2.5px) rotate(.5deg)}0%,100%{-webkit-transform:translate(0,0) rotate(0);-moz-transform:translate(0,0) rotate(0);-ms-transform:translate(0,0) rotate(0);-o-transform:translate(0,0) rotate(0);transform:translate(0,0) rotate(0)}}@-webkit-keyframes my-face{2%,24%,80%{-webkit-transform:translate(0,1.5px) rotate(1.5deg);-moz-transform:translate(0,1.5px) rotate(1.5deg);-ms-transform:translate(0,1.5px) rotate(1.5deg);-o-transform:translate(0,1.5px) rotate(1.5deg);transform:translate(0,1.5px) rotate(1.5deg)}4%,68%,98%{-webkit-transform:translate(0,-1.5px) rotate(-.5deg);-moz-transform:translate(0,-1.5px) rotate(-.5deg);-ms-transform:translate(0,-1.5px) rotate(-.5deg);-o-transform:translate(0,-1.5px) rotate(-.5deg);transform:translate(0,-1.5px) rotate(-.5deg)}38%,6%{-webkit-transform:translate(0,1.5px) rotate(-1.5deg);-moz-transform:translate(0,1.5px) rotate(-1.5deg);-ms-transform:translate(0,1.5px) rotate(-1.5deg);-o-transform:translate(0,1.5px) rotate(-1.5deg);transform:translate(0,1.5px) rotate(-1.5deg)}8%,86%{-webkit-transform:translate(0,-1.5px) rotate(-1.5deg);-moz-transform:translate(0,-1.5px) rotate(-1.5deg);-ms-transform:translate(0,-1.5px) rotate(-1.5deg);-o-transform:translate(0,-1.5px) rotate(-1.5deg);transform:translate(0,-1.5px) rotate(-1.5deg)}10%,72%{-webkit-transform:translate(0,2.5px) rotate(1.5deg);-moz-transform:translate(0,2.5px) rotate(1.5deg);-ms-transform:translate(0,2.5px) rotate(1.5deg);-o-transform:translate(0,2.5px) rotate(1.5deg);transform:translate(0,2.5px) rotate(1.5deg)}12%,64%,78%,96%{-webkit-transform:translate(0,-.5px) rotate(1.5deg);-moz-transform:translate(0,-.5px) rotate(1.5deg);-ms-transform:translate(0,-.5px) rotate(1.5deg);-o-transform:translate(0,-.5px) rotate(1.5deg);transform:translate(0,-.5px) rotate(1.5deg)}14%,54%{-webkit-transform:translate(0,-1.5px) rotate(1.5deg);-moz-transform:translate(0,-1.5px) rotate(1.5deg);-ms-transform:translate(0,-1.5px) rotate(1.5deg);-o-transform:translate(0,-1.5px) rotate(1.5deg);transform:translate(0,-1.5px) rotate(1.5deg)}16%{-webkit-transform:translate(0,-.5px) rotate(-1.5deg);-moz-transform:translate(0,-.5px) rotate(-1.5deg);-ms-transform:translate(0,-.5px) rotate(-1.5deg);-o-transform:translate(0,-.5px) rotate(-1.5deg);transform:translate(0,-.5px) rotate(-1.5deg)}18%,22%{-webkit-transform:translate(0,.5px) rotate(-1.5deg);-moz-transform:translate(0,.5px) rotate(-1.5deg);-ms-transform:translate(0,.5px) rotate(-1.5deg);-o-transform:translate(0,.5px) rotate(-1.5deg);transform:translate(0,.5px) rotate(-1.5deg)}20%,36%,46%{-webkit-transform:translate(0,-1.5px) rotate(2.5deg);-moz-transform:translate(0,-1.5px) rotate(2.5deg);-ms-transform:translate(0,-1.5px) rotate(2.5deg);-o-transform:translate(0,-1.5px) rotate(2.5deg);transform:translate(0,-1.5px) rotate(2.5deg)}26%,50%{-webkit-transform:translate(0,.5px) rotate(.5deg);-moz-transform:translate(0,.5px) rotate(.5deg);-ms-transform:translate(0,.5px) rotate(.5deg);-o-transform:translate(0,.5px) rotate(.5deg);transform:translate(0,.5px) rotate(.5deg)}28%{-webkit-transform:translate(0,.5px) rotate(1.5deg);-moz-transform:translate(0,.5px) rotate(1.5deg);-ms-transform:translate(0,.5px) rotate(1.5deg);-o-transform:translate(0,.5px) rotate(1.5deg);transform:translate(0,.5px) rotate(1.5deg)}30%,40%,62%,76%,88%{-webkit-transform:translate(0,-.5px) rotate(2.5deg);-moz-transform:translate(0,-.5px) rotate(2.5deg);-ms-transform:translate(0,-.5px) rotate(2.5deg);-o-transform:translate(0,-.5px) rotate(2.5deg);transform:translate(0,-.5px) rotate(2.5deg)}32%,34%,66%{-webkit-transform:translate(0,1.5px) rotate(-.5deg);-moz-transform:translate(0,1.5px) rotate(-.5deg);-ms-transform:translate(0,1.5px) rotate(-.5deg);-o-transform:translate(0,1.5px) rotate(-.5deg);transform:translate(0,1.5px) rotate(-.5deg)}42%{-webkit-transform:translate(0,2.5px) rotate(-1.5deg);-moz-transform:translate(0,2.5px) rotate(-1.5deg);-ms-transform:translate(0,2.5px) rotate(-1.5deg);-o-transform:translate(0,2.5px) rotate(-1.5deg);transform:translate(0,2.5px) rotate(-1.5deg)}44%,70%{-webkit-transform:translate(0,1.5px) rotate(.5deg);-moz-transform:translate(0,1.5px) rotate(.5deg);-ms-transform:translate(0,1.5px) rotate(.5deg);-o-transform:translate(0,1.5px) rotate(.5deg);transform:translate(0,1.5px) rotate(.5deg)}48%,74%,82%{-webkit-transform:translate(0,-.5px) rotate(.5deg);-moz-transform:translate(0,-.5px) rotate(.5deg);-ms-transform:translate(0,-.5px) rotate(.5deg);-o-transform:translate(0,-.5px) rotate(.5deg);transform:translate(0,-.5px) rotate(.5deg)}52%,56%,60%{-webkit-transform:translate(0,2.5px) rotate(2.5deg);-moz-transform:translate(0,2.5px) rotate(2.5deg);-ms-transform:translate(0,2.5px) rotate(2.5deg);-o-transform:translate(0,2.5px) rotate(2.5deg);transform:translate(0,2.5px) rotate(2.5deg)}58%{-webkit-transform:translate(0,.5px) rotate(2.5deg);-moz-transform:translate(0,.5px) rotate(2.5deg);-ms-transform:translate(0,.5px) rotate(2.5deg);-o-transform:translate(0,.5px) rotate(2.5deg);transform:translate(0,.5px) rotate(2.5deg)}84%{-webkit-transform:translate(0,1.5px) rotate(2.5deg);-moz-transform:translate(0,1.5px) rotate(2.5deg);-ms-transform:translate(0,1.5px) rotate(2.5deg);-o-transform:translate(0,1.5px) rotate(2.5deg);transform:translate(0,1.5px) rotate(2.5deg)}90%{-webkit-transform:translate(0,2.5px) rotate(-.5deg);-moz-transform:translate(0,2.5px) rotate(-.5deg);-ms-transform:translate(0,2.5px) rotate(-.5deg);-o-transform:translate(0,2.5px) rotate(-.5deg);transform:translate(0,2.5px) rotate(-.5deg)}92%{-webkit-transform:translate(0,.5px) rotate(-.5deg);-moz-transform:translate(0,.5px) rotate(-.5deg);-ms-transform:translate(0,.5px) rotate(-.5deg);-o-transform:translate(0,.5px) rotate(-.5deg);transform:translate(0,.5px) rotate(-.5deg)}94%{-webkit-transform:translate(0,2.5px) rotate(.5deg);-moz-transform:translate(0,2.5px) rotate(.5deg);-ms-transform:translate(0,2.5px) rotate(.5deg);-o-transform:translate(0,2.5px) rotate(.5deg);transform:translate(0,2.5px) rotate(.5deg)}0%,100%{-webkit-transform:translate(0,0) rotate(0);-moz-transform:translate(0,0) rotate(0);-ms-transform:translate(0,0) rotate(0);-o-transform:translate(0,0) rotate(0);transform:translate(0,0) rotate(0)}}@-o-keyframes my-face{2%,24%,80%{-webkit-transform:translate(0,1.5px) rotate(1.5deg);-moz-transform:translate(0,1.5px) rotate(1.5deg);-ms-transform:translate(0,1.5px) rotate(1.5deg);-o-transform:translate(0,1.5px) rotate(1.5deg);transform:translate(0,1.5px) rotate(1.5deg)}4%,68%,98%{-webkit-transform:translate(0,-1.5px) rotate(-.5deg);-moz-transform:translate(0,-1.5px) rotate(-.5deg);-ms-transform:translate(0,-1.5px) rotate(-.5deg);-o-transform:translate(0,-1.5px) rotate(-.5deg);transform:translate(0,-1.5px) rotate(-.5deg)}38%,6%{-webkit-transform:translate(0,1.5px) rotate(-1.5deg);-moz-transform:translate(0,1.5px) rotate(-1.5deg);-ms-transform:translate(0,1.5px) rotate(-1.5deg);-o-transform:translate(0,1.5px) rotate(-1.5deg);transform:translate(0,1.5px) rotate(-1.5deg)}8%,86%{-webkit-transform:translate(0,-1.5px) rotate(-1.5deg);-moz-transform:translate(0,-1.5px) rotate(-1.5deg);-ms-transform:translate(0,-1.5px) rotate(-1.5deg);-o-transform:translate(0,-1.5px) rotate(-1.5deg);transform:translate(0,-1.5px) rotate(-1.5deg)}10%,72%{-webkit-transform:translate(0,2.5px) rotate(1.5deg);-moz-transform:translate(0,2.5px) rotate(1.5deg);-ms-transform:translate(0,2.5px) rotate(1.5deg);-o-transform:translate(0,2.5px) rotate(1.5deg);transform:translate(0,2.5px) rotate(1.5deg)}12%,64%,78%,96%{-webkit-transform:translate(0,-.5px) rotate(1.5deg);-moz-transform:translate(0,-.5px) rotate(1.5deg);-ms-transform:translate(0,-.5px) rotate(1.5deg);-o-transform:translate(0,-.5px) rotate(1.5deg);transform:translate(0,-.5px) rotate(1.5deg)}14%,54%{-webkit-transform:translate(0,-1.5px) rotate(1.5deg);-moz-transform:translate(0,-1.5px) rotate(1.5deg);-ms-transform:translate(0,-1.5px) rotate(1.5deg);-o-transform:translate(0,-1.5px) rotate(1.5deg);transform:translate(0,-1.5px) rotate(1.5deg)}16%{-webkit-transform:translate(0,-.5px) rotate(-1.5deg);-moz-transform:translate(0,-.5px) rotate(-1.5deg);-ms-transform:translate(0,-.5px) rotate(-1.5deg);-o-transform:translate(0,-.5px) rotate(-1.5deg);transform:translate(0,-.5px) rotate(-1.5deg)}18%,22%{-webkit-transform:translate(0,.5px) rotate(-1.5deg);-moz-transform:translate(0,.5px) rotate(-1.5deg);-ms-transform:translate(0,.5px) rotate(-1.5deg);-o-transform:translate(0,.5px) rotate(-1.5deg);transform:translate(0,.5px) rotate(-1.5deg)}20%,36%,46%{-webkit-transform:translate(0,-1.5px) rotate(2.5deg);-moz-transform:translate(0,-1.5px) rotate(2.5deg);-ms-transform:translate(0,-1.5px) rotate(2.5deg);-o-transform:translate(0,-1.5px) rotate(2.5deg);transform:translate(0,-1.5px) rotate(2.5deg)}26%,50%{-webkit-transform:translate(0,.5px) rotate(.5deg);-moz-transform:translate(0,.5px) rotate(.5deg);-ms-transform:translate(0,.5px) rotate(.5deg);-o-transform:translate(0,.5px) rotate(.5deg);transform:translate(0,.5px) rotate(.5deg)}28%{-webkit-transform:translate(0,.5px) rotate(1.5deg);-moz-transform:translate(0,.5px) rotate(1.5deg);-ms-transform:translate(0,.5px) rotate(1.5deg);-o-transform:translate(0,.5px) rotate(1.5deg);transform:translate(0,.5px) rotate(1.5deg)}30%,40%,62%,76%,88%{-webkit-transform:translate(0,-.5px) rotate(2.5deg);-moz-transform:translate(0,-.5px) rotate(2.5deg);-ms-transform:translate(0,-.5px) rotate(2.5deg);-o-transform:translate(0,-.5px) rotate(2.5deg);transform:translate(0,-.5px) rotate(2.5deg)}32%,34%,66%{-webkit-transform:translate(0,1.5px) rotate(-.5deg);-moz-transform:translate(0,1.5px) rotate(-.5deg);-ms-transform:translate(0,1.5px) rotate(-.5deg);-o-transform:translate(0,1.5px) rotate(-.5deg);transform:translate(0,1.5px) rotate(-.5deg)}42%{-webkit-transform:translate(0,2.5px) rotate(-1.5deg);-moz-transform:translate(0,2.5px) rotate(-1.5deg);-ms-transform:translate(0,2.5px) rotate(-1.5deg);-o-transform:translate(0,2.5px) rotate(-1.5deg);transform:translate(0,2.5px) rotate(-1.5deg)}44%,70%{-webkit-transform:translate(0,1.5px) rotate(.5deg);-moz-transform:translate(0,1.5px) rotate(.5deg);-ms-transform:translate(0,1.5px) rotate(.5deg);-o-transform:translate(0,1.5px) rotate(.5deg);transform:translate(0,1.5px) rotate(.5deg)}48%,74%,82%{-webkit-transform:translate(0,-.5px) rotate(.5deg);-moz-transform:translate(0,-.5px) rotate(.5deg);-ms-transform:translate(0,-.5px) rotate(.5deg);-o-transform:translate(0,-.5px) rotate(.5deg);transform:translate(0,-.5px) rotate(.5deg)}52%,56%,60%{-webkit-transform:translate(0,2.5px) rotate(2.5deg);-moz-transform:translate(0,2.5px) rotate(2.5deg);-ms-transform:translate(0,2.5px) rotate(2.5deg);-o-transform:translate(0,2.5px) rotate(2.5deg);transform:translate(0,2.5px) rotate(2.5deg)}58%{-webkit-transform:translate(0,.5px) rotate(2.5deg);-moz-transform:translate(0,.5px) rotate(2.5deg);-ms-transform:translate(0,.5px) rotate(2.5deg);-o-transform:translate(0,.5px) rotate(2.5deg);transform:translate(0,.5px) rotate(2.5deg)}84%{-webkit-transform:translate(0,1.5px) rotate(2.5deg);-moz-transform:translate(0,1.5px) rotate(2.5deg);-ms-transform:translate(0,1.5px) rotate(2.5deg);-o-transform:translate(0,1.5px) rotate(2.5deg);transform:translate(0,1.5px) rotate(2.5deg)}90%{-webkit-transform:translate(0,2.5px) rotate(-.5deg);-moz-transform:translate(0,2.5px) rotate(-.5deg);-ms-transform:translate(0,2.5px) rotate(-.5deg);-o-transform:translate(0,2.5px) rotate(-.5deg);transform:translate(0,2.5px) rotate(-.5deg)}92%{-webkit-transform:translate(0,.5px) rotate(-.5deg);-moz-transform:translate(0,.5px) rotate(-.5deg);-ms-transform:translate(0,.5px) rotate(-.5deg);-o-transform:translate(0,.5px) rotate(-.5deg);transform:translate(0,.5px) rotate(-.5deg)}94%{-webkit-transform:translate(0,2.5px) rotate(.5deg);-moz-transform:translate(0,2.5px) rotate(.5deg);-ms-transform:translate(0,2.5px) rotate(.5deg);-o-transform:translate(0,2.5px) rotate(.5deg);transform:translate(0,2.5px) rotate(.5deg)}0%,100%{-webkit-transform:translate(0,0) rotate(0);-moz-transform:translate(0,0) rotate(0);-ms-transform:translate(0,0) rotate(0);-o-transform:translate(0,0) rotate(0);transform:translate(0,0) rotate(0)}}@keyframes my-face{2%,24%,80%{-webkit-transform:translate(0,1.5px) rotate(1.5deg);-moz-transform:translate(0,1.5px) rotate(1.5deg);-ms-transform:translate(0,1.5px) rotate(1.5deg);-o-transform:translate(0,1.5px) rotate(1.5deg);transform:translate(0,1.5px) rotate(1.5deg)}4%,68%,98%{-webkit-transform:translate(0,-1.5px) rotate(-.5deg);-moz-transform:translate(0,-1.5px) rotate(-.5deg);-ms-transform:translate(0,-1.5px) rotate(-.5deg);-o-transform:translate(0,-1.5px) rotate(-.5deg);transform:translate(0,-1.5px) rotate(-.5deg)}38%,6%{-webkit-transform:translate(0,1.5px) rotate(-1.5deg);-moz-transform:translate(0,1.5px) rotate(-1.5deg);-ms-transform:translate(0,1.5px) rotate(-1.5deg);-o-transform:translate(0,1.5px) rotate(-1.5deg);transform:translate(0,1.5px) rotate(-1.5deg)}8%,86%{-webkit-transform:translate(0,-1.5px) rotate(-1.5deg);-moz-transform:translate(0,-1.5px) rotate(-1.5deg);-ms-transform:translate(0,-1.5px) rotate(-1.5deg);-o-transform:translate(0,-1.5px) rotate(-1.5deg);transform:translate(0,-1.5px) rotate(-1.5deg)}10%,72%{-webkit-transform:translate(0,2.5px) rotate(1.5deg);-moz-transform:translate(0,2.5px) rotate(1.5deg);-ms-transform:translate(0,2.5px) rotate(1.5deg);-o-transform:translate(0,2.5px) rotate(1.5deg);transform:translate(0,2.5px) rotate(1.5deg)}12%,64%,78%,96%{-webkit-transform:translate(0,-.5px) rotate(1.5deg);-moz-transform:translate(0,-.5px) rotate(1.5deg);-ms-transform:translate(0,-.5px) rotate(1.5deg);-o-transform:translate(0,-.5px) rotate(1.5deg);transform:translate(0,-.5px) rotate(1.5deg)}14%,54%{-webkit-transform:translate(0,-1.5px) rotate(1.5deg);-moz-transform:translate(0,-1.5px) rotate(1.5deg);-ms-transform:translate(0,-1.5px) rotate(1.5deg);-o-transform:translate(0,-1.5px) rotate(1.5deg);transform:translate(0,-1.5px) rotate(1.5deg)}16%{-webkit-transform:translate(0,-.5px) rotate(-1.5deg);-moz-transform:translate(0,-.5px) rotate(-1.5deg);-ms-transform:translate(0,-.5px) rotate(-1.5deg);-o-transform:translate(0,-.5px) rotate(-1.5deg);transform:translate(0,-.5px) rotate(-1.5deg)}18%,22%{-webkit-transform:translate(0,.5px) rotate(-1.5deg);-moz-transform:translate(0,.5px) rotate(-1.5deg);-ms-transform:translate(0,.5px) rotate(-1.5deg);-o-transform:translate(0,.5px) rotate(-1.5deg);transform:translate(0,.5px) rotate(-1.5deg)}20%,36%,46%{-webkit-transform:translate(0,-1.5px) rotate(2.5deg);-moz-transform:translate(0,-1.5px) rotate(2.5deg);-ms-transform:translate(0,-1.5px) rotate(2.5deg);-o-transform:translate(0,-1.5px) rotate(2.5deg);transform:translate(0,-1.5px) rotate(2.5deg)}26%,50%{-webkit-transform:translate(0,.5px) rotate(.5deg);-moz-transform:translate(0,.5px) rotate(.5deg);-ms-transform:translate(0,.5px) rotate(.5deg);-o-transform:translate(0,.5px) rotate(.5deg);transform:translate(0,.5px) rotate(.5deg)}28%{-webkit-transform:translate(0,.5px) rotate(1.5deg);-moz-transform:translate(0,.5px) rotate(1.5deg);-ms-transform:translate(0,.5px) rotate(1.5deg);-o-transform:translate(0,.5px) rotate(1.5deg);transform:translate(0,.5px) rotate(1.5deg)}30%,40%,62%,76%,88%{-webkit-transform:translate(0,-.5px) rotate(2.5deg);-moz-transform:translate(0,-.5px) rotate(2.5deg);-ms-transform:translate(0,-.5px) rotate(2.5deg);-o-transform:translate(0,-.5px) rotate(2.5deg);transform:translate(0,-.5px) rotate(2.5deg)}32%,34%,66%{-webkit-transform:translate(0,1.5px) rotate(-.5deg);-moz-transform:translate(0,1.5px) rotate(-.5deg);-ms-transform:translate(0,1.5px) rotate(-.5deg);-o-transform:translate(0,1.5px) rotate(-.5deg);transform:translate(0,1.5px) rotate(-.5deg)}42%{-webkit-transform:translate(0,2.5px) rotate(-1.5deg);-moz-transform:translate(0,2.5px) rotate(-1.5deg);-ms-transform:translate(0,2.5px) rotate(-1.5deg);-o-transform:translate(0,2.5px) rotate(-1.5deg);transform:translate(0,2.5px) rotate(-1.5deg)}44%,70%{-webkit-transform:translate(0,1.5px) rotate(.5deg);-moz-transform:translate(0,1.5px) rotate(.5deg);-ms-transform:translate(0,1.5px) rotate(.5deg);-o-transform:translate(0,1.5px) rotate(.5deg);transform:translate(0,1.5px) rotate(.5deg)}48%,74%,82%{-webkit-transform:translate(0,-.5px) rotate(.5deg);-moz-transform:translate(0,-.5px) rotate(.5deg);-ms-transform:translate(0,-.5px) rotate(.5deg);-o-transform:translate(0,-.5px) rotate(.5deg);transform:translate(0,-.5px) rotate(.5deg)}52%,56%,60%{-webkit-transform:translate(0,2.5px) rotate(2.5deg);-moz-transform:translate(0,2.5px) rotate(2.5deg);-ms-transform:translate(0,2.5px) rotate(2.5deg);-o-transform:translate(0,2.5px) rotate(2.5deg);transform:translate(0,2.5px) rotate(2.5deg)}58%{-webkit-transform:translate(0,.5px) rotate(2.5deg);-moz-transform:translate(0,.5px) rotate(2.5deg);-ms-transform:translate(0,.5px) rotate(2.5deg);-o-transform:translate(0,.5px) rotate(2.5deg);transform:translate(0,.5px) rotate(2.5deg)}84%{-webkit-transform:translate(0,1.5px) rotate(2.5deg);-moz-transform:translate(0,1.5px) rotate(2.5deg);-ms-transform:translate(0,1.5px) rotate(2.5deg);-o-transform:translate(0,1.5px) rotate(2.5deg);transform:translate(0,1.5px) rotate(2.5deg)}90%{-webkit-transform:translate(0,2.5px) rotate(-.5deg);-moz-transform:translate(0,2.5px) rotate(-.5deg);-ms-transform:translate(0,2.5px) rotate(-.5deg);-o-transform:translate(0,2.5px) rotate(-.5deg);transform:translate(0,2.5px) rotate(-.5deg)}92%{-webkit-transform:translate(0,.5px) rotate(-.5deg);-moz-transform:translate(0,.5px) rotate(-.5deg);-ms-transform:translate(0,.5px) rotate(-.5deg);-o-transform:translate(0,.5px) rotate(-.5deg);transform:translate(0,.5px) rotate(-.5deg)}94%{-webkit-transform:translate(0,2.5px) rotate(.5deg);-moz-transform:translate(0,2.5px) rotate(.5deg);-ms-transform:translate(0,2.5px) rotate(.5deg);-o-transform:translate(0,2.5px) rotate(.5deg);transform:translate(0,2.5px) rotate(.5deg)}0%,100%{-webkit-transform:translate(0,0) rotate(0);-moz-transform:translate(0,0) rotate(0);-ms-transform:translate(0,0) rotate(0);-o-transform:translate(0,0) rotate(0);transform:translate(0,0) rotate(0)}}.personInfo{margin-bottom:20px}.pages{text-align:right}.postBody{color:#222;font-size:1.55rem;line-height:1.6}.postBody p,.postCon p{margin:0 auto 1em}.postCon a:active,.postCon a:link,.postCon a:visited{color:#9eabb3}.postCon a:hover{color:#98a0a4}.postBody ul,.postCon ul{margin-left:2em}.myposts_title{font-weight:700;text-align:center}#sideBar{font-size:12px}#sideBar h3{font-size:14px}#cnblogs_post_body img{max-width:700px;margin:10px 0}.main-header{display:table;width:100%;height:100vh;max-height:100vh;text-align:center;background-size:cover;overflow:hidden;position:absolute;top:0;left:0;z-index:1;box-shadow:0 1px 2px rgba(150,150,150,.7)}.inner{position:relative;width:80%;max-width:800px;padding:10px}.page-title,.sb-title{letter-spacing:-1px;font-weight:700;color:#fff;-webkit-animation:fade-in-down 1s;animation:fade-in-down 1s both;-webkit-animation-delay:.6s;animation-delay:.5s;text-shadow:0 3px 6px rgba(0,0,0,.3)}.page-title{font-size:5rem;font-family:'Playball',cursive}.sb-title{font-size:3.55rem}.vertical{display:table-cell;vertical-align:middle;width:100%}.page-author,.page-description{margin:0;letter-spacing:.01rem;color:rgba(255,255,255,.8);text-shadow:0 3px 6px rgba(0,0,0,.5);display:none;font-weight:400}.page-description{font-size:2.2rem;-webkit-animation:fade-in-down .9s;animation:fade-in-down .9s both;-webkit-animation-delay:.1s;animation-delay:.3s;-webkit-box-orient:vertical;-webkit-line-clamp:10;overflow:hidden;font-family:'Long Cang',cursive}.page-author{font-size:1.5rem!important;line-height:1.3em;font-family:'Ubuntu Mono',monospace;-webkit-animation:fade-in-down .9s;animation:fade-in-down .9s both;-webkit-animation-delay:.1s;animation-delay:.3s}.scroll-down{display:block;position:absolute;z-index:100;bottom:45px;left:50%;margin-left:-16px;width:34px;height:34px;font-size:34px;text-align:center;-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);-webkit-animation:bounce 4s 2s infinite;animation:bounce 4s 2s infinite;text-decoration:none!important}.scroll-down-icon{color:rgba(255,255,255,.6);font-size:34px!important;position:relative;bottom:7px}.scroll-down:hover{color:#fff;-webkit-animation:none;animation:none}.hidden{text-indent:-9999px;visibility:hidden;display:none}@-webkit-keyframes bounce{0%,10%,25%,40%,50%{-webkit-transform:translateY rotate(-90deg);transform:translateY(0) rotate(-90deg)}20%{-webkit-transform:translateY(-10px) rotate(-90deg);transform:translateY(-10px) rotate(-90deg)}30%{-webkit-transform:translateY(-5px) rotate(-90deg);transform:translateY(-5px) rotate(-90deg)}}@keyframes bounce{0%,10%,25%,40%,50%{-webkit-transform:translateY rotate(-90deg);transform:translateY(0) rotate(-90deg)}20%{-webkit-transform:translateY(-10px) rotate(-90deg);transform:translateY(-10px) rotate(-90deg)}30%{-webkit-transform:translateY(-5px) rotate(-90deg);transform:translateY(-5px) rotate(-90deg)}}@-webkit-keyframes fade-in-down{0%{opacity:0;-webkit-transform:translateY(-10px);transform:translateY(-10px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes fade-in-down{0%{opacity:0;-webkit-transform:translateY(-10px);transform:translateY(-10px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}.menu-button-scroll{background:#222!important;left:-20px!important;width:35px!important}.m-list-title{position:relative;border-bottom:#3b3b3b 1px solid;word-wrap:break-word;margin:24px 0;font-family:Merriweather,"Open Sans","Microsoft Jhenghei","Microsoft Yahei",sans-serif;display:none}.m-list-title-select{color:#888;font-size:22px!important;position:absolute;right:-7px;top:1px}.m-list-title-select:hover{color:#b8b8b8;cursor:pointer}.m-list-title>span{display:block;width:74px;text-align:center;position:absolute;bottom:-9px;left:35%;margin-left:-5px;background:#000;box-shadow:#000 0 0 0 6px;color:#b8b8b8;line-height:20px}.introduce-box{width:100%;position:absolute;top:0;left:0;color:#f5f5f5;z-index:1;opacity:1;height:225px;-webkit-transition:opacity .3s,-webkit-transform .3s;transition:opacity .3s,transform .3s;-webkit-transition-delay:.4s;transition-delay:.4s;outline:0;cursor:pointer;background:url(https://cdn.jsdelivr.net/gh/BNDong/Cnblogs-Theme-SimpleMemory@master/img/webp/me_top_bg.webp) center no-repeat #000;background-size:100%}.introduce-head{width:100%}.introduce-via{margin-top:20px;text-align:center}.introduce-via img{width:70px;height:70px;padding:1px;border:3px solid rgba(255,255,255,.5);border-radius:100%;box-shadow:inset 1px 1px 4px rgba(0,0,0,.3),0 2px 3px rgba(0,0,0,.4);transition:transform 1s ease-out}.introduce-via img:hover{-webkit-transform:rotateZ(360deg);-moz-transform:rotateZ(360deg);-ms-transform:rotateZ(360deg);-o-transform:rotateZ(360deg);transform:rotateZ(360deg)}#introduce{padding-left:85px;margin-top:10px}#introduce a{margin-left:10px;color:#f5f5f5;line-height:20px}#introduce a:hover{color:#fff!important}#introduce a:active,#introduce a:hover,#introduce a:link,#introduce a:visited{text-decoration:none!important}#introduce div{position:absolute;right:10px;bottom:15px;text-align:center;padding:2px 4px;border-radius:3px}#introduce div a{margin:0;padding:0}#introduce div:hover{opacity:.6}.post-del-title{display:none}#cnblogs_post_body h6,blockquote{line-height:20px;margin:0 0 24px;padding:1.45em;color:#313131;background-color:#f7f7f7;font-size:14px;border-left:4px solid #ddd;font-weight:400;border-top:0;border-right:0;border-bottom:0;min-height:0}blockquote p{margin:0!important;padding:0;text-indent:0!important}.titleIcon{position:relative;font-size:34px!important;color:#5d69a5;line-height:50px}#cnblogs_post_body ul{margin-left:20px;margin-top:5px;padding-left:0}.postBody li,.postCon li{list-style-type:disc;margin-bottom:.5em}#commentform_title,.entrylistTitle,.feedback_area_title{border-bottom:0}#commentform_title:after,.entrylistTitle:after,.feedback_area_title:after{content:'';display:block;width:100%;text-align:center;position:relative;bottom:16px;border-bottom:1px dashed #e9e9e9}.entrylistTitle:after{left:200px}#commentform_title:after,.feedback_area_title:after{left:80px}#tbCommentBody{width:100%!important}#rightMenu{position:fixed;bottom:10px;right:5px;min-width:24px;z-index:2;width:40px;text-align:center}#rightMenu i{font-weight:700;text-shadow:1px 1px 1px #fff;font-size:24px}#attention,#rightBuryit,#rightDiggit,#rightDashang,#toUpDown{cursor:pointer;color:#555;opacity:.5;filter:Alpha(opacity=50);-webkit-transition:all .5s ease-out;transition:all .5s ease-out;position:relative}#attention{bottom:3px}#rightBuryit{bottom:5px}#rightDiggit,#rightDashang{bottom:11px}#rightDashang i{font-size:32px;font-weight:500}#attention:hover,#rightBuryit:hover,#rightDiggit:hover,#rightDashang:hover,#toUpDown:hover{opacity:1;filter:Alpha(opacity=100)}.rightMenuSpan{position:absolute;left:-150px;font-size:14px;font-weight:700;width:140px;text-align:right;display:none}.rightDanshanSpan{bottom:-120px}.ds-pay{width:100%;height:100%;text-align:center}.ds-alipay,.ds-wecat{cursor:pointer;text-align:center;width:140px;height:140px;box-shadow:rgba(0,0,0,0.3) 0 2px 7px;border-radius:0 6px 6px 6px;transition:all 1s ease-in-out 0s;margin:3px 0;position:relative;padding:5px;background:#fff}.ds-alipay img,.ds-wecat img{width:100%;height:100%;border-radius:6px}.ds-alipay span,.ds-wecat span{position:absolute;font-family:'Ubuntu Mono',monospace;left:-30px;top:14px;background:#fff;color:#777;padding:3px 6px 6px 6px;box-shadow:rgba(0,0,0,0.1) 0 4px 7px;border-radius:0 0 6px 6px;font-size:.85em;transform:rotate(90deg);-ms-transform:rotate(90deg);-moz-transform:rotate(90deg);-webkit-transform:rotate(90deg);-o-transform:rotate(90deg)}#cnblogs_post_body table td,#cnblogs_post_body table th,.feedbackCon table th,.feedbackCon table td{height:40px;box-sizing:border-box;background-clip:padding-box;display:table-cell;position:relative;border:0;text-overflow:ellipsis;vertical-align:middle}.attentionSpan{top:2px}.rightBuryitSpan{top:0}.rightDiggitSpan{top:7px}.toUpDownSpan{top:3px}#cnblogs_post_body table,.feedbackCon table{position:relative;overflow:hidden!important;box-sizing:border-box;width:96%!important;max-width:96%!important;background-color:#fff;border:1px solid #dfe3ec;font-size:14px;color:#222;margin:0 auto 10px;padding:0;border-right:0;border-bottom:0;display:table!important;border-collapse:initial!important}.feedbackCon table{margin:10px 0}.cnblogs-markdown .cnblogs_code_copy a{top:0}#cnblogs_post_body table tr,.feedbackCon table tr{border:0}#cnblogs_post_body table th,.feedbackCon table th{border-bottom:1px solid #dfe3ec;border-right:1px solid #dfe3ec;background-color:#eef0f6;text-align:left;overflow:hidden;padding:0 18px;min-width:100px}#cnblogs_post_body table td,.feedbackCon table td{border-bottom:1px solid #dfe6ec;border-right:1px solid #dfe3ec;min-width:0;background-color:#fff;padding:0 20px}#cnblogs_post_body>p{margin:10px auto;padding:0 20px;line-height:1.9em;font-family:"Microsoft YaHei",Lato,"PingFang SC",sans-serif;font-size:1.1em;letter-spacing:.015em}#cnblogs_post_body ul li{margin-left:18px}.header__span{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default;position:relative;display:block;margin:0;transition:border-color .3s;padding:0}.header__dev{font-family:Lato,Arial,sans-serif;font-weight:300!important;position:relative;transition-delay:.5s;margin:0!important;color:#222!important;font-size:28px!important;height:50px;line-height:28px!important;left:-20px}.dev__fe,.dev__fe i,.dev__ux,.dev__ux i{width:50px;height:50px;position:absolute}.dev__slash{font-weight:300;position:absolute;z-index:1;-webkit-transform:rotateZ(22deg);transform:rotateZ(22deg)}.header__span .dev__slash{color:#5d69a5;top:8px;left:57px;font-size:35px}.cnblogs_code,.post pre{font-size:14px!important}.dev__fe,.dev__ux{overflow:hidden;-webkit-transform:rotateZ(22deg);transform:rotateZ(22deg)}.dev__fe{text-align:right;direction:rtl;top:-11px;left:11px}.dev__ux{left:64px;top:0;text-align:left}.dev__fe i,.dev__ux i{font-style:normal;line-height:50px;font-weight:400;-webkit-transform:rotateZ(-22deg);transform:rotateZ(-22deg);color:#333}.header__span .dev__fe i{text-indent:-9px;top:13px;right:0}.header__span .dev__ux i{text-indent:-6px;top:2px;left:-3px}.dev__developer{position:absolute;width:75vw;font-weight:700;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.cnblogs_code,.cnblogs_code span,.post pre{font-family:"Source Code Pro",Consolas,Menlo,Monaco,"Courier New",monospace!important;font-weight:400}.header__span .dev__developer{top:12px;left:90px;min-height:34px}.dev__developer,.dev__fe,.dev__fe i,.dev__slash,.dev__ux,.dev__ux i{transition:all .6s cubic-bezier(.555,-.375,0,1.615)}.header__dev--open .dev__fe i{text-indent:5px!important}.header__dev--open .dev__ux i{text-indent:11px!important}.header__dev--open .dev__developer{-webkit-transform:translateX(15px);transform:translateX(15px);opacity:.6}.header__dev--open .dev__slash{-webkit-transform:scale(.9) rotateZ(0);transform:scale(.9) rotateZ(0)}.header__dev--slow .dev__developer,.header__dev--slow .dev__fe,.header__dev--slow .dev__fe i,.header__dev--slow .dev__slash,.header__dev--slow .dev__ux,.header__dev--slow .dev__ux i{transition:all 1.2s cubic-bezier(.555,-.375,0,1.615)}#notHomeTopCanvas{position:absolute}#m-nav-list li{position:relative;overflow:hidden}#header,#leftcontentcontainer,#profile_block,.catListTitle,#comment_nav{display:none!important}#ad_c1,#ad_c2,#ad_t1,#ad_t2,#cnblogs_c1,#cnblogs_c2,#under_post_kb,#under_post_news{display:none}#bottomProgressBar{position:fixed;top:0;left:0;width:100%;z-index:998}span.cnblogs_code{border:0;padding:2px 4px;color:#d83b64;background-color:#f9f2f4;border-radius:3px;position:relative;bottom:1px}.cnblogs_code{line-height:20px;margin:0 auto;background-color:transparent;position:relative;overflow:hidden;border:0}code-box{margin:10px 0}.post pre{padding:10px!important;white-space:pre;word-wrap:normal;margin:5px 15px;border-radius:5px!important}.postBody pre{word-break:break-all;word-wrap:break-word;counter-reset:itemcounter}.postBody pre:not(.hljs){color:#000}.postBody pre .line-numbers-rows{counter-increment:itemcounter;position:absolute;left:-34px;width:30px;text-align:center;color:#999;display:none}.postBody pre .line-numbers-rows:before{content:counter(itemcounter)}.postBody pre .code-pre{position:relative;padding-left:10px;display:block}.postBody pre .code-pre-line{left:30px;border-left:1px solid #999}.code-copay-btn{position:absolute;top:8px;right:23px;display:flex;justify-content:center;align-items:center;width:30px;height:25px;cursor:pointer;font-size:14px;padding:0 0 0 2px;border:0;border-radius:6px;color:#ccc;opacity:0;visibility:hidden;background-color:hsla(0,0%,90.2%,.2);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;transition:opacity .2s ease-in-out,visibility .2s ease-in-out;z-index:1}.cnblogs_code span{font-size:14px!important}.cnblogs_code div{background-color:transparent}.cnblogs_code_collapse{border:0;background-color:#fff;cursor:pointer;color:#d08770;top:1px;font-weight:700;position:relative;font-family:Merriweather,"Open Sans","Microsoft Jhenghei","Microsoft Yahei",sans-serif!important;display:inline}#sideToolbar,.cnblogs_code_copy img,.list .out .icontd{display:none}.cnblogs_code_toolbar{height:0}.cnblogs_code_copy a{background-repeat:no-repeat;display:inline-block;padding:0;margin:0;width:16px;height:16px;position:absolute}.code_img_closed,.code_img_opened{cursor:pointer}.cnblogs_code_toolbar a:active,.cnblogs_code_toolbar a:hover,.cnblogs_code_toolbar a:link,.cnblogs_code_toolbar a:link img,.cnblogs_code_toolbar a:visited,.cnblogs_code_toolbar a:visited img{background-color:transparent!important;border:none!important}.cnblogs-markdown code,.cnblogs-post-body code{background-color:unset!important;border:0!important}.postBody .cnblogs-markdown code:not(.language-env),.postBody .cnblogs-post-body code:not(.language-env){padding:2px 4px!important;color:#d83b64;background-color:#f9f2f4!important;border-radius:3px!important;border:0!important;text-indent:0!important;position:relative;bottom:1px;font-size:13px!important;font-weight:600;font-family:"Ubuntu Mono",monospace!important}#cnblogs_post_body>pre .cnblogs_code_copy a{right:5px}#cnblogs_post_body>pre{margin:10px 15px!important}.my-line-numbers-rows{position:absolute;pointer-events:none;top:10px;left:0;width:45px;letter-spacing:-1px;border-right:1px solid #999;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.my-line-numbers-rows>span{color:#999;display:block;padding-right:.8em;text-align:right}#notHomeTopCanvas{margin:auto;width:100%;height:100%;top:0;bottom:0;left:0;right:0;opacity:.5}#pageAnimationOffOn{z-index:999;position:absolute;top:15px;right:20px;color:rgba(255,255,255,.6);cursor:pointer}#pageAnimationOffOnIcon{display:inline-block;font-weight:bold;font-size:20px}.toc{margin-bottom:30px}.article-info{color:#fff;margin-top:0}.article-info-text{margin-bottom:18px}.article-info-tag{text-decoration:none;display:inline-block;font-size:12px;font-weight:500;letter-spacing:2px;border-radius:3px;text-transform:uppercase;position:relative;background-image:none;box-shadow:none;margin:0 0 0 10px;padding:0 5px;height:22px;line-height:22px;color:#fff;width:fit-content;width:-webkit-fit-content;width:-moz-fit-content}.article-tag-class-color{background-color:#e8a258}.article-tag-color{background-color:#6fa3ef}div#loading,a[name=top]{background-color:#f0f0f0;z-index:1099;position:fixed;top:0;left:0;width:100vw;height:100vh}#evanyou{position:fixed;width:100%;height:100%;top:0;left:0;z-index:-1}.books-item{margin-top:10px}.books-item .books-item-span{width:98%;text-decoration:none;display:-webkit-box;display:flex;align-self:flex-start;-webkit-box-pack:justify;justify-content:space-between;background:rgba(245,245,245,.5);border-radius:3px;box-shadow:3px 3px 3px 1px rgba(220,220,220,.3);border:0;margin-bottom:20px}.books-item .books-item-span ._1P9uD{position:absolute;z-index:2;width:24px;line-height:normal;background-color:rgba(112,83,79,.9);text-align:center;padding:3px 0;border-radius:6px 0 30px}.books-item .books-item-span ._1P9uD._3D3vq{background-color:rgba(206,155,78,.9)}.books-item .books-item-span ._1P9uD._3D3vq ._2aw_6{color:#ffeacc}.books-item .books-item-span ._1P9uD ._2aw_6{display:inline-block;color:#e6d3cf;position:relative;z-index:1}.books-item .books-item-span ._28asT{position:relative;z-index:1;overflow:hidden;margin-right:15px}@media(max-width:600px){.books-item .books-item-span ._1P9uD{font-size:12px}.books-item .books-item-span ._1P9uD ._2aw_6{left:-.02rem;top:-.02rem}.books-item .books-item-span ._28asT{width:100px;height:140px}}@media(min-width:600px){.books-item .books-item-span ._1P9uD{font-size:13px}.books-item .books-item-span ._1P9uD ._2aw_6{left:-2px;top:-2px}.books-item .books-item-span ._28asT{width:95px;height:136px;min-width:95px}}.books-item .books-item-span ._28asT svg{width:100%;height:100%;border-radius:6px}.books-item .books-item-span ._34CGc{-webkit-box-flex:1;flex:1;text-align:left}.books-item .books-item-span ._2girK{display:-webkit-box;display:flex;-webkit-box-align:start;align-items:flex-start;-webkit-box-pack:justify;justify-content:space-between;margin-top:3px}.books-item .books-item-span ._2girK ._1P9dH{color:#555;font-weight:600;margin-bottom:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.books-item .books-item-span ._2girK ._6Y7v3{display:inline-block;width:60px;font-weight:500}@media(max-width:600px){.books-item .books-item-span ._2girK ._1P9dH{font-size:20px;line-height:29px;margin-bottom:2px;width:250px}}@media(min-width:600px){.books-item .books-item-span ._2girK ._1P9dH{font-size:20px;line-height:29px;margin-bottom:3px;width:550px}}.books-item .books-item-span ._2girK ._3Oa5I{color:#777;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media(max-width:600px){.books-item .books-item-span ._2girK ._3Oa5I{font-size:14px;line-height:16px;width:250px}}@media(min-width:600px){.books-item .books-item-span ._2girK ._3Oa5I{font-size:14px;line-height:20px;width:550px}}#green_channel{padding:5px 0 15px;margin-bottom:10px;margin-top:10px;border:0;border-top:#eee 1px dashed;border-bottom:#eee 1px dashed;font-size:12px;width:100%!important;text-align:center;display:inline-block;vertical-align:middle}a#green_channel_digg,a#green_channel_favorite,a#green_channel_follow,a#green_channel_wechat,a#green_channel_weibo,#btn_comment_submit{text-decoration:none;color:#fff;margin:10px auto auto;width:80px;height:30px;display:inline-block;line-height:30px;font-size:12px;font-weight:500;letter-spacing:2px;border-radius:3px;text-transform:uppercase;transition:all .4s;-webkit-transition:all .4s;-moz-transition:all .4s;-ms-transition:all .4s;-o-transition:all .4s;position:relative;background-image:none}a#green_channel_digg:hover,a#green_channel_favorite:hover,a#green_channel_follow:hover,a#green_channel_wechat:hover,a#green_channel_weibo:hover{transform:scale(1.02,1.02)}a#green_channel_digg:active,a#green_channel_favorite:active,a#green_channel_follow:active,a#green_channel_wechat:active,a#green_channel_weibo:active{transform:scale(.95,.95);transition:all .4s -125ms}a#green_channel_digg{background-color:#5c8ec6;box-shadow:0 15px 18px -6px rgba(95,193,206,.65)}a#green_channel_follow{background-color:#e33100!important;box-shadow:0 15px 18px -6px rgba(227,49,0,.65);margin-left:10px}a#green_channel_favorite{background-color:#ffb515;box-shadow:0 15px 18px -6px rgba(255,198,75,.65);margin-left:10px}a#green_channel_weibo{background-color:#ff464b!important;box-shadow:0 15px 18px -6px rgba(255,70,75,.65)!important;margin-left:10px;width:45px}a#green_channel_wechat{background-color:#3cb034!important;box-shadow:0 15px 18px -6px rgba(60,176,52,.65)!important;margin-left:10px;width:45px}#author_profile_info img.author_avatar{border-radius:100%;box-shadow:inset 1px 1px 3px rgba(0,0,0,.3),0 1px 3px rgba(0,0,0,.4);border:3px solid #f7f7f7;padding:0;margin-left:3px;margin-right:7px}div#green_channel img{height:20px;width:20px}@keyframes beating{0%,100%,30%,70%{transform:scale}20%,50%{transform:scale(1.6)}}.essaySuffix-eof{font-weight:700;font-size:16px;text-align:center;color:#ddd;text-indent:0}.essaySuffix-box{font-family:Microsoft YaHei,微软雅黑,MicrosoftJhengHei,华文细黑,STHeiti,MingLiu;font-size:14px;background:#f8f9fb!important;padding:17px;border:1px solid #edeef2!important;border-radius:3px;color:#414857;text-indent:0}.essaySuffix-box-left{width:15%;float:left}.essaySuffix-box-left img{width:80%;max-height:80%;border:1px solid #ccc;padding:5px;margin:0!important}.essaySuffix-box-right{width:85%;float:right}.essaySuffix-right-title{font-weight:700;white-space:nowrap}.footer-t1{min-height:130px!important;margin:250px 0 0 0!important;_height:15px!important;background:#232323}.footer-image{background:url(https://cdn.jsdelivr.net/gh/BNDong/Cnblogs-Theme-SimpleMemory@master/img/webp/footer.webp) no-repeat 50%;height:368px;z-index:1;position:absolute;width:100%;top:-293px;pointer-events:none}#footer .footer-box{width:70%;max-width:900px;text-align:center;margin:0 auto}#footer .footer-text{font-size:16px;padding-bottom:5px;border-bottom:1px dashed #333;font-family:'Long Cang',cursive;margin:0 auto;margin-bottom:5px}#footer .footer-text .footer-text-icon{display:inline-block;margin:0 7px;font-size:14px;-webkit-font-smoothing:antialiased;animation:iconAnimate 1.33s ease-in-out infinite}footer footer-background{bottom:7.25rem;left:0;height:18rem;position:absolute;width:100%;z-index:-1;transform:translate3d(0,0,0)}footer footer-background figure{bottom:0;left:0;height:15rem;margin:0;position:absolute;width:100%}footer footer-background .foreground{background-repeat:repeat-x!important;background:url(https://cdn.jsdelivr.net/gh/BNDong/Cnblogs-Theme-SimpleMemory@master/img/webp/foreground.webp) repeat-x;background-size:225em 15em;position:absolute;top:1rem;right:0;bottom:0;left:0}footer footer-background .background{background-repeat:repeat-x!important;background:url(https://cdn.jsdelivr.net/gh/BNDong/Cnblogs-Theme-SimpleMemory@master/img/webp/background.webp) repeat-x;background-size:225em 21.313em;position:absolute;top:-1em;right:0;bottom:0;left:0}footer footer-background .clouds{background-repeat:repeat-x!important;background:url(https://cdn.jsdelivr.net/gh/BNDong/Cnblogs-Theme-SimpleMemory@master/img/webp/clouds.webp) repeat-x;background-size:225em 15em;position:absolute;top:-2em;right:0;bottom:0;left:0}table#blogCalendar>tbody>tr>td>a{color:#bbb}@-moz-keyframes iconAnimate{0%,100%{transform:scale}10%,30%{transform:scale(.9)}20%,40%,50%,60%,70%,80%{transform:scale(1.1)}}@-webkit-keyframes iconAnimate{0%,100%{transform:scale}10%,30%{transform:scale(.9)}20%,40%,50%,60%,70%,80%{transform:scale(1.1)}}@-o-keyframes iconAnimate{0%,100%{transform:scale}10%,30%{transform:scale(.9)}20%,40%,50%,60%,70%,80%{transform:scale(1.1)}}@keyframes iconAnimate{0%,100%{transform:scale}10%,30%{transform:scale(.9)}20%,40%,50%,60%,70%,80%{transform:scale(1.1)}}#dayNightSwitch{display:inline-block;position:absolute;z-index:3;right:20px;top:25px;opacity:.65}#dayNightSwitch .onOff{background:#324164;width:65px;height:25px;border-radius:25px;box-shadow:0 15px 10px -10px rgba(0,0,0,0.2),0px 5px 10px rgba(0,0,0,0.1);border:2px solid #1e2d50;overflow:hidden;position:relative}#dayNightSwitch .onOff *{transition:all .4s ease}#dayNightSwitch .onOff.daySwitch{border:2px solid #52a6bf}#dayNightSwitch .onOff.daySwitch .sky{width:65px;height:25px;border-radius:25px;position:absolute;left:0;top:0;transform:translate(0px,0px);animation:none!important}#dayNightSwitch .onOff.daySwitch .sunMoon{background:#ffdf61;border:2px solid #d9b31c;left:calc(100% - 23px)}#dayNightSwitch .onOff.daySwitch .sunMoon .crater{transform:scale(0)!important}#dayNightSwitch .onOff.daySwitch .sunMoon .cloud{opacity:1;transform:translatex(0px);transition-delay:.2s;animation:cloudAnim 2.5s linear infinite}#dayNightSwitch .onOff .sunMoon{background:#f0e1a5;height:16px;width:16px;border-radius:100%;border:2px solid #ccc091;position:absolute;left:3px;top:2.5px}#dayNightSwitch .onOff .sunMoon .crater{background:#ccc091;width:5px;height:5px;border-radius:13px;position:absolute;left:50%;top:20%}#dayNightSwitch .onOff .sunMoon .crater.crater1{left:30%;top:45%;transform:scale(0.5)}#dayNightSwitch .onOff .sunMoon .crater.crater2{left:55%;top:60%;transform:scale(0.7)}#dayNightSwitch .onOff .sunMoon .cloud{background:white;border-radius:3px;position:absolute;opacity:0;transform:translatex(-20px);transition-delay:0s}#dayNightSwitch .onOff .sunMoon .cloud.part1{width:20px;height:2px;left:-12px;top:calc(50% - 1.5px)}#dayNightSwitch .onOff .sunMoon .cloud.part1:before{content:"";background:white;border-radius:3px;position:absolute;width:3px;height:3px;left:40%;top:-100%}#dayNightSwitch .onOff .sunMoon .cloud.part1:after{content:"";background:white;border-radius:3px;position:absolute;width:15px;height:2px;left:20%;top:-200%}#dayNightSwitch .onOff .sunMoon .cloud.part2{width:3px;height:3px;left:-1px;top:calc(50%+0.3px)}#dayNightSwitch .onOff .sunMoon .cloud.part2:before{content:"";background:white;border-radius:3px;position:absolute;width:18px;height:2px;left:-8px;top:100%}#dayNightSwitch .onOff .star{background:#5ebedb;width:5px;height:5px;border-radius:5px;position:absolute;left:50%;top:10%;transform:translate(20px,5px)}#dayNightSwitch .onOff .star.star1{transform:translate(10px,15px) scale(0.3);animation:starAnim1 3s -2.4s linear infinite}#dayNightSwitch .onOff .star.star2{transform:translate(15px,-7px) scale(0.6);animation:starAnim2 3s -1.1s linear infinite}#dayNightSwitch .onOff .star.star3{transform:translate(35px,-12px) scale(0.9);animation:starAnim3 3s -1.5s linear infinite}#dayNightSwitch .onOff .star.star4{transform:translate(30px,12px) scale(0.4);animation:starAnim4 3s -1.9s linear infinite}#dayNightSwitch .onOff .star.star5{transform:translate(0px,0px) scale(0.6);animation:starAnim5 3s -2.8s linear infinite}#dayNightSwitch .onOff .star.sky{animation:skyAnim 3s -.4s linear infinite}@keyframes starAnim1{0%{transform:translate(5px,30px) scale(0.3)}20%{transform:translate(8px,17px) scale(0.3)}50%{transform:translate(10px,0px) scale(0.3)}80%{transform:translate(8px,-17px) scale(0.3)}100%{transform:translate(5px,-30px) scale(0.3)}}@keyframes starAnim2{0%{transform:translate(10px,30px) scale(0.6)}20%{transform:translate(13px,17px) scale(0.6)}50%{transform:translate(15px,0px) scale(0.6)}80%{transform:translate(13px,-17px) scale(0.6)}100%{transform:translate(10px,-30px) scale(0.6)}}@keyframes starAnim3{0%{transform:translate(30px,30px) scale(0.9)}20%{transform:translate(33px,17px) scale(0.9)}50%{transform:translate(35px,0px) scale(0.9)}80%{transform:translate(33px,-17px) scale(0.9)}100%{transform:translate(30px,-30px) scale(0.9)}}@keyframes starAnim4{0%{transform:translate(25px,30px) scale(0.4)}20%{transform:translate(28px,17px) scale(0.4)}50%{transform:translate(30px,0px) scale(0.4)}80%{transform:translate(28px,-17px) scale(0.4)}100%{transform:translate(25px,-30px) scale(0.4)}}@keyframes starAnim5{0%{transform:translate(0px,30px) scale(0.6)}20%{transform:translate(3px,17px) scale(0.6)}50%{transform:translate(5px,0px) scale(0.6)}80%{transform:translate(3px,-17px) scale(0.6)}100%{transform:translate(0px,-30px) scale(0.6)}}@keyframes skyAnim{0%{transform:translate(15px,30px) scale(1)}20%{transform:translate(18px,17px) scale(1)}50%{transform:translate(20px,0px) scale(1)}80%{transform:translate(18px,-17px) scale(1)}100%{transform:translate(15px,-30px) scale(1)}}@keyframes cloudAnim{0%{transform:translatex(0px)}14%{transform:translatex(5px)}56%{transform:translatex(-10px)}100%{transform:translatex(0px)}}@media only screen and (max-width:1200px){.main-header{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;min-height:240px;height:60vh;max-height:60vh;padding:15% 0}#home{width:85%;max-width:100vw}.entrylistPosttitle a:link,.postTitle a:link{font-size:2.8rem}.entrylistItemPostDesc,.postDesc{font-size:1.3rem}.entrylistPosttitle,.page-title{font-size:4rem;letter-spacing:-1px}.sb-title{font-size:3.3rem;letter-spacing:-1px}p.article-info-text>.postMeta,p.article-info-text>.postMeta i{font-size:15px}.page-description{font-size:2rem;line-height:2rem;-webkit-line-clamp:4}.page-author{font-size:1.3rem!important;line-height:1.3em}#aplayer,#evanyou,#homeTopCanvas,#music-box,#notHomeTopCanvas,.scroll-down,body>meting-js{display:none!important}.c_b_p_desc_readmore{font-size:14px;width:75px}}@media only screen and (max-width:960px){.main-header{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;min-height:240px;height:50vh;max-height:50vh;padding:15% 0}#home{width:auto}#pageAnimationOffOn{display:none}#bgCanvas,#homeTopCanvas,#notHomeTopCanvas,.essaySuffix-box-left{display:none!important}.essaySuffix-box-right{width:100%}}@media only screen and (max-width:720px){#cnblogs_post_body>p{padding:0 10px;font-size:1em;line-height:1.8em}.post pre{margin:5px}.main-header{margin-bottom:15px;height:40vh;max-height:40vh}#home{padding-left:5px;padding-right:5px;box-shadow:unset}.entrylistPosttitle a:link,.postTitle a:link{font-size:2.3rem}.entrylistItemPostDesc,.entrylistPostSummary,.postCon,.postDesc{font-size:12px}.menu-button,.commentform{border:none!important;margin:0!important}.login_tips{font-size:12px}.inner{width:auto;margin:2rem auto}.entrylistPosttitle,.page-title{font-size:2.6rem}.sb-title{font-size:2.4rem}.page-description{font-size:1.6rem;-webkit-line-clamp:2}.page-author{font-size:1rem!important}.menu-button-scroll{background:#222!important;left:-8px!important;width:31px!important}.comment_date,#aplayer,#bgCanvas,#canvas,#evanyou,#homeTopCanvas,#music-box,#notHomeTopCanvas,#pageAnimationOffOn,.essaySuffix-box-left,.scroll-down,body>meting-js{display:none!important}.essaySuffix-box-right{width:100%}.postMeta{font-size:12px}.postMeta>i{font-size:13px}p.article-info-text>.postMeta,p.article-info-text>.postMeta i{font-size:13px}.article-info-tag{padding:0 3px}.c_b_p_desc_readmore{font-size:13px;width:68px;border-bottom:1px solid #666}.postSticky{font-size:12px;top:-4px}#footer .footer-box{width:95%}#dayNightSwitch .onOff,#dayNightSwitch .onOff.daySwitch .sky{width:50px;height:18px;border-radius:18px}#dayNightSwitch .onOff .sunMoon{height:12px;width:12px;top:1px}#dayNightSwitch .onOff.daySwitch .sunMoon{left:calc(100% - 19px)}#dayNightSwitch{right:12px;top:15px}#dayNightSwitch .onOff .star{top:-50%}#dayNightSwitch .onOff .sunMoon .crater{width:3px;height:3px}#dayNightSwitch .onOff .sunMoon .cloud.part1{width:17px}#dayNightSwitch .onOff .sunMoon .cloud.part1:after{width:12px}#dayNightSwitch .onOff .sunMoon .cloud.part2:before{width:15px}}

页脚HTML代码

<style>
        #cnblogs_c1,
        #cnblogs_c2,
        #ad_t2,
        #opt_under_post
        {
            display: none !important;
        }
        .itnews,
        .c_ad_block
        {
            display: none !important;
        }
</style>
<canvas id="c_n9" width="1920" height="990" style="position: fixed; top: 0px; left: 0px; z-index: -1; opacity: 0.5;"></canvas>
<script src="https://files.cnblogs.com/files/jingmoxukong/canvas-nest.min.js"></script>
<script type="text/javascript">
/* 鼠标特效 */
var a_idx = 0;
jQuery(document).ready(function($) {
    $("body").click(function(e) {
        var a = new Array("❤welcome to❤","❤博客园❤","❤Hitocoko❤","❤富强❤","❤民主❤","❤文明❤","❤和谐❤","❤自由❤","❤平等❤","❤公正❤","❤法治❤","❤爱国❤","❤敬业❤","❤诚信❤","❤友善❤");
        var $i = $("<span></span>").text(a[a_idx]);
        a_idx = (a_idx + 1) % a.length;
        var x = e.pageX,
        y = e.pageY;
        $i.css({
            "z-index": 999999999999999999999999999999999999999999999999999999999999999999999,
            "top": y - 20,
            "left": x,
            "position": "absolute",
            "font-weight": "bold",
            "color": "rgb("+~~(255*Math.random())+","+~~(255*Math.random())+","+~~(255*Math.random())+")"
        });
        $("body").append($i);
        $i.animate({
            "top": y - 180,
            "opacity": 0
        },
        1500,
        function() {
            $i.remove();
        });
    });
});
</script>

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Live2D</title>
     
    <link rel="stylesheet" type="text/css" href="https://files.cnblogs.com/files/hulean/waifu.css"/>
    <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
    <link rel="stylesheet" type="text/css" href="https://files.cnblogs.com/files/hulean/waifu.css">
    <div class="waifu" id="waifu">
        <div class="waifu-tips" style="opacity: 1;"></div>
        <canvas id="live2d" width="280" height="250" class="live2d"></canvas>
        <div class="waifu-tool">
            <span class="fui-home"></span>
            <span class="fui-chat"></span>
            <span class="fui-eye"></span>
            <span class="fui-user"></span>
            <span class="fui-photo"></span>
            <span class="fui-info-circle"></span>
            <span class="fui-cross"></span>
        </div>
    </div>
    <script src="https://files.cnblogs.com/files/hulean/live2d.js"></script>
    <script src="https://files.cnblogs.com/files/hulean/waifu-tips.js"></script>
    <script type="text/javascript">initModel()</script>
</body>
</html>
<link rel="stylesheet" type="text/css" href="https://files.cnblogs.com/files/yjlblog/flat-ui.min.css"/>

侧边栏HTML代码

<script type="text/javascript">
    window.cnblogsConfig = {
        GhVersions    : 'v1.3.1', // 版本
        blogUser      : "Hitocoko", // 用户名
        blogAvatar    : "https://i.loli.net/2020/07/24/91YoWNKEBuOHiyp.jpg", // 用户头像
        blogStartDate : "2019-03-16", // 入园时间,年-月-日。入园时间查看方法:鼠标停留园龄时间上,会显示入园时间
    }
</script>
<script src="https://cdn.jsdelivr.net/gh/BNDong/Cnblogs-Theme-SimpleMemory@v1.3.1/src/script/simpleMemory.min.js"></script>

<!-- 鼠标点击特效 -->
<script src="https://blog-static.cnblogs.com/files/Hitocoko/cursor-effects.js"></script>
<!-- 鼠标点击特效end -->

页首HTML代码

<!-- 鼠标移动特效begin -->
<canvas id="shuicheCanvas" style="position: fixed; left: 0px; top: 0px; z-index: 2147483647;pointer-events:none;" width="1920" height="431"></canvas>
<script src="https://blog-static.cnblogs.com/files/qtxy/mouse.min.js"></script>
<script type="text/javascript">
    $.shuicheMouse({
        type:11,
        color:"rgba(187,67,128,1)"
    })
</script>
<script src="https://blog-static.cnblogs.com/files/qtxy/mouse-follow.js"></script>
<span class="js-cursor-container"></span>
<!-- 鼠标移动特效end -->

<!-- 下雪特效begin -->
<div class="Snow">
    <canvas id="Snow"></canvas>
</div>
<script src="https://blog-static.cnblogs.com/files/qtxy/snow3.js"></script>
<!-- 下雪特效end -->
<script type="text/javascript">
$.silence({
	profile: {
		enable: true,
		avatar: '',
		favicon: 'https://blog-static.cnblogs.com/files/Hitocoko/bitbug_favicon.ico',
	},
	catalog: {
		enable: true,
		move: true,
		index: true,
		level1: 'h2',
		level2: 'h3',
		level3: 'h4',
	},
	signature: {
		enable: true,
		home: 'https://www.cnblogs.com/Hitocoko/',
		license: 'CC BY 4.0',
		link: 'https://creativecommons.org/licenses/by/4.0'
	},
	sponsor: {
		enable: true,
		paypal: null,
		//wechat: 'https://www.cnblogs.com/images/cnblogs_com/zouwangblog/1477590/t_%e5%be%ae%e4%bf%a1%e5%9b%be%e7%89%87_20190704175553.png',
		//alipay: 'https://www.cnblogs.com/images/cnblogs_com/zouwangblog/1477590/t_%e5%be%ae%e4%bf%a1%e5%9b%be%e7%89%87_20190704174158.png'
	},
	github: {
		enable: false,
		color: '#fff',
		fill: '#FF85B8',
		link: 'https://github.com/MZMH'
	},
	topImg: {
		homeTopImg: ["https://img2018.cnblogs.com/blog/1646268/201908/1646268-20190808213853909-1772245301.jpg","https://img2018.cnblogs.com/blog/1646268/201908/1646268-20190808213858652-132088076.jpg"],
		notHomeTopImg: ["https://img2018.cnblogs.com/blog/1646268/201908/1646268-20190808214726187-2092834311.jpg",				]
	},
	topInfo: {
		title: 'Hi,MZMH',
		text: 'You got to put the past behind you before you can move on.',
		github: "https://github.com/MZMH",
		weibo: "https://weibo.com/5682002748/profile?topnav=1&wvr=6&is_all=1",
		telegram: "",
		music: "https://music.163.com/#/user/home?id=436757779",
		twitter: "",
		zhihu:"https://www.zhihu.com/people/zouwang/activities",
		mail: "http://mail.qq.com/cgi-bin/qm_share?t=qm_mailme&email=KlBFX11LRE0SGBlqW1sESUVH",
	}
});
</script>

系列一

CSS

.cnblogs-markdown .hljs {
    display: block;
    color: #333;
    overflow-x: auto;
    background: #F2F4F5 !important;
    border: none !important;
    font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace !important;
    padding: 1em !important;
    font-size: 14px !important
}

.hljs-comment, .hljs-meta {
    color: #969896
}

.hljs-emphasis, .hljs-quote, .hljs-string, .hljs-strong, .hljs-template-variable, .hljs-variable {
    color: #df5000
}

.hljs-keyword, .hljs-selector-tag, .hljs-type {
    color: #a71d5d
}

.hljs-attribute, .hljs-bullet, .hljs-literal, .hljs-symbol {
    color: #0086b3
}

.hljs-name, .hljs-section {
    color: #63a35c
}

.hljs-tag {
    color: #333
}

.hljs-attr, .hljs-selector-attr, .hljs-selector-class, .hljs-selector-id, .hljs-selector-pseudo, .hljs-title {
    color: #795da3
}

.hljs-addition {
    color: #55a532;
    background-color: #eaffea
}

.hljs-deletion {
    color: #bd2c00;
    background-color: #ffecec
}

.hljs-link {
    text-decoration: underline
}

body {
    cursor: url(https://files-cdn.cnblogs.com/files/zouwangblog/cursor.ico), auto;
    background: #fff;
    color: #314659;
    min-height: 100% !important;
    font-family: Lato, "PingFang SC", "Microsoft YaHei", sans-serif !important;
}

body::before {
    background: url(https://img2018.cnblogs.com/blog/1646268/201907/1646268-20190709145111387-899901278.jpg) center/cover no-repeat;
}

body:before {
    content: '';
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0.05;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
}

a {
    transition: all .3s ease !important
}

a:hover {
    color: #FE9600 !important;
    text-decoration: none !important
}

#ad_c1, #ad_c2, #ad_t2, #author_profile, #blogCalendar, #blogTitle h2, #comment_form_container p:nth-of-type(3), #comments_pager_top, #green_channel, #homepage_top_pager, #sidebar_imagecategory, #sidebar_postarchive, #sidebar_recentcomments, #sidebar_recentposts, #sidebar_scorerank, #sidebar_search, #sidebar_shortcut, #sidebar_topcommentedposts, #tip_comment2, #under_post_kb, #under_post_news, .blogStats, .c_ad_block, .commentbox_title_left, .commentform p {
    display: none
}

#home {
    width: 100%
}

#header {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    margin: 0 auto;
    border-top: 0;
    background: #fff;
    border-bottom: 0px #ffebf2 solid;
    padding-bottom: 0;
    width: 100%;
    height: 75px;
    z-index: 999;
    opacity: 0;
    transition: all .4s ease;
}

#header #blogTitle {
    position: absolute;
}

#header #blogTitle h1 {
    font-size: 25px;
    font-family: Georgia;
    width: auto;
    margin-left: 0;
    margin-top: 12px;
    padding-left: 15px
}

#header #blogTitle h1 a {
    color: #61687C
}

#header #navigator {
    height: inherit;
    top: 0;
    background-color: transparent;
    z-index: 999;

}

#header #navList {
    height: inherit;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 100px;
    transition: all .4s ease;
}

#header #navList li {
    position: relative
}

#header #navList li:hover i {
    width: 100%;
    left: 0
}

#header #navList li i {
    width: 0;
    height: 4px;
    background-color: #FE9600;
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    transition: 1s
}

#navList .fa,#navList .iconfont {
    width: 30px!important;
    height: 4px!important;
    background-color: #fff!important;
    content: ""!important;
    position: static!important;
}

#header #navList a:active, #header #navList a:link, #header #navList a:visited {
    font-size: 16px;
    border-right: 0;
    color: #61687C;
    display: block;
    font-weight: 300;
    padding: 28px 0;
    height: inherit;
    -webkit-transition: all .3s;
    transition: all .3s
}

#header #navList a:hover {
    background: 0 0
}

#main {
    width: 800px;
    margin: 100vh auto 0;
    min-height: 750px;
    padding: 70px 10px 0 10px;
    animation-name: fadeIn;
    animation-duration: 1s;
    animation-iteration-count: 1;
    -webkit-animation-name: fadeIn;
    -webkit-animation-duration: 1s;
    -webkit-animation-iteration-count: 1;
    z-index: 9999;
}

#main #mainContent {
    background-color: transparent
}

#main #mainContent .forFlow {
    margin: 0 auto;
    margin-left: 0;
    max-width: 800px
}

#sideBar {
    width: 0px;
    border-right: 1px solid #EEF2F8;
    font-weight: 300;
    display: none;
    min-height: 750px;
    padding: 0
}

#sideBar .newsItem:hover {
    background: url(https://files-cdn.cnblogs.com/files/zouwangblog/caidai.gif);
    background-size: cover;
    color: #999;
}

.newsItem {
    padding: 15px 0 5px 0px;
    margin-bottom: 8px;
}

#sideBar #profile_block {
    margin-top: 0;
    font-size: 15px;
    padding-left: 15px
}

#sideBar #profile_block #p_b_follow {
    margin-top: 10px
}

#sideBar #profile_block a {
    color: #61687C
}

.catListTitle {
    position: relative;
    text-align: left;
    margin-top: 20px;
    padding-left: 30px !important;
    font-size: 20px;
    font-weight: 300;
    border-bottom: none
}

.catListTitle::before {
    color: #61687C;
    position: absolute;
    top: 1px;
    left: -2px
}

#sidebar_categories li, #sidebar_toptags li {
    font-size: 15px;
    height: 40px;
    margin: 0;
    padding-left: 15px;
    padding-right: 15px;
    line-height: 42px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

#sidebar_categories li a, #sidebar_toptags li a {
    color: #61687C
}

#sidebar_categories li:active, #sidebar_categories li:link, #sidebar_categories li:visited, #sidebar_toptags li:active, #sidebar_toptags li:link, #sidebar_toptags li:visited {
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

#sidebar_categories li:hover, #sidebar_toptags li:hover {
    margin-left: 10px;
    border-radius: 5px;
    margin: 0 5px;
    font-size: 17px
}

#sidebar_topdiggedposts li, #sidebar_topviewedposts li {
    margin: 12px 0;
    font-size: 15px;
    padding-left: 15px;
    padding-right: 15px;
    text-align: justify
}

#sidebar_topdiggedposts li a:active, #sidebar_topdiggedposts li a:hover, #sidebar_topdiggedposts li a:link, #sidebar_topdiggedposts li a:visited, #sidebar_topviewedposts li a:active, #sidebar_topviewedposts li a:hover, #sidebar_topviewedposts li a:link, #sidebar_topviewedposts li a:visited {
    color: #61687C
}

#taglist_title, .PostListTitle, .entrylistTitle, .myposts_title, .thumbTitle {
    padding-bottom: 3px;
    padding-right: 10px;
    width: 100%;
    text-align: left;
    border-bottom: 0 !important;
    font-size: 20px !important;
    font-weight: 300;
    margin-top: 15px
}

#myposts {
    margin-left: 0
}

#myposts .PostList {
    font-size: 13px;
    font-weight: 300;
    border-bottom: 1px solid #EEF2F8;
    padding: 6px 0 10px 0;
    margin-right: 0
}

#myposts .pager:first-of-type {
    display: none
}

#myposts a:link, #myposts a:visited {
    color: #61687C
}

#myposts .postDesc2 {
    color: inherit
}

.c_b_p_desc a:before {
    content: '🔎';
}

.day .postDesc, .entrylist .entrylistItemPostDesc, .post .postDesc {
    font-size: 13px;
    font-weight: 300;
    padding-right: 0;
    color: #61687C !important;
}

.post .postTitle {
    font-size: 25px !important;
    font-weight: 300 !important;
    padding-left: 15px !important;
    border-bottom: none !important
}

.post .postTitle a {
    color: #61687C
}

.post .postBody {
    font-weight: 300;
    font-size: 15px;
    padding: 5px 15px;
    line-height: 1.7;
    color: #61687C;
    border-bottom: 1px solid #EEF2F8
}

.post .postBody a:active, .post .postBody a:link, .post .postBody a:visited {
    color: #e67474;
    position: relative;
    text-decoration: none;
}

.post .postBody a:hover {
    color: orange;
    text-decoration: none
}

.post .postBody a:after {
    content: '';
    position: absolute;
    width: 100%;
    transform: scaleX(0);
    height: 2px;
    bottom: 0;
    left: 0;
    background-color: orange;
    transform-origin: bottom right;
    transition: transform .25s ease-out
}

.post .postBody a:hover:after {
    transform: scaleX(1);
    transform-origin: bottom left
}

.post .postBody h1 {
    font-size: 21px !important;
    color: #61687C
}

.post .postBody h5, .post .postBody h3 {
    font-size: 17px !important;
    color: #314659;
}

.post .postBody h4 {
    font-size: 15px !important;
    color: #314659;
}

.post .postBody p {
    margin: 17px auto
}

.post .postBody hr {
    border-left: none;
    border-right: none;
    border-top: none;
    border-bottom: 1px solid #EEF2F8
}

.post .postBody blockquote {
    border: none;
    color: #61687C;
    margin: 20px 0;
    padding: 0 0 0 10px;
    min-height: 20px;
    background: 0 0;
    border-left: 4px solid #FFC6DE
}

.post .postBody em {
    padding-right: 3px
}

.post .postBody strong {
    margin: 0 3px
}

.post .postBody img {
    max-width: 930px !important;
    display: block;
    margin: 30px auto;
    border-radius: 3px
}

.post .postBody ol li, .post .postBody ul li {
    margin: 3px 0;
    font-size: 15px;
    color: #61687C
}

.post .postBody ol li p, .post .postBody ul li p {
    margin: 0 !important
}

.post .postBody table {
    font-size: 13px;
    border-collapse: collapse;
    border-spacing: 0;
    empty-cells: show;
    border: 1px solid #fbdfeb;
    width: 100%;
    margin-bottom: 24px
}

.post .postBody table th {
    font-family: inherit;
    font-size: inherit;
    background: #f9f9f9 !important;
    white-space: nowrap;
    font-weight: 600;
    border: 1px solid #fbdfeb !important;
    padding: 8px 16px !important
}

.post .postBody table td {
    border: 1px solid #fbdfeb !important;
    padding: 8px 16px !important
}

.post .postBody h1 code, .post .postBody h2 code, .post .postBody h3 code, .post .postBody h4 code, .post .postBody h5 code, .post .postBody h6 code, .post .postBody li code, .post .postBody p code, .post .postBody table code {
    color: #61687C;
    line-height: 1;
    font-family: consolas !important;
    vertical-align: middle;
    margin: 0 3px;
    background: #fbfbfb !important;
    font-size: 14px !important;
    padding: .2em .3em !important;
    border-radius: 3px !important;
    border: 1px solid #eee !important
}

.post .postBody #BlogPostCategory {
    font-size: 13px;
    margin-bottom: 0
}

.post .postBody #BlogPostCategory a {
    margin-left: 5px
}

.post .postBody #EntryTag {
    font-size: 13px;
    color: #61687C
}

.post .postBody #EntryTag a {
    color: #FE9600
}

.post .postBody #post_next_prev {
    font-size: 13px
}

.cnblogs_code {
    background-color: #f2f4f5;
    padding-left: 1em;
    padding-right: 1em;
    border: none !important;
    border-radius: 3px !important;
    font-family: Lucida Console, Consolas, Monaco, Andale Mono, Ubuntu Mono, monospace !important
}

.cnblogs_code div {
    background-color: transparent;
    color: #656c73
}

.cnblogs_code img {
    margin: 0 !important
}

.cnblogs_code pre {
    color: #656c73;
    font-family: inherit !important
}

.cnblogs_code pre span {
    font-family: inherit !important;
    color: inherit !important
}

.cnblogs_code textarea {
    font-family: inherit !important;
    padding: 5px;
    border: 1px solid #3e4c42;
    color: #c5d4ef;
    background-color: #282c34
}

.cnblogs_code textarea:focus {
    outline: 0
}

.cnblogs_code .code_img_closed, .cnblogs_code .code_img_opened {
    display: none !important
}

.cnblogs_code .cnblogs_code_toolbar {
    width: 20px
}

.cnblogs_code .cnblogs_code_toolbar span {
    padding-right: 0
}

.cnblogs_code .cnblogs_code_toolbar a:link img {
    background-color: transparent !important
}

.cnblogs_code .cnblogs_code_collapse {
    color: #656c73;
    border: 1px solid #989fa6;
    border-radius: 2px;
    background-color: transparent;
    display: inline-block;
    cursor: pointer;
    padding: 5px 5px 2px 5px
}

.github-corner svg {
    fill: #FFC6DE
}

#footer {
    border-top: 1px solid #EEF2F8;
    font-weight: 300;
    z-index: 9999;
}

#footer div {
    margin: 5px auto
}

#footer a {
    color: #61687C
}

#footer:after {
    content: '❤';
    color: #ef6b6b;
    font-size: 16px
}

.cnblogs-markdown pre {
    white-space: pre !important;
    position: relative !important
}

#taglist_main {
    margin-top: 0
}

#taglist_main table {
    width: 100%
}

#taglist_main table tr td {
    padding: 5px 20px 5px 0
}

#taglist_main table tr td .small {
    display: none
}

#taglist_main table tr td a {
    display: inline-block;
    font-size: 12px;
    line-height: 1;
    padding: 5px;
    margin: 0;
    width: 100%;
    text-align: center;
    border: 1px solid #61687C;
    border-radius: 2px;
    color: #61687C;
    background-color: transparent
}

#taglist_main table tr td a:hover {
    color: #FE9600 !important;
    border: 1px solid #FE9600;
    text-decoration: none
}

.topicListFooter {
    margin-right: 0
}

#homepage1_HomePageDays_homepage_bottom_pager .pager, #comments_pager_bottom .pager {
    display: inline-block;
    font-size: 12px !important;
    font-weight: 100;
    color: #61687C;
    background-color: transparent !important;
    border-radius: 6px;
}

#nav_next_page, .pager {
    margin-right: 0;
    color: #61687C
}

#nav_next_page a, .pager a {
    padding: 3px 7px;
    border: 1px solid #61687C;
    border-radius: 4px;
    font-family: Monospaced Number;
    margin: 0 3px;
    text-decoration: none;
    color: inherit;
    transition: border .2s ease-in-out, color .2s ease-in-out
}

#nav_next_page a:hover, .pager a:hover {
    color: #FE9600;
    border: 1px solid #FE9600
}

.pager span.current {
    color: #FE9600;
    padding: 3px 7px;
    border: 1px solid #FE9600;
    border-radius: 4px;
    font-family: Monospaced Number;
    margin: 0 3px;
    text-decoration: none;
    background-color: transparent;
}

.esa-clipboard-button {
    font-size: 12px;
    cursor: pointer;
    position: absolute;
    right: 6px;
    top: 6px;
    box-shadow: 0 0 15px 0 rgba(0, 0, 0, .1);
    color: #5e6687;
    padding: 0 6px;
    border-radius: 5px
}

.esa-toolbar {
    position: fixed;
    display: grid;
    z-index: 999;
    bottom: 30px;
    right: 30px
}

.esa-toolbar .esa-toolbar-contents, .esa-toolbar .esa-toolbar-follow, .esa-toolbar .esa-toolbar-gotop {
    height: 45px;
    width: 45px;
    font-weight: 400;
    position: relative;
    outline: 0;
    cursor: pointer;
    border: 1px solid transparent;
    transition: color .2s linear, background-color .2s linear, border .2s linear, box-shadow .2s linear;
    margin-top: 5px;
    border-color: #EEF2F8;
    background-color: #fff;
    background-position: center;
    background-repeat: no-repeat
}

.esa-toolbar .esa-toolbar-contents .tips, .esa-toolbar .esa-toolbar-follow .tips, .esa-toolbar .esa-toolbar-gotop .tips {
    position: absolute;
    left: -60px;
    top: 15px;
    display: none;
    color: #FE9600;
    font-size: 12px
}

.esa-toolbar .esa-toolbar-contents:hover, .esa-toolbar .esa-toolbar-follow:hover, .esa-toolbar .esa-toolbar-gotop:hover {
    color: #FE9600;
    border-color: #FE9600
}

.esa-toolbar .esa-toolbar-gotop {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAACL0lEQVRIS+3TwWvTUBwH8O/vJSLrFBURFPSkoIiCVz3IilObFA/aNR0yEEk6EXfxH1D0L5DdyroMHaJL1a1Ikw3H6kVBHHjyIKKgMEQmbOqsTpv8JOkmna4mvQyRvVv4/fL78L7vPcIKLFoBA6tIUyn/e3H1F+xjYB4B8EyGp53RTkxF2VLkneQLTieYBwmQ/cEMfgsJh41U8k0YFAnJW3YPAb2Afxv5CZj2gdAK8BQgjuia8uJvUCiSt+wrBFxaGOJ8WYeTsQr2kscTAG1k5g+eJLV1dySeN4IaIsxMpuXkQMjW4kFh55aW0/F4vOp/D9wZ2+N67gQB25h5RmJx/Gyn8nQ5aFmk17bXtn7mGyDSAoBh6ppiEBHXDzFvje3wpADaxcAcGAkjoz76HfoDyVkPNsj44QA4GDQzrukZ9WKjKK7fG99crX4vA9gP8FePhJpNKw/r+5cgfXft7cLFOIDdCxFdNjT1atjt6S8W12NeHgXoEAPzgEgZWqK0+N8vZMAqHfAAB6CtzOwBlDUyqhkGLNYt63HLJ8zaBLQxUCWQpmvKsF8PEHNotN0jt0igGBjfIHBKT6t+ZE0t/yxjc3yfQEcBdplEl5FWblOfZWcE+CZAEgMfSXC73pGcbGp6XXMuN7lG3vR+GKBkcGeIz1N+qDRIRF1RH1YUvFwuy6+nKyM1iGepluVMtytJ1rlU4l2UIVF6fOjVdOUCs3gZ+uKjDAzrWUXCElpS/3/i+gn3gM6tu0xSdwAAAABJRU5ErkJggg==);
    diplay: none !important;
}

.esa-toolbar .esa-toolbar-contents {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAAAuUlEQVRIS2NkoANgpIMdDPSxZO6qbQeQffOf+X98SrD3w0WLdnL/5vi7lRo+ZZy7att/ZIMYGRi0k8K8rs1ctZufheH3B6pYMnv1dgdkg/5x/DmV7uv7bdWqVcwfGXltqWIJNQwhZAZ9Ip6QK6ghP4x8Mnfl1gaUJMzIODUpzOv1pG3b2Lk//6+kSnDRJZ/QxSfUCA5CZgyj1EXIq9SQp09w0aUUpk8+oUelRY2IJWQGfSKekCuoIQ8At39XNxqN1mQAAAAASUVORK5CYII=);
    diplay: none !important;
}

.esa-toolbar .esa-toolbar-follow {
    border-radius: 50%;
}

.esa-profile-avatar {
    margin-left: 15px;
    margin-top: 15px;
    border-radius: 3px;
    width: 200px
}

#sideBarMain .esa-profile-avatar:hover {
    background: url(https://files-cdn.cnblogs.com/files/zouwangblog/caidai.gif);
    background-size: cover;
    color: #999;
}

.esa-profile-avatar:hover, .site-master-avatar:hover {
    -webkit-animation: tada 1s .2s ease both;
    -moz-animation: tada 1s .2s ease both;
}

@keyframes tada {
    0% {
        -webkit-transform: scale(1);
    }
    10%, 20% {
        -webkit-transform: scale(0.9) rotate(-3deg);
    }
    30%, 50%, 70%, 90% {
        -webkit-transform: scale(1.2) rotate(3deg);
    }
    40%, 60%, 80% {
        -webkit-transform: scale(1.2) rotate(-3deg);
    }
    100% {
        -webkit-transform: scale(1) rotate(0);
    }
}

.esa-follow-button {
    z-index: 999;
    display: none;
    position: fixed;
    bottom: 30px;
    right: 30px;
    height: 45px;
    width: 45px;
    font-weight: 400;
    outline: 0;
    cursor: pointer;
    border: 1px solid transparent;
    white-space: nowrap;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font-size: 12px;
    border-radius: 50px;
    color: #515a6e;
    background-color: #fff;
    border-color: #dcdee2
}

.esa-follow-button:hover {
    color: #FE9600;
    border-color: #FE9600;
    background-color: #fff
}

.esa-mobile-menu {
    display: none;
    position: fixed;
    top: 7px;
    right: 15px;
    z-index: 941113;
    font-size: 1.5em;
    cursor: pointer;
    color: #7f7f7f
}

.esa-mobile-menu:after {
    content: '\2630';
    font-size: 1.5em;
    font-family: fontello
}

.esa-catalog {
    position: fixed;
    top: 120px;
    right: 1px;
    width: auto;
    height: auto;
    z-index: 999999;
    opacity: 0.8;
}

.esa-catalog-title {
    cursor: move;
    padding-left: 12px;
    width: 100%;
    height: 35px;
    line-height: 36px;
    border-bottom: 1px solid #EEF2F8;
    font-size: 14px;
    font-weight: 600;
}

.esa-catalog-title:before {
    content: '☲';
    margin-right: 5px
}

.esa-catalog-close {
    position: absolute;
    right: 15px;
    top: 10px;
    cursor: pointer;
    color: #a2a2a2
}

.esa-catalog-contents {
    overflow: hidden;
    display: none;
    color: #61687C;
    border: 1px solid #EEF2F8;
    min-width: 150px;
    opacity: 1;
    font-size: inherit;
    background-color: transparent;
    z-index: 19941112
}

.esa-catalog-contents ul {
    padding: 10px 15px;
    max-height: 350px;
    overflow-y: auto
}

.esa-catalog-contents ul li {
    margin-top: 5px;
    max-width: 170px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
    color: #34495e;
}

.li_h2 {
    font-weight: bold;
    color: #34495e;
}

.esa-catalog-contents ul li code {
    font-family: inherit
}

.esa-catalog-contents ul li a:hover {
    color: #FE9600;
    text-decoration: none
}

.esa-catalog-contents ul li .level1 {
    margin-left: 0
}

.esa-catalog-contents ul li .level2 {
    margin-left: 10px
}

.esa-catalog-contents ul li .level3 {
    margin-left: 26px
}

.esa-anchor {
    opacity: 0;
    -webkit-transition: opacity .3s ease;
    transition: opacity .3s ease;
    margin-left: 8px
}

.esa-post-signature {
    padding: 12px 24px 12px 30px;
    margin-top: 15px;
    margin-left: 5px;
    border-left-width: 4px;
    font-size: 15px;
    line-height: 2;
    border-left-style: solid;
    background-color: #f8f8f8;
    position: relative;
    border-bottom-right-radius: 2px;
    border-top-right-radius: 2px;
    border-left-color: #FE9600;
    z-index: 1
}

.esa-post-signature:before {
    content: "!";
    background-color: #FE9600;
    position: absolute;
    top: 25px;
    left: -12px;
    color: #fff;
    width: 20px;
    height: 20px;
    border-radius: 100%;
    text-align: center;
    line-height: 20px;
    font-weight: 700;
    font-size: 14px
}

.esa-post-signature p {
    margin: 0 !important
}

.esa-post-signature a {
    color: #61687C !important
}

.esa-layer {
    position: fixed;
    top: 5px;
    text-align: center;
    line-height: 25px;
    font-size: 15px;
    font-family: inherit;
    width: 100%;
    display: none;
    z-index: 9999999
}

.esa-layer-content {
    position: relative;
    background: rgba(0, 0, 0, .7);
    max-width: 250px;
    padding: 3px 9px;
    font-size: 13px;
    border-radius: 5px;
    color: #FFF;
    display: inline-block
}

.esa-reward {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: auto;
    height: auto;
    padding-bottom: 30px;
    background: #fff;
    box-shadow: 0 0 0 2000px rgba(0, 0, 0, .65);
    border-radius: 4px;
    z-index: 1000000
}

.esa-reward h2 {
    text-align: center;
    font-size: 20px;
    color: #61687C;
    font-weight: 400;
    margin: 20px 0 10px 0
}

.esa-reward p {
    text-align: center
}

.esa-reward .esa-reward-container {
    margin: 0 30px;
    text-align: center
}

.esa-reward .alipay, .esa-reward .wechat {
    position: relative;
    display: inline-block;
    width: 200px;
    height: 200px;
    padding: 10px;
    border: 2px solid #FE9600;
    border-radius: 10px;
    box-sizing: border-box;
    margin: 10px
}

.esa-reward .alipay:after, .esa-reward .wechat:after {
    content: '';
    position: absolute;
    left: 30px;
    bottom: -10px;
    color: #61687C;
    background: #fff;
    padding: 0 10px;
    font-size: 16px;
    width: auto;
    text-align: center
}

.esa-reward .alipay img, .esa-reward .wechat img {
    width: 100%;
    width: 170px;
    height: 170px
}

.esa-reward .alipay:after {
    content: '支付宝,扫一扫'
}

.esa-reward .wechat:after {
    content: '微信,扫一扫'
}

.esa-reward-close {
    position: absolute;
    font-size: 15px;
    color: #61687C;
    top: 7px;
    right: 10px;
    cursor: pointer
}

.esa-reward-close:hover {
    transition: all .2s;
    color: #FE9600
}

.esa-reward-close:active {
    transition: all .2s;
    color: #FE9600
}

#div_digg {
    position: static;
    float: none;
    margin: 0px auto 50px;
    z-index: -1;
    width: 370px
}

#div_digg .buryit, #div_digg .diggit, #div_digg .favorite, #div_digg .reward {
    background: #FFF;
    margin: 0;
    display: inline-block;
    width: auto;
    height: 32px;
    border-width: 0;
    cursor: pointer;
    color: #fff;
    user-select: none;
    padding: 0 10px;
    border-radius: 5px;
    transition: color .2s linear, background-color .2s linear, border .2s linear, box-shadow .2s linear
}

#div_digg .favorite {
    background-color: #2db7f5;
    border-color: #2db7f5;
    margin: 0 5px
}

#div_digg .favorite:hover {
    background-color: #57c5f7;
    border-color: #57c5f7
}

#div_digg .reward {
    background-color: #e13d13;
    border-color: #e13d13;
    margin: 0 5px
}

#div_digg .reward:hover {
    background-color: #f16643;
    border-color: #f16643
}

#div_digg .diggit {
    background-color: #18b566;
    border-color: #18b566
}

#div_digg .diggit:hover {
    background-color: #47cb89;
    border-color: #47cb89
}

#div_digg .buryit {
    background-color: #f90;
    border-color: #f90
}

#div_digg .buryit:hover {
    background-color: #ffad33;
    border-color: #ffad33
}

#div_digg .buryit .burynum, #div_digg .diggit .diggnum, #div_digg .favorite .favoritenum, #div_digg .reward .rewardnum {
    color: snow;
    display: inline-block;
    font-size: 15px;
    position: relative;
    top: 5px;
    width: 65px
}

#div_digg .favorite .favoritenum:before {
    content: '收藏';
    font-size: 15px
}

#div_digg .reward .rewardnum:before {
    content: '赞赏';
    font-size: 15px
}

#div_digg .diggit .diggnum:before {
    content: '推荐';
    font-size: 15px;
    margin-right: 5px
}

#div_digg .buryit .burynum:before {
    content: '反对';
    font-size: 15px;
    margin-right: 5px
}

.feedbackItem .feedbackListSubtitle {
    color: transparent
}

.feedbackItem .feedbackListSubtitle .sendMsg2This {
    background: 0 0;
    padding-left: 0;
    font-size: 15px
}

.feedbackItem .feedbackListSubtitle .sendMsg2This::before {
    content: '✉️'
}

.feedbackItem a {
    color: #61687C
}

.feedbackItem .louzhu {
    background: #FE9600 !important;
    color: #fff;
    border-radius: 2px;
    margin: 0 2px;
    padding: 0 6px 2px 6px !important
}

.feedbackItem .comment_date {
    color: #666
}

.feedbackItem .comment_quote {
    border: 1px dashed #FE9600;
    border-radius: 3px
}

#comment_nav {
    visibility: hidden
}

.feedbackCon {
    background: 0 0;
    padding: 10px 0 10px 0;
    border-bottom: 1px solid #EEF2F8
}

.feedbackCon .esa-comment-avatar {
    float: left;
    margin-right: 10px
}

.feedbackCon .esa-comment-avatar img {
    border-radius: 50%;
    transition: all .5s ease-out;
    -webkit-transition: all .6s ease-out;
    -moz-transition: all .5s ease-out;
    -ms-transition: all .5s ease-out;
    -o-transition: all .5s ease-out
}

.feedbackCon .esa-comment-avatar img:hover {
    -webkit-transform: rotateZ(360deg);
    -moz-transform: rotateZ(360deg);
    -ms-transform: rotateZ(360deg);
    -o-transform: rotateZ(360deg);
    transform: rotateZ(360deg)
}

.feedbackCon .blog_comment_body {
    border-radius: 3px;
    padding: 8px;
    margin-top: 5px;
    margin-right: 10px;
    margin-left: 6px;
    font-size: 13px;
    display: block;
    color: #858ca5;
    width: auto
}

.feedbackCon .blog_comment_body a {
    color: #FE9600
}

.feedbackCon .blog_comment_body img {
    border-radius: 3px
}

.feedbackCon .comment_vote {
    margin-top: 12px
}

.feedback_area_title {
    border-bottom: 1px solid #EEF2F8;
    margin-bottom: 15px;
    font-size: 13px;
    font-weight: 300;
    padding-left: 0;
    padding-bottom: 5px
}

.commentform #commentform_title {
    background-image: none;
    padding-left: 0;
    font-size: 20px
}

.commentform #tip_comment {
    color: #f37f7f !important;
    margin: 15px 0;
    display: block
}

.commentform .commentbox_title .commentbox_title_right {
    height: 30px;
    float: left
}

.commentform .commentbox_title .comment_icon {
    width: 16px;
    height: 16px;
    border: 1px solid #EEF2F8;
    border-radius: 3px;
    background-color: #fff;
    padding: 3px;
    cursor: pointer
}

.commentform .comment_textarea {
    width: 100% !important;
    height: 200px !important;
    border: 1px solid #EEF2F8;
    border-radius: 6px;
    padding: 5px;
    font-family: inherit;
    font-size: 15px;
    resize: none;
    box-sizing: border-box;
    background-color: transparent;
    color: #61687C
}

.commentform .comment_textarea:focus {
    outline: 0
}

.commentform .comment_textarea:hover, .commentform .comment_textarea:focus {
    border-color: #FE9600;
    position: relative;
    background: url(https://img2018.cnblogs.com/blog/1646268/201907/1646268-20190719134948147-1816156553.png) right -6px top;
    background-size: 200px;
    background-repeat: no-repeat;
}

.commentform #commentbox_opt {
    display: block
}

.commentform #commentbox_opt a {
    color: #61687C
}

.commentform #btn_comment_submit {
    width: auto;
    height: auto;
    border-width: 0;
    cursor: pointer;
    color: #fff;
    background-color: #FE9600;
    border-color: #FE9600;
    user-select: none;
    padding: 5px 20px;
    font-size: 12px;
    border-radius: 5px;
    transition: color .2s linear, background-color .2s linear, border .2s linear, box-shadow .2s linear
}

.commentform #btn_comment_submit:hover {
    opacity: .7
}

.commentform .comment_my_posted > img {
    display: none
}

.commentform .comment_my_posted > a b {
    font-size: 16px;
    font-weight: 300
}

.commentform .bq_post_comment {
    margin-top: 5px;
    font-size: 13px;
    display: block;
    color: #858ca5;
    background-color: #ffecf4;
    border: none;
    border-radius: 3px
}

.github-corner:hover .octo-arm {
    animation: octocat-wave 560ms ease-in-out
}

@keyframes octocat-wave {
    0%, 100% {
        transform: rotate(0)
    }
    20%, 60% {
        transform: rotate(-25deg)
    }
    40%, 80% {
        transform: rotate(10deg)
    }
}

/*滚动条*/
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
    background-color: #eee;
}

::-webkit-scrollbar-thumb {
    border-radius: 1px;
    background: #FE9600;
}

::-webkit-scrollbar-track {
    background: 0 0;
    border-radius: 1px
}

::-moz-selection, ::selection {
    color: #FE9600
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@media screen and (min-width: 768px) and (max-width: 980px) {
    #blog-comments-placeholder, #comment_form {
        padding: 10px;
        margin-left: 0
    }
}

@media only screen and (max-width: 767px) {
    #home {
        font-size: 12px !important
    }

    #mainContent .forFlow {
        padding-top: 15px
    }

    #sideBar, .esa-catalog, .postDesc {
        display: none
    }

    .postBody {
        padding: 0 !important
    }

    #main {
        margin-top: 60px;
        padding: 0 15px !important
    }

    #topics .postTitle {
        padding-left: 0 !important;
        padding-top: 10px
    }

    #cnblogs_post_body table {
        display: table !important
    }

    #cnblogs_post_body img {
        width: 100%;
        max-width: none !important
    }

    #comment_nav, #commentbox_main {
        margin: 0
    }

    #comment_form {
        padding: 5px;
        margin-left: 0
    }

    .esa-mobile-menu {
        display: block
    }

    .forFlow {
        margin-right: 0;
        margin-left: 0 !important
    }

    .feedbackItem .feedbackManage {
        width: auto
    }

    .github-corner {
        display: none
    }
}

@media only screen and (max-width: 410px) {
    #div_digg {
        display: grid;
        width: 100%
    }

    #div_digg .buryit, #div_digg .diggit, #div_digg .favorite, #div_digg .reward {
        margin: 5px 0
    }
}

.c-notice {
    padding: 10px 0;
    background: tan;
    font-size: 0.9em;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16), 0 2px 6px rgba(0, 0, 0, 0.23);
    font-size: 15px;
    text-align: center;
}

.c-portrait {
    text-align: center;
    padding: 50px 0;
    background: #39424b;
    color: #fff;
    margin-bottom: -40px;
    text-align: center;
}

#showsectime {
    font-size: 15px
}

#showsectime:before {
    content: '💕';
}

/**修改选择背景色*/
::selection {
    background: #E5F4FE;
    color: #384654;
}

::-moz-selection {
    background: #E5F4FE;
    color: #384654;
}

/**小工具*/
div.info {
    margin: 1.75em 0;
    padding: .85em 1em;
    font-size: .85em;
    color: #444;
    border-radius: .55em;
    position: relative;
    min-height: 4.7em;
    padding-left: 4.7em !important;
    background-color: #d9edf7;
}

div.info:before {
    content: "\f05a";
    font-family: FontAwesome;
}

div.info:before {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 100%;
    padding: 0em .25em;
    font-size: 3.5em;
    color: #70bbe1;
}

div.info.important {
    background-color: #f2dede;
}

div.info.important:before {
    color: #ce8383;
}

div.info.note {
    background-color: #dff0d8;
}

div.info.note:before {
    color: #93cd7c;
    content: "\f00c";
}

#cnblogs_post_body p {
    margin: 17px auto !important;
    text-indent: 0;
}

#Snow {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99999;
    background: rgba(125, 137, 95, 0.1);
    pointer-events: none;
}

/*溢出隐藏设置*/
#topics, #mainContent {
    overflow: visible;
}

#postDesc {
    float: none;
}

#waifu-toggle {
    position: fixed;
    writing-mode: vertical-rl;
    bottom: 70px;
    left: 0px;
    background-color: #fa0;
    color: #fff;
    border-radius: 5px;
    padding: 5px;
    font-size: 12px;
    width: 50px;
    cursor: pointer;
}

/*主页样式*/
/**主页头图*/
.main-header {
    display: table;
    width: 100%;
    height: 100vh;
    max-height: 100vh;
    text-align: center;
    background-image: url(https://img2018.cnblogs.com/blog/1646268/201908/1646268-20190806114008215-138720377.jpg);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    box-shadow: 0 1px 2px rgba(150, 150, 150, .7);
}

/*下拉*/
.scroll-down {
    display: block;
    position: absolute;
    bottom: 80px;
    left: 50%;
    margin-left: -16px;
    width: 34px;
    height: 34px;
    font-size: 34px;
    text-align: center;
    animation: float 2s linear infinite;
    text-decoration: none !important;
    color: white !important;
    z-index: 1000;
}

.hidden {
    text-indent: -9999px;
    visibility: hidden;
    display: none;
}

@-webkit-keyframes bounce {
    0%, 10%, 25%, 40%, 50% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    20% {
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px);
    }
    30% {
        -webkit-transform: translateY(-5px);
        transform: translateY(-5px);
    }
}

@keyframes bounce {
    0%, 10%, 25%, 40%, 50% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    20% {
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px);
    }
    30% {
        -webkit-transform: translateY(-5px);
        transform: translateY(-5px);
    }
}

@keyframes float {
    0% {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
    50% {
        -webkit-transform: translateY(-6px);
        -ms-transform: translateY(-6px);
        transform: translateY(-6px);
    }
    100% {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
}

/*网格遮罩*/
.headertop {
    overflow: hidden;
    height: 0;
}

.headertop, .pattern-center {
    animation: header 1s;
}

.headertop.filter-dot:before {
    background-image: url(https://img2018.cnblogs.com/blog/1646268/201908/1646268-20190806130657359-228955661.png);
}

.headertop:before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 3;
    background-attachment: fixed;
}

/*左上角标题*/
.site-branding {
    float: left;
    position: fixed;
    top: 10px;
    height: 75px;
    line-height: 75px;
    z-index: 1000;
}

.site-branding {
    animation: sitetop 1s;
}

.moe-mashiro {
    font-family: 'Moe-Mashiro', 'Merriweather Sans', Helvetica, Tahoma, Arial, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft Yahei', 'WenQuanYi Micro Hei', sans-serif;
}

.logolink.moe-mashiro a {
    color: #464646;
    float: left;
    font-size: 25px;
    font-weight: 800;
    height: 56px;
    line-height: 56px;
    padding-left: 12px;
    padding-right: 15px;
    text-decoration-line: none;
}

.logolink ruby {
    ruby-position: under;
    -webkit-ruby-position: after;
}

.logolink.moe-mashiro .sakuraso, .logolink.moe-mashiro .no {
    font-size: 25px;
    border-radius: 9px;
    padding: 5px 0px 0px 2px;
}
.site-branding a:hover .no {
    -webkit-animation: spin 1.5s linear infinite;
    animation: spin 1.5s linear infinite
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }
    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg)
    }
}

@keyframes spin {
    0% {
        -webkit-transform: rotate(0);
        -ms-transform: rotate(0);
        transform: rotate(0)
    }
    100% {
        -webkit-transform: rotate(359deg);
        -ms-transform: rotate(359deg);
        transform: rotate(359deg)
    }
}
.logolink .sakuraso {
    background-color: rgba(255, 255, 255, .5);
    border-radius: 5px;
    color: #464646;
    height: auto;
    line-height: 25px;
    margin-right: 0;
    padding-bottom: 0;
    padding-top: 1px;
    text-size-adjust: 100%;
    width: auto;
}

.chinese-font {
    display: none;
    margin-top: -5px;
}

/*主页博主信息*/
.focusinfo {
    position: absolute;
    max-width: 800px;
    padding: 0 10px;
    top: 49.3%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    text-align: center;
    z-index: 99;
    -webkit-transition: .4s ease all;
    -moz-transition: .4s ease all;
    -o-transition: .4s ease all;
    transition: .4s ease all;
}

.center-text {
    margin: auto;
    font-family: 'Ubuntu', sans-serif;
    font-size: 80px;
    text-transform: uppercase;
    font-weight: 800;
}

.glitch {
    position: relative;
    color: #fff;
    mix-blend-mode: lighten
}

.glitch:before, .glitch:after {
    position: absolute;
    top: 0;
    width: 100%;
    background: rgba(0, 0, 0, 0);
    clip: rect(0, 0, 0, 0)
}

.glitch:before {
    left: -1px;
    text-shadow: 1px 0 #ff3f1a
}

.glitch:after {
    left: 1px;
    text-shadow: -1px 0 #00a7e0
}

.glitch:hover:before {
    content: attr(data-text);
    text-shadow: 4px 0 #ff3f1a;
    animation: glitch-loop-1 .8s infinite ease-in-out alternate-reverse
}

.glitch:hover:after {
    content: attr(data-text);
    text-shadow: -5px 0 #00a7e0;
    animation: glitch-loop-2 .8s infinite ease-in-out alternate-reverse
}

@-webkit-keyframes glitch-loop-1 {
    0% {
        clip: rect(36px, 9999px, 9px, 0)
    }
    25% {
        clip: rect(25px, 9999px, 99px, 0)
    }
    50% {
        clip: rect(50px, 9999px, 102px, 0)
    }
    75% {
        clip: rect(30px, 9999px, 92px, 0)
    }
    100% {
        clip: rect(91px, 9999px, 98px, 0)
    }
}

@keyframes glitch-loop-1 {
    0% {
        clip: rect(36px, 9999px, 9px, 0)
    }
    25% {
        clip: rect(25px, 9999px, 99px, 0)
    }
    50% {
        clip: rect(50px, 9999px, 102px, 0)
    }
    75% {
        clip: rect(30px, 9999px, 92px, 0)
    }
    100% {
        clip: rect(91px, 9999px, 98px, 0)
    }
}

@-webkit-keyframes glitch-loop-2 {
    0% {
        top: -1px;
        left: 1px;
        clip: rect(65px, 9999px, 119px, 0)
    }
    25% {
        top: -6px;
        left: 4px;
        clip: rect(79px, 9999px, 19px, 0)
    }
    50% {
        top: -3px;
        left: 2px;
        clip: rect(68px, 9999px, 11px, 0)
    }
    75% {
        top: 0;
        left: -4px;
        clip: rect(95px, 9999px, 53px, 0)
    }
    100% {
        top: -1px;
        left: -1px;
        clip: rect(31px, 9999px, 149px, 0)
    }
}

@keyframes glitch-loop-2 {
    0% {
        top: -1px;
        left: 1px;
        clip: rect(65px, 9999px, 119px, 0)
    }
    25% {
        top: -6px;
        left: 4px;
        clip: rect(79px, 9999px, 19px, 0)
    }
    50% {
        top: -3px;
        left: 2px;
        clip: rect(68px, 9999px, 11px, 0)
    }
    75% {
        top: 0;
        left: -4px;
        clip: rect(95px, 9999px, 53px, 0)
    }
    100% {
        top: -1px;
        left: -1px;
        clip: rect(31px, 9999px, 149px, 0)
    }
}

.header-info {
    width: 100%;
    margin: auto;
    font-size: 16px;
    color: #eaeadf;
    background: rgba(0, 0, 0, .5);
    padding: 15px;
    margin-top: 22px;
    letter-spacing: 0;
    line-height: 30px;
    border-radius: 10px;
    box-sizing: initial;
    white-space: nowrap;
}

.header-info:before {
    content: "";
    position: absolute;
    top: 98px;
    left: 20%;
    margin-left: -15px;
    border-width: 15px;
    border-style: solid;
    border-color: transparent transparent rgba(0, 0, 0, .5) transparent;
}

.header-info p {
    margin: 0;
    font-family: 'Ubuntu', sans-serif;
    font-weight: 700;
}

.top-social_v2 {
    height: 35px;
    margin-bottom: -15px;
    margin-left: 10px;
    list-style: none;
    display: inline-block;
}

.top-social_v2 li {
    float: left;
    margin-right: 13px;
}

.top-social_v2 img {
    height: 30px;
    width: 30px;
    padding: 6px;
    background: 0 0;
}

.flipx {
    -moz-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    transform: scaleX(-1);
}

/*波浪特效*/
.wave {
    position: absolute;
    height: 110px;
    width: 100%;
    overflow: hidden;
    bottom: 0;
    z-index: 99;
}

.wave #banner_wave_1, .wave #banner_wave_2 {
    position: absolute;
    width: 200%;
    height: 100%;
    background-size: 50% 100%;

}

.wave #banner_wave_1 {
    top: 20px;
    left: -100%;
    opacity: 1;
    animation: water-right 20s infinite linear;
    background: url(https://img2018.cnblogs.com/blog/1646268/201908/1646268-20190807133952249-1243696775.png) repeat-x;
}

.wave #banner_wave_2 {
    top: 30px;
    left: 0;
    opacity: 1;
    animation: water-left 30s infinite linear;
    background: url(https://img2018.cnblogs.com/blog/1646268/201908/1646268-20190807133945197-1434861417.png) repeat-x;
}

@keyframes water-right {
    0% {
        transform: translateX(0) translateZ(0) scaleY(1)
    }
    50% {
        transform: translateX(25%) translateZ(0) scaleY(0.85)
    }
    100% {
        transform: translateX(50%) translateZ(0) scaleY(1)
    }
}

@keyframes water-left {
    from {
        transform: translate(0%, 0px);
    }
    to {
        transform: translate(-50%, 0px);
    }
}

/*阅读页样式*/
/*头图*/
.pattern-center {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    overflow: hidden;
}

.pattern-center:before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.pattern-attachment-img {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    background-origin: border-box;
    width: 100%;
    height: 500px;
}

.pattern-center header.pattern-header {
    position: absolute;
    top: 45%;
    left: 0;
    right: 0;
    text-align: center;
    color: #fff;
    text-shadow: 2px 2px 10px #000;
    z-index: 1;
}

.pattern-center h1.cat-title, .pattern-center h1.entry-title {
    color: #fff;
    font-size: 40px;
    font-weight: 500;
    width: 80%;
    margin: auto;
    padding: 0;
    border: 0;
}

.pattern-center:after {
    content: '';
    width: 150%;
    height: 4.375rem;
    background: #fff;
    left: -25%;
    bottom: -2.875rem;
    border-radius: 100%;
    position: absolute;
}

/*随笔页样式*/
.single-center:after {
    display: none
}

header.single-header {
    max-width: 800px;
    padding: 0 10px;
    margin-left: auto;
    margin-right: auto;
    text-align: left !important;
    top: auto !important;
    bottom: 20px
}

.single-center .single-header h1.entry-title {
    margin: 0;
    font-size: 32px;
    width: 100%
}

.single-center .entry-census {
    color: #fff;
    font-size: 14px;
    padding: 18px 0 0;
    line-height: 39px
}

.single-center .entry-census .bull {
    margin: 0 5px
}

.single-center .entry-census span img {
    width: 35px;
    height: 35px;
    border-radius: 100%;
    float: left;
    margin-right: 12px
}

.single-center .entry-census a {
    color: #fff
}

@media (max-width: 860px) {
    .pattern-center-sakura header.single-header {
        padding: 0 4%
    }

    .pattern-attachment-img {
        height: 280px
    }

    .pattern-center-sakura h1.cat-title, .pattern-center-sakura h1.entry-title, .single-center .single-header h1.entry-title {
        font-size: 26px
    }
}

/*回到顶部动画*/
.cd-top {
    position: fixed;
    left: 25px;
    top: -900px;
    z-index: 99;
    width: 70px;
    height: 900px;
    background: url(https://img2018.cnblogs.com/blog/1646268/201908/1646268-20190808095655186-266655888.png) no-repeat center;
    background-size: contain;
    -webkit-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
    opacity: 1
}

.cd-top.cd-is-visible {
    opacity: 1;
    top: -326px
}

.cd-top.cd-fade-out {
    opacity: 1
}

.cd-top:hover {
    opacity: 1
}

.cd-top span {
    display: none;
    color: #000;
    position: absolute;
    bottom: 0;
    height: 20px;
    width: 50px;
    text-align: center
}

@media screen and (max-width: 860px) {
    .cd-top {
        display: none;
        height: 60px;
        width: 50px
    }

    .cd-top span {
        height: 10px;
        width: 50px
    }
}

.faa-parent.animated-hover:hover > .faa-spin, .faa-spin.animated, .faa-spin.animated-hover:hover {
    -webkit-animation: spin 1.5s linear infinite;
    animation: spin 1.5s linear infinite
}

.faa-parent.animated-hover:hover > .faa-spin.faa-fast, .faa-spin.animated-hover.faa-fast:hover, .faa-spin.animated.faa-fast {
    -webkit-animation: spin .7s linear infinite;
    animation: spin .7s linear infinite
}

.faa-parent.animated-hover:hover > .faa-spin.faa-slow, .faa-spin.animated-hover.faa-slow:hover, .faa-spin.animated.faa-slow {
    -webkit-animation: spin 2.2s linear infinite;
    animation: spin 2.2s linear infinite
}

@-webkit-keyframes float {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    50% {
        -webkit-transform: translateY(-6px);
        transform: translateY(-6px)
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes float {
    0% {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
    50% {
        -webkit-transform: translateY(-6px);
        -ms-transform: translateY(-6px);
        transform: translateY(-6px)
    }
    100% {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
}

.faa-float.animated, .faa-float.animated-hover:hover, .faa-parent.animated-hover:hover > .faa-float {
    -webkit-animation: float 2s linear infinite;
    animation: float 2s linear infinite
}

.faa-float.animated-hover.faa-fast:hover, .faa-float.animated.faa-fast, .faa-parent.animated-hover:hover > .faa-float.faa-fast {
    -webkit-animation: float 1s linear infinite;
    animation: float 1s linear infinite
}

.faa-float.animated-hover.faa-slow:hover, .faa-float.animated.faa-slow, .faa-parent.animated-hover:hover > .faa-float.faa-slow {
    -webkit-animation: float 3s linear infinite;
    animation: float 3s linear infinite
}

/*随笔列表*/
.day {
    display: none;
}
.notice, .top-feature, .post-list-thumb, .post-list, .comments {
    animation: main .6s
}

@keyframes main {
    0% {
        opacity: 0;
        transform: translateY(50px)
    }
    100% {
        opacity: 1;
        transform: translateY(0)
    }
}
.post-list-thumb {
    float: left;
    width: 100%;
    height: 300px;
    position: relative;
    margin: 20px 0 20px;
    border-radius: 10px;
    background-color: rgba(255, 255, 255, 0);
    box-shadow: 0 1px 20px -6px rgba(0, 0, 0, .5);
    transition: box-shadow .3s ease
}

@media (min-width: 860px) {
    .post-list-thumb:hover {
        box-shadow: 0 5px 10px 5px rgba(110, 110, 110, .4)
    }
}

@media (max-width: 860px) {
    .post-list-thumb {
        margin: 0;
        height: auto
    }
}

.post-list-thumb i {
    margin-right: 5px;
    color: #989898;
    font-size: 14px
}

.post-list-thumb a {
    color: #504e4e
}

.post-content .post-title {
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    word-wrap: break-word;
    font-size: 18px;
    margin: 15px 0;
    font-weight: 600
}

.postTitle2 {
    text-decoration: none;
}

.post-date, .post-meta, .post-meta a {
    color: #888;
    font-size: 12px
}

.comments-number {
    margin: 0 10px
}

.post-thumb {
    position: relative;
    float: right;
    width: 55%
}

.post-thumb a {
    height: 300px;
    position: absolute;
    display: block;
    background-repeat: no-repeat;
    background-size: cover;
    overflow: hidden;
    border-radius: 0 10px 10px 0
}

.post-thumb a img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    pointer-events: none;
    transition: all .6s
}

.post-list-thumb:hover img {
    transform: scale(1.1)
}

.post-content-wrap {
    position: relative;
    display: inline-block;
    float: left;
    padding-right: 30px;
    padding-left: 0;
    width: 36%;
    margin: 20px 30px 0
}

.float-content {
    position: relative;
    width: 100%;
    right: 0;
    margin: 0;
    padding: 0;
    z-index: 50;
    color: rgba(0, 0, 0, .66)
}

.float-content .post-text {
    display: inline-block;
    text-align: justify;
    font-size: 14px
}

.float-content i {
    font-size: 25px;
    color: #666;
    margin-right: 20px
}

.float-content p {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
    height: 67.5px;
    overflow: hidden;
    margin: 20px 0px 40px;
    line-height: 25px;
}

/*图片在左侧*/
.post-list-thumb-left .post-content-wrap {
    float: right;
    padding-left: 30px;
    padding-right: 0;
    text-align: right;
    margin: 20px 10px 10px 0
}

.post-list-thumb-left .post-thumb {
    float: left
}

.post-list-thumb-left .post-thumb a {
    border-radius: 10px 0 0 10px
}

@media (max-width: 768px) {
    .float-content p {
        height: auto;
        display: block
    }

    .post-bottom {
        display: none
    }

    .post-list-thumb {
        padding: 0;
        border: 0;
        box-shadow: none
    }

    .post-thumb, .post-content-wrap, .float-content {
        width: 100%;
        left: 0
    }

    .post-content-wrap, .post-list-thumb-left .post-content-wrap {
        text-align: left;
        margin: 0;
        padding: 20px;
        float: none;
        box-shadow: none;
        border-top: 0
    }

    .post-list-thumb:before {
        content: '';
        width: 1px;
        height: 100px;
        background-color: rgba(0, 0, 0, 0);
        position: absolute;
        left: 0;
        right: 0;
        margin: auto;
        bottom: -101px;
        z-index: 0
    }

    .float-content {
        box-shadow: none;
        padding: 0;
        margin: 0
    }

    .post-bottom {
        text-align: right
    }

    .post-list-thumb-left .post-thumb a, .post-thumb a {
        border-radius: 10px
    }
}

@media (max-width: 600px) {
    .post-thumb a {
        height: 210px
    }

    .float-content .post-text {
        font-size: 13px;
        margin-bottom: 1em
    }
}

.post-list-show {
    animation: post-list-show .5s;
    -webkit-animation: post-list-show .5s;
    opacity: 1
}

@keyframes post-list-show {
    0% {
        opacity: 0;
        -webkit-transform: translateY(80px);
        transform: translateY(80px)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}
/*notice*/
.notice {
    padding: 20px 0px 20px 20px;
    border: 1px dashed #e6e6e6;
    color: #969696;
    position: relative;
    display: inline-block;
    width: 780px;
    background: #fbfbfb50;
    border-radius: 10px;
    font-size: 15px;
}

.notice i {
    float: left;
    color: #999;
    font-size: 18px;
    padding-right: 10px
}

.notice-content {
    display: initial;
    vertical-align: middle
}

@media (max-width: 860px) {
    .notice {
        margin-top: 40px;
        margin-bottom: 20px
    }
}
/*myHeart*/
.myheart {
    color: red;
    font-size: 35px;
}

.throb:before {
    font-style: normal;
    font-weight: normal;
    speak: none;
    display: inline-block;
    text-decoration: inherit;
    width: 1em;

    text-align: center;
    font-variant: normal;
    text-transform: none;
    line-height: 1em;

    -webkit-animation-name: scaleDraw; /*关键帧名称*/
    -webkit-animation-timing-function: ease-in-out; /*动画的速度曲线*/
    -webkit-animation-iteration-count: infinite; /*动画播放的次数*/
    -webkit-animation-duration: 5s; /*动画所花费的时间*/

}

@keyframes scaleDraw { /*定义关键帧、scaleDrew是需要绑定到选择器的关键帧名称*/
    0% {
        transform: scale(1); /*开始为原始大小*/
    }
    25% {
        transform: scale(1.5); /*放大1.1倍*/
    }
    50% {
        transform: scale(1);
    }
    75% {
        transform: scale(1.5);
    }
}
/*标签ui*/
#navigator li ul {
    display: none;
    opacity: 1;
    position: absolute;
    background: #fff;
    padding: 10px;
    top: 46px;
    right: -13px;
    width: 60px;
    text-align: center;
    z-index: 9999;
    border-radius: 5px;
    box-shadow: 0 1px 40px -8px rgba(0, 0, 0, .5);
    -webkit-animation: fadeInUp .3s .1s ease both;
    -moz-animation: fadeInUp .3s .1s ease both
}

#navigator li ul:before {
    content: "";
    position: absolute;
    top: -20px;
    left: 50%;
    margin-left: -10px;
    border-width: 10px;
    border-style: solid;
    border-color: transparent transparent #fff
}

@-webkit-keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translateY(10px)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0)
    }
}

@-moz-keyframes fadeInUp {
    0% {
        opacity: 0;
        -moz-transform: translateY(10px)
    }
    100% {
        opacity: 1;
        -moz-transform: translateY(0)
    }
}

#navigator li:hover ul {
    display: inline-block;
    -webkit-transition: all .4s;
    transition: all .4s
}

#navigator li ul li {
    width: 100%;
    margin: 0;
    -webkit-transition: all 1s ease;
}
.sub-menu {
    top: 70px!important;
}
.sub-menu a {
    padding: 10px 0!important;
}
.sub-menu i {
    width: 20%!important;
    margin-left: -20px;
}
.sub-menu .iconfont {
    font-size: 22px;
}

/*滚动条总进度*/
.scrollCls {
    position: fixed;
    top: 0;
    height: 3px;
    background: orange;
    transiton-property: width,background;
    transition-duration: 1s,1s;
    z-index: 99999;
}

/*aplayer*/
/*.ap {*/
/*left: -66px!important;*/
/*}*/
/*.ap:hover {*/
/*left: 0px!important;*/
/*}*/
/*赞赏*/
.esa-sponsor {
    position: relative;
    width: 100%;
    height: 160px
}

.esa-sponsor .posa {
    position: absolute
}

.esa-sponsor .tr3 {
    transition: all .3s
}

.esa-sponsor .blur {
    -webkit-filter: blur(3px);
    filter: blur(3px)
}

.esa-sponsor .text {
    position: absolute;
    left: calc(50% - 120px);
    top: calc(50% - 60px);
    font-size: 12px;
    width: 70px;
    height: 70px;
    line-height: 70px;
    color: #fff;
    background: #ffd886 url(http://images.cnblogs.com/cnblogs_com/esofar/1504962/o_like.png) no-repeat center 10px;
    background-size: 20px;
    border-radius: 35px;
    text-align: center;
    z-index: -1;
    transform: rotatez(-15deg)
}

.esa-sponsor .github {
    position: absolute;
    left: calc(50% + 135px);
    top: calc(50% - 30px);
    width: 24px;
    height: 24px;
    background: no-repeat center center url(http://images.cnblogs.com/cnblogs_com/esofar/1504962/o_github.png);
    background-size: contain;
    opacity: .3;
    transform: rotatez(15deg)
}

.esa-sponsor .box {
    left: calc(50% - 150px);
    top: calc(50% - 15px);
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 6px;
    width: 299px;
    height: 28px;
    float: left;
    z-index: 1;
    margin-left: 0
}

.esa-sponsor .box li {
    width: 99px;
    float: left;
    margin: 0 !important;
    text-align: center;
    border-left: 1px solid #ddd;
    background: no-repeat center center;
    background-color: rgba(204, 217, 220, .1);
    background-size: 45px;
    transition: all .3s;
    cursor: pointer;
    overflow: hidden;
    line-height: 600px;
    height: 28px;
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
    opacity: .5;
    list-style: none;
    list-style-type: none;
    margin: 0;
    padding: 0
}

.esa-sponsor .box li:hover {
    background-color: rgba(204, 217, 220, .3);
    -webkit-filter: grayscale(0);
    filter: grayscale(0);
    opacity: 1
}

.esa-sponsor .box li:first-child {
    border-width: 0
}

.esa-sponsor .box li a {
    display: block
}

.esa-sponsor .box .paypal {
    background-image: url(http://images.cnblogs.com/cnblogs_com/esofar/1504962/o_paypal.png)
}

.esa-sponsor .box .alipay {
    background-image: url(http://images.cnblogs.com/cnblogs_com/esofar/1504962/o_alipay.png)
}

.esa-sponsor .box .wechat {
    background-image: url(http://images.cnblogs.com/cnblogs_com/esofar/1504962/o_wechat.png)
}

.esa-sponsor #QRBox {
    top: 0;
    left: 0;
    z-index: 1;
    background-color: rgba(255, 255, 255, .3);
    display: none;
    perspective: 400px;
    width: 100%;
    height: 100%
}

.esa-sponsor #QRBox #MainBox {
    cursor: pointer;
    position: absolute;
    text-align: center;
    width: 200px;
    height: 200px;
    left: calc(50% - 100px);
    top: calc(50% - 100px);
    background: #fff no-repeat center center;
    background-size: 190px;
    border-radius: 6px;
    box-shadow: 0 2px 7px rgba(0, 0, 0, .3);
    opacity: 0;
    transition: all 1s ease-in-out;
    transform-style: preserve-3d;
    transform-origin: center center;
    overflow: hidden
}

.esa-sponsor #MainBox.showQR {
    opacity: 1;
    animation-name: showQR;
    animation-duration: 3s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    -webkit-animation: showQR 3s ease-in-out 0s 1 normal forwards
}

@keyframes showQR {
    from {
        transform: rotateX(90deg)
    }
    8% {
        opacity: 1;
        transform: rotateX(-60deg)
    }
    18% {
        opacity: 1;
        transform: rotateX(40deg)
    }
    34% {
        opacity: 1;
        transform: rotateX(-28deg)
    }
    44% {
        opacity: 1;
        transform: rotateX(18deg)
    }
    58% {
        opacity: 1;
        transform: rotateX(-12deg)
    }
    72% {
        opacity: 1;
        transform: rotateX(9deg)
    }
    88% {
        opacity: 1;
        transform: rotateX(-5deg)
    }
    96% {
        opacity: 1;
        transform: rotateX(2deg)
    }
    to {
        opacity: 1
    }
}

.esa-sponsor #MainBox.hideQR {
    opacity: 1;
    animation-name: hideQR;
    animation-duration: .5s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    -webkit-animation: hideQR .5s ease-in-out 0s 1 normal forwards
}

@keyframes hideQR {
    20%, 50% {
        transform: scale(1.08, 1.08);
        opacity: 1
    }
    to {
        opacity: 0;
        transform: rotateZ(40deg) scale(.6, .6)
    }
}

侧边栏

页脚
```

系列二

CSS

/*导入字体符号*/
@import url(https://cdn.jsdelivr.net/npm/font-awesome/css/font-awesome.min.css) screen and (min-width:0px);
@import url(https://at.alicdn.com/t/font_438759_kmvtb0te1nd.css) screen and (min-width:0px);



/* 主题全局变量 */
@media screen and (min-width:0px) {
  :root {

    /* 色卡 */
    --default:#00a1d6;  /* 默认 */
    --green:#109D58; /* 酷安绿 */
    --red:#DC4437; /* 姨妈红 */
    --pink:#FA7298; /* 哔哩粉 */
    --cyan:#009788; /* 水鸭青 */
    --orange:#FF9700; /* 伊藤橙 */
    --purple:#673BB7; /* 基佬紫 */
    --blue:#2196F3; /* 知乎蓝 */
    --gray:#607D8B; /* 低调灰 */

    /* 主题基础色调 */
   --ThemeColor:var(--default);
    --TextColor1: #4d4d4d;
    --TextColor2: #5f5f6b;
    --TextColor3: #97979f;
    --DividColor: #e7eaf0;
    --BlockColor: #fff;
    --BackgroundColor: #f4f6fa;

    /* light */


    /* dark */
    --DarkTextColor1: #4d4d4d;
    --DarkTextColor2: #5f5f6b;
    --DarkTextColor3: #97979f;
    --DarkDividColor: #e7eaf0;
    --DarkBlockColor: #fff;
    --DarkBackgroundColor: #f4f6fa;

    /* 主题辅助色调 */
    --AidColor1: #fa7d00;
    --AidColor2: #ff2e2e;
    --AidColor3: #36c67d;

    /* 字号大小 */
    --text1: 28px;
    --text2: 26px;
    --text3: 24px;
    --text4: 22px;
    --text5: 20px;
    --text6: 18px;
    --text7: 16px;
    --text8: 14px;
    --text9: 12px;
    --text10:10px;

    /* 资源链接 */
    --picture:url("https://images.cnblogs.com/cnblogs_com/gshang/1453531/o_2002231249006f9a87730f36a2856490a1ed90c56f9d.jpg");  
    --gradient:linear-gradient(var(--ThemeColor),var(--BlockColor));

    /* 博客头像 */
    --Avatar: url("https://img2018.cnblogs.com/blog/1489774/201912/1489774-20191227184718385-1756034612.jpg");

    /* 头部背景 */
    --BackgroundImg: var(--picture);

    /* blogTitle 高度 */
    --fit: fit-content;
    --max:100vh;
    --blogTitleHeight:var(--fit);
  }
}

/* 全局样式 */
@media screen and (min-width:0px){
  /* 去广告 */
 #ad_c1,
  #ad_c2,
  #ad_t2,.c_ad_block
 {
    display: none
  }

img{
max-width:100%!important;
vertical-align:middle;
}
body,h1,h2,h3,h4,h5,h6,h7,p,ul{
margin:0;
padding:0;
}
body{
background:var(--BackgroundColor);
}
.div_my_zzk{
margin:0!important;
}
*{
box-sizing:border-box;
margin:0;
padding:0;
}

#home{
font-size:var(--text7);
transition: all 100ms ease-in-out;
overflow:hidden!important;
-webkit-transition: all 100ms ease-in-out;
}

  a {
    text-decoration: none;
    color: inherit;
    word-break:break-all;
  }

  a:hover {
    color: var(--ThemeColor)
  }

#home  blockquote {
    border: none;
    color: var(--TextColor2)!important;
    margin: 10px 0;
    padding: 0 0 0 10px;
   height:auto!important;
    min-height: 20px;
    border-left: 4px solid var(--TextColor2);
  }

#home ul{
    list-style-type: disc;
   word-break:break-all;
  }
#home ul ul {
    list-style-type: circle;
  }
#home ul ul ul{
    list-style-type: square;
  }
#home ul ul li{
    list-style-type: circle;
  }
#home ul ul ul li {
    list-style-type: square;
  }

#home pre{
    color: #cfcecf;
background-color: #2d3748;
    border-radius: 4px;
margin:10px 0;
   font-family: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace!important;
    border: none !important;
    padding: 30px 10px 20px!important;
    position: relative;
}
 #home  pre:after{
    content:attr(class);
    position:absolute;
    display:block;
    z-index:2;
    right:8px;
    top:4px;
    font-size:var(--text8);
  }
 #home  pre:before{
    content:"";
    display:block;
    width:8px;
    position:absolute;
    top:8px;
    left:8px;
    height:8px;
    background-color:#f56565;
    border-radius:9999px;
    box-shadow:10px 0 0 0 #fbd38d,20px 0 0 0 #48bb78
  }
pre code{
background-color:inherit!important;
color:inherit!important;
}

#home fieldset{
border-width:0 0 0 4px;
padding:0 0 0 10px;
margin:6px 0;
color:var(--TextColor2);
border-color:var(--TextColor2);
}
#home fieldset legend{
display:none;
}
}
/***************/
@keyframes pulse {
  from {
    opacity: 1;
    transform: scale(2);
  }
  to {
    opacity: .25;
    transform: scale(.75);
  }
}
.hide{
display:none;
}
.block{

}
#loading{
  position:absolute;
  top:0;right:0;left:0;bottom:0;
  width:100%;
  height:100%;
  background:var(--BlockColor);
  display:flex;
  flex-direction:columns;
  align-items:center;
  z-index:9999999999;
  justify-content:center;
  }
.pulse-container {
  width: 150px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
 
.pulse-bubble {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: var(--ThemeColor);
}
 
.pulse-bubble-1 {
    animation: pulse .4s ease 0s infinite alternate;
}
.pulse-bubble-2 {
    animation: pulse .4s ease .2s infinite alternate;
}
.pulse-bubble-3 {
    animation: pulse .4s ease .4s infinite alternate;
}
/********/
/* #home */
@media screen and (min-width:0px){
#home{
margin:0!important;
padding:0!important;
background:var(--BackgroundColor);
display:grid;
grid-template-columns:100%;
grid-gap:10px;
}
}
/***************/
/* header */
@media screen and (min-width:0px) {
#header{
width:100%;
padding:0!important;
margin:0!important;
background-color:var(--BlockColor);
/*box-shadow: 0 0.05rem 1rem rgba(51, 51, 51, .05);*/
}
#header li{
list-style-type:none;
}
#blogTitle{
text-align:left;
padding:20px 14px;
height:var(--blogTitleHeight);
width:100vw;
display:none!important;
flex-direction:column;
align-items:center;
justify-content: center;
color:#fff!important;
background-image: var(--BackgroundImg);
background-position: center;
background-size: cover;
position:relative;
}
#blogTitle:after{
content:"";
display:block;
width:100%;
height:100%;
position:absolute;
z-index:-1;
background-image:linear-gradient(0deg, rgba(119,108,186,0.5), rgba(119,108,186,0.1));
}

#blogTitle #lnkBlogLogo{
position:relative;
z-index:1;
width:80px!important;
height:80px!important;
border-radius:100px;
border:4px solid #fff;
background-image:var(--Avatar);
background-position: center;
background-size: cover;
}

#blogTitle h1{
margin:8px 0;
padding:0;
text-shadow:2px 2px 4px rgba(0,0,0,0.2);
font-size:var(--text3);
}
#blogTitle h2{
font-size:var(--text7);
text-shadow:2px 2px 4px rgba(0,0,0,0.2);
font-weight:normal;
}


#navigator {
    width: 100%;
    height: 60px;
    padding: 0px!important;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    z-index: 99;
  }

  #navigator #navList {
    margin: 0px!important;
    padding: 0!important;
    overflow-x: auto;
    flex: auto;
    display: inline-flex;
  }

  #navigator .blogStats {
    float: right;
    line-height: 60px;
  }

  #navigator #navList li {
    list-style-type: none;
    float: left;
    margin: 0;
    padding: 0;
    display: inline-block;
  }

  #navigator #navList li a {
    line-height: 60px;
    height: 60px;
    color: inherit;
    text-decoration: none;
    margin: 0 10px;
    white-space: nowrap;
    display: block;
    /*transition: all 300ms ease;
    -webkit-transition: all 300ms ease;*/
    position: relative;
  }

  #navList li a:after {
    content: "";
    width: 0;
    margin: auto;
    display: block;
    height: 3px;
    background-color: var(--ThemeColor);
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: all 300ms ease;
    -webkit-transition: all 300ms ease;
  }

  #navList li a:hover:after {
    width: 100%;
    transition: all 300ms ease;
    -webkit-transition: all 300ms ease;
  }

  #blog_nav_sitehome:before {
    content: "\e62d";
    color: #fb7299;
    /*font-size:20px;*/
    font-family: iconfont;
  }

  #blog_nav_myhome:before {
    content: "\e626";
    color: #00c091;
    /*font-size:20px;*/
    font-family: iconfont;
  }

  #blog_nav_newpost:before {
    content: "\e628";
    color: #3c9ed1;
    /*font-size:20px;*/
    font-family: iconfont;
  }

  #blog_nav_contact:before {
    content: "\e624";
    color: #f3a034;
    /*font-size:20px;*/
    font-family: iconfont;
  }
  #blog_nav_rss{
    display:block!important;
  }
  #blog_nav_rss:before {
    content: "\e62a";
    color: #ff5d47;
    /*font-size:20px;*/
    font-family: iconfont;
  }

  #blog_nav_admin:before {
    content: "\e627";
    color: #23c9ed;
    /*font-size:20px;*/
    font-family: iconfont;
  }
.blogStats{
display:none;
}
}
/***************/
/* #main */
@media screen and (min-width:0px){
#main{
padding:0!important;
max-width:1200px!important;
width:100%!important;
margin:0 auto!important;
}
}
/***************/
@media screen and (max-width:960px){
#main{
display:grid;
padding:0!important;
grid-template-columns:100%;
grid-gap:10px;
}
}
/***************/
@media screen and (min-width:961px){
#main{
display:grid;
grid-template-columns:1fr 320px;
grid-gap:10px;
}
}
/***************/
/* #mainContent */
@media screen and (min-width:0px){
#mainContent{
/*background:orange;*/
padding:0;
margin:0;
}
}

/***************/
/* .forFlow*/
@media screen and (min-width:0px){
.forFlow{
/*background:yellow;*/
display:grid;
grid-template-columns:100%;
grid-gap:10px;
padding:0!important;
margin:0!important;
}
}

/***************/
/* .day*/
@media screen and (min-width:0px){
.day{
background:var(--BlockColor);
display:grid;
grid-template-columns:100%;
/*grid-gap:10px;*/
padding:0!important;
margin:0!important;
}
.postSeparator{
width:100%;
height:10px;
background:var(--BackgroundColor);
}
}
/***********************/
/* 随笔翻页 */
@media screen and (min-width:0px){
.topicListFooter{
padding:0!important;
margin:0!important;
background:var(--BlockColor);
}
#homepage_bottom_pager,
#homepage_top_pager{
 padding:10px 14px!important;
}
#homepage_bottom_pager {
margin-top:-10px!important;
}
#nav_next_page a{
display:block!important;
padding:10px 14px;
text-align:center;
}
#nav_next_page a:after{
content:"\f105";
font-family:FontAwesome;
}
#nav_next_page a:hover{
color:inherit;
}
}
/***************/
/* 翻页 */
@media screen and (min-width:0px){
.pager{
padding:0!important;
margin:0!important;
line-height:1.5;
}
.Pager,
#homepage_top_pager .pager,
#homepage_bottom_pager .pager{
background:var(--BlockColor);
padding:10px 14px;
margin:0;
text-align:center!important;
color:var(--TextColor2)!important;
font-size:var(--text7);
}
.Pager a,.pager a,
#homepage_top_pager .pager a,
#homepage_bottom_pager .pager a{
border:1px solid var(--DividColor);
margin:8px 4px!important;
display:inline-table;
color:var(--TextColor1)!important;
border-radius:2px;
padding:4px 8px!important;
}
.pager .current{
border:1px solid var(--ThemeColor)!important;
margin:6px 4px!important;
display:inline-table;
color:#fff!important;;
font-weight:normal!important;
border-radius:2px;
background-color:var(--ThemeColor)!important;
padding:4px 8px!important;
}

#comment_pager_top,
#comment_pager_bottom{
 padding:0 14px!important;
background:var(--BlockColor);
min-height:0!important;
}
#comment_pager_top{
}
}
/**********************/
/* 首页随笔 */
@media screen and (min-width:0px){
.dayTitle{
display:none;
}
.day .postTitle{
font-size:var(--text5);
color:var(--TextColor1)!important;
padding:14px 14px 10px 14px;
}
.postCon{
font-size:var(--text7)!important;
color:var(--TextColor2)!important;
padding:0 14px 14px 14px;
}
.postCon ul{
 margin-left:14px;
}
.postCon img{
max-width:100%!important;
border-radius:4px;
}
.postDesc{
font-size:var(--text8);
color:var(--TextColor3)!important;
margin:-4px 14px 14px 14px;
text-indent:-62px;
overflow:hidden;
text-overflow:ellipsis;
background:var(--BlockColor);
/*display:none;*/
}
.day .postDesc a{
display:none;
}
.clear{
display:none;
}
}
/***************/
@media screen and (max-width:540px){
.c_b_p_desc{
display:block;
display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    text-overflow: ellipsis;
    overflow: hidden;
}
.desc_img{
width:100px;
height:70px;
border-radius:4px;
margin-left:14px;
float:right;
background-color:var(--BackgroundColor);
object-fit:cover;
display:grid;
align-items:center;
text-align:center;
justify-content:center;
}
.desc_img:before{
content:"\f071"" 图片加载失败!";
font-family:FontAwesome;
font-size:var(--text10);
color:var(--TextColor2);
display:block;
line-height:70px;
padding-bottom:70px;
}
.c_b_p_desc_readmore{
display:none;
}
}

/***************/

@media screen and (min-width:541px){
.c_b_p_desc{
display:block;
display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
    text-overflow: ellipsis;
    overflow: hidden;
}
.desc_img{
width:190px;
height:120px;
border-radius:4px;
margin-left:14px;
float:right;
object-fit:cover;
background-color:var(--BackgroundColor);
display:grid;
align-items:center;
text-align:center;
justify-content:center;
}
.desc_img:before{
content:"\f071"" 图片加载失败!";
font-family:FontAwesome;
font-size:var(--text9);
color:var(--TextColor2);
display:block;
line-height:120px;
padding-bottom:120px;
}
.c_b_p_desc_readmore{
display:none;
}
}
/************/
/* 我的标签 */
@media screen and (min-width:0px){
#taglist_main{
display:grid;
grid-template-columns:100%;
margin:0;
padding:0;
grid-gap:10px;
}
#taglist_title_wrap{
margin:0;
padding:0;

}
#taglist{
margin:0;
padding:0;
background:var(--BlockColor);
}
#taglist_title{
margin:0!important;
padding:14px!important;
font-size:var(--text5)!important;
color:var(--TextColor1);
text-align:center;
background:var(--BlockColor);
font-weight:normal!important;
}
#taglist td{
padding:14px 7px 14px 14px;
font-size:var(--text8);
color:var(--TextColor2);
text-align:center;
border:none!important;
}

}
/***************/

/* 我的标签*/
@media screen and (min-width:0px) {
  .catListTag ul {
display:flex;
flex-wrap:wrap;
color:var(--TextColor2);
}
  .catListTag ul li{
margin: 0 14px 10px 0;
display: inline-block;
}
  .catListTag ul li a:before {
    content: "\f02c";
   margin-right: 4px;
    font-family: FontAwesome;
  }

}

/***************/

/* 我的链接*/
@media screen and (min-width:0px) {
  #sidebar_links1575513 ul {
display:flex;
flex-wrap:wrap;
color:var(--TextColor2);
}
  #sidebar_links1575513 ul li{
margin: 0 14px 10px 0;
display: inline-block;
}
  #sidebar_links1575513 ul li a:before {
    content: "\f0c2";
   margin-right: 4px;
    font-family: FontAwesome;
  }

}

/***************/
/* 我的相册*/
@media screen and (min-width:0px) {
  #sidebar_imagecategory ul {
display:flex;
flex-wrap:wrap;
color:var(--TextColor2);
}
  #sidebar_imagecategory ul li{
margin: 0 14px 10px 0;
display: inline-block;
}
  #sidebar_imagecategory ul li a:before {
    content: "\f03e";
   margin-right: 4px;
    font-family: FontAwesome;
  }

}

/***************/
/*排行榜 */
@media screen and (min-width:0px) {
  #sidebar_topviewedposts ul li,
  #sidebar_topcommentedposts ul li,
  #sidebar_topdiggedposts ul li{
    line-height:2;
   display:block;
   word-break:keep-all; 
   white-space:nowrap;
   text-overflow:ellipsis; 
  overflow:hidden;
display:block;
 color:var(--TextColor2);
  }
}
/*************/
/* 我的随笔 */
@media screen and (min-width:0px){
.PostListTitle{
margin:0!important;
padding:14px!important;
font-size:var(--text5);
color:var(--TextColor1);
text-align:center;
font-weight:normal!important;
background:var(--BlockColor);
}
#myposts{
margin:0!important;
padding:0!important;
/*background:red;*/
display:grid;
grid-template-columns:100%;
grid-gap:10px;
}
.PostList{
margin:0!important;
padding:0 14px!important;
display:grid;
grid-template-columns;100%;
background:var(--BlockColor);
}
.postTitl2 {
font-size:var(--text5)!important;
color:var(--TextColor1);
padding:14px 0 0px;
}
.postDesc2{
font-size:var(--text8)!important;
color:var(--TextColor3);
padding:0px 0 14px;
order:1;
}
.postText2{
font-size:var(--text7)!important;
color:var(--TextColor2);
word-break:break-all!important;
overflow:hidden;
}
.postText2 ol{
margin-left:14px;
}
}
/***********************/
/* #post_detail,#blog-comments-placeholder,#comment_form */
@media screen and (min-width:0px){
#post_detail,#blog-comments-placeholder,#comment_form{
/*background:green;*/
padding:0!important;
margin:0!important;
}
#comment_form,#blog-comments-placeholder{
display:grid;
grid-template-columns;100%;
}
#blog-comments-placeholder br{
display:none;
}
.feedbackItem br{
display:block!important;
}
}
/***************/
a[name="!comments"]{
display:none!important;
}
/***********************/
/* #sideBar */
@media screen and (min-width:0px){
#sideBar{
padding:0!important;
margin:0!important;

}
}
/***************/
/* #sideBarMain*/
@media screen and (min-width:0px){
#sideBarMain{
width:100%;
display:grid;
grid-template-columns:100%;
grid-gap:10px;
padding:0!important;
margin:0!important;
}
}

/***************/
/* #leftcontentcontainer */
@media screen and (min-width:0px){
#leftcontentcontainer{
padding:0!important;
margin:0!important;
width:100%;
}
}

/***************/
#sidebar_news,#blog-calendar{
background:var(--BlockColor);
padding:0!important;
margin:0!important;
width:100%;
}

.catListTitle{
padding:10px 14px;
font-size:var(--text5);
font-weight:normal!important;
color:var(--TextColor1);
border-bottom:1px solid var(--DividColor);
}
/***************/
/* #blog-sidecolumn*/
@media screen and (min-width:0px){
#blog-sidecolumn{
display:grid;
grid-template-columns:100%;
grid-gap:10px;
padding:0!important;
margin:0!important;
}
}
/***************/
/* 公告 */
@media screen and (min-width:0px){
#blog-news{
padding:10px 14px;
}
#profile_block{
font-size:0;
display:flex;
flex-wrap:wrap;
flex:1;
justify-content:space-around;
align-items:center;
width:100%;
}
#profile_block:before{
   content:"";
display:table;
width:80px;
height:80px;
margin:10px auto 10px;
border-radius:80px;
background-image: var(--Avatar);
    background-position: center;
    background-size: cover;
}
#profile_block br{
display:none;
}
#profile_block a{
font-size:var(--text7);
text-align:center;
}
#profile_block a[href^="https://home.cnblogs.com/u"]{
font-size:var(--text5);
color:var(--TextColor1);
display:block!important;
width:100%;
font-weight:bold;
margin-bottom:14px;
}
#p_b_follow{
display:block!important;
width:100%;
text-align:center;
}

#p_b_follow a{
display:block!important;
width:100%;
line-height:2.8;
font-size:var(--text7)!important;
color:#fff!important;
background:var(--ThemeColor)!important;
border-radius:4px;
font-weight:normal!important;
}


#p_b_follow span{
display:block!important;
width:100%;
line-height:2.8;
font-size:var(--text7)!important;
color:#fff!important;
background:var(--gray);
border-radius:4px;
font-weight:normal!important;
}

#profile_block a:nth-child(3),
#profile_block a:nth-child(5),
#profile_block a:nth-child(7){
text-align:center;
margin-bottom:8px;
font-size:var(--text7);
color:var(--TextColor2);
font-weight:bold;
line-height:2;
overflow:hidden;
text-overflow:ellipsis;
width:33.3%!important;
display:inline-block!important;
box-sizing:border-box;
}

#profile_block a:nth-child(3):after{
content:"园龄";
color:var(--TextColor3);
font-size:var(--text8);
display:block;
width:100%;
font-weight:normal;
}

#profile_block a:nth-child(5):after{
content:"粉丝";
color:var(--TextColor3);
font-size:var(--text8);
display:block;
font-weight:normal;
width:100%;
}

#profile_block a:nth-child(7):after{
content:"关注";
font-weight:normal;
color:var(--TextColor3);
font-size:var(--text8);
display:block;
width:100%;
}
}

/***************/
/*日历*/
@media screen and (min-width:0px) {
  #blogCalendar{
    padding: 10px 14px;
  }

  .CalTitle {
    line-height: 2.4;
    font-size: var(--text6);
    color: var(--TextColor1);
  }

  .CalDayHeader {
    line-height: 2.4;
    font-size: var(--text6);
    font-weight: normal;
    color: var(--TextColor2);
    border-bottom: 0px solid var(--DividColor);
  }

 
  .CalTodayDay {
    height: 34px !important;
    width: 34px !important;
  }

  .CalTodayDay u,
  .CalTodayDay {
    color: #fff !important;
    background-color: var(--ThemeColor);
    line-height: 2.15;
    border-radius: 50%;
  }

  #blog-calendar u {
    color: var(--ThemeColor);
    font-weight: 600;
    text-decoration: none !important;
    height: 22px;
    position: relative;
  }

  .CalOtherMonthDay {
    color: var(--TextColor3);
  }

  #blog-calendar u:after {
    content: '●';
    display: block;
    font-size: 4px;
    position: absolute;
    top: 20px;
    text-align: center;
    left: 0;
    right: 0;
    line-height: 0;
  }

  #blogCalendar td {
    line-height: 2;
  }

  .CalTitle .CalNextPrev {
    font-size: 0px;
  }

  .CalTitle .CalNextPrev:nth-child(1) a:before {
    content: "\f0d9";
    font-size: 18px;
    text-align: center;
    font-family: FontAwesome;
    line-height: 2;
  }

  .CalTitle .CalNextPrev:nth-child(3) a:before {
    content: "\f0da";
    text-align: center;
    font-size: 18px;
    font-family: FontAwesome;
    line-height: 2;
  }
}

/***************/
/* 搜索 */
@media screen and (min-width:0px) {
    #sidebar_search_box{
padding:10px 14px;
display:grid;
grid-template-columns:100%;
grid-gap:10px;
   }
  #sidebar_search_box .div_my_zzk {
    display: flex;
    margin: 10px;
  }

  #sidebar_search_box .input_my_zzk {
    padding: 6px;
    outline: none;
    background: var(--BackgroundColor);
    border: 1px solid var(--DividColor);
    vertical-align: middle;
    height: 40px;
    flex: auto;
    border-radius: 4px;
  }

  #sidebar_search_box .input_my_zzk:hover {
    border: 1px solid var(--ThemeColor);
  }

  input.btn_my_zzk {
    color: #fff;
    background-color: var(--ThemeColor);
    border-color: var(--ThemeColor);
    border: 1px;
    padding: 8px;
    border-radius: 4px;
    height: auto !important;
  }

  input.btn_my_zzk:hover {
    outline: none;
    opacity: 0.8;
  }
}
/***************/
/* .sidebar-block*/
@media screen and (min-width:0px){
.sidebar-block{
background:var(--BlockColor);
padding:0;
margin:0;
}
.sidebar-block ul{
padding:14px 14px;
}
.sidebar-block ul li{
list-style-type:none;
}
}
/***************/
/* #sidebar_categories*/
@media screen and (min-width:0px){
#sidebar_categories{
display:grid;
grid-template-columns:100%;
grid-gap:10px;
padding:0!important;
margin:0!important;
}
}

/***************/
/* 常用链接 */
@media screen and (min-width:0px){
#sidebar_shortcut ul{
display:grid;
grid-template-columns:1fr 1fr;
grid-gap:10px;
}
#sidebar_shortcut ul li a{
word-break:keep-all;
text-overflow:ellipsis;
display:inline-block;
color:var(--TextColor2);
}

  #sidebar_shortcut ul li:nth-child(1) a:before {
    content: "\f1fc";
   margin-right:4px;
    font-family: FontAwesome;
  }

  #sidebar_shortcut ul li:nth-child(2) a:before {
    content: "\f075";
   margin-right:4px;
    font-family: FontAwesome;
  }

  #sidebar_shortcut ul li:nth-child(3) a:before {
    content: "\f0c0";
   margin-right:4px;
    font-family: FontAwesome;
  }

  #sidebar_shortcut ul li:nth-child(4) a:before {
    content: "\f27a";
   margin-right:4px;
    font-family: FontAwesome;
  }

  #sidebar_shortcut ul li:nth-child(5) a:before {
    content: "\f02c";
   margin-right:4px;
    font-family: FontAwesome;
  }
}
/***************/
/* 随笔分类 */
@media screen and (min-width:0px) {
#sidebar_postcategory ul{
display:grid;
grid-template-columns:1fr 1fr;
grid-gap:10px;
}
#sidebar_postcategory ul li{
word-break:keep-all;
text-overflow:ellipsis;
}
#sidebar_postcategory ul li a{
background-color:var(--BackgroundColor);
color:var(--TextColor2);
line-height:2;
width:100%;
height:100%;
display:block!important;
padding:2px 4px;
text-align:center;
font-size:var(--text7);
border-radius:4px;
transition: all 300ms ease-in-out;
 -webkit-transition: all 300ms ease-in-out;
}
#sidebar_postcategory ul li a:hover{
background-color:var(--ThemeColor);
color:#fff;
transition: all 300ms ease-in-out;
    -webkit-transition: all 300ms ease-in-out;
}
}
/***************/
/* 最新随笔 */
@media screen and (min-width:0px) {
  #sidebar_recentposts ul li a:before {
    content: "\f017";
   margin-right:4px;
    font-family: FontAwesome;
  }
  #sidebar_recentposts ul li{
display:block;
   word-break:keep-all; 
   white-space:nowrap;
   text-overflow:ellipsis; 
  overflow:hidden;
   line-height:1.8;
 color:var(--TextColor2);
}
}
/***************/
/* 随笔档案 */
@media screen and (min-width:0px) {
#sidebar_postarchive ul,  #sidebar_articlearchive ul{
display:grid;
grid-template-columns:1fr 1fr;
grid-gap:10px;
}
#sidebar_postarchive ul li a,   #sidebar_articlearchive ul li a{
word-break:keep-all;
text-overflow:ellipsis;
display:inline-block;
color:var(--TextColor2);
}
}
/***************/
/* 随笔档案*/
@media screen and (min-width:0px) {
  #sidebar_postarchive ul li a:before {
    content: "\f073";
    font-family: FontAwesome;
  margin-right:4px;
  }

  #sidebar_articlearchive ul li a:before {
    content: "\f073";
    font-family: FontAwesome;
  margin-right:4px;
  }
}
/***************/
/* 积分排名*/
@media screen and (min-width:0px) {
.catListBlogRank ul{
display:grid;
grid-template-columns:1fr 1fr;
grid-gap:10px;
}
  .liScore:before {
    content: "\f005";
    font-family: FontAwesome;
   line-height:1.8;
  }
  .liScore,  .liRank{
  color:var(--TextColor2)
}
  .liRank:before {
    content: "\f091";
    font-family: FontAwesome;
   line-height:1.8;
  }

}
/***************/
/*最新评论*/
@media screen and (min-width:0px) {
  .recent_comment_title a:before {
    content: "\f27a";
    font-family: FontAwesome;
    margin-right: 10px;
    margin-left: 0px;
  }
.recent_comment_title{
margin:8px 0;
display:inline-block;
color:var(--TextColor1);
font-size:var(--text6);
}
  .recent_comment_author {
    border-bottom: 1px dashed var(--DividColor);
    padding:10px 0!important;
    margin:0!important;
   color:var(--TextColor3);
font-size:var(--text8);
  }
  .recent_comment_author:last-child{
border:none;
}

  .recent_comment_body {
  color:var(--TextColor2);
font-size:var(--text7);
line-height:1.8;
  }
 .RecentCommentBlock p,  .recent_comment_body blockquote p{
margin:0!important;
line-height:1.8;
}
.recent_comment_body br{
/*display:none;*/
}
  ul .recent_comment_body blockquote{
height:0!important;
padding:0 0 0 10px!important;
margin:0!important;
line-height:1!important;
}
}
/***************/
/* 随笔分类 */
@media screen and (min-width:0px){
.entrylist{
margin:0;
padding:0;
background:red
}
.entrylistTitle{
margin:0!important;
padding:14px!important;
font-size:var(--text5);
color:var(--TextColor1);
text-align:center;
font-weight:normal!important;
background:var(--BlockColor);
}
.entrylistItem{
margin:0;
padding:0 14px 14px 14px;
background:var(--BlockColor);
}
.entrylistDescription{
font-size:var(--textNormal);
color:var(--TextColor2);
padding:0 14px 14px 14px;
border-bottom:1px solid var(--DividColor);
margin: 0;
text-align:left!important;
background-color:var(--BlockColor);
}
.entrylistDescription img{
max-width:100%!important;
margin:4px auto;
border-radius:4px;
}
.entrylistPosttitle {
font-size:var(--text5)!important;
color:var(--TextColor1);
padding:14px 0 10px;
}
.entrylistItemPostDesc{
font-size:var(--text8)!important;
color:var(--TextColor3);
padding:0;
margin:14px 0 0 0;
text-indent:-60px;
overflow:hidden;
text-overflow:ellipsis;
/*display:none;*/
}
.entrylistItemPostDesc a:last-child{
display:none
}
.entrylistPostSummary{
font-size:var(--text7)!important;
color:var(--TextColor2);
}
}

/***************/
/* 评论列表 */
@media screen and (min-width:0px){
#blog-comments-placeholder br:nth-child(1){
}
.feedback_area_title{
order:-1;
/*margin-top:-20px;*/
padding:10px 14px;
font-size:var(--text5);
font-weight:normal!important;
color:var(--TextColor1);
border-bottom:1px solid var(--DividColor);
background:var(--BlockColor);
}
.feedbackItem{
padding:14px;
background-color:var(--BlockColor);
position:relative;
overflow:hidden;
}
.feedbackItem:nth-child(5){
border-top:1px solid var(--DividColor);
}
.feedbackItem{
border-bottom:1px solid var(--DividColor);
}
.feedbackItem img{
max-width:100%!important;
}
.feedbackListSubtitle{
font-size:0;
display:flex;
flex-wrap:wrap;
position:relative;
margin-bottom:4px;
}
.feedbackListSubtitle a,
.feedbackManage ,
.feedbackListSubtitle .comment_date{
font-size:var(--text8);
line-height:1.5;
}
.feedbackListSubtitle a{
margin-right:4px;
}

.feedbackListSubtitle .layer{
order:1;
width:auto;
padding:0;
margin-right:10px;
word-break:keep-all;
}

.feedbackListSubtitle a:last-child{
font-weight:bold;
order:2;
width:auto;
word-break:keep-all;
    border-radius: 2px;
}

.feedbackListSubtitle .comment_date{
display:block!important;
width:100%!important;
color:var(--TextColor3);
order:5;
word-break:keep-all;
}

.feedbackManage{
position:absolute;
right:0;
top:0;
display:inline-block;
color:var(--TextColor3);
}

.feedbackManage a:last-child{
font-weight:normal!important;
}
.comment_vote{
margin-top:4px;
color:var(--TextColor3);
font-size:var(--text8);
}

.feedbackCon .blog_comment_body{
height:fit-content!important;
margin:0;
display:block;
justify-content: center;
word-break:break-all;
width:100%!important;
overflow:hidden!important;
}

}
/***************/
/* 发表评论 */
@media screen and (min-width:0px){
#comment_nav{
text-align:center;
font-size:var(--text7);
color:var(--TextColor1);
padding:14px!important;
margin:0!important;
background-color:var(--BlockColor);
border-bottom:1px solid var(--DividColor);
/*border-top:1px solid var(--DividColor);*/
}
#comment_form_container{
padding:0 0 14px 0!important;
margin:0!important;
background-color:var(--BlockColor);
}
.login_tips{
background-image:url();
margin:0!important;
text-align:center;
font-size:var(--text7);
font-weight:normal!important;
padding:14px!important;
}
#commentform_title{
padding:14px!important;
background:url();
margin:0!important;
font-size:var(--text5)!important;
font-weight:normal!important;
border-bottom:1px solid var(--DividColor);
}

.comment_textarea{
    width:100%;
    height:fit-content!important;
    background-color:var(--BlockColor);
    color:var(--TextColor2);
    padding:8px 14px;
margin:0;
border-radius:0!important;
border:none!important;
    /*border:1px solid var(--DividColor);*/
  }
 .commentbox_title{
    border-bottom-color:var(--DividColor);
    color:var(--TextColor3)!important;
  }
#tbCommentBody{
padding:8px;
background:var(--BlockColor);
word-break:break-all;
}

/* 贴吧表情 */
img[src^="https://cdn.jsdelivr.net/gh/moezx/cdn@3.1.9/img/Sakura/images/smilies"],
img[src^="https://images.cnblogs.com/cnblogs_com/gshang/1626876/"],
img[src^="https://images.cnblogs.com/cnblogs_com/gshang/1663431/"]{
width:26px;
height:26px;
}

/*
  .commentbox_footer{
    border:none!important;
  }
*/
  .commentbox-tab{
    color:var(--TextColor3)!important;
  }
  .commentbox_tab:hover,.commentbox_tab.active{
    border-bottom-color:var(--ThemeColor);
    color:var(--TextColor1)!important;
  }
#commentbox_opt{
padding:14px;
margin:0;
border-top:1px solid var(--DividColor);
background-color:var(--BlockColor);
}
  #btn_comment_submit {
    width: auto;
    height: auto;
    border-width: 0;
    cursor: pointer;
    color: #fff;
   padding:4px 8px;
    background-color: var(--ThemeColor);
    border-color: var(--ThemeColor);
    user-select: none;
    border-radius: 4px;
  }

  #btn_comment_submit:hover {
    opacity: 0.8
  }
#tip_comment2{
display:none;
}
#tip_comment{
background-color:var(--BlockColor);
font-size:var(--text8)!important;
padding:14px!important;
line-height:1.8;
display:block;
width:100%;
margin:0;
}

#comment_form_container p:nth-child(7){
color:var(--TextColor3);
font-size:var(--text7);
width:100%;
display:block;
margin:0;
padding:6px 14px;
background-color:var(--BlockColor);
}
}
/***************/
/* 相关博文 */
@media screen and (min-width:0px){
#under_post_news{
margin:0!important;
padding:0!important;
width:100%!important;
max-width:100%!important;
display:block!important;
}
.recomm-block{
padding:0 0 14px 0!important;
margin:0!important;
font-size:0;
width:100%!important;
max-width:100%!important;
background:var(--BlockColor);
word-break:keep-all;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.recomm-block b:before{
content:"相关博文";
display:block!important;
padding:14px;
font-size:var(--text5)!important;
font-weight:normal!important;
color:var(--TextColor1);
border-bottom:1px solid var(--DividColor);
background:var(--BlockColor);
margin-bottom:10px;
}
.recomm-block  br{
display:none;
}
.recomm-block a{
line-height:1.8;
width:100%!important;
color:var(--TextColor2);
font-size:var(--text7)!important;
padding:0 14px !important;
text-overflow:ellipsis;
word-break:keep-all;
white-space:nowrap;
display:block!important;
overflow:hidden;
width:auto;
}
.recomm-block a:last-child{
display:none!important;
}
.recomm-block a:before{
content:"\f0f6";
margin-right:4px;
font-family:FontAwesome;
}
.recomm-block a:nth-last-child(2):before{
content:"\f101"!important;
margin-right:4px
font-family:FontAwesome;
}
}

/***************/
/* Markdown */
@media screen and (min-width:0px) {
table::-webkit-scrollbar{
    display:none!important;
  }
.post .postBody{
color:var(--TextColor1);
word-break:break-all;
}
.post .postBody h1,.blog_comment_body h1{
   color:var(--TextColor1);
    font-size:var(--text1)!important;
  }

  .post .postBody h2 ,.blog_comment_body h2{
    color:var(--TextColor1);
    font-size:var(--text2)!important;
  }

  .post .postBody h3 ,.blog_comment_body h3{
    color:var(--TextColor1);
    font-size:var(--text3)!important;
  }

  .post .postBody h4 ,.blog_comment_body h4{
 color:var(--TextColor1);
    font-size:var(--text4)!important;
  }


  .post .postBody h5,.blog_comment_body h5 {
    color:var(--TextColor1);
    font-size:var(--text5)!important;
  }

  .post .postBody h6,.blog_comment_body h6 {
    color:var(--TextColor1);
    font-size:var(--text6)!important;
  }

  .post .postBody p,.blog_comment_body p {
    margin: 17px auto;
  }
.post .postBody img,.blog_comment_body img {
    margin: 4px auto;
    border-radius:4px;
position:relative;
text-align:center;
  }

#home code{
    border:none!important;
    color:var(--AidColor2);
   padding:0 .5em!important;
line-height:1.5!important;
font-size:var(--text8)!important;
font-family: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace!important;
    background-color:var(--BackgroundColor);
}
.cnblogs-markdown a{
color: var(--ThemeColor);
}

.cnblogs-markdown ul{
margin:0!important;
padding-left:14px !important;
}
.MathJax{
  outline: none;
}
.MathJax_Display {
  overflow-x: auto;
  overflow-y: hidden;
}
.forFlow{
display:grid;
grid-template-columns:100%;
}

.forFlow hr{
border:1px solid var(--DividColor);
}
.forFlow .tablebox{
display:block;
margin:0 auto;
}
.forFlow  table{
    margin:10px 0;
   font-size: var(--text8);
    border-collapse: collapse;
    border-spacing: 0;
    empty-cells: show;
    border: none !important;
    overflow: auto; 
    width:100%!important;
    /*display:block!important;*/
    word-break: keep-all !important;
}
.forFlow table th{
    font-weight: bold;
padding:.5em 1em;
    border: 1px solid var(--DividColor) !important;
background-color: var(--BackgroundColor) !important;
}
 .forFlow table tr:nth-child(2n) {
    background-color: var(--BackgroundColor) !important;
  }

.forFlow table tr {
    background-color: var(--BlockColor) !important;
  }

.forFlow table td {
    border: 1px solid var(--DividColor) !important;
    padding:.5em 1em;
  }
}

/***************/
@media screen and (min-width:0px) {
#post_detail{
margin-bottom:-10px!important;
}
.post{
padding:0;
display:grid;
margin-bottom:10px;
grid-template-columns:100%;
}
#topics .postTitle{
margin:0!important;
text-align:center;
background:var(--BlockColor);
color:var(--TextColor1);
font-size:var(--text4)!important;
padding:14px 14px 0 14px;
}
.post .postDesc{
display:block!important;
padding:0 14px!important;
text-indent:0!important;
margin:0!important;
background-color:var(--BlockColor);
}
/* 调整 */
  .post .postBody {
    order: 1;
padding:14px;
overflow:hidden;
 background-color:var(--BlockColor);
  }
/* 博文信息 */
.post .postDesc {
    font-size: 0;
    line-height: 1.5;
    text-align: center;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--DividColor);
    margin-bottom: 10px;
  }

  #topics #post-date,
  #topics .postDesc a,
  #topics #post_view_count,
  #topics #post_comment_count {
    color: var(--TextColor3);
    font-size: var(--text8);
    word-break:keep-all!important;
    display:inline-block;
    margin-right: 10px;
  }

  #topics .postDesc a:hover {
    color: var(--ThemeColor);
  }

  #topics #post-date:before {
    content: "\f017";
    margin-right: 4px;
    font-family: FontAwesome;
  }

  #topics .postDesc a:nth-child(2):before {
    content: "\f2be";
    margin-right: 4px;
    font-family: FontAwesome;
  }

  #topics .postDesc #post_view_count:before {
    content: "\f06e";
    margin-right: 4px;
    font-family: FontAwesome;
  }

  #topics #post_comment_count:before {
    content: "\f27b";
    margin-right: 4px;
    font-family: FontAwesome;
  }

  #topics .postDesc a:nth-last-child(3):before {
    content: '\f121';
    font-family: FontAwesome;
    margin-right: 4px;
  }

  #topics .postDesc a:nth-last-child(2):before {
    content: '\f040';
    font-family: FontAwesome;
    margin-right: 4px;
  }

  #topics .postDesc a:nth-last-child(1):before {
    content: '\f02e';
    font-family: FontAwesome;
    margin-right: 4px;
  }
/* 分类 标签*/
#BlogPostCategory,#EntryTag{
color:var(--TextColor2);
}
#BlogPostCategory a,#EntryTag a{
display:inline-table;
}
  #BlogPostCategory a:before {
    content: '\f02d';
    font-family: FontAwesome;
    margin-right: 4px;
  }

  #EntryTag a:before {
    content: '\f02c';
    font-family: FontAwesome;
    margin-right: 4px;
  }
/* 博文发布信息*/
  #blog_post_info {
    display: grid !important;
    grid-template-columns: 100% !important;
    grid-template-rows: auto auto auto !important;
    width: 100%;
    margin:20px 0;
    grid-gap: 20px;
  }

	#green_channel {
		border: none !important;
		width: auto !important;
		display: inline-flex;
		margin: 0 auto;
		padding: 0;
		grid-column-start: 1;
		grid-column-end: 2;
	}

	#green_channel a:hover {
		color: var(--ThemeColor);
	}
	#green_channel a {
		background: url();
		font-weight: normal;
		font-size: var(--text7)!important;
		margin-right: 20px;
		color: var(--TextColor2);
		text-shadow: none !important;
	}

	#green_channel #green_channel_digg {
		display: none;
	}

	#green_channel #green_channel_follow:before {
		content: "\f08a";
		font-family: FontAwesome;
		margin-right: 4px;
		margin-left: 0px;
	}

	#green_channel #green_channel_favorite:before {
		content: "\f006";
		font-family: FontAwesome;
		margin-right: 4px;
		margin-left: 0px;
	}


	#green_channel #green_channel_follow,
	#green_channel #green_channel_favorite,
	#green_channel #green_channel_weibo,
	#green_channel #green_channel_wechat {
		color: var(--TextColor2) !important;
		background-color: transparent;
		border: 1px solid transparent;
		padding: 0px;
		font-size: var(--text7);
		-webkit-border-radius: 4px;
		-webkit-box-shadow: none !important;
		box-shadow: none !important;
	}



	#green_channel #green_channel_weibo:hover {
		background-color: #00000000 !important;
	}

	#green_channel_weibo img {
		margin-left: 0 !important;
	}


	#green_channel #green_channel_wechat:hover {
		background-color: #00000000 !important;
	}

	#green_channel_wechat img {
		margin-left: 0 !important;
	}

	#green_channel #green_channel_follow:hover,
	#green_channel #green_channel_favorite:hover {
		color: var(--ThemeColor) !important;
	}

	#green_channel_weibo img,
	#green_channel_wechat img {
		display: none;
	}

	#green_channel_weibo:before {
		content: "\f18a";
		font-family: FontAwesome;
		color: #d21212;
		margin-right: 4px;
		margin-left: 0px;
	}

	#green_channel_wechat {
		margin-right: 0 !important;
	}

	#green_channel_wechat:before {
		content: "\f1d7";
		color: #14981a;
		font-family: FontAwesome;
		margin-right: 4px;
		margin-left: 0px;
	}

	#div_digg {
		width: auto !important;
		font-size: 22px;
		float: right;
		margin: 0 auto;
		grid-column-start: 1;
		grid-column-end: 2;
	}

	.buryit:hover,
	.diggit:hover {
		opacity: 0.8;
		color: var(--ThemeColor) !important;
	}

	.diggit {
		background: none !important;
		font-size: 20px;
		height: auto;
		padding: 0;
		margin: 0 20px 0 0;
		height: auto;
		width: auto !important;
		color: var(--TextColor2) !important;
		background-color: #00000000 !important;
		border: 1px solid #00000000 !important;
	}

	#digg_count {
		color: var(--TextColor2) !important;
	}

	.diggit:before {
		content: '\f087';
		font-family: FontAwesome;
		margin-right: 0px;
		margin-left: 10px;
	}

	.buryit {
		width: auto !important;
		font-size: 20px;
		height: auto;
		padding: 0;
		margin: 0;
		background: none !important;
		color: var(--TextColor2) !important;
		background-color: #00000000 !important;
		border: 1px solid #00000000 !important;
	}

	#bury_count {
		color: var(--TextColor2) !important;
	}

	.buryit:before {
		content: '\f088';
		font-family: FontAwesome;
		margin-right: 0px;
		margin-left: 10px;
	}
/* 博主信息*/
#author_profile{
order:1;
width:100%;
background-color:var(--BackgroundColor);
padding:10px;
display:inline-flex;
align-items:center;
justify-content: center;
border-radius:4px;
}
#author_profile_info{
flex:1;
}
.author_avatar{
margin:0 10px 0 0!important;
padding:0;
border-radius:9999px!important;
}
#author_profile_detail{
display:grid;
width:fit-content;
column-gap:0px!important;
justify-content: center;
color:var(--TextColor1)!important;
grid-template-columns:1fr 1fr;
grid-template-rows:auto auto;
}
#author_profile_detail br{
display:none;
}
#author_profile_detail a:nth-child(1){
grid-column-start:1;
grid-column-end:3;
font-weight:bold;
margin-top:0px;
line-height:2;
font-size:var(--text8);
grid-row-start:1;
grid-row-end:2;
}
#author_profile_detail a:nth-child(2){
grid-column-start:1;
grid-column-end:2;
grid-row-start:2;
grid-row-end:3;
}
#author_profile_detail a:nth-child(3){
grid-column-start:2;
grid-column-end:3;
grid-row-start:2;
grid-row-end:3;
margin-left:10px;
}
#author_profile_follow{
font-size:0;
}
#author_profile_follow a{
color:#fff;
font-size:var(--text8);
line-height:2.4;
padding:.5em 1em!important;
width:fit-content!important;
border-radius:100px;
background-color:var(--ThemeColor);
}
#author_profile_follow a:hover{
color:#fff;
}
/*上下篇*/
#post_next_prev{
font-size:var(--textNormal);
    text-overflow: ellipsis;
    overflow: hidden;
}
#post_next_prev br{
display:block!important;
}

}

/***************/

 /*** Atom OneDark**/
@media screen and (min-width:0px) {
  #home .hljs,
#home pre code{
    display: block;
    white-space:pre;
    word-break:keep-all;
    overflow-x: auto!important;
    padding: .5em;
    color: #abb2bf;
   font-family: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace!important;
  font-size:var(--text8)!important;
   border:none!important;
    background: inherit!important;
  }

  #home .hljs-comment,
#home .hljs-quote {
    color: #5c6370;
    font-style: italic
  }

  #home .hljs-doctag,
#home .hljs-formula,
#home .hljs-keyword{
    color: #c678dd
  }

#home .hljs-deletion,
#home .hljs-name,
#home .hljs-section,
#home .hljs-selector-tag,
#home .hljs-subst {
    color: #e06c75
  }

  #home .hljs-literal{
    color: #56b6c2
  }

#home .hljs-addition,
#home .hljs-attribute,
#home .hljs-meta-string,
#home .hljs-regexp,
#home .hljs-string{
    color: #98c379
  }

  #home .hljs-built_in,
#home .hljs-class .hljs-title{
    color: #e6c07b
  }

#home .hljs-attr,
#home .hljs-number,
#home .hljs-selector-attr,
#home .hljs-selector-class,
#home .hljs-selector-pseudo,
#home .hljs-template-variable,
#home .hljs-type,
#home .hljs-variable{
    color: #d19a66;
  }

#home .hljs-bullet,
#home .hljs-link,
#home .hljs-meta,
#home .hljs-selector-id,
#home .hljs-symbol,
#home .hljs-title{
    color: #61aeee
  }

  #home .hljs-emphasis{
    font-style: italic
  }

 #home .hljs-strong{
    font-weight: 700
  }

  #home .hljs-link{
    text-decoration: underline
  }

#home .hljs-tag {
    color: #abb2bf
  }
}
/***************/

/* 相册 */
@media screen and (min-width:0px) {
.gallery{
background-color:var(--BlockColor);
text-align:center!important;
padding:14px;
align-items:center;
font-size:0;
}
.gallery br{
display:none;
}
  .gallery .thumbTitle ,.galleryTitle{
    font-size:var(--text5)!important;
      color:var(--TextColor1);
     padding:0 0 14px 0;
   margin:0;
  font-weight:normal;
  }
.thumbDescription{
font-size:var(--text7)!important;
color:var(--TextColor2);
padding:0 14px 14px 14px;
text-align:left;
border-bottom:1px dashed var(--DividColor)
}

  #GalleryThumbNailViewer1_ThumbNails {
    margin:0;
    width: 100%!important;
   /* border: 1px solid var(--DividColor);*/
  /*background-color:var(--BlockColor);*/
padding:14px!important;
background:green;
border-collapse: collapse;
border-spacing: 0;
cellspacing:10!important;
table-layout: fixed;
 overflow:hidden;
 overflow:hidden;
  }

  #GalleryThumbNailViewer1_ThumbNails  td{
   width:100%!important;
    overflow: hidden!important;
    border:none!important;
 padding:0px!important;
   background:var(--BlockColor)!important;
  }

.divPhoto{
display:block!important;
align-item:center;
padding:4px;
justify-content:center;
width:100%;
}
  #ViewPicture1_GalleryImage {
    border-radius: 0 0 4px 4px;
    padding: 20px;
    width: 100%;
    max-width: 100% !important;
    background-color: var(--BlockColor);
  }

  #ViewPicture1_ReturnUrl,
  #ViewPicture1_OriginalImage {
    background-color: var(--BlockColor);
   padding: 6px 10px;
  margin:0 14px;
    display: inline-table;
    line-height: 1.5;
    color: var(--TextColor1);
    border: 1px solid var(--DividColor);
    border-radius: 4px;
    text-align:center!important;
    font-size: var(--text7);
  }

  #ViewPicture1_ReturnUrl:hover,
  #ViewPicture1_OriginalImage:hover {
    color: white;
    border: 1px solid var(--ThemeColor);
    background-color: var(--ThemeColor);
  }
}

/***************/
@media screen and (min-width:0px){
.commentform{
display:grid;
padding:0px!important;
margin:0!important;
grid-template-columns:100%;
}
#divCommentShow{
/*order:1;*/
margin:0;
background-color:var(--BlockColor)!important;
padding:0 14px!important;
/*border:1px solid var(--DividColor);*/
position:relative;
}
.new-comment-block{
padding:8px 0;
border-bottom:1px dashed var(--DividColor)
}
.new-comment-title{
color:var(--TextColor3);
font-size:var(--text7);
padding:0;
display:flex;
margin-bottom:8px;
flex-wrap:wrap;
position:relative;
background-color:var(--BlockColor);
}
.new-comment-title a:nth-child(2){
top:0!important;
left:8px!important;
position:absolute!important;
}
.new-comment-title span{
display:block!important;
width:100%!important;
order:2;
}
.new-comment-title a:nth-child(3){
top:0!important;
right:40px!important;
position:absolute!important;
}

.new-comment-title a:nth-child(4){
top:0!important;
right:0!important;
position:absolute!important;
}
.comment_my_posted{
border-bottom:1px dashed var(--DividColor);
padding:6px 0;
}
.bq_post_comment{
border:none!important;
}
}
/***************/
/* #footer */
@media screen and (min-width:0px){
#footer,#page_end_html{
text-align:center;
padding:0!important;
margin:0!important;
font-size:var(--text8);
display:grid;
grid-template-columns:100%;
color:var(--TextColor3);
background:var(--BackgroundColor)
}
}

/***************/

/* 附加 */
@media screen and (min-width:0px) {
textarea[title=js]{ 
  display: none;
}
/* 代码复制 */
.clipboard-button{
position:absolute;
display:none;
z-index:9999;
right:10px;
top:28px;
border-radius:4px;
font-size:var(--text8);
color:#333;
padding:2px 6px;
box-sizing:border-box;
background-color:#fff;
z-index:10;
box-shadow:0px 0px 10px 5px rgba(0,0,0,0.1);
}
.clipboard-button:before{
content:"复制"
}
.blog_comment_body pre:hover .clipboard-button,
.cnblogs-markdown pre:hover .clipboard-button{
display:block;
z-index:99999;
}
  /* 扩展 */
  #blog_nav_shortcut:before {
    content: "\f022";
    color: #fb7299;
    margin-right: 6px;
    font-family: FontAwesome;
  }

  #blog_nav_theme:before {
    content: "\f1de";
    margin-right: 6px;
    color: #00c091;
    font-family: FontAwesome;
  }

  #blog_nav_frieds:before {
    content: "\f0c1";
    margin-right: 6px;
    color: #f3a034;
    font-family: FontAwesome;
  }

  #blog_nav_maintain:before {
    content: "\f0ad";
    margin-right: 6px;
    color: #ff5d47;
    font-family: FontAwesome;
  }

  #blog_nav_cnblogs:before {
    content: "\f29a";
    margin-right: 6px;
    color: #3c9ed1;
    font-family: FontAwesome;
  }

  /* 插入媒体 */
  @media screen and (min-width: 0px) {

    #cnblogs_post_body .video {
      height: 0;
      margin: 10px auto;
      padding-bottom: 56.25%;
      /* 16:9 */
      position: relative;
      width: 100%;
      display: flex;
      justify-content: center;
      align-items: center;
      border: 1px solid var(--DividColor);
      border-radius: 4px;
      overflow: hidden;
    }

    #cnblogs_post_body .video iframe,
    #cnblogs_post_body .video video {
      position: absolute;
      /*left: 0;*/
      top: 0;
      /*right:0;*/
      width: 100%;
      height: 100%;
      z-index: 0;
    }

    #cnblogs_post_body .music {
      height: 140px;
      /*padding-bottom: 14.39%;*/
      /* 16:9 */
      position: relative;
      width: 100%;
    }

    #cnblogs_post_body .music iframe {
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
    }
    .imgtext{
      font-size:var(--text7);
      text-align:center;
      color:var(--TextColor3);
    }
  }

  /****** 信息提示 *******/
  @media screen and (min-width: 0px) {

    .newscard {
      border-radius: 4px;
      margin: 0  10px 10px;
      padding: 0px 10px;
      line-height: 40px;
      height:40px;
      overflow:hidden;
      background-color: #dfedf8;
      color: #3162ae;
      box-shadow: 0 0.05rem 1rem rgba(50,50,50, .04);
      */border:1px solid #3162ae;*/
    }
    .newscard ul{
      height:40px;
      margin:0;
      padding:0;
    }
    .newstext{
      word-break:keep-all;
      white-space:nowrap;
      overflow:hidden;
      height:40px;
      line-height:40px;
      text-overflow:ellipsis;
    }
    .newscard i {
      float: left;
      margin: 0 10px;
      font-size:inherit;
      line-height:40px;
      vertical-align: middle !important;
    }

    .infocard {
      border-radius: 4px;
      margin:  10px 0;
      padding: 10px 16px;
    text-align:justify;
      word-break:break-all;
     line-height: inherit!important;
      display:inline-grid;  
      grid-template-columns:auto 1fr;
      width:100%;
      align-items:center;
      justify-content:center;
    }

    .infocard i {
      /*float: left;*/
      margin-right:16px;
      font-size:inherit;
      line-height:inherit!important;
      vertical-align: middle !important;
     display:inline-block;
    }
.infocard p{
  padding:0!important;
margin:0!important;
  text-align:left;
}

    .tip {
      background-color: #d5f1e5;

      color: #20704d;

    }

    .warning {
      background-color: #f9e8de;

      color: #a84229;
    }

    .normal {
      background-color: #dfedf8;
      color: #3162ae;
    }
  }


  /* 折叠 */
  @media screen and (min-width: 0px) {
    .details {
      border: 1px solid var(--DividColor);
      border-radius: 4px;
      padding: .5em .5em 0;
      margin: 10px 0;
    }

    .summary{
      font-weight: bold;
      margin: -.5em -.5em 0;
      padding: .5em;
      outline: none;
      user-select: none;
      background-color: var(--BackgroundColor);
      border-radius: 4px;
    }
    summary{
      outline:none;
    }
    .details[open] {
      padding: .5em;
    }

    .details[open] .summary {
      border-bottom: 1px solid var(--DividColor);
      margin-bottom: .5em;
      border-radius: 4px 4px 0 0;
    }
  }


  /******** 导航目录 *********/
  @media screen and (min-width: 0px) {
    .scroller-offset1 {
      text-indent: 0;
      overflow: hidden;
      text-overflow: ellipsis !important;
     line-height:1.8;
    }

    .scroller-offset2 {
      text-indent: 1.5em;
      overflow: hidden;
      text-overflow: ellipsis !important;
line-height:1.8;
    }

    .scroller-offset3 {
      text-indent: 3em;
      overflow: hidden;
      text-overflow: ellipsis !important;
line-height:1.8;
    }

    .scroller-offset4 {
      text-indent: 4.5em;
      overflow: hidden;
      text-overflow: ellipsis !important;
line-height:1.8;
    }

    .scroller-offset5 {
      text-indent: 6em;
      overflow: hidden;
      text-overflow: ellipsis !important;
line-height:1.8;
    }

    .scroller-offset6 {
      text-indent: 7.5em;
      overflow: hidden;
      text-overflow: ellipsis !important;
line-height:1.8;
    }

    .nav .active {
      background-color: var(--BackgroundColor);
      border-radius: 2px;
      margin: 0 6px;
    }

    .nav .active a {
      color: var(--ThemeColor);
    }
    .nav .active a:before{
      content:"\f04b";
      margin-right:10px;
      font-family:FontAwesome;
    }

    .nav {
      max-height: 400px;
      overflow-y: auto;
      /*padding:10px;*/
      overflow-x: hidden;
      white-space: nowrap;
    }

    .nav li {
      padding: 2px 10px;
    }

    .nav li a {
      text-overflow: ellipsis !important;
      width: 100px !important;
      white-space: nowrap;
    }
  }

  @media screen and (max-width: 960px) {
    #sidebar_scroller {
      position: fixed !important;
      top: 0 !important;
      left: 0 !important;
      right: 0 !important;
      bottom: 0;
      opacity: 0.98;
      width: auto !important;
      max-width: 100%;
      margin-bottom: 0 !important;
      display: none;
      max-height: 100vh;
      padding-bottom: 60px;
      overflow: auto;
      border-radius: 0 !important;
      border: none !important;
      border-bottom: 1px solid #eee;
      z-index: 999999999;
    }
  }

  /******** 移动端目录 *********/
  @media screen and (min-width: 0px) {
    .mytoolbar {
      position: fixed;
      z-index: 9999999999999999999999;
      bottom: 0;
      left: 0;
      right: 0;
     margin:0 auto!important;
      padding: 10px;
      font-size: var(--textNormal);
    }

    .mytoolbar #toolbtn {
      display:grid;
      width:fit-content;
      grid-template-columns:auto auto auto;
      margin: 0 auto!important;
     padding:0!important;
    }

    .mytoolbar #toolbtn li a {
      color: inherit;
      display:block!important;
     width:100%;
     height:100%;
   padding: 8px 16px;
    }

    .mytoolbar #toolbtn li {
      text-align: center;
      margin: 0 10px;
      background-color: var(--BlockColor);
      box-shadow: 0px 0px 10px 1px rgba(0,0,0,0.1);
      /* border: 1px solid var(--DividColor); */
      border-radius: 4px;
      list-style-type: none !important;
      /*line-height: 18px;*/
    }
  }

  /* 首页轮播 */
  @media screen and (min-width: 0px) {

    #slideContainer {
      display: block;
    }

    #slideContainer img {
      max-width: 100% !important;
    }

    .cl:after {
      content: ".";
      display: block;
      height: 0;
      clear: both;
      visibility: hidden;
    }

    .cl {
      zoom: 1;
    }

    .frame {
      margin-bottom: 10px;
      border: 1px solid #e1e1e1;
      background: #FFF;
    }

    .title {
      padding: 0 10px;
      height: 32px;
      font-size: 14px;
      font-weight: 700;
      line-height: 32px;
      overflow: hidden;
    }

    .block {
      margin: 10px 10px 0;
    }

    .temp {
      margin: 1px;
    }

    .slideshow {
      clear: both;
      margin: 0;
      padding: 0;
    }

    .slideshow li {
      position: relative;
      overflow: hidden;
    }
    .slideshow li div{
      width:100%;
      height:0;
      padding-bottom:42.85%;
      background-position: center center;
      background-repeat: no-repeat;
          -webkit-background-size:cover;
          -moz-background-size:cover;
          background-size:cover;

        }
        .slideshow span.title {
          position: absolute;
          bottom: 0;
          left: 0;
          margin-bottom: 0;
          width: 100%;
          height: auto;
          line-height: 32px;
          font-size: 16px;
          text-indent: 10px;
        }

        .slideshow span.title,
        .slidebar li {
          background: rgba(0, 0, 0, 0.3);
          filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#30000000, endColorstr=#30000000);
          color: #FFF;
          overflow: hidden;
        }

        .slidebar li {
          float: left;
          margin-right: 1px;
          width: 20px;
          height: 20px;
          line-height: 20px;
          text-align: center;
          font-size: 10px;
          cursor: pointer;
        }

        .slidebar li.on {
          background: rgba(255, 255, 255, 0.5);
          filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#50FFFFFF, endColorstr=#50FFFFFF);
          color: #000;
          font-weight: 700;
        }

        .frame {
          background: none;
          border: 0px solid #fff;
          margin-bottom: 0px;
        }

        .temp {
          margin: 0;
        }

        .slidebar {
          position: absolute;
          top: 5px;
          left: 4px;
        }

        .slidebar ul {
          margin: 0;
          padding: 0;
        }

        .slideshow span.title,
        .slidebar li {
          background: rgba(0, 0, 0, 0.3);
          filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#90000000, endColorstr=#90000000);
          color: #FFF;
          overflow: hidden;
        }

        .slidebar li.on {
          background: rgba(255, 255, 255, 0.5);
          filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#90000000, endColorstr=#90000000);
          color: #b62525;
          font-weight: 700;
        }

        .slideshow SPAN.title {
          text-indent: 0px;
        }

        .block {
          margin: 0;
          position: relative;
        }

        #frameHlicAe {
          margin: 0px !important;
          border: 0px !important;
        }

        .comiis_wrap960,
        .comiis_wrapad {
          margin: 0 auto;
          background-color: var(--BlockColor);
          border-radius: 0px;
        }

        .comiis_wrapad {
          padding: 10px;
          margin-bottom: 0px;
          width: 100%;
        }

        .comiis_wrapad {
          overflow: hidden;
        /*  box-shadow: 0 0.05rem 1rem rgba(51, 51, 51, .05);*/
          /*border: 1px solid var(--DividColor);*/
        }

        .comiis_wrapad img {
          float: left;
          margin-top: 0px;
          width: 100%;
        }

        #slidesImgs li {
          width: 100%;
          height: auto;
          display: none;
        }

        #slidesImgs img:hover {
          transform: scale(1.4);
        }

        #slidesImgs img {
          cursor: pointer;
          transition: all 0.6s
        }
      }


      /*解析*/
      @media screen and (min-width: 0px) {

        .__zy_bounce __zy_animated __zy_infinite {
          display: none;
        }

        .div-box {
          display: flex;
          height: 40px;
          line-height: 40px;
          background: #fff;
          text-align: center;
          width: 100%;
          margin-top: 20px;
          background-color: var(--BlockColor);
        }

        .input-url {
          flex: 1;
          padding: 10px;
          outline: none;
          margin-left: 5px;
          background: var(--BlockColor);
          border: 1px solid var(--DividColor);
          border-radius: 4px;
          color: inherit;
        }

        .jiexi {
          /*width: 100px;*/
          background: var(--ThemeColor);
          border: 1px solid var(--ThemeColor);
          padding: 10px 20px;
          border-radius: 4px;
          margin: 0 4px 0 10px;
          height: 40px;
          outline: none;
          color: #fff;
        }

        .jiexi:hover {
          opacity: 0.9;
        }

        /* 下拉 */
        .dropdown {
          position: relative;
          display: inline-block;
          margin-right:10px;
        }

        .dropdown-content {
          display: none;
          z-index: 9999;
          /*margin-left: 10px;*/
          position: absolute;
          background-color: var(--BlockColor);
          width: 90px;
          color: inherit;
          border-radius: 4px;
          box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
        }

        .dropdown:hover .dropdown-content {
          display: block;
        }

        .dropdown-content p {
          color: inherit;
          display: block;
          cursor: pointer;
        }

        .dropdown-content p:hover {
          background-color: var(--BackgroundColor);
        }
      }


      /* 返回 */
      @media screen and (min-width: 0px) {
        .toNav {
          text-align: center;
          z-index: 99999;
          position: absolute;
          display:grid;
          grid-template-columns:100%;
          bottom:0;
          left:0;
          right:0;
          width:fit-content;
          margin:0 auto;
          padding:20px;
          color: #fff !important; 
          animation: move 1.5s infinite;
          font-size: var(--text5);
        }

        .toNav:before {
          content: '\f078';
          font-family: FontAwesome;
          margin-left: 0px;
          text-shadow: 0 0.05rem 1rem rgba(51, 51, 51, .05);
        }

        .toNav:hover {
          animation: pause;
        }

        @keyframes move {
          0% {
            transform: translateY(-10px);
            opacity: 0;
          }

          100% {
            transform: translateY(10px);
            opacity: 1;
          }
        }

        .header-hidden:before,
        .header-hidden:after {
          content: "";
          height: 0 !important;
        }

        .hidden {
          display: none;
        }
      }

      /* 返回顶部 */
      @media screen and (min-width: 0px) {
        .upToNav {
          position: fixed;
          right: 20px;
          bottom: 20px;
          background-color: var(--BlockColor);
          /*border: 1px solid var(--DividColor);*/
          border-radius: 4px;
          padding: 10px;
          color: var(--TextColor2);
          box-shadow: 0px 0px 10px 1px rgba(0,0,0,0.1);
        }

        .upToNav:hover {
          background-color: var(--ThemeColor);
          /*border: 1px solid var(--ThemeColor);*/
          box-shadow: 0px 0px 10px 1px rgba(0,0,0,0.2);
          color: #fff;
        }

        .upToNav:before {
          content: '\f077';
          font-family: FontAwesome;
          margin-left: 0px;
        }
      }
/* 移动端侧边栏 */
@media screen and (max-width:960px){
@keyframes fadeOut {
  0% {
    opacity: 1;
transform: translateY(-100h)
  }
  100% {
    opacity: 0;
transform: translateY(0vh)
  }
}
@keyframes fadeIn{
  0% {
    opacity: 0;
transform: translateY(100vh)
  }
  100% {
    opacity: 1;
    transform: translateY(0)
  }
}

.sideBarMain_hide{
display:none!important;
transition:transformY(100vh) 2s!important;
animation: fadeOut 4s;
}
#showBtn:before{
content:"\f0c9";
padding:0 14px;
line-height:60px;
font-family:FontAwesome;
}
#hideBtn:before{
content:"\f078";
font-size:var(--text5);
display:block;
font-family:FontAwesome;
}
#hideBtn{
width:100%;
display:block!important;
padding:20px;
background-color:var(--BlockColor);
border-bottom:1px solid var(--DividColor);
text-align:center;
}
.sideBarMain_show{
animation:fadeIn 0.3s;
display:block!important;
display:grid!important;
grid-template-columns:100%!important;
grid-gap:10px;
position:fixed;
top:0;
left:0;
width:100vwimportant;
height:100vh!important;
z-index:9999;
overflow-y:scroll;
background-color:var(--BackgroundColor);
}
}

@media screen and (min-width:0px){
.feedbackListSubtitle_right,.feedbackCon_right{
margin-left:50px;
}
.comment_avatar{
width:40px;
height:40px;
border-radius:100%;
border:1px solid var(--DividColor);
}
.comment_avatar img{
box-shadow: 0 0 1px 0px rgba(51, 51, 51, .1)!important;
}
}
    }


/********** 自定义matlab语法高亮 **********/
.matlab-code {
	white-space: pre;
        overflow-x:auto;
     color: var(--TextColor1)!important;
       background:var(--BackgroundColor)!important;
}
.matlab-code .hljs{
   background-color:var(--BackgroundColor)!important;
  margin:0!important;
}
.matlab-code .matlab-keyword,
code .matlab-keyword {
	color: #0000fe!important;
}

.matlab-code .matlab-string,
code .matlab-string {
	color: #a020ef!important;
}

.matlab-code .matlab-number,
code .matlab-number {
	color: var(--TextColor1)!important;
}

.matlab-code .matlab-bracket,
code .matlab-bracket {
	color: var(--TextColor1)!important;
}

.matlab-code .matlab-comment,
code .matlab-comment {
	color: #228b22!important;
}

.matlab-code .matlab-comment span,
code .matlab-comment span {
	color: #228b22!important;
	font-weight: normal!important;
}

侧边栏

<script type="text/javascript">
$.silence({
	profile: {
		enable: true,
		avatar: '',
		favicon: 'https://blog-static.cnblogs.com/files/Hitocoko/bitbug_favicon.ico',
	},
	catalog: {
		enable: true,
		move: true,
		index: true,
		level1: 'h2',
		level2: 'h3',
		level3: 'h4',
	},
	signature: {
		enable: true,
		home: 'https://www.cnblogs.com/Hitocoko/',
		license: 'CC BY 4.0',
		link: 'https://creativecommons.org/licenses/by/4.0'
	},
	sponsor: {
		enable: true,
		paypal: null,
		//wechat: 'https://www.cnblogs.com/images/cnblogs_com/zouwangblog/1477590/t_%e5%be%ae%e4%bf%a1%e5%9b%be%e7%89%87_20190704175553.png',
		//alipay: 'https://www.cnblogs.com/images/cnblogs_com/zouwangblog/1477590/t_%e5%be%ae%e4%bf%a1%e5%9b%be%e7%89%87_20190704174158.png'
	},
	github: {
		enable: false,
		color: '#fff',
		fill: '#FF85B8',
		link: 'https://github.com/MZMH'
	},
	topImg: {
		homeTopImg: ["https://img2018.cnblogs.com/blog/1646268/201908/1646268-20190808213853909-1772245301.jpg","https://img2018.cnblogs.com/blog/1646268/201908/1646268-20190808213858652-132088076.jpg"],
		notHomeTopImg: ["https://img2018.cnblogs.com/blog/1646268/201908/1646268-20190808214726187-2092834311.jpg",				]
	},
	topInfo: {
		title: 'Hi,MZMH',
		text: 'You got to put the past behind you before you can move on.',
		github: "https://github.com/MZMH",
		weibo: "https://weibo.com/5682002748/profile?topnav=1&wvr=6&is_all=1",
		telegram: "",
		music: "https://music.163.com/#/user/home?id=436757779",
		twitter: "",
		zhihu:"https://www.zhihu.com/people/zouwang/activities",
		mail: "http://mail.qq.com/cgi-bin/qm_share?t=qm_mailme&email=KlBFX11LRE0SGBlqW1sESUVH",
	}
});
</script>

页首

<div id="loading">
  <div class="pulse-container">  
    <div class="pulse-bubble pulse-bubble-1"></div>
    <div class="pulse-bubble pulse-bubble-2"></div>
    <div class="pulse-bubble pulse-bubble-3"></div>
  </div>
</div>

页脚

<script src="https://blog-static.cnblogs.com/files/Hitocoko/main.js"></script>