/*
Theme Name: Clarified
Theme URI: https://www.roughpixels.com/themes/clarified/
Author: Rough Pixels
Author URI: https://www.roughpixels.com
Description: Clarified is a clean, beautiful and responsive theme for both personal and business-based bloggers. Simplistic design with a ton of features and options to give you greater flexibility when it comes to personalizing it to your own needs. We made sure that Clarified is ready for Gutenberg block and Classic Editors; both include theme-related styles that give you a better representation of what your content will look like as you create it. In addition to this, features are abundant with unlimited colours, the choice of several blog layouts, full post layouts, page templates, dynamic width sidebars, typography options, live previews with the WordPress Customizer, and much more!
Version: 1.0.5
Tested up to: 6.4
Requires at least: 4.7
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: clarified
Tags: blog, one-column, custom-background, custom-colors, custom-logo, custom-menu, editor-style, featured-images, footer-widgets, full-width-template, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready, block-styles, wide-blocks

Clarified, (C) 2024 roughpixels.com
Clarified is distributed under the terms of the GNU GPL.
*/


/* Oswald - variable */
@font-face {
  font-family: "Oswald";
  font-display: swap;
  font-style: normal;
  font-weight: 200 700;
  /* Super Modern Browsers */
  src: url("./assets/fonts/Oswald-VariableFont_wght.woff2") format("woff2"),
    /* Modern Browsers */ url("./assets/fonts/Oswald-VariableFont_wght.woff")
      format("woff");
}

/* Root Variables
==================================================== */
:root {
  /* Font Families */
  --clarified-primary-font: "Segoe UI", "Helvetica Neue", Arial, "Noto Sans",
    "Liberation Sans", sans-serif, system-ui, -apple-system, "Apple Color Emoji",
    "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";

  --clarified-secondary-font: Oswald, Impact, "Segoe UI", "Helvetica Neue",
    "Arial Narrow", "Noto Sans", "Liberation Sans", sans-serif, system-ui,
    -apple-system, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol",
    "Noto Color Emoji";

  --clarified-serif-font: Georgia, serif;

  /* Colours */
  --clarified-primary: #4b9789;
  --clarified-secondary: #96604B;
  --clarified-tertiary: #44515E;
  --clarified-beige: #a99a99;
  --clarified-dark: #1d1d1d;
  --clarified-body: #f6f2ee;
  --clarified-content-bg: #fff;
  --clarified-text: #595959;
  --clarified-secondary-text: #8f97a0;
  --clarified-headings: #282828;
  --clarified-links: #4b9789;
  --clarified-hover-links: #c39239;
  --clarified-bottom-text: #adadad;
  --clarified-blockquote-bg: #f3f4f5;

  --clarified-grey-100: #f8f9fa;
  --clarified-grey-200: #e9ecef;
  --clarified-grey-300: #dee2e6;
  --clarified-grey-400: #ced4da;
  --clarified-grey-500: #adb5bd;
  --clarified-grey-600: #6c757d;
  --clarified-grey-700: #495057;
  --clarified-grey-800: #343a40;
  --clarified-grey-900: #212529;

  --clarified-offcanvas-bg: #fff;
  --clarified-hover-opacity: 0.7;
  --clarified-bottom-bg: #1d1d1d;
  --clarified-lines: #dae1e8;
  --clarified-footer-line: #373737;

  --clarified-table-header-bg: var(--clarified-grey-700);
  --clarified-table-header-text: #fff;

  /* Shadows */
  --clarified-page-shadow: 0 0.5rem 1.563rem -0.625rem rgba(0, 0, 0, 0.27);
  --clarified-shadow-sm: 0 1.3rem 1rem -1.25rem rgba(0, 0, 0, 0.5);
  --clarified-shadow: 0 1.5rem 1rem -1.25rem rgba(0, 0, 0, 0.4);
  --clarified-shadow-lg: 0 1.75rem 1.25rem -1.25rem rgba(0, 0, 0, 0.4);

  /* Border radius */
  --clarified-border-radius: 0.5rem;

  /* Media */
  --clarified-img-bg: #fff;
  --clarified-img-radius: 0.25rem;
  --clarified-img-border-color: #ccc;
  --clarified-img-padding: 0.313rem;
  --clarified-img-placeholder-text: 1.125rem;
  --clarified-caption-text: #677179;

  /* Navigation */
  --clarified-nav-bg: #1d1d1d;
  --clarified-menu-links: #9a9a9a;
  --clarified-menu-hover-links: #fff;
  --clarified-submenu-lines: rgba(255,255,255,0.1);
  --clarified-submenu-hover-bg: #96604B;

  /* Forms */
  --clarified-btn: #4b9789;
  --clarified-btn-hover: #96604b;
}

/* Reset
==================================================== */
*,
*::before,
*::after {
  box-sizing: border-box;
}

* {
  margin: 0;
  padding: 0;
}

@media (prefers-reduced-motion: no-preference) {
  :root {
    scroll-behavior: smooth;
  }
}

.clearfix::after {
  display: block;
  clear: both;
  content: "";
}

/* Base
==================================================== */
html {
  font-size: 15px;
}

body {
  background-color: var(--clarified-body);
  color: var(--clarified-text);
  font-family: var(--clarified-primary-font);
  font-size: 1rem;
  height: 100%;
  line-height: 1.65;
  overflow-x: hidden;
  -ms-word-wrap: break-word;
  word-wrap: break-word;
  word-break: break-word;
}

/* Accessibility
==================================================== */
.screen-reader-text,
.visually-hidden,
.visually-hidden-focusable:not(:focus):not(:focus-within) {
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.visually-hidden:not(caption),
.visually-hidden-focusable:not(:focus):not(:focus-within):not(caption) {
  position: absolute !important;
}

.skip-link:focus {
  background-color: #000;
  border-radius: 0.188rem;
  box-shadow: 0 0 0.125rem 0.125rem rgba(0, 0, 0, 1);
  clip: auto !important;
  -webkit-clip-path: none;
  clip-path: none;
  color: #fff;
  display: block;
  font-size: 0.875rem;
  font-weight: 700;
  height: auto;
  left: 0.313rem;
  padding: 1rem 1.438rem 0.875rem;
  text-decoration: none;
  top: 0.313rem;
  width: auto;
  z-index: 100000;
}

/* Do not show the outline on the skip link target. */
#content[tabindex="-1"]:focus {
  outline: 0;
}

/* Layout
==================================================== */
.container,
#bottom-sidebar,
#colophon {
  max-width: 1120px;
  max-width: 70rem;
}

.boxed #page {
    max-width: 80rem;
}

#page {
  background: #fff;
  box-shadow: var(--clarified-page-shadow);
  margin: 0 auto;
  padding: 0;
}

.boxed .container, 
#bottom-wrapper {
    padding-inline: 1rem;
}

.header,
.footer {
  width: 100%;
}

.container {
  display: flex;
  flex-direction: column;
  margin: 2.75rem auto 2.75rem;
      padding-inline: 1rem;
}

#bottom-sidebar,
#colophon {
	margin-inline: auto;
}

#colophon {
  border-top: 1px solid var(--clarified-footer-line);
  padding: 1rem 1.25rem;
}

/* Header
==================================================== */
.site-header,
.home #hero,
.page #hero {
  display: flex;
  align-items: center;
  text-align: center;
  padding: 1rem 0;
  background-size: cover;
  background-position: center;
}

.home #hero,
.page #hero {
  min-height: 400px;
  min-height: 25rem;
}

.header-default .site-header,
.header-minimal .site-header {
  min-height: 5rem;
  flex-direction: column;
  padding: 1rem;
}

.header-hemingway.page.has-post-thumbnail .site-header,
.header-default .site-header,
.header-minimal .site-header,
.header-hemingway .site-header,
.header-outside #nav-container  {
	background-color: var(--clarified-nav-bg);
}


.header-default #hero,
.header-default .site-header {
    border-bottom: 0.375rem solid var(--clarified-beige);
}

.header-default.home .site-header,
.header-default.page.has-post-thumbnail .site-header {
	border: none;
}


.header-content {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 150px;
  background-color: rgba(0, 0, 0, 0.5);
  border-radius: 0.25rem;
  padding: 1rem 2rem;
  width: 90%;
}

.header-default .header-content,
.header-minimal .header-content {
  background: none;
}

.site-title {
  font-family: var(--clarified-secondary-font);
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.1;
  margin: 0;
}

.header-default .site-title a {
  font-weight: 700;
}

.site-title,
.site-title a {
  color: #fff;
  text-decoration: none !important;
}

.header-outside .site-title, 
.header-outside .site-title a {
    color: var(--clarified-dark);
}

.site-title a:focus,
.site-title a:hover {
	color: #fff;
  opacity: 0.8;
  text-decoration: none;
}

.header-default .site-title a:focus,
.header-default .site-title a:hover,
.header-outside .site-title a:focus, 
.header-outside .site-title a:hover {
  opacity: 0.8;
}

.header-default .header-title-logo,
.header-minimal .header-title-logo {
    text-align: left;
}

.site-description {
  color: #9ea2a5;
  text-transform: uppercase;
  font-size: 0.688rem;
  letter-spacing: 2px;
  font-weight: 400;
  position: relative;
}

.header-default .site-description::before {
  content: none;
}

.header-default .site-description {
  color: #fff;
}

.outside-header {
    background: #fff;
    text-align: center;
    padding: 1rem;
}

@media (max-width: 768px) {
  .header-content {
    height: auto;
  }
}

/* Hero */
.page #hero #fade-block {
	max-width: 100%;
	margin-inline: auto;
}

#hero {
    display: flex;
    align-items: center;
    position: relative;
    line-height: 0;
    height: 50vh;
    padding: 1rem;
}

.home #hero .wrap {
    padding: 0;
    max-width: 980px;
    margin: 0 auto;
    text-align: center;
    position: relative;
    z-index: 4;
}

#hero #hero-title {
    color: #fff;
    font-size: 3.25rem;
    font-size: calc(1rem + 2vw);
    font-weight: 900;
    letter-spacing: 0.125rem;
    line-height: 1.1;
    margin: 0 auto;
    width: 90%;
    text-transform: capitalize;
    text-shadow: 0px 0px 8px rgba(0, 0, 0, 0.6);
}

#hero #hero-intro {
    color: #fff;
    font-size: 1.5rem;
    font-size: calc(1rem + 0.5vw);
    font-weight: 300;
    line-height: 1.4;
    text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.75);
    margin: 1rem auto 0;
    width: 90%;
}

.home #hero #hero-button {
    margin: 0;
}

.home #hero a.button,
.home #hero a.button:visited {
    background: #00a699;
    border-radius: 0.25rem;
    display: inline-block;
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
    line-height: 17px;
    padding: 1.125rem 1.5rem;
    margin-top: 1.875rem;
	text-decoration: none;
}

.home #hero a.button:focus,
.home #hero a.button:hover {
    background: var(--clarified-secondary);
    display: inline-block;
    color: #fff;
    text-decoration: none;
}

#fade-block {
    transition: opacity 0.65s ease-out;
}

#hero .gradient {
    position: absolute;
    height: 100%;
    width: 100%;
	left: 0;
	right: 0;
	
    z-index: 2;
    background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 0.65) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, 0.65)));
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 0.65) 100%);
    background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 0.65) 100%);
    background: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 0.65) 100%);
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 0.65) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#a6000000', GradientType=0);
}


/* Footer
==================================================== */
.site-info {
  font-size: 0.75rem;
  line-height: 1.3;
  text-align: center;
  margin: 0;
}

.copyright {
  margin-top: 0.5rem;
}

/* Content
==================================================== */
#page-header,
#post-header {
  margin-bottom: 3rem;
}

#page-header {
  text-align: left;
}

.single .entry-header {
    margin-bottom: 2.5rem;
}

.entry-header {
  position: relative;
}

.blog-left-sidebar .entry-header,
.blog-right-sidebar .entry-header,
.blog-full-width .entry-header {
  display: flex;
  flex-direction: column;
}

.featured-category-wrap,
.hentry.sticky {
  list-style: none;
  display: inline-flex;
  font-size: 1.25rem;
  margin: 0;
  padding: 0;
  position: relative;
  /* Needed for pseudo-elements positioning */
  font-family: var(--clarified-secondary-font);
}



.featured-category-wrap {
    position: absolute;
    top: 5%;
    right: 0;
    padding: 8px 10px;
    border-radius: 3px 0 0 3px;
    background: var(--clarified-dark);
    color: #fff;
    font-size: 0.7em;
    text-transform: uppercase;
    letter-spacing: 1px;
    z-index: 10;
}




.blog .hentry,
.hentry.sticky,
.archive .hentry,
.search-results .hentry {
  margin-bottom: 4rem;
}

.entry-content {
  font-size: 1rem;
}

/* Classic Kubrick styles */
.blog-classic h2.entry-title,
.post-classic h2.entry-title {
  text-align: left;
  margin-bottom: 0.5rem;
}

.blog-classic .post-meta li:first-child,
.post-classic .post-meta li:first-child {
  margin-left: 0;
}

.blog-classic .top-meta,
.post-classic .top-meta {
  margin-bottom: 1.25rem;
}

.blog-classic .post-meta li,
.post-classic .post-meta li {
  display: inline-block;
  margin-inline: 0.75rem;
}

.blog-classic .featured-category-wrap {
  font-size: inherit;
  font-family: inherit;
  font-weight: 700;
}

.blog-classic .featured-category-wrap::before,
.blog-classic .featured-category-wrap::after {
  content: none;
}

.classic-clarified-styling .entry-header,
.classic-clarified-styling h1.entry-title {
  text-align: left;
}

.classic-clarified-styling h1.entry-title {
  margin-inline: 0;
}

.classic-clarified-styling ul.post-meta {
  justify-content: start;
}

.classic-clarified-styling .post-meta li:first-child {
  margin-left: 0;
}

/* Space and add a line between sections */
.single .entry-footer,
.single .entry-content,
.post-author-info,
.comments-area,
.related-posts {
  border-bottom: 1px solid var(--clarified-lines);
  padding-bottom: 2rem;
  margin-bottom: 2rem;
}

.entry-footer {
  clear: both;
  display: flex;
  align-items: center;
  margin-top: 1.5rem;
  position: relative;
}

.hentry.sticky {
  display: block;
  font-family: var(--clarified-primary-font);
  font-weight: 400;
}

/* Post thumbnail */
.post-thumbnail {
  margin: 0 0 2rem;
}

.single .post-thumbnail {
  margin: 0.313rem 0 3rem;
  width: 100%;
}

.single .post-thumbnail img {
  width: 100%;
}

.post-thumbnail a {
  display: block;
  position: relative;
  z-index: 1;
}

.post-thumbnail figcaption.wp-caption-text {
  color: rgba(255, 255, 255, 0.8);
  position: absolute;
  bottom: 0;
  display: block;
  z-index: 2;
  left: 0;
  right: 0;
  margin-bottom: 0;
}

.post-thumbnail figcaption span {
  display: block;
  background-color: rgba(0, 0, 0, 0.5);
  padding: 0.5rem 1.5rem;
  border-radius: 0 0 0.5rem 0.5rem;
}

.no-sidebar figure.post-thumbnail img {
  width: 100%;
}

/* Post info
.post-meta {
  list-style: none;
  display: flex;
  align-items: center;
  font-size: 0.813rem;
  margin: 0;
  padding: 0;
  position: relative;
}

.single .post-meta:not(.post-classic .post-meta),
.search-results .post-meta {
  justify-content: center;
  margin: -1rem 0 1.5rem;
}

.post-meta li {
  display: inline-block;
  margin-inline: 0.5rem;
}

.post-meta li:first-child {
  margin-left: 0.875rem;
}

.post-meta,
.post-meta a {
  color: var(--clarified-secondary-text);
  text-decoration: none;
}

.post-meta a {
  text-decoration: none;
}

.post-meta a {
  text-decoration: none;
}

*/
.post-meta {
    font-size: 0.688rem;
    list-style: none;
    line-height: 1.3;
    margin: 1rem 0;
    padding: 0;
    text-transform: uppercase;
}

.single-wide .post-meta {
    margin: 1.5rem 0 0;
}

.blog-minimal-left .post-meta,
.blog-minimal-right .post-meta {
    font-size: 0.813rem;
}

.post-meta li {
    display: inline-block;
    padding: 0 0.688rem;
    position: relative;
}

.post-meta li:before {
    content: "\002F";
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -0.375rem;
    margin-left: -0.125rem;
    font-size: 0.75rem;
    color: inherit;
    font-weight: 400;
    line-height: 1;
	opacity: 0.8;
}

.post-meta li:first-child:before {
    content: none;
}

.post-meta li:first-child {
    padding-left: 0;
}

.updated:not(.published) {
    display: none;
}

.post-meta,
.post-meta a,
.post-meta a:visited {
    color: #9a9a9a;
	text-decoration: none;
}

.single-banner .post-meta,
.single-banner .post-meta a,
.single-banner .post-meta a:visited,
.single-banner-left .post-meta,
.single-banner-left .post-meta a,
.single-banner-left .post-meta a:visited,
.single-banner-right .post-meta,
.single-banner-right .post-meta a,
.single-banner-right .post-meta a:visited {
    color: #e4e4e4;
}

.post-meta a:focus,
.post-meta a:hover,
.single-banner .post-meta a:focus,
.single-banner .post-meta a:hover,
.single-banner-left .post-meta a:focus,
.single-banner-left .post-meta a:hover,
.single-banner-right .post-meta a:focus,
.single-banner-right .post-meta a:hover {
    color: #00a699;
    text-decoration: none;
}

/* Read more */
.readmore-wrapper {
  display: flex;
  margin: 0;
  padding-right: 1rem;
  position: relative;
}

/* Blog and singular styles */
.blog-full-width .entry-title,
.blog-full-width .entry-content,
.blog-full-width .entry-footer,
.post-full-width .entry-title,
.post-full-width .entry-content,
.post-full-width .entry-footer,
.post-full-width .post-author-info,
.post-full-width #comments,
.post-full-width .post-navigation {
  max-width: 53.75rem;
  margin-inline: 0;
}

/* No Sidebar enabled */
.no-sidebar #page-header,
.no-sidebar .entry-header,
.no-sidebar .entry-content,
.no-sidebar .entry-footer {
  max-width: 53.75rem;
  margin-inline: 0;
}


.no-sidebar figure.post-thumbnail {
  width: 100%;
}

/* Post category and tags */
.single .entry-footer {
  align-items: start;
  margin: 0 auto 2rem;
  flex-direction: column;
  padding-bottom: 2rem;
}

.single .entry-footer p {
  margin: 0 0 0.5rem;
  font-size: 0.875rem;
}

.single .entry-footer .svg-icon {
  position: relative;
  bottom: 2px;
  margin-right: 0.5rem;
}

.single .entry-footer > :last-child {
  margin-bottom: 0;
}

.cat-links a,
.tags-links a,
.post-edit-link {
  color: var(--clarified-links);
  line-height: normal;
  display: inline-block;
  word-wrap: break-word;
  text-decoration: none;
  margin-bottom: 0.313rem 0;
  font-weight: 600;
}

.cat-links a:focus,
.cat-links a:hover,
.tags-links a:focus,
.tags-links a:hover,
.post-edit-link:focus,
.post-edit-link:hover {
  color: inherit;
}

/* Post Author Bio */
.post-author-info {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  align-items: center;
}

.post-author-avatar {
  min-width: 5rem;
}

.post-author-description {
  font-size: 0.875rem;
  text-align: center;
}

.post-author-description .svg-icon {
  width: 1rem;
  height: 1rem;
  position: relative;
  bottom: 0.063rem;
}

.post-author-heading {
  font-size: 1.125rem;
  margin: 0 0 0.5rem;
}

.post-author-link {
  color: var(--clarified-links);
  display: inline-block;
  font-size: 0.75rem;
  margin: 1rem 0.5rem 0;
  text-decoration: none;
}

.post-author-link:focus,
.post-author-link:hover {
  color: inherit;
}

/* Comments
==================================================== */

.comments-title {
  margin: 0 0 2rem;
}

.comments-title,
.comment-reply-title {
  font-size: 1.375rem;
}

.comments-title .svg-icon {
  width: 1.25rem;
  height: 1.25rem;
  margin-right: 0.375rem;
  opacity: 0.75;
}

.logged-in-as {
  color: var(--clarified-secondary-text);
  font-size: 0.875rem;
}

.comment > .comment {
  margin-left: 4%;
}

.comment-list,
.comment-list .children {
  list-style: none;
  margin: 0;
  padding: 0;
}

.comment {
  margin-bottom: 2.25rem;
}

.comment-header {
  display: flex;
  align-items: center;
  margin-bottom: 0.875rem;
}

.comment-avatar,
.comment-author.vcard {
  flex-shrink: 0;
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1;
  text-transform: capitalize;
}

.comment-author.vcard .url {
  text-decoration: none;
}

.comment-meta {
  flex-grow: 1;
  padding-left: 0.75rem;
}

.comment-time,
.bypostauthor .by-postauthor {
  font-size: 0.813rem;
  color: var(--clarified-grey-600);
}

a.comment-edit-link {
  color: var(--clarified-grey-600);
  font-size: 0.813rem;
  text-decoration: none;
}

.by-postauthor {
  font-weight: 600;
}

.comment-content {
  font-size: 0.938rem;
}

.comment-content p:last-child {
  margin-bottom: 0.5rem;
}

.comment-reply {
  margin: 1.125rem 0;
}

.comment-reply-link {
  font-size: 12px;
  font-weight: 400;
  color: #151515;
  -webkit-transition: 120ms ease-in;
  transition: 120ms ease-in;
  text-decoration: none;
  border: 1px solid #151515;
  padding: 4px 12px;
}

.comment-reply-link:focus,
.comment-reply-link:hover {
  border-color: var(--clarified-primary);
  background: var(--clarified-primary);
  color: #fff;
}

.required-field-message {
  display: block;
}

.logged-in-as a {
  color: var(--clarified-grey-600);
}

.logged-in-as a:focus,
.logged-in-as a:hover {
  text-decoration: none;
}

.comment-notes {
  font-size: 0.875rem;
  font-style: italic;
  color: var(--clarified-secondary-text);
}

.comment-form-cookies-consent label {
  font-size: 0.875rem;
  color: var(--clarified-grey-600);
  font-style: italic;
}

#wp-comment-cookies-consent {
  position: relative;
  bottom: 0.063rem;
}

.comment-form-comment label {
  font-weight: 600;
}

textarea#comment {
  width: 100%;
}

#commentform .form-submit {
  margin-bottom: 0;
}

/* Pages
==================================================== */
/* 404 */
.page-clarified-header {
  position: relative;
}

.error-title {
  position: relative;
  bottom: 0;
  color: var(--clarified-beige);
  font-family: arial;
  font-size: 26vw;
  line-height: 1;
  font-weight: 700;
  margin: 0;
  text-align: center;
}

.error-404 .page-content {
	color: var(--clarified-headings);
  position: relative;
  z-index: 2;
  top: -6rem;
  font-weight: 600;
  font-size: 2.25rem;
  text-align: center;
  max-width: 760px;
  margin-inline: auto;
  line-height: 1.2;
}

/* Search Results */
.search-results .page-title {
  text-align: center;
}

.search-results .main-content {
  max-width: 760px;
  margin-inline: auto;
}

/* Navigation
==================================================== */

/* Primary Navigation Styles */
.main-navigation {
  display: none;
}

#nav-container {
  display: flex;
  border-radius: 0;
  padding: 0.875rem 1rem;
  justify-content: center;
      margin-left: -1.125rem;
    margin-right: -1.125rem;
    margin-top: 0;
}

.header-minimal .site-header,
.header-outside #nav-container {
    border-bottom: 0.375rem solid var(--clarified-beige);
}
.header-hemingway #nav-container {
    background: var(--clarified-nav-bg);
}

div.nav-menu ul {
  margin-bottom: 0;
  padding: 0;
}

div.nav-menu li {
  display: inline-block;
}

.nav-menu {
  /* Main menu styles (horizontal layout, spacing, etc.) */
  display: flex;
  font-size: 0.813rem;
  list-style: none;
  justify-content: center;
  margin: 0;
  padding: 0;
  position: relative;
  z-index: 1000;
  text-transform: uppercase;
}

.nav-menu li {
  position: relative;
  margin-inline: 0;
  /* Needed for submenu positioning */
}

.nav-menu li::before {
content: "\002F";
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -0.688rem;
    margin-left: -0.25rem;
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.2);
    font-weight: 300;
    z-index: 1000;
}

.nav-menu li:first-child::before,
.nav-menu li:last-child::before, 
.nav-menu .sub-menu li::before {
	content: none;
}

.nav-menu li ul {
  border-radius: 0 0 0.375rem 0.375rem;
  box-shadow: 0 0.375rem 1rem -0.5rem rgba(0, 0, 0, 0.27);
  font-size: 0.813rem;
  list-style: none;
  position: absolute;
  padding: 1rem 0.25rem 0.25rem;
  top: 100%;
  left: 50%;
  /* Set left position to 50% of parent item */
  transform: translateX(-50%);
  /* Shift horizontally by -50% of own width */
  background: var(--clarified-nav-bg);
  text-transform: capitalize;
  text-align: center;
  width: 13rem;
  /* Width of submenus */
  opacity: 0;
  /* Start with submenu invisible */
  visibility: hidden;
  /* Start the submenu a bit higher */
  transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;
  /* Transition effect for submenu flyouts */
}

/* Adding a caret to the menu item */
.nav-menu > .has-children::after, 
.nav-menu .menu-item-has-children::after {
    content: "";
    display: block;
    border: 5px solid transparent;
    border-top-color: rgba(255, 255, 255, 0.5);
    position: absolute;
    z-index: 1001;
    right: 1.063rem;
    top: 50%;
    margin-top: -0.125rem;
    transition: border-color .2s ease-in-out;
}



.nav-menu li ul ul {
  border-radius: 0.375rem;
  top: 0;
  left: 100%;
  padding: 0.25rem;
  /* Position to the right of the parent submenu */
  transform: translateY(0);
  /* Adjust if necessary */
}

/* Show submenu on hover */
.nav-menu li:hover > ul,
.nav-menu li:focus-within > ul,
.nav-menu li ul li:hover > ul {
  opacity: 1;
  /* Make submenu visible */
  visibility: visible;
  /* Show the submenu */
}

.sub-menu li {
  border-bottom: 1px solid var(--clarified-submenu-lines);
  margin-inline: 0;
}

.sub-menu li:last-child {
  border: none;
}

.sub-menu li a {
  display: flex;
  padding: 0.375rem 0;
  margin: 0;
  justify-content: center;
}

.nav-menu a:hover:not(.sub-menu a:hover) {
  opacity: 1;
}

/* Menu link styles */
.nav-menu a {
  text-decoration: none;
  letter-spacing: 1px;
  color: var(--clarified-menu-links);
  padding: 0 1rem;
}

.nav-menu > .has-children a, 
.nav-menu .menu-item-has-children a {
    padding-right: 2rem;
}

.nav-menu > .has-children .sub-menu a,
.nav-menu .menu-item-has-children .sub-menu a {
  padding-right: 1rem;
  padding-left: 1rem;
}


.nav-menu a:focus,
.nav-menu a:hover {
  color: var(--clarified-menu-hover-links);
}


/* Show the offcanvas toggler button in mobile view */
.navbar-toggler {
  cursor: pointer;
  display: flex;
  margin: auto;
}

/* Mobile Menu */
.mobile-nav {
  font-size: 1.188rem;
  padding-left: 0;
}

.mobile-nav ul {
  border-top: 1px solid var(--clarified-submenu-lines);
  font-size: 1rem;
  padding-left: 0;
}

.mobile-nav li {
  border-bottom: 1px solid var(--clarified-submenu-lines);
  list-style: none;
}

.mobile-nav ul,
.mobile-nav li {
  border-color: var(--clarified-grey-300);
}

.mobile-nav li a {
  text-decoration: none;
  padding: 0.25rem 0.5rem;
  display: flex;
  justify-content: start;
}

.mobile-nav ul li a {
  font-weight: 400;
  padding-left: 1.5rem;
}

.mobile-nav ul li ul li a {
  padding-left: 2.25rem;
}

.mobile-nav ul li ul li ul li a {
  padding-left: 3rem;
}

.mobile-nav a {
  color: #000;
  font-weight: 500;
}

.mobile-nav a:focus,
.mobile-nav a:hover {
  background: var(--clarified-submenu-hover-bg);
  border-radius: 0.375rem;
  color: #fff;
}

/* Footer Menu
==================================================== */
.footer-nav {
	    font-size: 0.688rem;
    list-style: none;
    margin: 0;
    padding: 0;
	text-transform: uppercase;
}

.footer-nav li {
    display: inline-block;
    padding: 0 0.375rem;
    position: relative;
}

.footer-nav li:before {
    content: "\002F";
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -0.438rem;
margin-left: -0.25rem;
    font-size: 0.75rem;
    color: inherit;
    font-weight: 300;
    line-height: 1;
    z-index: 1000;
}

.footer-nav li:first-child:before {
    content: none;
}

.footer-nav a {
    text-decoration: none;
}

/* Back To Top
==================================================== */
#backToTop {
  background: var(--clarified-beige);
  background: var(--clarified-secondary);
  border: none;
  position: fixed;
  bottom: 2rem;
  right: 2rem;
  display: none;
  cursor: pointer;
  padding: 0.75rem;
  border-radius: 50%;
  width: 3rem;
  height: 3rem;
  z-index: 1000;
}

#backToTop:focus,
#backToTop:hover {
  background: var(--clarified-beige);
}

#backToTop .svg-icon {
  fill: #fff;
  width: 1.25rem;
  height: 1.25rem;
  bottom: 0;
  display: flex;
  margin-inline: auto;
}

/* Social Menu
==================================================== */
#social-nav {
  list-style: none;
  margin: 0.5rem;
  padding: 0;
  display: flex;
  justify-content: center;
}

#social-nav li {
  margin-inline: 0.375rem;
}

#social-nav span {
  position: absolute;
  left: -10000px;
}

#social-nav a {
  color: var(--clarified-grey-600);
}

#social-nav a:focus,
#social-nav a:hover {
  color: var(--clarified-secondary);
}

#social-nav .svg-icon {
  fill: var(--clarified-grey-200);
  width: 1.5rem;
  height: 1.5rem;
}

.header-default #header-social-wrapper #social-nav .svg-icon,
.header-minimal #header-social-wrapper #social-nav .svg-icon {
    fill: var(--clarified-grey-200);
    width: 1.25rem;
    height: 1.25rem;
}

#social-nav .svg-icon:focus,
#social-nav .svg-icon:hover {
  color: var(--clarified-beige);
  fill: var(--clarified-beige);
}

.header-default #header-social-wrapper #social-nav a,
.header-minimal #header-social-wrapper #social-nav a {
    display: block;
    background: var(--clarified-beige);
	background: var(--clarified-secondary);
    border-radius: 50%;
    width: 2rem;
    height: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.header-default #header-social-wrapper #social-nav a:focus,
.header-default #header-social-wrapper #social-nav a:hover
.header-minimal #header-social-wrapper #social-nav a:focus,
.header-minimal #header-social-wrapper #social-nav a:hover {
    background: var(--clarified-beige);
}

/* Blog and Post Navigation
==================================================== */
.pagination {
  display: flex;
  margin-bottom: 2rem;
  margin-top: 3rem;
}

.pagination,
.template-full .pagination,
.template-short .pagination {
  justify-content: center;
}

.pagination .nav-links {
  display: flex;
  gap: 0.25rem;
  line-height: 1;
  align-items: center;
}

.navigation.pagination {
    border-top: 4px solid #ededed;
    border-bottom: 4px solid #ededed;
    padding: 1rem 0;
    text-align: center;
}

.page-numbers {
    border: 1px solid #efefef;
    border-radius: 50%;
    cursor: pointer;
    display: inline-block;
    font-size: 0.875rem;
    line-height: 2rem;
    padding: 3px;
    width: 2.5rem;
    height: 2.5rem;
    margin: 0 1px;
	text-decoration: none;
	 text-align: center;
}


.prev.page-numbers,
.next.page-numbers {
  background: transparent;
}

.page-numbers, 
.page-numbers:visited {
    color: #505050;
    border-color: #efefef;
}

.page-numbers.current,
.page-numbers:focus,
.page-numbers:hover,
.prev.page-numbers:focus,
.next.page-numbers:focus,
.prev.page-numbers:hover,
.next.page-numbers:hover {
  background: var(--clarified-grey-200);
  border-color: var(--clarified-grey-200);
  color: initial;
}

.prev.page-numbers .svg-icon,
.next.page-numbers .svg-icon {
  fill: var(--clarified-grey-600);
  position: relative;
  bottom: 2px;
}

/* Post Navigation */
.post-navigation .nav-links,
.comment-navigation .nav-links {
  display: flex;
  flex-direction: column;
}

.post-navigation .nav-previous,
.post-navigation .nav-next,
.comment-navigation .nav-previous,
.comment-navigation .nav-next {
  flex-basis: 50%;
  margin-bottom: 1rem;
}

.post-navigation .nav-next,
.comment-navigation .nav-next {
  text-align: left;
}

.post-navigation .nav-links > :only-child,
.comment-navigation .nav-links > :only-child {
  flex-basis: 100%;
}

.post-navigation .nav-meta {
  display: inline-block;
  font-family: var(--clarified-secondary-font);
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 1px;
  margin-bottom: 0.25rem;
  position: relative;
  text-transform: uppercase;
}

.post-navigation a {
  text-decoration: none;
}

.post-navigation a:focus,
.post-navigation a:hover {
  color: inherit;
}

.post-navigation a > .nav-meta {
  color: initial;
}

.post-navigation .post-title {
  display: block;
  font-family: var(--clarified-serif-font);
  font-size: 0.938rem;
  font-style: italic;
  line-height: 1.4;
}

.comment-navigation {
  margin-bottom: 1.375rem;
}

/* Multi-Page Navigation
==================================================== */
.multi-page-links {
  clear: both;
  margin: 1rem 0;
  font-size: 0.75rem;
}

.multi-page-links a,
.multi-page-links .post-page-numbers {
  border: 1px solid;
  border-color: rgba(0, 0, 0, 0.3);
  color: inherit;
  padding: 0.188rem 0.5rem;
  border-radius: 0.5rem;
  margin-right: 0.188rem;
  text-decoration: none;
}

.multi-page-links a:focus,
.multi-page-links a:hover,
.post-page-numbers.current {
  background: var(--clarified-secondary);
  border-color: var(--clarified-secondary);

  /*   background: var(--clarified-grey-600);
    border-color: var(--clarified-grey-600); */

  color: #fff;
}

/* Typography
==================================================== */
h1,
h2,
h3,
h4,
h5,
h6,
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
  color: var(--clarified-headings);
  font-family: var(--clarified-secondary-font);
  margin-top: 0;
  margin-bottom: 1rem;
  font-weight: 500;
  line-height: 1.2;
  text-decoration: none;
}

.entry-content h1 a,
.entry-content h2 a,
.entry-content h3 a,
.entry-content h4 a,
.entry-content h5 a,
.entry-content h6 a {
  color: var(--clarified-links);
  text-decoration: underline;
}

.h1,
h1 {
  font-size: 2rem;
}

.h2,
h2 {
  font-size: 1.75rem;
}

.h3,
h3 {
  font-size: 1.5rem;
}

.h4,
h4 {
  font-size: 1.25rem;
}

.h5,
h5 {
  font-size: 1.125rem;
}

.h6,
h6 {
  font-size: 1rem;
}

.entry-title {
  font-size: 2.125rem;
  margin-bottom: 0;
  text-transform: capitalize;
}

.entry-title a:hover {
  opacity: 0.8;
  color: var(--clarified-headings);
}

/* Adjust blog title width */
.blog.blog-left-sidebar .entry-title,
.archive.blog-left-sidebar .entry-title,
.blog.blog-right-sidebar .entry-title,
.archive.blog-right-sidebar .entry-title,
.blog.blog-full-width .entry-title,
.archive.blog-full-width .entry-title {
  max-width: 90%;
  margin-inline: 0;
}

#page-header .entry-title {
  text-align: left;
  margin-bottom: 1rem;
}

.archive-prefix {
   color: var(--clarified-secondary);
}

.lead {
  font-size: 1.25rem;
  font-weight: 300;
  line-height: 1.3;
}

p {
  margin-top: 0;
  margin-bottom: 1.5rem;
}

p:last-child {
  margin-bottom: 0;
}

/* Links */
a {
  color: var(--clarified-links);
  text-underline-offset: 0.188rem;
}

a:focus,
a:hover {
  color: var(--clarified-hover-links);
}

.entry-content p > a:not(.readmore-link) {
  font-weight: 500;
}

p > a:not(.readmore-link):hover,
p > a:not(.readmore-link):focus {
  text-decoration: underline;
  text-decoration-style: dotted;
}

/* Blockquotes */
blockquote,
.blockquote {
    padding: 2rem;
    background: var(--clarified-blockquote-bg);
  font-family: var(--clarified-serif-font);
  font-size: 1.125rem;
  font-style: italic;
  line-height: 1.3;
  margin: 2rem 0;
  position: relative;
}

.wp-block-pullquote p {
    margin-bottom: 0.75rem;
}

blockquote > :last-child,
.blockquote > :last-child {
  margin-bottom: 0;
}

.blockquote-footer {
  margin-top: -1rem;
  margin-bottom: 1rem;
  font-size: 0.875em;
  color: #6c757d;
}

figcaption.blockquote-footer {
  text-align: left;
}

.blockquote-footer::before,
cite:before {
    content: "\2014";
}

.wp-block-pullquote cite, 
.wp-block-pullquote footer, 
.wp-block-pullquote__citation {
    color: currentColor;
    font-size: 0.625rem;
    font-style: normal;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* Lists */
ol,
ul {
  padding-left: 2rem;
}

li > ul {
  padding-left: 1.25rem;
}

dl,
ol,
ul {
  margin-top: 0;
  margin-bottom: 1.5rem;
}

ul li > ul,
ol li > ol,
ul li > ol,
ol li > ul {
  margin-bottom: 0;
}

.list-unstyled {
  padding-left: 0;
  list-style: none;
}

dl {
  border-top: 1px solid var(--clarified-grey-300);
  display: block;
  margin: 2rem 0;
}

dt {
  font-weight: 700;
}

dd {
  font-style: italic;
  margin-bottom: 0;
  margin-left: 0;
}

dt,
dd {
  border-bottom: 1px solid var(--clarified-grey-300);
  padding: 0.438rem 0;
  font-size: 0.875rem;
}

.text-truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Inline elements */
.mark,
mark {
  padding: 0.188rem;
  color: #222;
  background-color: #fff3cd;
}

.initialism {
  font-size: 90%;
  text-transform: uppercase;
}

code,
kbd,
pre,
samp {
  font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
    "Courier New", monospace;
  font-size: 0.813rem;
  direction: ltr;
  /* rtl:ignore */
  unicode-bidi: bidi-override;
  font-size: 1em;
}

kbd {
  background: var(--clarified-grey-800);
  border-radius: 0.125rem;
  color: #fff;
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1;
  padding: 0.125rem 0.375rem;
  white-space: nowrap;
  position: relative;
  bottom: 0.125rem;
}

/* Code */
pre {
  background: var(--clarified-grey-100);
  border: 1px solid var(--clarified-grey-300);
  display: block;
  overflow: auto;
  font-size: 0.875rem;
  max-width: 100%;
  margin: 1.5rem 0;
  padding: 1rem;
  white-space: break-spaces;
}

pre code {
  background: transparent;
  font-size: inherit;
  color: inherit;
  padding: 0;
  word-break: normal;
}

code {
  font-size: 0.875em;
  color: #d63384;
  word-wrap: break-word;
}

/* Tables */
table,
th,
td,
.wp-block-table,
.wp-block-table th,
.wp-block-table td {
  border: 1px solid var(--clarified-grey-200);
}

table,
.wp-block-table {
  border-collapse: collapse;
  border-spacing: 0;
  border-width: 1px 0 0 1px;
  margin: 1.5rem 0;
  table-layout: auto;
  width: 100%;
}

table thead,
.table-striped table thead,
.table-striped table tr > th {
  background: var(--clarified-table-header-bg);
  color: var(--clarified-table-header-text);
  font-weight: 500;
}

.table-striped table tr:nth-of-type(odd) {
  background: var(--clarified-grey-100);
}

table th,
table td,
.wp-block-table td,
.wp-block-table th {
  padding: 0.5rem 0.75rem;
  text-align: left;
}

thead td,
.wp-block-table thead td {
  border-color: var(--clarified-grey-600);
}

table td,
.wp-block-table td {
  font-size: 0.938rem;
}

/* Miscellaneous
 ==================================================== */
::selection {
  color: #fff;
  background: var(--clarified-primary);
}

hr,
.wp-block-separator {
  border: none;
  border-bottom: 0.125rem solid var(--clarified-grey-400);
  margin: 3rem auto;
}

/* Media
 ==================================================== */
figure {  
margin: 0 0 1rem;
  position: relative;
  margin: 0;
  max-width: 100%;
}
figure {
    max-width: 100%; /* Ensures that figure does not exceed its container's width */
    width: auto; /* Adjusts width to be only as wide as its content, up to the max-width */
}
img {
	border-radius: 0.25rem;
  height: auto;
  max-width: 100%;
}

.blog-full-width .post-thumbnail {
  display: block;
}

.wp-block-image figcaption,
figcaption,
.wp-caption-text {
  font-size: 0.938rem;
  color: var(--clarified-caption-text);
  margin: 0.5rem 0;
  line-height: 1.2;
  text-align: center;
}

img,
svg {
  vertical-align: middle;
}

.img-box {
  padding: var(--clarified-img-padding);
  background-color: var(--clarified-img-bg);
  border: 1px solid var(--clarified-img-border-color);
  border-radius: var(--clarified-img-radius);
  max-width: 100%;
  height: auto;
}

.img-placeholder-text {
  font-size: var(--clarified-img-placeholder-text);
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  text-anchor: middle;
}

/* Classic Gallery
 ==================================================== */
.gallery {
  display: grid;
  gap: 10px; /* Space between images */
  grid-template-columns: repeat(1, 1fr); /* 1 column on small screens */
  margin: 3rem 0 1rem;
}

/* Gallery item styles */
.gallery-item {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

/* Gallery image link */
.gallery-item a {
  display: block;
  border: none;
  padding: 0;
}

/* Gallery image */
.gallery-item img {
  width: 100%;
  height: auto;
  border: 2px solid #f0f0f0; /* Light gray border */
}

/* Clearfix for the gallery */
.gallery:after {
  content: "";
  display: table;
  clear: both;
}

/* Alignment
 ==================================================== */
.text-start {
  text-align: left !important;
}

.text-end {
  text-align: right !important;
}

.text-center {
  text-align: center !important;
}

.wp-block-gallery.alignleft,
.wp-block-image .alignleft,
.alignleft,
.float-start {
  float: left;
  margin: 0.375rem 2rem 0.5rem 0;
}

.wp-block-gallery.alignright,
.wp-block-image .alignright,
.alignright,
.float-end {
  float: right;
  margin: 0.375rem 0 0.5rem 2rem;
}

.wp-block-image .aligncenter,
.aligncenter,
.float-center {
  margin: 1rem auto;
}

.wp-block-image .alignnone,
.alignnone,
.float-none {
  float: none;
}

/* Transitions
==================================================== */
a,
a::after,
a::before,
input,
textarea,
button,
select {
  transition: all 0.2s ease-out;
}

input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="url"],
select,
textarea {
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

button,
input[type="submit"],
input[type="button"],
input[type="reset"] {
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
    border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

@media (prefers-reduced-motion: reduce) {
  button,
  input[type="submit"],
  input[type="button"],
  input[type="reset"] {
    transition: none;
  }
}

/* Sidebars
 ==================================================== */
#top-sidebar {
  background: #fff;
  box-shadow: var(--clarified-page-shadow);
  border-radius: var(--clarified-border-radius);
  max-width: 1200px;
  margin: 0 auto 1.5rem;
  padding: 1.125rem;
  text-align: center;
}

#breadcrumb-sidebar {
  padding: 1rem 0 0;
  text-align: center;
  font-size: 0.75rem;
  color: var(--clarified-secondary-text);
}

#breadcrumb-sidebar a {
  color: initial;
  text-decoration: none;
}

#bottom-wrapper {
    background-color: var(--clarified-bottom-bg);
}

#bottom-wrapper,
#bottom-wrapper a,
#bottom-wrapper h3,
#bottom-wrapper h4 {
	color: var(--clarified-bottom-text);
}

#bottom-sidebar {
  display: grid;
  /* gap: 1.25rem;  Adjust the space between widgets */
  gap: 2rem;
  margin: 0 auto;
  padding: 3rem 0;
}

/* Styles for different numbers of widgets */
.bottom-sidebar-grid-1,
.bottom-sidebar-grid-2,
.bottom-sidebar-grid-3,
.bottom-sidebar-grid-4 {
  grid-template-columns: repeat(1, 1fr); /* Default for mobile: 1 column */
}

.footer-widget {
  padding: 2rem 0 1rem;
}


#footer-sidebar.widget-area {
  max-width: 100%;
  margin-inline: auto;
  text-align: center;
}

/* Widgets
 ==================================================== */
.hide-widget-title {
  display: none;
}

#sidebar-column .widget {
  margin-bottom: 3rem;
}


.widget:not(:last-child) {
    padding-bottom: 3rem;
    border-bottom: 0.25rem solid #ededed;
    margin-bottom: 3rem;
}

#bottom-sidebar .widget:not(:last-child) {
    padding-bottom: 2rem;
    border-bottom: 0.188rem solid var(--clarified-footer-line);
    margin-bottom: 2rem;
}

#footer-sidebar .widget {
  padding: 2.5rem 0 1rem;
}

#bottom-sidebar .widget,
#footer-sidebar .widget {
  background-color: transparent;
}

.widget-area {
  font-size: 90%;
}

.widget-title {
  font-size: 1.125rem;
  text-transform: uppercase;
}

.widget-area ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.widget-area ul > li {
  border-bottom: 1px solid var(--clarified-lines);
  padding: 0.5rem 0;
}

#bottom-sidebar ul > li {
    border-bottom: 1px solid var(--clarified-footer-line);
}

#bottom-sidebar ul > li:last-child {
    border-bottom: none;
}

.widget-area li > a,
.widget_tag_cloud a {
  color: inherit;
  text-decoration: none;
}

.widget-area li > a:focus,
.widget-area li > a:hover,
.widget_tag_cloud a:focus,
.widget_tag_cloud a:hover {
  color: var(--clarified-hover-links);
  text-decoration: underline;
  text-underline-offset: 0.188rem;
}

.widget-area li:last-child {
  border: none;
  padding-bottom: 0;
}

.widget .post-date {
  font-size: small;
  font-style: italic;
  color: var(--clarified-secondary-text);
}

/* Widget Menus */
.widget_nav_menu .sub-menu li > a {
  display: block;
  padding: 0;
}

.widget_nav_menu .sub-menu {
  border-top: 1px solid var(--clarified-lines);
  margin-top: 0.5rem;
  padding-left: 1rem;
}
.widget_nav_menu li:last-child {
  border: none;
  padding-bottom: 0;
}

.widget_nav_menu .sub-menu li > a:focus,
.widget_nav_menu .sub-menu li > a:hover {
  background: none;
}

/* Widget tagcloud */
.widget_tag_cloud a,
.widget_tag_cloud a:visited {
    background: #f5f5f5;
    color: #303030;
    display: inline-block;
    font-size: 0.813rem !important;
    line-height: 2.5;
    margin: 0 3px 5px 0;
    padding: 0 1rem;
    text-transform: capitalize;
    vertical-align: middle;
    transition: background .2s ease-out, border-color .2s ease-out, color .2s ease-out;
}


.widget_tag_cloud a:focus,
.widget_tag_cloud a:hover {
    background: var(--clarified-tertiary);
    color: #ffffff !important;
    text-decoration: none !important;
}

#bottom-sidebar .widget_tag_cloud a {
    background: var(--clarified-secondary);
    color: #fff;
}

#bottom-sidebar .widget_tag_cloud a:focus,
#bottom-sidebar .widget_tag_cloud a:hover {
    opacity: 0.8;
}

/* Widget Recent Entries */
.widget_recent_entries li {
  font-family: var(--clarified-secondary-font);
  font-weight: 500;
}

.widget_recent_entries li .post-date {
  font-family: inherit;
  font-family: var(--clarified-primary-font);
  font-style: normal;
  display: block;
}

/* Widget Comments */
.widget_recent_comments .comment-author-link {
  font-weight: 600;
}

.widget_recent_comments .recentcomments a {
  font-style: italic;
}

/* Widget Calendar */
.widget_calendar .wp-calendar-table {
  width: 100%;
}
.wp-calendar-table caption {
  font-family: var(--clarified-secondary-font);
  font-size: 1.125rem;
  margin-bottom: 0.375rem;
}
.wp-calendar-table thead th {
  border: none;
  border-bottom-width: 2rem;
  padding: 0.125rem 0;
}
.wp-calendar-table .pad {
  border: none;
}
.wp-calendar-table .wp-calendar-nav {
  padding: 0 0.25rem;
}

.wp-calendar-table thead th,
.wp-calendar-nav {
  background: var(--clarified-grey-200);
}

.widget_calendar td {
  text-align: center;
  padding: 0.25rem;
  border: 1px solid var(--clarified-lines);
}

.wp-calendar-nav {
  padding: 0.125rem 0.5rem;
}

.wp-calendar-nav a {
  display: inline-block;
  color: inherit;
  border: 1px solid var(--clarified-grey-500);
  font-family: var(--clarified-secondary-font);
  padding: 0 0.5rem;
  border-radius: 0.125rem;
  text-decoration: none;
  font-size: 80%;
  text-transform: uppercase;
}

.wp-calendar-nav a:focus,
.wp-calendar-nav a:hover {
  border-color: var(--clarified-hover-links);
  color: var(--clarified-hover-links);
}

/* Plugins - Featherlight lightbox
==================================================== */
.featherlight-image {
  border-radius: 0.5rem 0.5rem 0 0;
}

.featherlight .featherlight-content .caption {
  display: block;
  background: #000;
  font-size: 90%;
  width: 100%;
  padding: 0.5rem;
  border-radius: 0 0 0.5rem 0.5rem;
}

/* Form Styles
==================================================== */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="url"],
select {
  display: block;
  width: 100%; /* Full width for standalone use */
  padding: 0.375rem 1rem; /* Same padding as buttons */
  font-size: 1rem; /* Same font size as buttons */
  font-weight: 400; /* Same font weight as buttons */
  line-height: 1.5; /* Same line height as buttons */
  color: #495057; /* Slightly darker text for better contrast */
  background-color: #fff; /* White background */
  background-clip: padding-box;
  border: 1px solid #ced4da; /* Light grey border */
  border-radius: 0.313rem; /* Same border-radius as buttons */
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); /* Subtle inner shadow */
  font-family: var(--clarified-primary-font); /* Consistent font family */
}

textarea {
  display: block;
  width: 100%; /* Full width for standalone use */
  padding: 0.375rem 1rem; /* Same padding as buttons and inputs */
  font-size: 1rem; /* Same font size as buttons and inputs */
  font-weight: 400; /* Same font weight as buttons and inputs */
  line-height: 1.5; /* Same line height as buttons and inputs */
  color: #495057; /* Slightly darker text for better contrast */
  background-color: #fff; /* White background */
  background-clip: padding-box;
  border: 1px solid #ced4da; /* Light grey border */
  border-radius: 0.313rem; /* Same border-radius as buttons and inputs */
  font-family: var(--clarified-primary-font); /* Consistent font family */
  height: auto; /* Auto height to accommodate content */
  resize: vertical; /* Allow vertical resizing */
}

/* Adjustments for disabled state */
textarea:disabled {
  background-color: #e9ecef;
  opacity: 1;
}

.readmore-link:focus,
button:focus,
input[type="submit"]:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
select:focus,
textarea:focus {
  color: #495057;
  background-color: #fff;
  border-color: var(--clarified-grey-400); /* Grey colour on focus */
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(108, 117, 125, 0.125); /* Light to medium grey glow */
}

.menu-item-search button:focus {
  box-shadow: 0 0 0 0.125rem rgba(108, 117, 125, 0.75); /* Light to medium grey glow */
}
/* Adjustments for disabled state */
input[type="text"]:disabled,
input[type="password"]:disabled,
input[type="email"]:disabled,
input[type="number"]:disabled,
input[type="search"]:disabled,
input[type="tel"]:disabled,
input[type="url"]:disabled,
select:disabled {
  background-color: #e9ecef;
  opacity: 1;
}

/* Buttons */
button,
input[type="submit"],
input[type="button"],
input[type="reset"],
.readmore-link,
.wp-block-button__link,
.wp-block-file a,
.wp-block-file__button {
  background-color: var(--clarified-primary);
  display: inline-block;
  padding: 0.375rem 1rem;
  font-family: var(--clarified-secondary-font);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #fff;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  border: 1px solid transparent;
  border-radius: 0.188rem;
}

.wp-block-button .wp-block-button__link.is-style-outline,
.wp-block-button.is-style-outline > .wp-block-button__link {
  border: 1px solid var(--clarified-grey-400);
  border-radius: 0.188rem !important;
  line-height: 1.5;
  padding: 0.375rem 1rem;
}

/* Hover and focus states */
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
.readmore-link:hover,
.wp-block-button__link:hover,
.wp-block-button .wp-block-button__link.is-style-outline:hover,
.wp-block-button.is-style-outline > .wp-block-button__link:hover,
button:focus,
input[type="submit"]:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
.readmore-link:focus,
.wp-block-button__link:focus,
.wp-block-button .wp-block-button__link.is-style-outline:focus,
.wp-block-button.is-style-outline > .wp-block-button__link:focus,
.wp-block-file a:focus,
.wp-block-file__button:focus,
.wp-block-file a:hover,
.wp-block-file__button:hover {
  color: #fff;
  background-color: var(--clarified-btn-hover);
  border-color: var(--clarified-btn-hover);
}

/* Form icons */
.button .svg-icon {
  bottom: 2px;
  position: relative;
  fill: #fff;
}

/* Style the input-group container */
.input-group {
  display: flex;
  align-items: stretch; /* Align the elements vertically */
}

/* Style the search input within the input-group */
.input-group input[type="search"] {
  flex-grow: 1; /* Input takes available space */
  border-radius: 0.188rem 0 0 0.188rem; /* Rounded corners on the left side */
  margin-bottom: 0; /* Remove any default margin */
}

/* Style the search button within the input-group */
.input-group button {
  border-radius: 0 0.188rem 0.188rem 0; /* Rounded corners on the right side */
}

/* Adjustments for focus state to maintain visual connection */
.input-group button:focus,
.input-group button:hover,
.input-group input[type="search"]:focus,
.input-group input[type="submit"]:focus {
  z-index: 1; /* Ensure focused element is on top */
}

/* Search Modal
 ==================================================== */
.menu-item-search button {
  padding: 0;
  background: none;
  line-height: 1;
  border: none;
  width: 1.25rem;
  height: 1.25rem;
  font-size: inherit;
}

li.menu-item-search {
  margin-left: 0.5rem;
  display: none;
}

.menu-item-search button:focus,
.menu-item-search button:hover {
  background: transparent;
}

.searchModal-btn .svg-icon {
  fill: var(--clarified-menu-links);
  color: currentColor;
  position: relative;
  top: 0.063rem;
}

.searchModal-close-x {
  border: 0;
  border-radius: 50%;
  background-color: transparent;
  cursor: pointer;
  padding: 1rem;
  width: 3rem;
  height: 3rem;
  display: flex;
}

.modal-body .button {
  background: var(--clarified-primary);
  border-color: var(--clarified-primary);
}

.searchModal-btn:focus,
.searchModal-btn:hover,
.searchModal-close-x:focus,
.searchModal-close-x:hover,
.modal-body .button:focus,
.modal-body .button:hover {
  background-color: var(--clarified-btn-hover);
  border-color: var(--clarified-btn-hover);
}

.searchModal-btn .svg-icon:focus,
.searchModal-btn .svg-icon:hover,
.searchModal-btn:focus .svg-icon,
.searchModal-btn:hover .svg-icon,
.searchModal-close-x:focus .svg-icon,
.searchModal-close-x:hover .svg-icon {
  fill: #fff;
}

.searchModal-btn,
.searchModal-close-btn {
  cursor: pointer;
}

.searchModal-close-x .svg-icon {
  width: 1.25rem;
  height: 1.25rem;
}

.modal {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1100;
  display: none;
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  outline: 0;
}

/* This stops the browser scrollbar being removed */
.modal.show {
  overflow-y: scroll;
  overflow-x: hidden;
}

.modal-dialog {
  position: relative;
  width: auto;
  margin: 0.5rem;
  pointer-events: none;
}

.modal.fade .modal-dialog {
  transition: transform 0.3s ease-out;
  transform: translate(0, -50px);
}

@media (prefers-reduced-motion: reduce) {
  .modal.fade .modal-dialog {
    transition: none;
  }
}

.modal.show .modal-dialog {
  transform: none;
}

.modal.modal-static .modal-dialog {
  transform: scale(1.02);
}

.modal-dialog-scrollable {
  height: calc(100% - 0.5rem * 2);
}

.modal-dialog-scrollable .modal-content {
  max-height: 100%;
  overflow: hidden;
}

.modal-dialog-scrollable .modal-body {
  overflow-y: auto;
}

.modal-dialog-centered {
  display: flex;
  align-items: center;
  min-height: calc(100% - 0.5rem * 2);
}

.modal-content {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  color: var(--clarified-grey-800);
  pointer-events: auto;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid var(--clarified-grey-200);
  border-radius: 0.25rem;
  outline: 0;
}

.modal-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  width: 100vw;
  height: 100vh;
  background: #000;
}

.modal-backdrop.fade {
  opacity: 0;
}

.modal-backdrop.show {
  opacity: 0.8;
}

.modal-header {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: space-between;
  padding: 1rem;
  border-bottom: 1px solid var(--clarified-grey-300);
  border-top-left-radius: calc(0.5rem - 1px);
  border-top-right-radius: calc(0.5rem - 1px);
}

.modal-header .btn-close {
  padding: calc(1rem * 0.5) calc(1 * 0.5);
  margin: calc(-0.5 * 1rem) calc(-0.5 * 1) calc(-0.5 * 1rem) auto;
}

.search-wrap .svg-icon {
  fill: #fff;
}

.modal-title {
  margin: 0;
  line-height: 1.5;
}

.modal-body {
  position: relative;
  flex: 1 1 auto;
  padding: 1rem;
}

.modal-footer {
  display: flex;
  flex-shrink: 0;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  padding: calc(1rem - 0.5rem * 0.5);
  background-color: var(--clarified-white);
  border-top: 1px solid var(--clarified-grey-300);
  border-bottom-right-radius: calc(0.5rem - 1px);
  border-bottom-left-radius: calc(0.5rem - 1px);
}

.modal-footer > * {
  margin: calc(0.5rem * 0.5);
}

@media (min-width: 576px) {
  .modal {
    margin: 0;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  }

  .modal-dialog {
    max-width: 500px;
    margin-right: auto;
    margin-left: auto;
  }
}

/* Block Styles
 ==================================================== */

.wp-block-gallery,
.wp-block-media-text,
.wp-block-columns,
.wp-block-cover {
  margin-top: 3rem;
  margin-bottom: 3rem;
}

.wp-block-image {
  margin: auto;
  margin-bottom: 2rem;
  margin-top: 1rem;
}

.wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
  border-radius: 0 0 0.5rem 0.5rem;
}

.left-sidebar .wp-block-image .alignleft,
.left-sidebar .wp-block-image .alignright,
.right-sidebar .wp-block-image .alignleft,
.right-sidebar .wp-block-image .alignright {
  max-width: 50%;
}

/* Drop cap */
.has-drop-cap:not(:focus):first-letter {
  color: var(--clarified-primary);
  float: left;
  font-size: 6rem;
  line-height: 0.75;
  margin: 0.25rem 1rem 0 0;
  text-transform: uppercase;
  font-family: var(--clarified-serif-font);
  font-style: normal;
  font-weight: 700;
}

/* Block text colours */

.has-dark-background-color {
  background: var(--clarified-dark);
}

.has-white-background-color {
  background: #fff;
}

.has-beige-background-color {
  background: #cdc0a9;
}
.has-primary-background-color {
  background: var(--clarified-primary);
}

.has-secondary-background-color {
  background: var(--clarified-secondary);
}

.has-tertiary-background-color {
  background: var(--clarified-tertiary);
}

.has-dark-color,
.has-dark-color .has-inline-color {
  color: var(--clarified-dark);
}

.has-beige-color,
.has-beige-color .has-inline-color {
  color: #cdc0a9;
}
.has-white-color,
.has-white-color .has-inline-color {
  color: #fff;
}

.has-primary-color,
.has-primary .has-inline-color {
  color: var(--clarified-primary);
}

.has-secondary-color,
.has-secondary-color .has-inline-color {
  color: var(--clarified-secondary);
}

.has-tertiary-color,
.has-tertiary .has-inline-color {
  color: var(--clarified-tertiary);
}

/* Text Sizing */
.has-extra-small-font-size {
  font-size: 0.875rem;
}

.has-small-font-size {
  font-size: 1rem;
}

.has-medium-font-size {
  font-size: 1.125rem;
}

.has-large-font-size {
  font-size: 1.25rem;
  line-height: 1.5;
}

.has-extra-large-font-size {
  font-size: 1.375rem;
  line-height: 1.3;
}

.has-huge-font-size {
  font-size: 1.625rem;
  line-height: 1.3;
}

.has-gigantic-font-size {
  font-size: 2rem;
  line-height: 1.3;
}

.entry-content .wp-block-buttons {
  margin-bottom: 1.5rem;
}

/* Blockquotes */
.wp-block-quote,
.wp-block-pullquote {
  border: none !important;
}

.wp-block-pullquote.alignleft,
.wp-block-pullquote.alignright {
  max-width: 420px;
  max-width: 40%;
  padding: 0;
  margin-top: 0;
  margin-bottom: 0;
  text-align: left;
}
.wp-block-pullquote.alignright {
  text-align: right;
}


.template-left .wp-block-pullquote.alignleft {
    margin: 1rem 3rem 1rem 0;
}

.template-right .wp-block-pullquote.alignright {
    margin: 1rem 0 1rem 3rem;
}

.wp-block-quote {
    margin: 2rem 0;
    padding: 2rem;
}

.wp-block-quote,
.wp-block-pullquote.alignleft,
.wp-block-pullquote.alignright {
	background: var(--clarified-blockquote-bg);
}

.wp-block-pullquote blockquote {
    padding: 0;
	    margin: 2rem;
}



/* Inline block pagination */
.wp-block-query-pagination-numbers {
  display: flex;
}

/* Block widgets */
.wp-block-latest-comments {
  padding-left: 0;
}

/* Media Queries
 ==================================================== */

/* Extra small devices (portrait phones, less than 576px) */
/* No media query since this is the default in Bootstrap */

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
  .bottom-sidebar-grid-2,
  .bottom-sidebar-grid-4 {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Specific case for three widgets between 576px and 768px */
  .bottom-sidebar-grid-3 {
    grid-template-columns: repeat(2, 1fr); /* 2 columns */
  }

  .bottom-sidebar-grid-3 .bottom-sidebar-widget:nth-child(3) {
    grid-column: 1 / -1; /* Third widget spans full width */
  }

  /* Gallery 2 columns for small devices (tablets, 576px and up) */
  .gallery-columns-2.gallery,
  .gallery-columns-3.gallery,
  .gallery-columns-4.gallery,
  .gallery-columns-5.gallery,
  .gallery-columns-6.gallery,
  .gallery-columns-7.gallery,
  .gallery-columns-8.gallery,
  .gallery-columns-9.gallery {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
  .header-content {
    width: 80%;
  }

.page #hero #fade-block {
    max-width: 80%;
}

  .container {
    flex-direction: row;
    gap: 3rem;
    margin-top: 4.375rem;
  }


.main-content {
    flex: 1 1 auto; /* flex-grow, flex-shrink, flex-basis */
    min-width: 0; /* Prevents flex items from growing beyond the max size in a flex container */
}

.sidebar {
    flex: 0 0 20rem; /* Does not grow or shrink, remains at 20rem */
}

.page-template-template-half .container {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

  .blog-left-sidebar .main-content,
  .post-left-sidebar .main-content,
  .template-left .main-content {
    order: 2;
  }


  .d-md-block {
    display: flex;
  }

  .main-navigation {
    display: block;
  }

  /* Hide the offcanvas toggler button in desktop view */
  .navbar-toggler {
    display: none;
  }

  .bottom-sidebar-grid-3 {
    grid-template-columns: repeat(3, 1fr); /* 3 columns */
  }

  .bottom-sidebar-grid-3 .bottom-sidebar-widget:nth-child(3) {
    grid-column: auto; /* Reset to default for larger screens */
  }

  /* Gallery 3 columns for medium devices (desktops, 768px and up) */
  .gallery-columns-3.gallery,
  .gallery-columns-4.gallery,
  .gallery-columns-5.gallery,
  .gallery-columns-6.gallery,
  .gallery-columns-7.gallery,
  .gallery-columns-8.gallery,
  .gallery-columns-9.gallery {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
  body {
    padding: 0;
  }

  body.boxed {
    padding: 3.125rem 0.75rem;
  }

  .header-content {
    width: 70%;
  }

.page #hero #fade-block {
    max-width: 70%;
}
.boxed #hero #fade-block {
    max-width: 80%;
}
  li.menu-item-search,
  .searchModal-btn {
    display: block;
  }

  h1.entry-title {
    max-width: 80%;
    margin-inline: 0;
    font-size: 2.5rem;
  }

  .page h1.entry-title {
    margin-inline: 0;
  }

  #page-excerpt {
    max-width: 80%;
  }

  /* Post Author Bio */
  .post-author-info {
    flex-direction: row;
    align-items: start;
  }

  .post-author-description {
    text-align: left;
  }

  dl {
    display: grid;
    grid-template-columns: 30% 1fr;
    line-height: 1.2;
  }

  dt {
    padding-right: 1rem;
  }

  /* Post navigation */
  .post-navigation .nav-previous,
  .post-navigation .nav-next,
  .comment-navigation .nav-previous,
  .comment-navigation .nav-next {
    margin-bottom: 0;
  }

  /* Adjust blog title width */
  .blog.blog-left-sidebar .entry-title,
  .archive.blog-left-sidebar .entry-title,
  .blog.blog-right-sidebar .entry-title,
  .archive.blog-right-sidebar .entry-title,
  .blog.blog-full-width .entry-title,
  .archive.blog-full-width .entry-title {
    max-width: 80%;
    margin-inline: 0;
  }

  /* Resize grouped sidebars */
  .bottom-sidebar-grid-4 {
    grid-template-columns: repeat(4, 1fr);
  }

  /* Gallery 4 columns for large devices (large desktops, 992px and up) */
  .gallery-columns-4.gallery,
  .gallery-columns-5.gallery,
  .gallery-columns-6.gallery,
  .gallery-columns-7.gallery,
  .gallery-columns-8.gallery,
  .gallery-columns-9.gallery {
    grid-template-columns: repeat(4, 1fr);
  }
  .template-right .gallery-columns-5 .gallery-caption,
  .template-right .gallery-columns-6 .gallery-caption,
  .template-right .gallery-columns-7 .gallery-caption,
  .template-right .gallery-columns-8 .gallery-caption,
  .template-right .gallery-columns-9 .gallery-caption {
    display: none;
  }

  #footer-sidebar.widget-area {
    max-width: 70%;
  }
  
}

/*  X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
  html {
    font-size: 16px;
  }

.page #hero #fade-block {
    max-width: 60%;
}
.boxed #hero #fade-block {
    max-width: 70%;
}

.container {
	    padding-inline: 0;
}

  .header-content {
    width: auto;
    min-width: 20%;
	max-width: 32%;
  }


.header-default .site-header,
.header-minimal .site-header {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
}


.header-hemingway #header-social-wrapper #social-nav,
.header-default #header-social-wrapper #social-nav,
.header-minimal #header-social-wrapper #social-nav {
    justify-content: end;
}

  .post-navigation .nav-links {
    flex-direction: row;
  }

  .post-navigation .nav-next,
  .comment-navigation .nav-next {
    text-align: right;
  }

  .post-navigation .nav-previous,
  .post-navigation .nav-next,
  .comment-navigation .nav-previous,
  .comment-navigation .nav-next {
    margin-bottom: auto;
  }

  /* Gallery 5, 6, 7, 8, and 9 columns for extra large devices */
  .gallery-columns-5.gallery {
    grid-template-columns: repeat(5, 1fr);
  }
  .gallery-columns-6.gallery {
    grid-template-columns: repeat(6, 1fr);
  }
  .gallery-columns-7.gallery {
    grid-template-columns: repeat(7, 1fr);
  }
  .gallery-columns-8.gallery {
    grid-template-columns: repeat(8, 1fr);
  }
  .gallery-columns-9.gallery {
    grid-template-columns: repeat(9, 1fr);
  }
}

/*  XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {
  html {
    font-size: 17px;
  }
  .page #hero #fade-block {
    max-width: 50%;
}
.boxed #hero #fade-block {
    max-width: 60%;
}

}

/* Mega-Large devices (Mega large resolutions, 1920px and up) */
@media (min-width: 1920px) {
  html {
    font-size: 18px;
  }
  .page #hero #fade-block {
    max-width: 40%;
}

}

/* Super-Large devices (Super large resolutions, 2560px and up) */
@media (min-width: 2560px) {
  html {
    font-size: 19px;
  }
}