:root {
  --accent-color: #2196f3;
  --accent-color-light: #6ab8f7;
  --accent-color-llight: #9acffa;
  --blur-size: 25px;
  --heading-color: #ffce64;
  --h1-color: #ddd;
  --bg-color: rgba(38, 50, 56, 0.65);
  --bg-color-pure: #263238;
  --fore-color: #fff;
  --fore-color-dark: #ccc;
  --title-color: #ddd;
  --buryit-bg5: rgba(0, 0, 0, 0.5);
  --buryit-bg8: rgba(0, 0, 0, 0.8);
  --hr-color: #333;
  --post-a-fore-color: #aaa;
  --shadow-color: #111;
  --shadow-color-light: rgba(17, 17, 17, 0.2);
  --green-channel-bg: rgba(0, 0, 0, 0.1);
  --searchbar-bg: rgba(0, 0, 0, 0.1);
  --quote-bg: #263238;
  --commentbar-bg: rgba(38, 50, 56, 0.2);
  --commentbar-bg-hover: rgba(38, 50, 56, 0.8);
  --th-bg: rgba(226, 243, 255, 0.5);
  --nav-a-color: #ddd;
  --nav-a-color-hover: rgba(9, 96, 165, 0.15);
  --bg2-color: rgba(38, 50, 56, 0.6);
  --cnb-code-toolbar-item-bg: transparent;
  --my-zzk: rgba(102, 102, 102, 0.2);
  --scroll-track: #222;
  --img-lighter: 1.5;
  --inline-code-color: #c0e3ff;
}
@media (prefers-color-scheme: light) {
  :root {
    --heading-color: #ca8a00;
    --h1-color: #222;
    --bg-color: rgba(236, 240, 241, 0.65);
    --bg-color-pure: #ecf0f1;
    --fore-color: #000;
    --fore-color-dark: #333;
    --title-color: #222;
    --buryit-bg5: rgba(255, 255, 255, 0.5);
    --buryit-bg8: rgba(255, 255, 255, 0.8);
    --hr-color: #ccc;
    --post-a-fore-color: #555;
    --shadow-color: rgba(17, 17, 17, 0.2);
    --shadow-color-light: rgba(17, 17, 17, 0.4);
    --green-channel-bg: rgba(255, 255, 255, 0.1);
    --searchbar-bg: rgba(255, 255, 255, 0.4);
    --quote-bg: #ecf0f1;
    --commentbar-bg: rgba(236, 240, 241, 0.5);
    --commentbar-bg-hover: rgba(236, 240, 241, 0.8);
    --th-bg: rgba(226, 243, 255, 0.5);
    --nav-a-color: #222;
    --bg2-color: rgba(236, 240, 241, 0.6);
    --my-zzk: rgba(153, 153, 153, 0.2);
    --scroll-track: #ddd;
    --img-lighter: 1;
    --inline-code-color: #ff3800;
  }
}
body {
  font-family: 'Varela Round', 'Microsoft YaHei', 'Source Sans Pro', 'Helvetica Neue', Menlo, Monaco, monospace, 'Lucida Console', sans-serif, Helvetica, 'Hiragino Sans GB', 'Hiragino Sans GB W3', Source Han Sans CN Regular, WenQuanYi Micro Hei, Arial, sans-serif;
  background-image: url(https://images.cnblogs.com/cnblogs_com/lollipopnougat/2242693/o_221112155023_67239FBB-E15D-4F4F-8EE8-0F1C9F3C4E7C.jpeg);
  background-attachment: fixed;
  background-position: 40% 60%;
}
#home {
  margin-top: 80px;
  backdrop-filter: blur(var(--blur-size));
  background-color: var(--bg-color);
  border-radius: 10px;
  box-shadow: 0 3px 8px var(--shadow-color);
  font-family: 'Varela Round', 'Microsoft YaHei', 'Source Sans Pro', 'Helvetica Neue', Menlo, Monaco, monospace, 'Lucida Console', sans-serif, Helvetica, 'Hiragino Sans GB', 'Hiragino Sans GB W3', Source Han Sans CN Regular, WenQuanYi Micro Hei, Arial, sans-serif;
}
*,
a:link {
  color: var(--fore-color);
}
a:visited {
  color: var(--fore-color-dark);
}
a {
  transition: color 0.25s ease-in-out, background 0.25s ease-in-out;
}
a:hover {
  color: var(--accent-color-light);
}
#user_info ~ a.navbar-anonymous {
  color: var(--nav-a-color);
}
#user_info ~ a.navbar-anonymous:hover {
  color: var(--accent-color);
}
.tippy-content,.tippy-box[data-theme~=cnblogs] {
  background: transparent;
}
.cnblogs-toc,.cnblogs-toc>.cnblogs-tox-item {
  background: var(--bg-color);
  border-radius: 5px;
}
.postDesc a:link,
.postDesc a:visited,
.postDesc a:active,
#topics .postDesc {
  color: var(--post-a-fore-color);
}
.forFlow .postDesc {
  width: 90%;
}
.postBody h4,
.postBody h5 {
  color: var(--fore-color-dark);
}
.postBody blockquote {
  background: var(--bg-color-pure);
  border-color: var(--accent-color);
  backdrop-filter: blur(var(--blur-size));
  border-radius: 6px;
  box-shadow: rgba(17, 17, 17, 0.1) 2px 2px 8px;
  margin-right: 50px;
}
.postBody th {
  background: var(--th-bg);
}
.postBody .blogpost-bodya a,
.postBody .blogpost-bodya a:link,
.postBody .blogpost-bodya a:visited {
  color: #ff3800;
}
#navList a:link,
#navList a:visited,
#navList a {
  color: var(--h1-color) !important;
}
#navList a:hover,
#navList a:active {
  color: var(--accent-color) !important;
}
#blogTitle h1 a {
  color: var(--h1-color);
}
#blogTitle h1 a:hover {
  color: var(--accent-color);
}
#blogTitle h2 {
  color: var(--title-color);
}
#green_channel {
  background-color: var(--green-channel-bg);
}
#green_channel a {
  background: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  padding: 4px 8px;
  border-radius: 5px;
  transition: all 0.3s ease-in-out;
}
#green_channel a#green_channel_favorite:hover {
  background: none;
  background-color: #ffce64;
}
#green_channel a#green_channel_follow:hover {
  background: none;
  background-color: #ff3800;
}
#green_channel a#green_channel_favorite:active {
  background: none;
  background-color: #ca8f0f;
}
#green_channel a#green_channel_follow:active {
  background: none;
  background-color: #b52700;
}
#green_channel a#green_channel_digg:hover {
  background: none;
  background-color: #54dcee;
}
#green_channel a#green_channel_digg:active {
  background: none;
  background-color: #23818e;
}
#green_channel {
  border-radius: 5px;
  border: 1px dashed #c0c0c0;
}
#green_channel:hover {
  border: 1px solid var(--accent-color);
  transition: all 0.3s ease-in-out;
}
#commentform_title {
  border-bottom: 2px solid var(--hr-color);
}
.navbar > nav .navbar-icon,
fieldset,
img {
  filter: brightness(var(--img-lighter));
}
.author_avatar,
.navbar #user_icon,
#green_channel_wechat img,
.postBody img {
  filter: none !important;
}
.navbar {
  height: 64px;
  line-height: 64px;
  background-color: var(--bg-color);
  backdrop-filter: blur(var(--blur-size));
  display: block;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 999;
  padding-top: 0;
  padding-bottom: 0;
}
.navbar #msg_count {
  right: 0;
  background: var(--accent-color);
}
.navbar > nav {
  justify-content: space-evenly;
}
.navbar > nav .navbar-list {
  height: 64px;
}
.navbar > nav .navbar-search {
  background-color: var(--searchbar-bg);
  transition: border 0.3s ease-in-out;
  border: dashed 1px transparent;
}
.navbar > nav .navbar-search:hover {
  border: solid 1px var(--accent-color);
}
.navbar > nav .navbar-left > *:not(:first-child) {
  margin: 0;
  padding: 0;
}
.navbar > nav #nav_left .navbar-branding a:hover {
  background: transparent;
}
.navbar > nav .navbar-right > *:not(:first-child),
.navbar > nav #navbar_login_status > *:not(:first-child) {
  margin-left: 12px;
}
.navbar > nav .navbar-icon:hover {
  filter: hue-rotate(-27deg) saturate(10) contrast(1.5);
  transition: filter 0.2s ease-in-out;
}
#nav_left a:link,
#nav_left a:active,
#nav_left a:visited {
  display: block;
  padding: 0 16px;
  color: var(--nav-a-color);
  transition: all 0.2s ease-in-out;
  border-bottom: 2px dashed transparent;
}
#nav_left a:hover {
  color: var(--accent-color);
  background: var(--nav-a-color-hover);
}
#navList a:link,
#navList a:visited,
#navList a:active {
  color: #222;
}
#navList a:hover {
  color: var(--accent-color);
}
.dropdown > .dropdown-menu {
  background-color: var(--bg-color-pure);
  box-shadow: 2px 2px 13px 0 var(--shadow-color-light);
}
.dropdown > .dropdown-menu > *:first-child,
.dropdown > .dropdown-menu > *:not(:first-child) {
  margin: 6px;
  height: 40px;
  line-height: 40px;
}
.dropdown > .dropdown-menu > *:first-child:hover,
.dropdown > .dropdown-menu > *:not(:first-child):hover {
  text-decoration: none;
  color: var(--accent-color);
}
hr {
  margin-bottom: 2px;
  border-color: var(--hr-color);
  margin-right: 50px;
}
.diggit,
.buryit {
  background: var(--buryit-bg5);
  border-radius: 8px;
  height: 48px;
  transition: all ease-in-out 0.2s;
  box-shadow: rgba(17, 17, 17, 0.1) 2px 2px 8px;
}
.diggit:hover,
.buryit:hover {
  background: var(--buryit-bg8);
  box-shadow: rgba(17, 17, 17, 0.1) 2px 2px 10px;
}
.diggit:active,
.buryit:active {
  box-shadow: rgba(17, 17, 17, 0.2) 2px 2px 6px;
}
.diggit::after {
  content: '\A推荐';
  white-space: pre;
}
.buryit::after {
  content: '\A反对';
  white-space: pre;
}
.diggnum,
.burynum {
  color: var(--accent-color);
}
.cnb-code-toolbar-item {
  background-color: var(--cnb-code-toolbar-item-bg) !important;
}
#navigator {
  border-bottom: 1px solid #555;
  border-top: 1px solid #555;
}
#navblog-myblog-icon,
.navbar-user-info.navbar-message.navbar-icon-wrapper,
#user_info a.dropdown-button {
  padding: 0 8px;
  background: transparent;
  border: none;
  margin: 0;
}
.newsItem,
.catListPostArchive.sidebar-block,
.catListView {
  background-color: var(--bg2-color);
  border-radius: 10px;
  box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.1);
  padding-left: 10px;
  padding-bottom: 10px;
  padding-top: 1px;
  backdrop-filter: blur(var(--blur-size));
}
#sideBarMain {
  width: 100%;
}
.mySearch,
.catListLink,
.catListTag,
.catListPostCategory,
.catListImageCategory {
  max-width: 290px;
  border-radius: 10px;
  padding-left: 10px;
  padding-top: 1px;
  padding-bottom: 5px;
  background-color: var(--bg2-color);
  box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(var(--blur-size));
}
.newsItem,
.catListPostArchive,
.catListView {
  max-width: 290px;
}
.catListTitle,
.div_my_zzk {
  margin-top: 10px;
}
#blog-calendar {
  max-width: 300px;
  padding-bottom: 5px;
  margin-bottom: 35px;
  box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.1);
  border: none;
  border-radius: 10px;
  background-color: var(--bg2-color);
  backdrop-filter: blur(var(--blur-size));
}
.CalTitle td {
  border-radius: 10px 0px 0px 0px;
  background: transparent !important;
}
.CalTitle {
  border-radius: 10px 10px 0px 0px;
  background: transparent;
}
.CalNextPrev a {
  margin-right: 5px;
  padding-left: 5px;
  padding-right: 5px;
  padding-bottom: 2px;
  border-radius: 10px;
}
.CalNextPrev a:hover {
  background: var(--accent-color-light);
  color: #fff !important;
}
.CalTodayDay {
  border-radius: 3px;
  background: var(--accent-color) !important;
}
.CalDayHeader {
  background: var(--bg2-color);
  backdrop-filter: blur(var(--blur-size));
}
#sideBar a:hover {
  color: var(--accent-color);
  text-decoration: none;
}
.div_my_zzk {
  width: 160px;
  color: #333;
  background: transparent;
  height: 35px;
}
@media only screen and (max-width: 767px) {
  #sidebar_search_box input[type='text'].input_my_zzk {
    width: 240px;
  }
  .btn_my_zzk {
    right: -110px;
  }
}
.input_my_zzk:focus {
  background: rgba(33, 150, 243, 0.15);
  border: 1px solid var(--accent-color);
}
.input_my_zzk:hover {
  border: 1px solid var(--accent-color) !important;
}
.input_my_zzk {
  background: var(--my-zzk);
  border-radius: 5px;
  border: dashed transparent 1px;
  transition: all 0.2s ease-in-out;
}
#mainContent .forFlow .day {
  border-radius: 10px;
  background: var(--bg2-color);
  padding-top: 10px;
  padding-left: 10px;
  backdrop-filter: blur(var(--blur-size));
  box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.1);
  margin-right: 10px;
}
.postCon a,
.postCon a:link,
.postCon a:visited {
  text-decoration: none;
  color: var(--accent-color);
}
.postCon a:hover {
  color: var(--accent-color-light);
}
.postTitle a:link,
.postTitle a:visited,
.postTitle a:active {
  color: var(--accent-color);
}
.postTitle {
  border-color: var(--accent-color);
}
.postTitle span[role='heading'] {
  color: var(--heading-color);
}
.cnblogs-markdown pre,
.postBody blockquote,
.cnblogs-markdown pre {
  margin-right: 50px;
}
.CalTodayDay:hover {
  border-radius: 10px;
  transition: all 0.2s ease-in-out;
}
.CalTodayDay a u {
  text-decoration: none !important;
  color: #000;
}
.comment_textarea {
  background-color: var(--commentbar-bg) !important;
}
.commentbox_tab:hover,
.commentbox_tab.active {
  color: var(--fore-color) !important;
}
.comment_textarea:focus,
.comment_textarea:hover {
  background-color: var(--commentbar-bg-hover) !important;
}
#comment_form_container .comment_textarea {
  border: 1px dashed #ddd;
  border-radius: 8px;
}
#comment_form_container .comment_textarea:hover {
  border: 1px solid var(--accent-color);
  transition: all 0.2s ease-in-out;
  box-shadow: var(--shadow-color-light) 2px 2px 8px;
}
.commentbox_tab:hover,
.commentbox_tab.active {
  border-bottom: 2px solid var(--accent-color);
}
.comment_btn {
  background: var(--accent-color);
  -webkit-border-radius: 5px;
  border-radius: 5px;
  width: 80px;
  height: 30px;
  padding: 0;
}
.comment_btn:hover {
  background: var(--accent-color-light);
}
.comment_btn:active {
  background: var(--accent-color-llight);
}
#comment_nav {
  margin-right: 10px;
}
div#EntryTag,
#BlogPostCategory {
  color: var(--title-color);
}
div#EntryTag a,
#BlogPostCategory a,
div#EntryTag a:link,
#BlogPostCategory a:link,
div#EntryTag a:visited,
#BlogPostCategory a:visited {
  color: #fff;
  padding: 5px 15px;
  border-radius: 8px;
  background: #599e71;
}
div#EntryTag a:hover,
#BlogPostCategory a:hover {
  background: #0c7cd5;
}
#commentform_title {
  border-bottom: 2px solid #555;
}
.comment_textarea {
  background-color: rgba(255, 255, 255, 0.4);
  transition: all 0.3s ease-in-out;
}
div.commentform textarea {
  background: transparent;
}
.comment_textarea:focus,
.comment_textarea:hover {
  background-color: rgba(255, 255, 255, 0.8);
}
::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}
::-webkit-scrollbar-thumb {
  background-color: #aaa;
  background-clip: padding-box;
  min-height: 100px;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background-color: #555;
}
::-webkit-scrollbar-thumb:active {
  background-color: var(--accent-color);
}
::-webkit-scrollbar-track {
  width: 5px;
  background-color: var(--scroll-track);
}
.cnblogs-markdown pre,
.postBody blockquote,
.cnblogs-markdown pre {
  box-shadow: var(--shadow-color-light) 2px 2px 8px;
  border-radius: 6px;
}
.cnblogs-markdown code,
.cnblogs-post-body code {
  background-color: var(--bg-color) !important;
  color: var(--inline-code-color) !important;
  border: none !important;
  font-size: 14px !important;
}
.cnblogs-markdown pre {
  max-width: 97%;
}
#cnblogs_post_body th, .blogpost-body th {
  background-color: rgba(255, 255, 255, 0.2);
}
@media screen and (max-width: 767px) {
  #cnblogs_post_body table{
    overflow-x: hidden!important;
  }
}