@charset 'UTF-8';

/* ==========================================================================
   Pinghsu - uefeng/minimal style
   视觉与布局对齐 https://uefeng.com/ (minimal 主题)
   ========================================================================== */

/* ---- Base reset ---- */
* { margin: 0; padding: 0; border: 0; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
*, *:after, *:before { box-sizing: border-box; }
html { overflow-x: hidden; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }
body {
  margin: 0 auto;
  color: #505050;
  font-size: 14px;
  font-family: -apple-system, BlinkMacSystemFont, "SF UI Text", Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;
  line-height: 1.8;
  text-rendering: geometricPrecision;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body > :first-child { margin-top: 0 !important; }
body > :last-child { margin-bottom: 0 !important; }
blockquote, dl, ol, p, pre, table, ul { margin: 20px 0; vertical-align: baseline; }
h1, h2, h3, h4, h5, h6 { font-weight: 400; -webkit-font-smoothing: antialiased; }
h1 code, h1 tt, h2 code, h2 tt, h3 code, h3 tt, h4 code, h4 tt, h5 code, h5 tt, h6 code, h6 tt { font-size: inherit; }
h1 { color: #222; font-size: 1.4em; }
h2 { color: #333; font-size: 1.3em; }
h3 { color: #444; font-size: 1.2em; }
h4 { font-size: 1.1em; }
h4, h5, h6 { color: #555; }
h5, h6 { font-size: 1em; }
a:first-child h1, a:first-child h2, a:first-child h3, a:first-child h4, a:first-child h5, a:first-child h6,
body > h1:first-child, body > h1:first-child + h2, body > h2:first-child, body > h3:first-child,
body > h4:first-child, body > h5:first-child, body > h6:first-child { margin-top: 0; padding-top: 0; }
a { outline: 0; color: #505050; text-decoration: none; }
a:active, a:focus, a:hover { outline: 0; color: #2479cc; }
ol, ul { padding-left: 30px; }
ol li ol:first-of-type, ol li ul:first-of-type, ol li > :first-child,
ul li ol:first-of-type, ul li ul:first-of-type, ul li > :first-child { margin-top: 0; }
li { word-wrap: break-word; }
li p { margin: 0; }
ol ol, ol ul, ul ol, ul ul { margin-bottom: 0; }
pre { position: relative; margin: 20px 0; }
code {
  margin: 0 3px; padding: 2px 6px; border-radius: 3px;
  background-color: #f7f7f7;
  font-family: Menlo, "Bitstream Vera Sans Mono", "DejaVu Sans Mono", Monaco, Consolas, monospace;
}
code, pre code { font-size: 13px; }
pre code { display: block; overflow: auto; padding: 1.3em; border: 0; }
blockquote { padding: 0 10px 0 20px; border-left: 4px solid #ddd; }
blockquote > :first-child { margin-top: 0; }
blockquote > :last-child { margin-bottom: 0; }
hr { clear: both; overflow: hidden; margin: 15px 0; padding: 0; height: 0; border: 0; border-bottom: 2px solid #ddd; background: 0 0; }
button, input, select, textarea {
  font-size: 13px; line-height: 1.6; resize: none;
  font-family: -apple-system, "SF UI Text", Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;
}
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #5f5f5f; }
input:-moz-placeholder, input::-moz-placeholder, textarea:-moz-placeholder, textarea::-moz-placeholder { color: #5f5f5f; }
input:-ms-input-placeholder, textarea:-ms-input-placeholder { color: #5f5f5f; }
.clearfix:after, .clearfix:before { display: table; content: ''; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

/* ---- Icons (pure CSS / inline SVG replacements for iconfont) ---- */
.icon-search {
  position: relative; z-index: 1; display: inline-block;
  margin: 0 0 0 3px; width: 13px; height: 13px;
  border: 2px solid currentColor; border-radius: 50%; color: #505050; transform: rotate(-45deg);
}
.icon-search:before { position: absolute; top: 11px; left: 3px; width: 2px; height: 4px; background-color: currentColor; content: ''; }
.icon-menu {
  position: relative; display: inline-block; width: 20px; height: 9pt;
  transition: all .4s ease-in-out; transition-timing-function: cubic-bezier(.61, .04, .17, 1.32);
}
.icon-menu .middle { top: 50%; display: inline-block; margin-top: -1px; }
.icon-menu .middle, .icon-menu:after, .icon-menu:before {
  position: absolute; left: -.25em; width: 20px; height: 2px; background: #505050; transition: all .4s ease-in-out;
}
.icon-menu:after, .icon-menu:before { content: ''; transform-origin: 50% 50% 0; }
.icon-menu:after { bottom: 0; }
.icon-menu:before { top: 0; }
.icon-rili { display: inline-block; width: 14px; height: 14px; margin-right: 6px; vertical-align: -2px; }
.icon-rili svg { width: 14px; height: 14px; display: block; }
.icon-top {
  position: fixed; right: 60px; bottom: 30px; z-index: 20;
  display: block; width: 40px; height: 40px; color: #999; cursor: pointer;
}
.icon-top svg { width: 100%; height: 100%; display: block; }

/* ---- Header ---- */
.header {
  position: fixed; top: 0; z-index: 10; display: block; padding: 0;
  width: 100%; height: 70px; box-shadow: 0 1px .5px rgba(0, 0, 0, .1);
  text-align: right; line-height: 68px;
}
.header.animated { animation-duration: .5s; animation-fill-mode: both; }
.header.animated.slideUp { animation-name: slideUp; }
.header.animated.slideDown { animation-name: slideDown; }
.bg-white { background-color: #f9f9f9 !important; }
.navbar-container { position: relative; margin: 0 auto; width: 990px; height: 70px; max-width: 100%; }
.navbar-logo {
  position: absolute; top: 50%; left: 0; display: block; margin-top: -10px; margin-left: 10px;
  width: auto; height: 22px; max-width: 50%; text-decoration: none; font-size: 22px; line-height: 22px;
}
.navbar-logo img { width: auto; height: 22px; outline: 0; }
.subtitle { position: absolute; top: 7px; left: 5pc; color: #999; font-size: 9pt; }
.navbar-menu { z-index: 10; display: inline-block; padding-right: 5px; width: auto; }
.navbar-menu a { padding: 0 15px; font-size: 14px; }
.navbar-menu a.current { color: #2479cc; }
.navbar-mobile-menu { z-index: 1; display: none; padding: 0 30px 0 10px; width: 28px; line-height: 60px; cursor: pointer; }
.navbar-mobile-menu-on, .navbar-mobile-menu:active { cursor: pointer; }
.navbar-mobile-menu-on .icon-menu, .navbar-mobile-menu:active .icon-menu { transform: rotateZ(360deg); }
.navbar-mobile-menu-on .icon-menu.cross .middle,
.navbar-mobile-menu-on .icon-menu.cross:after,
.navbar-mobile-menu-on .icon-menu.cross:before,
.navbar-mobile-menu:active .icon-menu.cross .middle,
.navbar-mobile-menu:active .icon-menu.cross:after,
.navbar-mobile-menu:active .icon-menu.cross:before { background: #2479cc; }
.navbar-mobile-menu-on .icon-menu.cross .middle, .navbar-mobile-menu:active .icon-menu.cross .middle { opacity: 0; }
.navbar-mobile-menu-on .icon-menu.cross:after, .navbar-mobile-menu:active .icon-menu.cross:after { bottom: 5px; transform: rotate(135deg); }
.navbar-mobile-menu-on .icon-menu.cross:before, .navbar-mobile-menu:active .icon-menu.cross:before { top: 5px; box-shadow: 0 0 0 #fff; transform: rotate(45deg); }
.navbar-mobile-menu li { position: relative; display: inline; margin: 0; text-decoration: none; }
.navbar-mobile-menu ul {
  position: absolute; top: 100%; z-index: 1; overflow: hidden; clip: rect(1px, 1px, 1px, 1px);
  margin: 0 0 0 -95px; padding: 0; text-indent: 0; transition: transform .3s; transform: translate(120px, 0);
}
.navbar-mobile-menu-on ul, .navbar-mobile-menu:active > ul, .navbar-mobile-menu:focus > ul {
  overflow: inherit; clip: inherit; transition: transform .3s; transform: translateX(0) translateY(0) translateZ(0);
}
.navbar-mobile-menu ul li a { display: block; margin: 0; padding: 8px 25px; width: 140px; background-color: #fefefe; text-align: center; font-size: 14px; line-height: 2.2; }
.navbar-search { display: inline-block; padding: 8px 30px 0 0; width: 20px; line-height: 60px; cursor: pointer; }
.navbar-search:active > form, .navbar-search:focus > form, .navbar-search:hover > form { overflow: inherit; clip: inherit; opacity: 1; transition: opacity .5s ease-in-out; }
.navbar-search:active > .icon-search, .navbar-search:focus > .icon-search, .navbar-search:hover > .icon-search { color: #2479cc; }
.navbar-search form {
  position: absolute; top: 50%; right: 0; display: block; overflow: hidden; clip: rect(1px, 1px, 1px, 1px);
  margin-top: -15px; padding-right: 10px; width: auto; height: 30px; max-width: 60%; line-height: 30px; opacity: 0;
}
.navbar-search form .search-box {
  position: relative; top: 3px; display: inline-block; padding: 0; width: 260px; height: 30px;
  max-width: 100%; border: none; border-radius: 3px; line-height: 30px;
}
.navbar-search form .search-box input {
  position: absolute; top: 0; left: 0; padding: 0 40px 0 18px; width: 100%; height: 30px;
  outline: 0; border: 1px solid #2479cc; border-radius: 5px; background-color: #fff; color: #505050;
  font-size: 14px; line-height: 30px; -webkit-appearance: none;
}

/* ---- Main content ---- */
.main-content { margin: 0 auto; padding-top: 90px; max-width: 990px; animation: fade-in; animation-duration: .5s; }

/* ---- Post list (index, single column big cards) ---- */
.main-content .index-page { padding: 10px 15px; width: 100%; height: auto; align-items: center; }
.index-page .post-list-item-container {
  border: 1px solid #eaeaea; border-radius: 3px; background-color: #fff; box-shadow: 0 1px 4px rgba(0, 0, 0, .04);
}
.index-page .post-list-item-container .item-label {
  position: absolute; z-index: 1; padding-top: 90pt; width: 100%; height: 100%;
  background-color: rgba(0, 0, 0, .4); color: #fff; text-align: center; font-size: 13px;
}
.index-page .post-list-item-container .item-title a { font-size: 22px; }
.index-page .post-list-item-container .item-label a { color: #fff; }
.index-page .post-list-item-container .item-label a:hover { color: #2479cc; }
.post-list { position: relative; display: block; overflow: hidden; }
.post-list-item { float: left; padding: 10px 15px; width: 33.3333%; height: auto; align-items: center; }
.post-list-item-container {
  position: relative; overflow: hidden; padding: 0; width: 100%;
  border: 1px solid #eaeaea; border-radius: 3px; background-color: #fff; box-shadow: 0 1px 4px rgba(0, 0, 0, .04);
}
.post-list-item-container .item-desc { z-index: 100; overflow: hidden; padding: 0 40px; width: 100%; height: 100%; text-align: left; }
.post-list-item-container .item-label { padding: 25px 20px 40px; background-color: #fff; }
.post-list-item-container .item-label .item-meta { position: absolute; right: 0; bottom: 0; padding: 0 15px 15px; width: 100%; text-align: right; }
.post-list-item-container .item-label .item-meta .item-meta-cat a {
  position: relative; float: right; margin-right: 10px; padding: 10px 0; color: #5f5f5f;
  text-align: right; text-transform: none; font-size: 13px;
}
.post-list-item-container .item-label .item-meta .item-meta-date {
  position: relative; float: left; padding-top: 9px; padding-left: 9px; color: #f7f7f7;
  text-align: right; text-transform: none; font-size: 9pt;
}
.post-list-item-container .item-desc p { opacity: 0; }
.post-list-item-container:hover .item-desc p { opacity: 1; animation: fade-in; animation-duration: .5s; }
.post-list-item-container .item-thumb {
  position: relative; display: inherit; min-height: 300px;
  background-position: 50% 50%; background-size: cover; transition: transform .5s ease, filter .5s ease;
}
.post-list-item-container:hover .item-thumb { transform: scale(1.1); -moz-filter: blur(8px); filter: blur(8px); }

/* ---- Archive / category page ---- */
.archive-page .categorys-title, .common-page .common-title { margin: 0 0 0 13px; color: #5f5f5f; font-weight: 500; font-size: 1pc; }
.archive-page .post-list-item-container, .common-page .post-list-item-container {
  border: 1px solid #eaeaea; border-radius: 3px; background: #fff; box-shadow: 0 1px 4px rgba(0, 0, 0, .04);
}
.archive-page .post-list-item-container .item-label, .common-page .post-list-item-container .item-label { height: 95px; background: #fff; }
.archive-page .post-list-item-container .item-title, .common-page .post-list-item-container .item-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.archive-page .post-list-item-container .item-label .item-meta .item-meta-date,
.common-page .post-list-item-container .item-label .item-meta .item-meta-date { padding-bottom: 5px; padding-left: 5px; color: #5f5f5f; }
.archive-page .post-list-item-container:hover, .common-page .post-list-item-container:hover { box-shadow: 2px 2px 4px rgba(0, 0, 0, .1); }
.common-page .common-title span { padding: 0 5px; color: #2479cc; }

/* ---- Single page / page ---- */
.page-page { padding: 0 25px 20px; max-width: 990px; }
.page-page .links-note { position: absolute; top: 103px; margin-left: 60px; color: #dfdfdf; font-size: 9pt; }
.page-page .links { padding: 0; }
.page-page .links li { display: inline-block; overflow: hidden; margin-right: 10px; padding: 10px 0; width: 46%; }
.page-page .links li span { display: block; overflow: hidden; padding: 10px 0 0 22px; font-size: 9pt; }
.page-page .links li a:hover { border-bottom: 1px solid; }

/* ---- Post detail ---- */
.post-page {
  margin: 0 auto; margin-top: 90px; padding: 20px 25px; max-width: 970px;
  border: 1px solid #eaeaea; border-radius: 0 0 3px; background: #fff; box-shadow: 0 1px 4px rgba(0, 0, 0, .04);
}
.post-page .post-header { margin-bottom: 10px; border-bottom: 1px dashed #e9e9e9; text-align: center; }
.post-title { font-size: 21px; }
.post-data, .post-data a { margin: 10px 0; color: #999; font-size: 13px; }
.post-content p { word-wrap: break-word; font-size: 14px; word-break: break-word; }
.post-content h1, .post-content h2, .post-content h3, .post-content h4, .post-content h5, .post-content h6 { font-weight: 600; }
.post-content h1:before { margin-right: 5px; color: #2479cc; content: '#'; font-weight: 600; }
h3:before { margin-right: 5px; color: #2479cc; content: '#'; font-weight: 600; }
.post-content h2:before, .post-content h4:before, .post-content h5:before, .post-content h6:before { margin-left: 5px; color: #2479cc; content: ''; font-weight: 600; }
.post-content pre { overflow-x: auto; margin: 20px 0; border-radius: 4px; background: #f5f5f5; text-shadow: none; }
.post-content pre code { margin: 0; padding: 1.3em; background-color: #f5f5f5; color: #505050; line-height: 20px; }
.post-content p a { border-bottom: 1px solid #333; color: #333; }
.post-content p a:hover { border-bottom: 1px solid #2479cc; color: #2479cc; }
.post-content img { margin: 0 auto; }
.post-content img, .post-content p img { position: relative; display: block; overflow: hidden; height: auto; max-width: 100%; }
.post-content p img { margin: 20px auto; }
.post-content input.text { padding: 5px 10px; background-color: #fff; color: #5f5f5f; }
.post-content input.submit, .post-content input.text { display: inline-block; outline: 0; border: 1px solid #5f5f5f; border-radius: 3px; }
.post-content input.submit { padding: 5px 15px; background-color: #5f5f5f; color: #fff; }
.post-content table { width: 100%; max-width: 65em; border: 1px solid #dedede; border-collapse: collapse; empty-cells: show; }
.post-content table td, .post-content table th { height: 35px; border: 1px solid #dedede; text-align: center !important; padding: 0 10px; }
.post-content table th { font-weight: 700; background: rgba(158, 188, 226, .2); }
.post-content table tbody tr:nth-child(2n) { background: rgba(158, 188, 226, .12); }
.post-content table tr:hover { background: #efefef; }
.post-content table th { white-space: nowrap; }
.post-tags { margin: 0; }
.post-tags a {
  float: right; margin-left: 5px; padding: 2px 6px 0; letter-spacing: 0; font-size: 9pt; transition-duration: .4s;
}
.post-tags a:nth-child(1n) { border: 1px solid #6fa3ef; border-radius: 5px; background: #6fa3ef; color: #fff; }
.post-tags a:nth-child(2n) { border: 1px solid #ff9800; border-radius: 5px; background: #ff9800; color: #fff; }
.post-tags a:nth-child(3n) { border: 1px solid #336; border-radius: 5px; background: #336; color: #fff; }
.post-tags a:nth-child(4n) { border: 1px solid #c03; border-radius: 5px; background: #c03; color: #fff; }
.post-tags a:nth-child(5n) { border: 1px solid #bc99c4; border-radius: 5px; background: #bc99c4; color: #fff; }
.post-tags a:nth-child(6n) { border: 1px solid #e8583d; border-radius: 5px; background: #e8583d; color: #fff; }
.post-content .post-tags a:hover { outline-style: none; background: #f7f7f7; color: #505050; }

/* ---- Comments ---- */
#comments { margin: 0 auto; max-width: 970px; }
.comment-close { padding-top: 20px; color: #8a1f11; text-align: center; font-size: 14px; }
.comment-num { padding: 10px 0; max-width: 970px; text-align: center; font-weight: 400; font-size: 18px; }
.comment-list { margin: 0; padding-left: 0; list-style-type: none; }
.comment-parent { margin: 20px 0; border: 1px solid #eaeaea; border-radius: 3px; background: #fff; box-shadow: 0 1px 4px rgba(0, 0, 0, .04); }
#comments .response { display: block; padding: 10px 0; border-bottom: 1px solid rgba(208, 217, 230, .2); color: #5f5f5f; font-weight: 400; font-size: 14px; }
#comments .response a { color: #2479cc; }
.comment-parent:last-child { margin: 20px 0 0; }
.comment-parent:first-child { margin: 0; }
.comment-list .comment-even { background-color: #f9f9f9; }
.comment-child, .comment-child2 { border-top: 1px solid #eaeaea; }
.comment-view { padding: 20px; }
.comment-header { display: inline-block; width: 100%; }
.comment-header .avatar { float: left; width: 40px; height: 40px; border: 1px solid #eaeaea; border-radius: 50%; }
.comment-header .comment-author { float: left; margin: 0 20px; line-height: 45px; }
.comment-header .comment-author a:hover, .comment-header .comment-by-author a { color: #2479cc !important; }
.comment-content { margin-bottom: 10px; color: #505050; }
.comment-meta { font-size: 9pt; }
.comment-meta .comment-reply { float: right; display: none; }
.comment-meta .comment-reply a { color: #2479cc !important; }
.comment-view:hover .comment-meta .comment-reply { display: block; }
.comment-parent > .comment-children .avatar { margin: 3px 0 0 3px; width: 40px; height: 40px; }
.comment-parent > .comment-children .comment-author-at { float: left; margin-right: 5px; width: 100%; }
.comment-parent > .comment-children .comment-content { margin: -3px 3px 10px; }
.comment-parent > .comment-children .comment-meta { margin: 0 3px; }
.comment-form {
  position: relative; padding: 10px 20px; border: 1px solid #eaeaea; border-radius: 0 0 3px;
  background: #fff; box-shadow: 0 1px 4px rgba(0, 0, 0, .04);
}
.comment-form .form-control { display: block; width: 100%; height: 34px; outline: 0; color: #505050; font-size: 13px; }
.comment-form .form-control:focus { outline: 0; border-color: #2479cc; }
.comment-form textarea.form-control { overflow: hidden; padding: 10px 0; height: 150px; }
.comment-form .input-control {
  float: left; margin: 10px 10px 10px 0; padding: 0 10px; width: 100%; max-width: 290px;
  border-radius: 5px; background-color: #f5f5f5;
}
.comment-form .submit {
  position: absolute; right: 20px; bottom: 20px; display: block; margin: 0 auto; padding: 0 20px; height: 34px;
  border: 1px solid #f5f5f5; border-radius: 5px; background-color: #f5f5f5; color: #5f5f5f;
  text-align: center; cursor: pointer; transition-duration: .4s;
}
.comment-form .submit:hover, .submit:active, .submit:active:focus, .submit:focus {
  outline-style: none; border: 1px solid #2479cc; background-color: #fff; color: #2479cc;
}

/* ---- Pagination ---- */
.navigator { margin: 30px 0 35px; }
.navigator ol { margin: 0; padding: 0 5px; list-style: none; text-align: center; }
.navigator ol li { display: inline-block; margin: 0 5px; }
.navigator ol li span { margin: 0 5px; }
.navigator ol li a { padding: 6px 10px; border: 1px solid #eaeaea; border-radius: 5px; text-decoration: none; }
.navigator ol li.current a, .navigator ol li.current a:hover { color: #2479cc; }

/* ---- Footer ---- */
.footer { position: relative; z-index: 1; margin-top: 30px; background-color: #fff; }
.footer-social { background-color: #f7f7f7; }
.footer-social .footer-container { margin: 0 auto; max-width: 940px; }
.footer-social .social-list { padding: 20px; text-align: center; }
.footer-social .social-list a { padding: 0 25px; color: #5f5f5f; text-decoration: none; font-size: 13px; }
.footer-container { margin: 0 auto; width: 100%; max-width: 990px; list-style: none; text-align: center; }

/* ---- Responsive ---- */
@media (max-width: 880px) {
  .icon-top { margin-right: -9999px; }
  .comment-container, .post-page { margin-right: 10px; margin-left: 10px; }
  .post-list-item { padding: 10px; width: 50%; }
  .comment-container .navigator { margin: 30px 0 35px; }
  .navigator { margin: 10px 0 0; }
}
@media (max-width: 650px) {
  .navbar-menu { display: none; }
  .navbar-search { padding: 8px 35px 0 0; }
  .navbar-search form { margin-right: 45px; width: 180px; }
  .navbar-mobile-menu { display: inline-block; }
  .post-page { margin-top: 90px; }
  .post-page .post-header { display: block; text-align: center; }
  .item-desc, .page-page .links li span { display: none; }
  .footer { margin-top: 0; }
  .footer-social { display: none; }
}
@media (max-width: 580px) {
  .post-list-item { padding: 10px; width: 100%; }
  .subtitle { display: none; }
}

/* ---- Keyframes ---- */
@keyframes slideDown { 0% { transform: translateY(-70px); } to { transform: translateY(0); } }
@keyframes slideUp { 0% { transform: translateY(0); } to { transform: translateY(-70px); } }
@keyframes fade-in { 0% { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }

/* ---- Dark mode ---- */
@media (prefers-color-scheme: dark) {
  a, body { color: #eee; }
  .index-page .post-list-item-container .item-label a:hover, .navbar-menu a.current,
  .navbar-search:active > .icon-search, .navbar-search:focus > .icon-search, .navbar-search:hover > .icon-search,
  .navigator ol li.current a, .navigator ol li.current a:hover, a:hover { color: #89c0ef; }
  .post-page, body { background-color: #555; }
  .footer-social .social-list a, .icon-search { color: #eee; }
  .bg-white { background-color: #555 !important; }
  .footer, .footer-social { background-color: #555; }
  h1, h2, h3, h4, h5, h6 { color: #eee; }
  .comment-parent { background-color: #555; }
  .comment-list .comment-even { background-color: #595959; }
  .archive-page .categorys-title, .comment-content, .common-page .common-title { color: #eee; }
  .archive-page .post-list-item-container, .archive-page .post-list-item-container .item-label,
  .common-page .post-list-item-container, .common-page .post-list-item-container .item-label { background-color: #555; }
  #comments .response, .archive-page .post-list-item-container .item-label .item-meta .item-meta-date,
  .common-page .post-list-item-container .item-label .item-meta .item-meta-date { color: #eee; }
  .comment-form, textarea { background-color: #555; }
  textarea { color: #eee; }
  .icon-menu .middle, .icon-menu:after, .icon-menu:before { background-color: #eee; }
  .navbar-mobile-menu ul li a { background-color: #555; color: #eee; }
  .archive-page .post-list-item-container, .comment-form, .comment-parent, .common-page .post-list-item-container,
  .index-page .post-list-item-container, .post-page { border: 1px solid #666; box-shadow: 0 1px 4px #777; }
  .comment-child, .comment-child2 { border-top: 1px solid #777; }
  .post-page .post-header { border-bottom: 1px dashed #777; }
  .comment-form .submit { border: 1px solid #666; background-color: #666; color: #eee; }
  .comment-form .submit:hover, .submit:active, .submit:active:focus, .submit:focus { border: 1px solid #777; background-color: #666; box-shadow: 0 1px 4px #777; color: #eee; }
  #comments .response { border-bottom: none; }
  .comment-form .form-control { color: #eee; }
  .navbar-search form .search-box input { border: 1px solid #777; background-color: #666; color: #eee; }
  #comments .response a, .comment-header .comment-author a:hover, .comment-header .comment-by-author a,
  .comment-meta .comment-reply a, .post-content h1:after, .post-content h1:before, .post-content h2:after,
  .post-content h2:before, .post-content h3:after, .post-content h3:before, .post-content h4:after,
  .post-content h4:before, .post-content h5:after, .post-content h5:before, .post-content h6:after,
  .post-content h6:before { color: #89c0ef !important; }
  .page-page .links li span { color: #999; }
  .comment-form .input-control { background-color: #666; }
  .post-content pre code { background-color: #888; }
}