/*---------------------------------------------------------------------------------
	Theme Name: Hydrant
	Version: 1.2.131
	Text Domain: hydrant
	Description: Hemingway is a clean, beautiful and responsive two-column theme for bloggers. Features responsive design, retina-ready assets, full-width header image with parallax scrolling effect, custom accent color, custom logo upload, custom widgets (video, Flickr and Dribbble), page templates and translation-ready code. Included translations: Swedish/svenska.
	Template: hemingway
	Tags: black, dark, white, green, two-columns, fluid-layout, responsive-layout, custom-header, custom-menu, custom-colors, featured-images, flexible-header, post-formats, sticky-post, threaded-comments, translation-ready, editor-style
	Author: Anders Norén
	Author URI: http://www.andersnoren.se
	Theme URI: http://www.andersnoren.se/teman/hemingway-wordpress-theme/
	License: GNU General Public License version 2.0
	License URI: http://www.gnu.org/licenses/gpl-2.0.html
	All files, unless otherwise stated, are released under the GNU General Public License
	version 2.0 (http://www.gnu.org/licenses/gpl-2.0.html)
-----------------------------------------------------------------------------------

	0.	CSS Reset
	1.	Document Setup
	2.  Element Base
	3.  Structure
	4.	Header
	5.	Navigation
	6.	Main Content
	7.  Single post
	8.	Blocks
	9.	Post Content
	10.	Comments
	11.	Pagination
	12.	Page & Page Templates
	13.	Sidebar
	14.	Footer
	15. Credits
	16.	Media Queries

----------------------------------------------------------------------------------- */

:root {
  --admin-offset: 0px;
} /* default when logged out */
body.admin-bar {
  --admin-offset: 32px;
} /* WP admin bar (desktop) */
@media (max-width: 782px) {
  body.admin-bar {
    --admin-offset: 46px;
  }
}
@media (max-width: 600px) {
  body.admin-bar {
    --admin-offset: 0px;
  }
}

html {
  scroll-behavior: smooth;
}

html,
body {
  height: 100%;
  margin: 0;
}

.big-wrapper {
  /* Color Links */

  --hydrant-page-bg: var(--hydrant-general-layer-1);
  --hydrant-page-select-bg: var(--hydrant-general-layer-2);

  --hydrant-head-bloginfo-color_hover: var(--color-a_focused);

  --hydrant-sidebar-wide-search-input: var(--hydrant-general-text);
  --hydrant-sidebar-wide-search-input-border: var(--hydrant-general-layer-3);
  --hydrant-sidebar-wide-search-input-background: var(
    --hydrant-general-layer-2
  );
  --hydrant-sidebar-wide-search-input-placeholder: var(--hydrant-general-text);
  --hydrant-sidebar-wide-search-button-background: var(
    --hydrant-general-layer-3
  );
  --hydrant-sidebar-wide-search-button-background_hover: var(
    --hydrant-general-hover
  );
  --hydrant-sidebar-wide-widgets-label: var(--hydrant-general-text);
  --hydrant-sidebar-wide-widgets-sep: var(--hydrant-general-layer-3);
  --hydrant-sidebar-wide-tagcloud-background: var(--hydrant-general-layer-3);
  --hydrant-sidebar-wide-tagcloud-background_hover: var(
    --hydrant-general-hover
  );
  --hydrant-sidebar-wide-subscribe-button-background: var(
    --hydrant-general-layer-3
  );
  --hydrant-sidebar-wide-subscribe-button-background_hover: var(
    --hydrant-general-hover
  );
  --hydrant-sidebar-wide-subscribe-button-color: var(--hydrant-general-layer-1);

  --hydrant-nav-wide-background: var(--hydrant-general-layer-3);
  --hydrant-nav-wide-background_hover: var(--hydrant-general-hover);
  --hydrant-nav-wide-color: var(--color-b);
  --hydrant-nav-wide-color_hover: var(--color-d);
  --hydrant-nav-wide-color_active: var(--color-d);

  --hydrant-nav-narr-background-primary: var(--hydrant-general-layer-3);
  --hydrant-nav-narr-background: var(--hydrant-general-hover);
  --hydrant-nav-narr-color_hover: var(--color-d);
  --hydrant-nav-narr-color_active: var(--color-d);
  --hydrant-nav-narr-searchicon: var(--color-e);
  --hydrant-nav-narr-hamburgericon: var(--color-e);

  --hydrant-footer-background: var(--hydrant-general-layer-3);
  --hydrant-footer-credits-background: var(--hydrant-general-layer-3);
  --hydrant-footer-credits-color: var(--hydrant-general-layer-1);
  --hydrant-footer-widgets-color: var(--hydrant-general-layer-1);
  --hydrant-footer-widgets-sep: var(--hydrant-general-layer-2);
  --hydrant-footer-tagcloud-background: var(--hydrant-general-layer-1);
  --hydrant-footer-tagcloud-background_hover: var(--hydrant-general-layer-2);
  --hydrant-footer-tagcloud-color: var(--color-e);
  --hydrant-footer-tagcloud-color_hover: var(--color-e);

  --hydrant-plugins-readingtime-background: var(--hydrant-general-layer-3);
  --hydrant-plugins-readingtime-color: var(--hydrant-general-layer-1);
  --hydrant-plugins-readingprog-background: var(--hydrant-general-layer-3);

  --hydrant-post-title: var(--hydrant-general-text);
  --hydrant-post-metadata: var(--hydrant-general-text-secondary);
  --hydrant-post-categories: var(--hydrant-general-layer-3);
  --hydrant-post-categories-icon: var(--hydrant-general-text-secondary);
  --hydrant-post-categories-icon-border: var(--hydrant-general-text-inverted);
  --hydrant-post-navigation-color: var(--hydrant-general-text-secondary);
  --hydrant-post-navigation-color_hover: var(--hydrant-general-hover);
  --hydrant-post-navigation-sep: var(--hydrant-general-layer-3);
  --hydrant-post-tags-background: var(--hydrant-general-layer-3);
  --hydrant-post-tags-background_hover: var(--hydrant-general-hover);
  --hydrant-post-tags-color: var(--hydrant-general-text-inverted);
  --hydrant-post-comments-color: var(--hydrant-general-text);
  --hydrant-post-comments-notes-color: var(--hydrant-general-text-secondary);
  --hydrant-post-comments-reply: var(--hydrant-general-layer-3);
  --hydrant-post-comments-author: var(--hydrant-general-text);
  --hydrant-post-comments-post-author: var(--hydrant-general-text-secondary);
  --hydrant-post-tables-thead-background: var(--hydrant-general-layer-2);
  --hydrant-post-tables-color: var(--hydrant-general-text-secondary);
  --hydrant-post-tables-border: var(--color-a_focused);
  --hydrant-post-link-color: var(--color-c);
  --hydrant-post-link-color_hover: var(--color-d);
  --hydrant-post-quote-color: var(--hydrant-general-text-secondary);
  --hydrant-post-quote-background: var(--hydrant-general-layer-2);

  --hydrant-home-headline-color: var(--hydrant-general-layer-3);
  --hydrant-home-headline-underline: var(--hydrant-general-layer-3);
  --hydrant-home-postbox-background: var(--hydrant-general-layer-2);
  --hydrant-home-postbox-color: var(--hydrant-general-text);
  --hydrant-home-postbox-title: var(--hydrant-general-layer-3);
  --hydrant-home-postbox-title_hover: var(--hydrant-general-hover);
  --hydrant-home-postbox-readmore-background: var(--hydrant-general-layer-3);
  --hydrant-home-postbox-readmore-background_hover: var(
    --hydrant-general-hover
  );
  --hydrant-home-postbox-readmore-color: var(--hydrant-general-layer-1);
}

.big-wrapper {
  color: var(--hydrant-general-text);
  background-color: var(--hydrant-page-bg);
  font-family: "Heebo";
  position: relative;
  overflow: hidden;
  z-index: 0;
}

.page-bg {
  position: relative;
  overflow: hidden;
}

.page-bg::before {
  content: "";
  z-index: -1;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background-image: url(assets/imgs/blog_background.png);
  background-size: 300px;
  filter: var(--hydrant-general-latex-filter);
}

.wrapper {
  padding: 20px 50px;
  background: linear-gradient(
    90deg,
    transparent 0%,
    var(--hydrant-page-bg) 3%,
    var(--hydrant-page-bg) 96%,
    transparent 100%
  );
  margin: 0 auto;
  padding-top: 4em;
}

main {
  display: flow-root;
}

.content.middle {
  width: 100%;
}

.featured-media {
  display: flex;
}

.sidebar {
  height: 100%;
  padding-bottom: 2em;
  padding-right: 1em;
  padding-left: 3em;
  width: 35%;
}

.post-header {
  margin-bottom: 3%;
}

.bright-theme {
  /* palette */
  --color-a: #b20000;
  --color-a_focused: #830e0e;
  --color-b: #ffb396;
  --color-c: #cb0000;
  --color-d: #fff5c0;
  --color-e: #1b1717;
  --color-f: #424040;
  --color-g: dodgerblue;
  --color-h: #fcccba;
  --color-i: yellow;

  /* main rules */
  --hydrant-general-layer-1: var(--color-d);
  --hydrant-general-layer-2: var(--color-b);
  --hydrant-general-layer-3: var(--color-a);
  --hydrant-general-text: var(--color-e);
  --hydrant-general-text-secondary: var(--color-f);
  --hydrant-general-text-inverted: var(--color-d);
  --hydrant-general-text-inverted-secondary: var(--color-b);
  --hydrant-general-hover: var(--color-a_focused);
  --hydrant-general-button-background: var(--hydrant-general-layer-3);
  --hydrant-general-button-background_hover: var(--hydrant-general-hover);
  --hydrant-general-button-color: var(--hydrant-general-text-inverted);
  --hydrant-general-textarea-background: var(--hydrant-general-layer-2);
  --hydrant-general-textarea-color: var(--hydrant-general-text);
  --hydrant-general-latex-filter: invert(7%) sepia(9%) saturate(703%)
    hue-rotate(314deg) brightness(96%) contrast(94%);

  /* sub rules */

  --hydrant-head-bloginfo-background: var(--color-e);
  --hydrant-head-bloginfo-color: var(--color-d);

  --hydrant-nav-narr-color: var(--color-b);

  --hydrant-home-postbox-tags: var(--color-a_focused);
}

.dark-theme {
  /* palette */
  --color-a: #e84545;
  --color-a_focused: #b50000;
  --color-b: #393939;
  --color-c: #ff4d4d;
  --color-d: #262626;
  --color-e: #e4d3cf;
  --color-f: #e2bcb7;
  --color-g: #34bfd2;
  --color-h: #555;
  --color-i: #f8e272;

  /* main rules */
  --hydrant-general-layer-1: var(--color-d);
  --hydrant-general-layer-2: var(--color-b);
  --hydrant-general-layer-3: var(--color-a);
  --hydrant-general-text: var(--color-e);
  --hydrant-general-text-secondary: var(--color-f);
  --hydrant-general-text-inverted: var(--color-d);
  --hydrant-general-text-inverted-secondary: var(--color-b);
  --hydrant-general-hover: var(--color-a_focused);
  --hydrant-general-button-background: var(--hydrant-general-layer-3);
  --hydrant-general-button-background_hover: var(--hydrant-general-hover);
  --hydrant-general-button-color: var(--hydrant-general-text-inverted);
  --hydrant-general-textarea-background: var(--hydrant-general-layer-2);
  --hydrant-general-textarea-color: var(--hydrant-general-text);
  --hydrant-general-latex-filter: invert(91%) sepia(17%) saturate(244%)
    hue-rotate(319deg) brightness(96%) contrast(85%);

  /* sub rules */

  --hydrant-head-bloginfo-background: var(--color-d);
  --hydrant-head-bloginfo-color: var(--color-e);

  --hydrant-nav-narr-color: var(--color-e);

  --hydrant-home-postbox-tags: var(--color-a);
}

/* ------------------------------------------------------------------------------- */
/*	Head
/* -------------------------------------------------------------------------------- */

/* .header-cover.section {
	background-color: #0b4c3e;
}

div.header.section {
	background-image: url(assets/imgs/squares_pattern.png);
	background-repeat: repeat;
	background-size: 5%;
} */

.header-inner {
  display: flex;
  justify-content: center;
}

.header-inner.section-inner img {
  max-height: 9em;
  margin-left: 2em;
}

.blog-info {
  background: var(--hydrant-head-bloginfo-background);
}

.blog-title a {
  color: var(--hydrant-head-bloginfo-color);
}

.blog-title a:hover {
  color: var(--hydrant-head-bloginfo-color_hover) !important;
}

/* ------------------------------------------------------------------------------- */
/*	Page
/* -------------------------------------------------------------------------------- */

body.custom-background {
  background-color: #e84545 !important;
}

textarea,
.comment-form input {
  background-color: var(--hydrant-general-textarea-background);
  color: var(--hydrant-general-textarea-color);
}

button,
.button,
.faux-button,
a.more-link,
.wp-block-button__link,
.wp-block-file .wp-block-file__button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
  background-color: var(--hydrant-general-button-background);
  color: var(--hydrant-general-button-color);
  font-weight: bold;
}

.content input[type="submit"]:hover {
  background-color: var(--hydrant-general-button-background_hover) !important;
}

form label {
  color: var(--hydrant-general-text-secondary);
}

form {
  margin: 0;
}

select {
  -webkit-appearance: button;
  appearance: button;
  -moz-appearance: button;
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -webkit-padding-end: 20px;
  -moz-padding-end: 20px;
  -webkit-padding-start: 15px;
  -moz-padding-start: 15px;
  border-radius: 5px;
  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
  font-size: inherit;
  margin: 0;
  overflow: hidden;
  padding-top: 2px;
  padding-bottom: 2px;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%;
  max-width: 400px;

  background-color: var(--hydrant-sidebar-wide-search-input-background);
  border: 1px solid var(--hydrant-sidebar-wide-search-input-border);
  color: var(--hydrant-sidebar-wide-search-input);
}

.wp-block-archives-dropdown.wp-block-archives label {
  text-decoration: underline;
}

code,
kbd,
pre {
  background: var(--hydrant-general-layer-2);
}

.syntaxhighlighter {
  direction: ltr;
  white-space: normal;
}

.post-content .syntaxhighlighter code {
  white-space: nowrap;
}

.post-content kbd,
.post-content code {
  display: inline-block;
  max-width: 100%;
  white-space: normal;
  word-break: break-word;
  direction: ltr;
}

/* ------------------------------------------------------------------------------- */
/*	Post
/* -------------------------------------------------------------------------------- */

article {
  margin-top: 3em;
}

article a:link,
article a:visited,
article a:active,
.series_info a,
.postbox-list a,
.comment-content a {
  position: relative;
  color: var(--hydrant-post-link-color);
  /* border-bottom: 3px solid var(--hydrant-post-link-color); */
  box-shadow: inset 0px -2px 0px 0px var(--hydrant-post-link-color);
}

.series_info a {
  padding: 0 !important;
  display: inline !important;
}

article a:hover,
.post-nav .series_info a:hover,
.postbox-list a:hover,
.comment-content a:hover {
  text-decoration: none;
  color: var(--hydrant-post-link-color_hover) !important;
  box-shadow: inset 0px -30px 0px 0px var(--hydrant-post-link-color);
}

article a.fbx-link {
  box-shadow: none;
}

.wp-block-image,
.wp-block-embed {
  display: flex;
  flex-direction: column;
}

.post-content p {
  display: flow-root;
}

figure.wp-block-image.size-large.style-svg {
  max-width: 500px;
  margin: 1em auto;
}

.post-title,
.post-title a,
.post-title a:hover {
  color: var(--hydrant-general-text) !important;
}

.post-meta,
.post-meta a {
  color: var(--hydrant-general-text-secondary);
  vertical-align: middle;
}

.post-meta a:hover {
  color: var(--hydrant-general-hover) !important;
}

h1,
.post-title {
  font-size: 3em;
}

h2 {
  font-size: 2em;
  font-style: italic;
}

h3 {
  font-size: 1.5em;
  text-decoration: underline;
  font-weight: 400;
}

h4 {
  position: relative;
  font-size: 1em;
  text-decoration: underline;
  font-weight: bold;
  width: fit-content;
  display: flex;
}

h1,
h2,
h3,
h4,
h5,
h6,
.faux-heading {
  color: var(--hydrant-general-text);
}

.post-content {
  font-size: 1.2rem;
  padding: 0 1em;
  margin-top: 1em;
}

.post-content > *:last-child {
  margin-bottom: 20px !important;
}

.post-content ul,
.post-content ol {
  margin: 1em;
  margin-top: 0em;
  display: flow-root;
}

.post-content figcaption,
.post-content .wp-caption-text,
.post-content .gallery-caption,
.post-content .wp-block-image figcaption {
  color: var(--hydrant-general-text-secondary);
}

.posts article {
  width: 100%;
}

hr.wp-block-separator {
  background-color: var(--hydrant-post-navigation-sep);
}

.post-categories a {
  color: var(--hydrant-post-categories) !important;
  font-weight: bold;
}

.category-icon,
.category-icon:after {
  background: var(--hydrant-post-categories-icon);
}

.front-flap {
  background: var(--hydrant-post-categories-icon);
  border: 1px solid var(--hydrant-post-categories-icon-border);
}

.post-nav {
  border-top-color: var(--hydrant-post-navigation-sep);
  border-bottom-color: var(--hydrant-post-navigation-sep);
  border-radius: 0.3em;
}

.archive-nav a {
  margin: 0 2px;
  color: var(--hydrant-post-navigation-color);
}

.post-nav h5 {
  color: var(--hydrant-post-navigation-color);
  text-align: center;
}

.post-meta-wrapper {
  display: flex;
}

.post-meta-wrapper img {
  border-radius: 100%;
}

.post-meta {
  margin-right: 1em;
  display: flex;
  flex-direction: column;
  height: 96px;
  justify-content: space-around;
}

.post-tags a {
  background: var(--hydrant-post-tags-background);
  color: var(--hydrant-post-tags-color);
  border-left: 0.5px solid var(--hydrant-post-tags-background);
  border-bottom-left-radius: 2px;
}

.post-tags a::after {
  border-right: 12px solid var(--hydrant-post-tags-background);
  left: -11.5px;
}

.post-tags a::before {
  background-color: var(--hydrant-general-layer-1);
}

.post-tags a:hover {
  background-color: var(--hydrant-post-tags-background_hover) !important;
  border-left-color: var(--hydrant-post-tags-background_hover);
}

.post-tags a:hover::after {
  border-right: 12px solid var(--hydrant-post-tags-background_hover) !important;
}

p.series_info {
  padding: 1em 0;
}

iframe {
  max-width: 600px !important;
  max-height: 400px !important;
}

/* ------------------------------------------------------------------------------- */
/*	Comments
/* -------------------------------------------------------------------------------- */

.comments,
.comment-respond {
  border-top: none;
  padding-top: 0;
  margin-top: 10%;
}

.comment-meta .avatar {
  float: right;
}

.comment-meta-content {
  margin-right: 70px;
  padding-top: 7px;
  margin-left: 0;
}

.comments-title,
#reply-title,
.pingbacks-title {
  color: var(--hydrant-post-comments-color);
}

.comment-form label {
  color: var(--hydrant-post-comments-color);
}

p.comment-notes,
p.logged-in-as {
  color: var(--hydrant-post-comments-notes-color);
}

.post-content a.comment-reply-link,
#cancel-comment-reply-link,
.logged-as a,
a.comment-edit-link {
  color: var(--hydrant-post-comments-reply) !important;
  box-shadow: none;
  font-weight: bold;
  padding: 1em;
}

.comment-meta-content cite {
  color: var(--hydrant-post-comments-author);
}

.bypostauthor .comment-meta-content cite .post-author {
  color: var(--hydrant-post-comments-post-author);
}

.ql-img-inline-formula,
.dynamic_color img,
.ql-img-displayed-equation {
  filter: var(--hydrant-general-latex-filter);
}

.comments + .comment-respond {
  border-top: 4px solid var(--hydrant-post-navigation-sep);
}

li.comment,
li > div.comment {
  margin: 0;
}

li > div.comment,
.commentlist > li:first-child > div.comment:first-child {
  border-top: 1px solid var(--hydrant-post-navigation-sep);
  border-bottom: none;
  padding: 1em;
  margin-bottom: 0;
}

.children > li > div.comment {
  padding: 1em !important;
}

ol.commentlist ul.children {
  border-right: 10px solid var(--hydrant-sidebar-wide-widgets-sep);
  margin-right: 1em;
  /* padding-right: 1em; */
}

.post,
.page {
  border-bottom: 0;
}

.post-nav-group {
  position: relative;
}

.post-nav-newer h5 {
  right: 0;
  text-align: right;
}

.post-nav-older h5 {
  left: 0;
  text-align: left;
}

nav.post-nav.group {
  margin-bottom: 2em;
  display: flow-root;
}

nav.post-nav.group p {
  margin-bottom: 0em;
}

.commentlist .comment-respond {
  padding-right: 1em;
  border-bottom: none;
  margin-bottom: 0;
  position: relative;
}

#cancel-comment-reply-link {
  top: 0;
  left: 0;
}

span.required-field-message,
p.comment-notes {
  margin-top: 1em;
  margin-bottom: 1em;
  color: var(--hydrant-general-text-secondary);
}

/* Nested Lists
=================== */

.post-nested-list ol {
  list-style-type: none;
  counter-reset: item;
  margin: 0;
  padding: 0;
}

.post-nested-list li {
  display: table;
  counter-increment: item;
}

.post-nested-list li:before {
  content: counters(item, ".") ". ";
  display: table-cell;
  padding-left: 0.6em;
}

.post-nested-list.nested-ltr li:before {
  padding-right: 0.6em;
}

.post-nested-list li li {
  margin: 0;
}

.post-nested-bullet ul li {
  margin-right: 1.5em;
}

/* Tables
=================== */

.wp-block-table {
  overflow-x: auto;
}

figure.wp-block-table {
  margin-bottom: 1em;
}

figure.wp-block-table.is-style-regular table,
.wp-block-table table {
  border: solid 2px var(--hydrant-post-tables-border);
  margin-bottom: 0;
}

figure.wp-block-table.is-style-regular td,
.wp-block-table td {
  border-color: var(--hydrant-post-tables-border);
  border-width: 2px;
  border-style: dashed;
}

figure.wp-block-table.is-style-regular thead,
.wp-block-table thead {
  white-space: normal;
  background-color: var(--hydrant-post-tables-thead-background);
  border: solid 2px var(--hydrant-post-tables-border);
  vertical-align: middle;
  text-align: center;
}

figure.wp-block-table.is-style-regular th,
.wp-block-table th {
  border-color: var(--hydrant-post-tables-border);
  border-top: none;
  border-width: 3px;
  color: var(--hydrant-post-tables-color);
}

/* Quotes
=================== */

.post-content blockquote {
  background: var(--hydrant-post-quote-background);
  color: var(--hydrant-post-quote-color);
  font-family: inherit;
  position: relative;
  padding-top: 2em;
}

.post-content blockquote::before {
  content: '"';
  font-size: 5em;
  position: absolute;
  right: 0;
}

.post-content blockquote p:last-of-type::after {
  content: '"';
  font-size: 5em;
  position: absolute;
  bottom: 0.5em;
  left: 0;
  line-height: 0%;
}

.post-content blockquote cite {
  margin-top: 2em;
  color: var(--hydrant-post-quote-color);
}

/* ------------------------------------------------------------------------------- */
/*	Sidebar
/* -------------------------------------------------------------------------------- */

input,
.search-form .search-field,
input[type="text"],
input[type="password"],
input[type="email"],
input[type="url"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="week"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="color"],
textarea {
  background-color: var(--hydrant-sidebar-wide-search-input-background);
  border: 1px solid var(--hydrant-sidebar-wide-search-input-border);
  color: var(--hydrant-sidebar-wide-search-input);
  border-radius: 5px;
}

.search-form .search-field::placeholder {
  opacity: 1;
  color: var(--hydrant-sidebar-wide-search-input-placeholder);
}

.search-form .search-submit {
  background-color: var(
    --hydrant-sidebar-wide-search-button-background
  ) !important;
}

.search-form .search-submit:hover {
  background-color: var(
    --hydrant-sidebar-wide-search-button-background_hover
  ) !important;
}

.wp-block-archives-dropdown.wp-block-archives label,
.widget-title,
.wp-block-categories__label {
  color: var(--hydrant-sidebar-wide-widgets-label) !important;
  font-family: "Heebo";
  font-size: 0.9rem;
  font-weight: 700;
  margin: 0 0 20px 0;
  text-transform: uppercase;
  size: 14.4px;
  height: 28px;
  text-decoration: underline;
}

.widget {
  border-bottom: 4px solid var(--hydrant-sidebar-wide-widgets-sep);
}

#mc-embedded-subscribe {
  background-color: var(
    --hydrant-sidebar-wide-subscribe-button-background
  ) !important;
  color: var(--hydrant-sidebar-wide-subscribe-button-color) !important;
  font-weight: bold;
}

#mc-embedded-subscribe:hover {
  background-color: var(
    --hydrant-sidebar-wide-subscribe-button-background_hover
  ) !important;
}

/* Tag Cloud
=================== */

.tagcloud,
article .wp-block-tag-cloud {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  row-gap: 1em;
}

article .wp-block-tag-cloud {
  width: 70%;
}

.tagcloud a,
article .wp-block-tag-cloud a,
article .wp-block-tag-cloud a:link {
  background-color: var(--hydrant-sidebar-wide-tagcloud-background);
  float: right;
  border-radius: 1em;
  color: var(--hydrant-footer-tagcloud-color);
  padding: 0.5em;
  box-shadow: none;
}

.tagcloud a:hover,
article .wp-block-tag-cloud a:hover {
  background-color: var(--hydrant-sidebar-wide-tagcloud-background_hover);
  box-shadow: none;
}

/* 
to enable sizing remove !important from
tag clouds in parent theme
*/

/* ------------------------------------------------------------------------------- */
/*	Nav Bar
/* -------------------------------------------------------------------------------- */

.navigation.section.no-padding.bg-dark {
  background-color: var(--hydrant-nav-wide-background);
}

.navigation.section.no-padding.is-stuck {
  position: fixed;
  top: var(--admin-offset, 46px);
  left: 0;
  right: 0;
  z-index: 1000;
}

.below-featured.is-stuck {
  margin-top: calc(3em + var(--admin-offset));
}

.below-featured.is-stuck.big {
  margin-top: calc(260px + var(--admin-offset));
}

.below-featured {
}

.blog-menu a {
  color: var(--hydrant-nav-wide-color);
  font-size: 1em;
  font-weight: bold;
  padding: 20px;
  user-select: none;
}

.blog-menu a:hover {
  color: var(--hydrant-nav-wide-color_hover) !important;
  background-color: var(--hydrant-nav-wide-background_hover) !important;
}

.blog-menu .current-menu-item > a {
  color: var(--hydrant-nav-wide-color_active);
  font-weight: bold;
}

.blog-menu > li + li:before {
  display: none;
}

.theme-toggle::after {
  content: "☀️";
}

.theme-toggle.dark::after {
  content: "🌙";
}

li.theme-toggle-parent {
  margin-left: auto;
  user-select: none;
}

a.theme-toggle:hover {
  text-decoration: none;
}

.wide-nav-div {
  display: flex;
}

.blog-menu {
  justify-content: space-between;
}

/* Mobile Nav Bar
=================== */

.mobile-menu a {
  background-color: var(--hydrant-nav-wide-background);
}

.toggle-container {
  background: var(--hydrant-nav-narr-background-primary);
}

.search-toggle .glass {
  background-color: var(--hydrant-nav-narr-background-primary);
}

.search-toggle .handle,
.search-toggle .metal {
  background: var(--hydrant-nav-narr-searchicon);
}

.nav-toggle .bar {
  background-color: var(--hydrant-nav-narr-hamburgericon);
}

.nav-toggle.active .bar {
  background-color: var(--hydrant-nav-narr-hamburgericon);
  display: none;
}

.nav-toggle.active .bar:first-child {
  transform: translateY(3px) rotate(45deg);
  margin-top: 0;
  display: block;
}

.nav-toggle.active .bar:nth-child(3) {
  transform: rotate(-45deg);
  margin-top: 0;
  display: block;
}

.mobile-menu a {
  color: var(--hydrant-nav-narr-color);
  text-align: center;
  font-weight: bold;
}

.mobile-menu .current-menu-item a {
  color: var(--hydrant-nav-narr-color_active);
  font-weight: bold;
  text-decoration: underline;
}

/* ------------------------------------------------------------------------------- */
/*	Footer
/* -------------------------------------------------------------------------------- */

@media screen and (min-width: 900px) {
  .column.column-1.left {
    display: none;
  }
}

.footer form,
.widget-content select {
  margin-bottom: 30px;
}

.footer .wp-block-archives-dropdown.wp-block-archives {
  margin-top: 0;
}

.footer.section.bg-dark {
  background: var(--hydrant-footer-background);
}

.column.column-1.left {
  width: 100%;
}

.footer .widget {
  margin-top: 10%;
  margin-bottom: 0;
  flex-grow: 1;
  padding: 0 2em;
}

.footer .widget-content {
  color: var(--hydrant-footer-widgets-color);
}

.footer-inner .column.column-1.left .widgets {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
}

.footer .widget.widget_tag_cloud {
  padding-bottom: 2em;
  border-bottom: 4px solid var(--hydrant-footer-widgets-sep);
}

.footer .tagcloud a {
  background-color: var(--hydrant-footer-tagcloud-background);
  color: var(--hydrant-footer-tagcloud-color);
}

.footer .tagcloud a:hover {
  background-color: var(--hydrant-footer-tagcloud-background_hover) !important;
  color: var(--hydrant-footer-tagcloud-color_hover);
}

.footer .column {
  border-top: none;
}

.footer-inner .widgets {
  display: block;
  left: 0;
  right: 0;
}

.footer .column.column-3.left {
  width: fit-content;
}

@media (max-width: 700px) {
  .footer .column {
    width: fit-content;
    margin-left: 0;
    padding-top: 0;
    border-top: 0;
    margin-top: 0;
  }

  .footer .wp-block-archives-dropdown.wp-block-archives {
    margin-bottom: 2em;
  }
}

.footer #block-3.widget.widget_block {
  margin-top: 0;
}

.footer-inner.section-inner.group {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.footer.section.large-padding.bg-dark {
  margin: 0;
  padding-bottom: 1em;
  padding-top: 0;
}

.credits.section.bg-dark {
  background: var(--hydrant-footer-credits-background);
  display: flow-root;
  padding-bottom: 1em;
}

.credits-inner.section-inner.group {
  padding-bottom: 1em;
  padding-top: 1em;
}

.credits-inner.section-inner.group p {
  margin: 0;
}

.footer .widget {
  border-bottom-color: var(--hydrant-footer-widgets-sep);
}

.credits-inner {
  border-top: 2px solid var(--hydrant-footer-widgets-sep);
}

.credits {
  color: var(--hydrant-footer-credits-color);
}

/* ------------------------------------------------------------------------------- */
/*	Plugins
/* -------------------------------------------------------------------------------- */

.rt-reading-time {
}

.middle.content .rt-reading-time {
  display: inline;
  background-color: var(--hydrant-plugins-readingtime-background);
  text-align: center;
  color: var(--hydrant-plugins-readingtime-color);
  font-weight: bold;
  padding: 0.5em 1em;
  width: fit-content;
  margin-bottom: 1.5em;
  border-radius: 2em;
}

/* ------------------------------------------------------------------------------- */
/*	Others
/* -------------------------------------------------------------------------------- */

/* Lyrics
=================== */

.curLyrics {
  background-color: cadetblue;
  color: azure;
  font-weight: bold;
}

.lyrics {
  cursor: pointer;
}

/* Layout Fixes
================== */

.skip-link.button {
  display: none;
  left: 0;
}

/* ------------------------------------------------------------------------------- */
/*	Home Page
/* -------------------------------------------------------------------------------- */

.archive-description {
  text-align: right;
}

.home-headline,
.archive-title {
  color: var(--hydrant-home-headline-color);
  text-align: center;
  font-size: 2em;
  padding: 0;
  margin-top: 0;
  border-bottom: 2px solid var(--hydrant-home-headline-underline);
}

.archive-header {
  margin-bottom: 5%;
  text-align: center;
}

.posts {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-evenly;
  padding-right: 20px;
}

.home_post_box {
  border-radius: 1em;
  background-color: var(--hydrant-home-postbox-background);
  margin: 1em 0;
  overflow: hidden;
  display: flex;
  max-width: 45%;
  flex-direction: column;
}

.postbox_header {
  display: flex;
  flex-direction: column;
}

a.postbox_image_wrapper {
  display: contents;
}

.postbox-list {
  /* color: yellow; */
  font-size: 1.5em;
}

.moviebox {
  width: 45%;
  position: relative;
}

.moviebox .wp-post-image {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
}

@media screen and (max-width: 800px) {
  .home_post_box {
    max-width: 100%;
  }
}

.home-post-content {
  margin: 0;
  padding: 0.5em;
  font-size: 1em;
  color: var(--hydrant-home-postbox-color);
}

.home-post-content p {
  font-size: 1.4em;
}

.home_post_box h1 {
  margin: 0.5em 0.5em 0 0.5em;
  font-size: 2em;
  /* height: 200px; */
}

.home_post_box h1 a:link,
.home_post_box h1 a:visited {
  color: var(--hydrant-home-postbox-title);
  text-decoration: none;
}

.home_post_box h1 a:hover,
.home_post_box h1 a:active {
  color: var(--hydrant-home-postbox-title_hover);
  text-decoration: none;
}

.home-post-metadata {
  display: flex;
  padding: 0.5em;
  width: 100%;
  background-color: var(--color-h);
  flex-direction: row;
  align-items: center;
  justify-content: space-around;
}

.home_post_box .home-post-metadata div {
  vertical-align: middle;
}

.home_post_box .home-post-metadata span {
  display: inline-block;
}

.home-post-date::before {
  content: " 📅 ";
}

.home-post-author::before {
  content: " 👤 ";
}

.home-post-tags::before {
  content: "🏷️";
}

.home-post-tags a {
  color: var(--hydrant-home-postbox-tags);
}

@media (max-width: 500px) {
  .post-author {
    display: inline;
  }
}

@media (max-width: 1200px) {
  .postbox_header {
    flex-direction: column;
  }

  img.attachment-post-thumbnail-size.size-post-thumbnail-size.wp-post-image {
    width: 100%;
  }

  .home-post-metadata {
    width: 100%;
  }
}

p.home-post-readmore {
  background-color: var(--hydrant-home-postbox-readmore-background);
  width: fit-content;
  padding: 0.5em 1em;
  font-size: 1em;
  color: var(--hydrant-home-postbox-readmore-color);
  border-radius: 2em;
  font-weight: bold;
}

a.home-post-readmore-row {
  display: flex;
  flex-direction: row-reverse;
  margin-left: 2em;
  margin-top: auto;
}

.home-post-readmore:hover {
  background-color: var(--hydrant-home-postbox-readmore-background_hover);
}

.post-nav.archive-nav {
  height: 4.5em;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  column-gap: 10px;
  grid-template-areas: "newer_things pages older_things";
  place-items: stretch;
}

.archive-nav .post-nav-newer {
  grid-area: newer_things;
  float: none;
}

.archive-nav > .post-nav-older {
  grid-area: older_things;
  justify-content: flex-end;
}

.post-nav.archive-nav a {
  float: none;
  padding: 0;
  max-width: none;
  display: flex;
  align-items: center;
}

.post-nav.archive-nav .post-nav-older span {
  margin-left: 1em;
}

.post-nav.archive-nav .post-nav-newer span {
  margin-right: 1em;
}

.archive-nav .navigation.pagination {
  grid-area: pages;
}

.archive-nav .navigation.pagination .nav-links {
  display: flex;
  height: 100%;
  align-items: center;
  justify-content: center;
}

.archive-nav .nav-links .page-numbers {
  padding: 0 0.25em;
}

.archive-nav .nav-links .page-numbers :hover {
  color: var(--hydrant-general-hover);
}

.archive-nav .nav-links .page-numbers.current {
  color: var(--hydrant-general-button-background);
  top: 0;
}

.group:after {
  clear: both;
  content: none;
  display: block;
}

.nav-links a.page-numbers.prev,
.nav-links a.page-numbers.next {
  display: none;
}

.post-nav a,
.post-nav h5 {
  color: var(--hydrant-post-navigation-color);
  display: block;
}

.post-nav a:hover {
  color: var(--hydrant-post-navigation-color_hover) !important;
}

.page-numbers.current {
  color: var(--color-a_focused);
  font-weight: bold;
  font-size: 1.3rem;
  position: relative;
  top: 2px;
}

.blog-search,
.navigation {
  background-color: inherit;
}

.wp-block-syntaxhighlighter-code .toolbar {
  display: none;
}

@media (max-width: 900px) {
  .post-content {
    padding: 0 0.5em;
  }

  .post-content .alignwide {
    margin-left: 0;
    position: relative;
    left: calc(50% - 37vw + 20px);
    width: calc(80vw - 40px);
  }

  div.wp-block-syntaxhighlighter-code.smallcode {
    font-size: 0.6em !important;
  }
}

@media (max-width: 700px) {
  .wrapper {
    padding-right: 45px;
    padding-left: 45px;
  }
}

@media (max-width: 600px) {
  .wrapper {
    padding: 20px 25px;
  }

  .reduce-size-for-mobile {
    font-size: 0.7em;
  }
}

@media (max-width: 500px) {
  .wrapper {
    padding: 20px 25px;
  }

  .section-inner {
    max-width: 100%;
    margin: 0 auto;
  }

  .navigation-inner.section-inner {
    max-width: 86%;
  }

  .post-content {
    padding: 0 0.25em;
  }

  .reduce-size-for-mobile {
    font-size: 0.6em;
  }

  .post-content .alignwide {
    left: calc(50% - 50vw + 40px);
    width: calc(100vw - 40px);
  }

  .post-nav span,
  .archive-nav span,
  .comment-nav-below span {
    display: inherit;
  }
}

@media (max-width: 900px) {
  body:not(.show-sidebar-on-mobile) .sidebar {
    display: none;
  }
}

div#mc_embed_signup {
  display: flow-root;
}

@media (max-width: 900px) {
  .content,
  .sidebar {
    width: 100%;
    float: none;
  }
}

.content.left {
  width: 100%;
}

.search-form-container {
  max-width: 270px;
}

.home-post-excerpt {
  /* height: 240px; */
}

.svg-color-black-stroke {
  stroke: var(--color-a) !important;
}

.svg-color-black-fill {
  fill: var(--color-a) !important;
}

.svg-color-gray-stroke {
  stroke: var(--color-f) !important;
}

.svg-color-gray-fill {
  fill: var(--color-f) !important;
}

.svg-color-blue-stroke {
  stroke: var(--color-g) !important;
}

.svg-color-blue-fill {
  fill: var(--color-g) !important;
}

.svg-color-yellow-stroke {
  stroke: var(--color-i) !important;
}

.svg-color-yellow-fill {
  fill: var(--color-i) !important;
}

.svg-color-text-stroke {
  stroke: var(--color-e) !important;
}

.svg-color-text-fill {
  fill: var(--color-e) !important;
}

.svg-color-transparent-stroke {
  stroke: transparent !important;
}

.svg-color-transparent-fill {
  fill: transparent !important;
}

.search-form {
  height: 100%;
}

div.search-form-container input.search-field {
  border: none;
  height: 100%;
}
