@charset "UTF-8";
/* Donovan Theme for Z-BlogPHP - Ported from WordPress Donovan by ThemeZee */

:root {
  --primary-color: #ee1133;
  --secondary-color: #d5001a;
  --accent-color: #1153ee;
  --light-gray-color: #f2f2f2;
  --gray-color: #666;
  --dark-gray-color: #202020;
  --text-color: #202020;
  --medium-text-color: #707070;
  --light-text-color: rgba(0, 0, 0, 0.5);
  --medium-border-color: rgba(0, 0, 0, 0.15);
  --light-border-color: rgba(0, 0, 0, 0.075);
  --page-background-color: #fff;
  --page-border-color: rgba(0, 0, 0, 0.05);
  --link-color: #ee1133;
  --button-color: #ee1133;
  --button-text-color: #fff;
  --button-hover-color: #d5001a;
  --navi-color: #202020;
  --navi-text-color: #fff;
  --navi-hover-text-color: rgba(255, 255, 255, 0.5);
  --title-color: #202020;
  --widget-title-color: #202020;
  --footer-color: #202020;
  --footer-text-color: #fff;
  --footer-hover-text-color: rgba(255, 255, 255, 0.5);
  --text-font: "Microsoft YaHei", "PingFang SC", Raleway, Arial, Helvetica, sans-serif;
  --title-font: "Microsoft YaHei", "PingFang SC", Quicksand, Tahoma, Arial, sans-serif;
}

/* Reset & Normalize */
html { font-family: sans-serif; -webkit-text-size-adjust: 100%; box-sizing: border-box; }
*, *::before, *::after { box-sizing: inherit; }
body { margin: 0; background: #e8e8e8; }
article, aside, details, figcaption, figure, footer, header, main, menu, nav, section { display: block; }
a { background-color: transparent; text-decoration: none; }
a:active, a:hover { outline: 0; }
img { max-width: 100%; height: auto; border: 0; }
b, strong { font-weight: 700; }

/* Typography */
body, button, input, select, textarea {
  color: var(--text-color);
  font-size: 15px;
  font-family: var(--text-font);
  line-height: 1.75;
}
h1, h2, h3, h4, h5, h6 {
  clear: both;
  margin: 0.8em 0 0.5em;
  line-height: 1.4;
}
h1 { font-size: 2rem; }
h2 { font-size: 1.625rem; }
h3 { font-size: 1.375rem; }
h4 { font-size: 1.25rem; }
p { margin-top: 0.8em; margin-bottom: 1em; }
a, a:link, a:visited { color: var(--link-color); }
a:hover, a:focus, a:active { text-decoration: underline; }
blockquote {
  margin: 1.5em 0;
  padding-left: 1.25em;
  border-left: 4px solid var(--dark-gray-color);
  color: var(--medium-text-color);
  font-size: 1.125rem;
}
pre {
  overflow: auto;
  margin: 1.5em 0;
  padding: 1.5em;
  border: 1px solid var(--light-border-color);
  font-family: "Courier 10 Pitch", Courier, monospace;
  font-size: 0.9375rem;
  line-height: 1.6;
}
hr {
  margin: 1.5em 0;
  height: 1px;
  border: 0;
  background-color: var(--light-border-color);
}
ul, ol { margin: 1em 0; padding: 0 0 0 1.25em; }
ul { list-style: disc; }
ol { list-style: decimal; }
table { width: 100%; border-spacing: 0; border-collapse: collapse; margin: 1em 0; }
th, td { padding: 0.3em 0.6em; border: 1px solid var(--light-border-color); }
th { background: rgba(0, 0, 0, 0.05); }

/* Forms */
button, input[type="button"], input[type="reset"], input[type="submit"] {
  margin: 0;
  padding: 0.5em 1.2em;
  border: none;
  color: var(--button-text-color);
  background-color: var(--button-color);
  cursor: pointer;
  font-size: 0.9375rem;
}
button:hover, input[type="submit"]:hover {
  background-color: var(--button-hover-color);
}
input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], textarea {
  padding: 0.4em 0.6em;
  max-width: 100%;
  border: 1px solid var(--light-border-color);
  background: none;
  color: var(--medium-text-color);
}
input[type="text"]:focus, input[type="email"]:focus, input[type="url"]:focus, textarea:focus {
  border-color: var(--medium-border-color);
  color: var(--text-color);
}
textarea { width: 100%; }

/* Clearfix */
.clearfix::before, .clearfix::after { display: table; content: ""; }
.clearfix::after { clear: both; }

/* Layout */
.site { margin: 0; padding: 0; width: 100%; }
.container { margin: 0 auto; padding: 0 15px; max-width: 1200px; }

/* Header */
.site-header { background: #fff; }
.header-main {
  display: block;
  text-align: center;
  padding: 1.5rem 0;
}
.site-branding { max-width: 100%; }
.site-branding a, .site-branding a:link, .site-branding a:visited, .site-branding a:hover {
  text-decoration: none;
}
.site-title {
  margin: 0;
  padding: 0;
  color: var(--title-color);
  font-size: 2rem;
  font-family: var(--title-font);
  font-weight: 700;
  line-height: 1.4;
}
.site-title a:link, .site-title a:visited { color: var(--title-color); text-decoration: none; }
.site-title a:hover { text-decoration: underline; }
.site-description { margin: 0.3em 0 0; font-size: 0.875rem; color: var(--medium-text-color); }

/* Navigation */
.primary-navigation-wrap { background-color: var(--navi-color); }
.primary-navigation { width: 100%; }
.main-navigation ul {
  margin: 0;
  padding: 0;
  list-style: none;
  color: var(--navi-text-color);
  font-size: 1rem;
  font-family: var(--title-font);
}
.main-navigation ul li { display: inline-block; position: relative; margin: 0; }
.main-navigation ul a {
  display: block;
  padding: 0.8em 1.2em;
  color: var(--navi-text-color);
  text-decoration: none;
}
.main-navigation ul a:hover { color: var(--navi-hover-text-color); }
.main-navigation ul li.current > a { text-decoration: underline; }
.primary-navigation { text-align: center; }

/* Content Layout */
.site-content {
  display: flex;
  flex-wrap: wrap;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
.content-area { flex: 1 1 0; min-width: 0; }
.sidebar {
  flex: 0 0 320px;
  margin-left: 1.5rem;
  max-width: 320px;
}

/* Posts */
.type-post, .type-page, .error-page {
  margin: 0 0 1rem;
  padding: 1.5rem;
  background-color: var(--page-background-color);
  border-bottom: 1px solid var(--page-border-color);
  word-wrap: break-word;
}
.sticky-post { border-left: 4px solid var(--primary-color); }
.sticky-badge { color: var(--primary-color); font-weight: 700; font-size: 0.85em; }

/* Entry Title */
.entry-title {
  margin: 0 0 0.2em;
  padding: 0;
  color: var(--title-color);
  font-size: 1.35rem;
  font-family: var(--title-font);
  font-weight: 700;
  line-height: 1.4;
}
.entry-title a:link, .entry-title a:visited { color: var(--title-color); text-decoration: none; }
.entry-title a:hover { text-decoration: underline; }
.single-post .entry-title { font-size: 1.8rem; }
.page-title { font-size: 1.8rem; }

/* Entry Meta */
.entry-meta {
  margin: 0.4em 0 0.8em;
  color: var(--light-text-color);
  font-size: 0.875rem;
}
.entry-meta a:link, .entry-meta a:visited { color: var(--light-text-color); text-decoration: none; }
.entry-meta a:hover { color: var(--text-color); }
.meta-sep { margin: 0 0.5em; color: #ccc; }

/* Entry Content */
.entry-content { margin-top: 0.5em; line-height: 1.8; }
.entry-content > *:first-child { margin-top: 0; }
.entry-excerpt { max-height: 6em; overflow: hidden; }

/* Entry Tags */
.entry-tags {
  margin: 1.5em 0 0;
  padding: 1em 0 0;
  border-top: 1px solid var(--light-border-color);
  font-size: 0.9rem;
  color: var(--medium-text-color);
}
.entry-tags a { margin: 0 0.3em; color: var(--link-color); }

/* Entry Footer */
.entry-footer {
  margin: 1em 0 0;
  padding: 0.8em 0 0;
  border-top: 2px solid var(--page-border-color);
  color: var(--light-text-color);
  font-size: 0.875rem;
}

/* Archive Header */
.archive-header {
  margin: 0 0 1rem;
  padding: 1.5rem;
  background-color: var(--page-background-color);
  word-wrap: break-word;
}
.archive-title {
  margin: 0;
  padding: 0;
  color: var(--widget-title-color);
  font-size: 1.125rem;
  font-family: var(--title-font);
  font-weight: 700;
}

/* Pagination */
.pagination {
  padding: 1.5rem;
  background-color: var(--page-background-color);
  border-bottom: 1px solid var(--page-border-color);
  text-align: center;
}
.pagination a, .pagination span {
  display: inline-block;
  padding: 0.2rem 0.8rem;
  margin: 0 2px;
  text-decoration: none;
  color: var(--text-color);
  background: var(--light-gray-color);
}
.pagination .now-page, .pagination a:hover {
  color: var(--button-text-color);
  background-color: var(--button-color);
}

/* Sidebar / Widgets */
.widget-area dl.function {
  margin: 0 0 1rem;
  padding: 1.5rem;
  background-color: var(--page-background-color);
  border-bottom: 1px solid var(--page-border-color);
  word-wrap: break-word;
}
.widget-area dt.function_t {
  margin: 0 0 0.8rem;
  padding: 0;
  color: var(--widget-title-color);
  font-size: 1.125rem;
  font-family: var(--title-font);
  font-weight: 700;
}
.widget-area dd.function_c { margin: 0; padding: 0; }
.widget-area dd.function_c ul { margin: 0; padding: 0; list-style: none; }
.widget-area dd.function_c ul li { padding: 0.25em 0; }
.widget-area dd.function_c a:link, .widget-area dd.function_c a:visited { text-decoration: none; }
.widget-area dd.function_c a:hover { text-decoration: underline; }

/* Comments */
.comments-area { word-wrap: break-word; }
.comments-title {
  margin: 0 0 1em;
  padding: 1.5rem;
  background-color: var(--page-background-color);
  color: var(--widget-title-color);
  font-size: 1.125rem;
  font-family: var(--title-font);
  font-weight: 700;
}
.comment-list { margin: 0; padding: 0; list-style: none; }
.comment {
  margin: 0 0 1em;
  padding: 1.5rem;
  background-color: var(--page-background-color);
}
.comment-meta { margin-bottom: 0.5em; }
.comment-meta .avatar { float: left; margin-right: 1em; border-radius: 50%; }
.comment-author-name { font-weight: 700; }
.comment-author-name a { color: var(--text-color); text-decoration: none; }
.comment-metadata { font-size: 0.8rem; color: var(--light-text-color); }
.comment-reply { margin-left: 1em; }
.comment-reply a { color: var(--link-color); }
.comment-content { clear: both; padding-top: 0.5em; line-height: 1.7; }
.children { margin: 1em 0 0; padding-left: 2em; list-style: none; }
.children .comment { border-top: 2px solid var(--page-border-color); padding: 1.5rem 0 0; margin: 0; }

/* Comment Form */
.comment-respond {
  margin: 0 0 1em;
  padding: 1.5rem;
  background-color: var(--page-background-color);
}
.comment-reply-title { margin: 0 0 1em; font-size: 1.125rem; font-weight: 700; }
.comment-form-field { margin-bottom: 0.8em; }
.comment-form-field label { display: inline-block; min-width: 80px; font-weight: 700; font-size: 0.9rem; }
.comment-form-field input[type="text"] { width: 250px; max-width: 100%; }
.comment-form-field textarea { width: 100%; min-height: 100px; }
.form-submit { margin-top: 1em; }
.form-submit .submit {
  padding: 0.6em 2em;
  color: var(--button-text-color);
  background-color: var(--button-color);
  border: none;
  cursor: pointer;
  font-size: 1rem;
}
.form-submit .submit:hover { background-color: var(--button-hover-color); }
.comment-notes { margin-top: 0.5em; font-size: 0.8rem; color: var(--light-text-color); }
.commentpagebar { text-align: center; padding: 0.5em 0; }

/* Footer */
.site-footer {
  background-color: var(--footer-color);
  color: var(--footer-hover-text-color);
  text-align: center;
  padding: 1.5rem;
  font-size: 0.9rem;
  margin-top: 1.5rem;
}
.site-footer a:link, .site-footer a:visited { color: var(--footer-text-color); text-decoration: none; }
.site-footer a:hover { color: var(--footer-hover-text-color); }
.site-footer p { margin: 0.2em 0; }

/* Responsive */
@media only screen and (max-width: 960px) {
  .site-content { flex-direction: column; }
  .sidebar { flex: 1 1 auto; margin-left: 0; max-width: 100%; margin-top: 1.5rem; }
}
@media only screen and (max-width: 640px) {
  .header-main { padding: 1rem 0; }
  .site-title { font-size: 1.5rem; }
  .main-navigation ul li { display: block; }
  .main-navigation ul a { padding: 0.6em 1em; border-top: 1px solid rgba(255,255,255,0.05); }
  .entry-title { font-size: 1.15rem; }
  .single-post .entry-title, .page-title { font-size: 1.4rem; }
  .type-post, .type-page, .error-page { padding: 1rem; }
  .widget-area .module { padding: 1rem; }
  .comment { padding: 1rem; }
  .comment-respond { padding: 1rem; }
}