/*!************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./src/scss/flat-blocks.scss ***!
  \************************************************************************************************************************************************/
/**
 * File:	flat-blocks.css
 * Theme:	Flat Blocks
 * 
 * The base stylesheet for the Flat Block theme's CORE block styles
 * 
 * NOTE: This file is AUTO-GENERATED from the SASS source files 
 * in /src/sass/flat-blocks.scss. Do not make updates here.
 *
 * @package flat-blocks
 * @since	1.0
 */
/*-----------------------------------------------------------------------------
# BASE STYLES
-----------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------
# Normalize
-----------------------------------------------------------------------------*/
/* 
 * Default to contain borders and padding within blocks and prevent iOS from adjusting
 * text sizes after orientation change. 
 */
html {
  box-sizing: border-box;
  -webkit-text-size-adjust: 100%;
  scroll-behavior: auto !important;
}

*, *:before, *:after {
  box-sizing: inherit;
}

/* 
 * Default color scheme to light, but allow theme styles to set it to "light dark".
 * That will turn input fields black and also allows the use of the CSS light-dark
 * function. e.g. light-dark(white, black).
 */
:root {
  color-scheme: var(--wp--custom--color--scheme, light);
}

/*
 * Font smoothing and text decoration styles.
 * These are niche settings that will not be available via Global Styles.
 * https://github.com/WordPress/gutenberg/issues/35934
 * 
 * Also text decoration styles.
 */
body {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  text-decoration-style: var(--wp--custom--color--link--style, solid);
  text-decoration-thickness: var(--wp--custom--link--thickness, 1px);
  text-underline-position: var(--wp--custom--link--position, under);
  text-underline-offset: var(--wp--custom--link--offset, 0);
}

/*-----------------------------------------------------------------------------
# Elements
-----------------------------------------------------------------------------*/
/* Use bold font-weight from theme.json */
strong,
b {
  font-weight: var(--wp--custom--typography--font-weight--bold, 500);
}

/* Prevent code from breaking layout */
code,
pre {
  overflow-x: scroll;
}

/* Set lists with background to match other padding */
ol.has-background:not(.wp-block-navigation-submenu):not(.wp-block-navigation__container),
ul.has-background:not(.wp-block-navigation-submenu):not(.wp-block-navigation__container) {
  padding: var(--wp--preset--spacing--40, 18px);
  list-style-position: inside;
}

/* Center captions by default */
.wp-element-caption {
  text-align: center;
}

/*-----------------------------------------------------------------------------
# Buttons and Links
-----------------------------------------------------------------------------*/
/*
 * Link styles.
 * Necessary until the following issue is resolved in Gutenberg:
 * https://github.com/WordPress/gutenberg/issues/27075
 */
a,
.wp-block-navigation a,
.wp-block-navigation-submenu__toggle {
  cursor: pointer;
  text-decoration-style: var(--wp--custom--color--link--style, solid);
}

/* Set link hover styles */
:where(.has-background :not(.wp-block-site-title) > a:not(.wp-element-button):not(.wp-block-navigation-item__content):not(.wp-block-social-link-anchor)) {
  text-decoration: underline;
}
:where(.has-background :not(.wp-block-site-title) > a:not(.wp-element-button):not(.wp-block-navigation-item__content):not(.wp-block-social-link-anchor)):hover, :where(.has-background :not(.wp-block-site-title) > a:not(.wp-element-button):not(.wp-block-navigation-item__content):not(.wp-block-social-link-anchor)):active {
  opacity: var(--wp--custom--color--link--hover-opacity, 0.8);
}

/* 
 * Style basic buttons to match block buttons. 
 */
input[type=button]:not(.wp-element-button),
input[type=submit][class*=button]:not(.wp-element-button),
input[type=reset][class*=button]:not(.wp-element-button),
input[type=file]::file-selector-button {
  background-color: var(--wp--custom--color--button--background, var(--wp--custom--color--highlight, var(--wp--preset--color--highlight)));
  color: var(--wp--custom--color--button--text, var(--wp--preset--color--foreground-alt, white));
  border: none;
  border-width: 0;
  border-radius: var(--wp--custom--button--radius, 0);
  padding: var(--wp--preset--spacing--30, 9px) var(--wp--preset--spacing--40, 18px);
  font-size: var(--wp--preset--font-size--normal, 18px);
  font-weight: 400;
  line-height: 1.5;
  text-shadow: none;
}

input[type=file] {
  font-size: var(--wp--preset--font-size--small, 16px);
  width: 100%;
}

/* 
 * But override basic buttons to look like outlines on primary-colored
 * backgrounds 
 */
.has-primary-background-color input[type=button],
.has-primary-background-color input[type=submit][class*=button],
.has-primary-background-color input[type=reset][class*=button],
.has-primary-background-color input[type=file]::file-selector-button {
  border: 3px solid var(--wp--custom--color--button--text, var(--wp--preset--color--foreground-alt, white));
}

/*
 * Button hover styles.
 * Necessary until the following issue is resolved in Gutenberg:
 * https://github.com/WordPress/gutenberg/issues/27075
 */
button:not(.wp-block-navigation-submenu__toggle):hover,
input[type=submit][class*=button]:hover,
input[type=reset][class*=button]:hover,
input[type=file]::file-selector-button:hover,
.wp-block-search__button:hover,
.wp-block-file .wp-block-file__button:hover,
.wp-block-button__link:hover {
  cursor: pointer;
  opacity: var(--wp--custom--color--button--hover-opacity, 0.8);
}

input[type=button]:not(.wp-element-button):hover,
input[type=submit][class*=button]:not(.wp-element-button):hover,
input[type=reset][class*=button]:not(.wp-element-button):hover,
input[type=file]::file-selector-button:hover {
  background-color: var(--wp--custom--color--button--hover-background, var(--wp--custom--color--button--background, var(--wp--custom--color--highlight, var(--wp--preset--color--highlight))));
  color: var(--wp--custom--color--button--hover-text, var(--wp--custom--color--button--text, var(--wp--preset--color--foreground-alt, white)));
}

/*-----------------------------------------------------------------------------
# Custom: Link Underlines
-----------------------------------------------------------------------------*/
/* Underline links */
.is-style-link-underline :not(.is-style-link-no-underline) > a:not(.wp-block-navigation-item__content) {
  text-decoration: underline !important;
}

.is-style-link-underline a:hover,
.is-style-link-underline a:active {
  opacity: var(--wp--custom--color--link--hover-opacity, 0.8);
}

/* No Underline links */
.is-style-link-no-underline a {
  text-decoration: none !important;
}

/* Underline links on hover */
.is-style-link-underline-hover a {
  text-decoration: none !important;
}
.is-style-link-underline-hover a:hover, .is-style-link-underline-hover a:active {
  text-decoration: underline !important;
  opacity: 1;
}

/*-----------------------------------------------------------------------------
# Forms
-----------------------------------------------------------------------------*/
/* 
 * Style form fields
 * 
 * Note: Many of these need to be excluded from the Block Editor 
 * toolbars or it will alter them too.
 */
fieldset {
  font-size: var(--wp--preset--font-size--normal, 18px);
  font-weight: var(--wp--custom--typography--font-weight--normal, 300);
  line-height: 1.5;
  padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--40);
  border: 1px solid var(--wp--preset--color--contrast);
  border-radius: var(--wp--custom--border--radius);
  text-shadow: none;
  -webkit-appearance: none;
}

select,
textarea,
input:not(.file):not(.wp-element-button) {
  font-family: inherit;
  background-color: var(--wp--custom--color--field--background, revert);
  color: var(--wp--custom--color--field--text, inherit);
}

select {
  font-size: var(--wp--preset--font-size--small, 16px);
  font-weight: var(--wp--custom--typography--font-weight--normal, 300);
  line-height: 1.5;
  border-radius: var(--wp--preset--spacing--20);
  text-shadow: none;
  border: 1px solid var(--wp--custom--color--field--border, var(--wp--preset--color--dark-gray));
}

textarea,
input {
  font-size: var(--wp--preset--font-size--normal);
  font-weight: var(--wp--custom--typography--font-weight--normal, 300);
  line-height: 1.5;
  border-radius: var(--wp--preset--spacing--20);
  text-shadow: none;
}

textarea,
input:not([type=radio]):not([type=checkbox]):not([type=file]):not([type=button]):not([type=image]):not([class*=button]):not(.wp-block-button__link) {
  -webkit-appearance: none;
  border: 1px solid var(--wp--preset--color--contrast);
}

/* Style focus outline */
input:focus,
textarea:focus {
  outline: none !important;
  box-shadow: 0 0 0 3px var(--wp--custom--color--field--outline, var(--wp--custom--outline--color));
  transition: box-shadow 0.3s ease;
}

select:focus,
select:focus-visible {
  outline: var(--wp--custom--color--field--outline, var(--wp--custom--outline--color)) 5px solid;
  transition: outline 0.3s ease;
}

/*-----------------------------------------------------------------------------
# Alignments
-----------------------------------------------------------------------------*/
/*
 * Don't let anything be wider than our max width. This is so 
 * fullwidth images don't get so wide they lose resolution.
 */
.wp-site-blocks {
  max-width: var(--wp--custom--layout--full-size, 1600px);
  margin-left: auto;
  margin-right: auto;
}

/* FIX for center alignment */
body .is-layout-constrained > .aligncenter {
  text-align: center;
}

/* 
 * ADD padding to align left and align right to honor wide width 
 */
.wp-site-blocks > .alignleft {
  margin-right: var(--wp--style--root--padding-right, var(--wp--preset--spacing--50));
}

body .is-layout-constrained > .alignleft {
  padding-left: calc(0.5 * (100% - var(--wp--style--global--wide-size)));
  margin-inline-end: var(--wp--style--root--padding-right, var(--wp--preset--spacing--50));
}

.wp-site-blocks > .alignright {
  margin-left: var(--wp--style--root--padding-left, var(--wp--preset--spacing--50));
}

body .is-layout-constrained > .alignright {
  padding-right: calc(0.5 * (100% - var(--wp--style--global--wide-size)));
  margin-inline-start: var(--wp--style--root--padding-left, var(--wp--preset--spacing--50));
}

/* Fix WordPress Admin bar on phones not sticking to the top */
@media screen and (max-width: 600px) {
  body > #wpadminbar {
    position: fixed;
  }
}
/*------------------------------------------------------------------------------
# Colors
------------------------------------------------------------------------------*/
/*
 * Default contrast (text) and/or highlight (link, button) color based on 
 * background color.
 * 
 * Override contrast (text) color in theme.json with:
 *		--wp--custom--color--contrast--{color} or 
 *		--wp--custom--color--contrast--default-black or
 *		--wp--custom--color--contrast--default-white
 * 
 * Override highlight (link, button) color in theme.json with:
 *		--wp--custom--color--highlight--{color}
 */
.has-contrast-background-color :where(a:not(.wp-element-button):hover), .has-dark-background-color :where(a:not(.wp-element-button):hover), .has-dark-alt-background-color :where(a:not(.wp-element-button):hover), .has-almost-black-background-color :where(a:not(.wp-element-button):hover), .has-not-quite-black-background-color :where(a:not(.wp-element-button):hover), .has-black-background-color :where(a:not(.wp-element-button):hover), .has-base-background-color :where(a:not(.wp-element-button):hover), .has-neutral-background-color :where(a:not(.wp-element-button):hover), .has-neutral-alt-background-color :where(a:not(.wp-element-button):hover), .has-foreground-alt-background-color :where(a:not(.wp-element-button):hover), .has-white-background-color :where(a:not(.wp-element-button):hover), .has-off-white-background-color :where(a:not(.wp-element-button):hover), .has-very-light-gray-background-color :where(a:not(.wp-element-button):hover), .has-light-gray-background-color :where(a:not(.wp-element-button):hover), .has-gray-background-color :where(a:not(.wp-element-button):hover) {
  opacity: 1;
}

/* 
 * Black and near-black colors, default light text but leave link color alone
 */
.has-contrast-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--contrast, var(--wp--custom--color--contrast--default-black, var(--wp--preset--color--foreground-alt)));
}

.has-dark-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--dark, var(--wp--custom--color--contrast--default-black, var(--wp--preset--color--foreground-alt)));
}

.has-dark-alt-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--dark-alt, var(--wp--custom--color--contrast--default-black, var(--wp--preset--color--foreground-alt)));
}

.has-almost-black-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--almost-black, var(--wp--custom--color--contrast--default-black, var(--wp--preset--color--foreground-alt)));
}

.has-not-quite-black-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--not-quite-black, var(--wp--custom--color--contrast--default-black, var(--wp--preset--color--foreground-alt)));
}

.has-black-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--black, var(--wp--custom--color--contrast--default-black, var(--wp--preset--color--foreground-alt)));
}

/* 
 * Primary, Secondary, and Tertiary colors, default light text and links
 */
.has-primary-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--primary, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--primary, inherit);
}
.has-primary-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

.has-secondary-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--secondary, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--secondary, inherit);
}
.has-secondary-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

.has-tertiary-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--tertiary, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--tertiary, inherit);
}
.has-tertiary-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

.has-primary-alt-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--primary-alt, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--primary-alt, inherit);
}
.has-primary-alt-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

.has-secondary-alt-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--secondary-alt, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--secondary-alt, inherit);
}
.has-secondary-alt-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

.has-tertiary-alt-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--tertiary-alt, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--tertiary-alt, inherit);
}
.has-tertiary-alt-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

.has-highlight-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--highlight, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--highlight, inherit);
}
.has-highlight-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

.has-highlight-alt-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--highlight-alt, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--highlight-alt, inherit);
}
.has-highlight-alt-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

/* 
 * Dark colors, default light text and links
 */
.has-dark-gray-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--dark-gray, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--dark-gray, inherit);
}
.has-dark-gray-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

.has-very-dark-gray-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--very-dark-gray, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--very-dark-gray, inherit);
}
.has-very-dark-gray-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

.has-green-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--green, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--green, inherit);
}
.has-green-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

.has-dark-bright-green-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--dark-bright-green, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--dark-bright-green, inherit);
}
.has-dark-bright-green-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

.has-midnight-blue-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--midnight-blue, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--midnight-blue, inherit);
}
.has-midnight-blue-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

.has-dark-midnight-blue-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--dark-midnight-blue, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--dark-midnight-blue, inherit);
}
.has-dark-midnight-blue-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

.has-orange-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--orange, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--orange, inherit);
}
.has-orange-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

.has-dark-orange-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--dark-orange, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--dark-orange, inherit);
}
.has-dark-orange-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

.has-blue-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--blue, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--blue, inherit);
}
.has-blue-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

.has-dark-blue-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--dark-blue, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--dark-blue, inherit);
}
.has-dark-blue-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

.has-purple-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--purple, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--purple, inherit);
}
.has-purple-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

.has-dark-purple-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--dark-purple, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--dark-purple, inherit);
}
.has-dark-purple-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

.has-light-red-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--light-red, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--light-red, inherit);
}
.has-light-red-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

.has-red-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--red, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--red, inherit);
}
.has-red-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

.has-dark-red-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--dark-red, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--dark-red, inherit);
}
.has-dark-red-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

/* 
 * Medium colors, default light text and links
 */
.has-light-green-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--light-green, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--light-green, inherit);
}
.has-light-green-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

.has-bright-green-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--bright-green, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--bright-green, inherit);
}
.has-bright-green-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

.has-light-orange-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--light-orange, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--light-orange, inherit);
}
.has-light-orange-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

.has-light-blue-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--light-blue, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--light-blue, inherit);
}
.has-light-blue-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

.has-light-purple-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--light-purple, var(--wp--preset--color--foreground-alt));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--light-purple, inherit);
}
.has-light-purple-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

/* 
 * Light Colors, default dark text and links
 */
.has-light-yellow-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--light-yellow, var(--wp--preset--color--almost-black));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--light-yellow, inherit);
}
.has-light-yellow-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

.has-yellow-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--yellow, var(--wp--preset--color--almost-black));
  --wp--custom--color--highlight: var(--wp--custom--color--highlight--yellow, inherit);
}
.has-yellow-background-color :where(a:not(.wp-element-button)) {
  color: var(--wp--custom--color--highlight);
}

/* 
 * White and near-white colors, default dark text but leave the link color alone
 */
.has-base-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--base, var(--wp--custom--color--contrast--default-white, var(--wp--preset--color--contrast)));
}

.has-neutral-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--neutral, var(--wp--custom--color--contrast--default-white, var(--wp--preset--color--contrast)));
}

.has-neutral-alt-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--neutral-alt, var(--wp--custom--color--contrast--default-white, var(--wp--preset--color--contrast)));
}

.has-foreground-alt-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--foreground-alt, var(--wp--custom--color--contrast--default-white, var(--wp--preset--color--contrast)));
}

.has-white-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--white, var(--wp--custom--color--contrast--default-white, var(--wp--preset--color--contrast)));
}

.has-off-white-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--off-white, var(--wp--custom--color--contrast--default-white, var(--wp--preset--color--contrast)));
}

.has-very-light-gray-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--very-light-gray, var(--wp--custom--color--contrast--default-white, var(--wp--preset--color--contrast)));
}

.has-light-gray-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--light-gray, var(--wp--custom--color--contrast--default-white, var(--wp--preset--color--contrast)));
}

.has-gray-background-color {
  --wp--custom--color--contrast: var(--wp--custom--color--contrast--gray, var(--wp--custom--color--contrast--default-white, var(--wp--preset--color--contrast)));
}

/* Set the contrast color on colored backgrounds and buttons */
:root :where(.has-background),
:root :where(.wp-block-background.has-background .wp-element-button, .wp-block-background.has-background .wp-block-button__link) {
  color: var(--wp--custom--color--contrast);
}

/* Set the text color on gradient backgrounds */
:root :where([class*=-gradient-background]:not(.has-gray-gradient-background):not(.has-yellow-gradient-background)) {
  color: var(--wp--preset--color--foreground-alt);
}

:root :where(.has-primary-gradient-background, .has-primary-to-secondary-gradient-background, .has-secondary-to-primary-gradient-background, .has-primary-to-tertiary-gradient-background, .has-tertiary-to-primary-gradient-background) {
  color: var(--wp--custom--color--contrast--primary, var(--wp--preset--color--foreground-alt));
}

:root :where(.has-secondary-gradient-background, .has-secondary-to-tertiary-gradient-background, .has-tertiary-to-secondary-gradient-background) {
  color: var(--wp--custom--color--contrast--secondary, var(--wp--preset--color--foreground-alt));
}

:root :where(.has-tertiary-gradient-background) {
  color: var(--wp--custom--color--contrast--tertiary, var(--wp--preset--color--foreground-alt));
}

/* Inherit the link color on gradient backgrounds */
:root :where([class*=-gradient-background]) a:where(:not(.wp-element-button)) {
  color: inherit;
}

/* 
 * On Cover blocks, default the text color to white, but set it back to black
 * on light backgrounds with dim 30% or less
 */
:where(.wp-block-cover-image.is-light:not(.has-text-color)), :where(.wp-block-cover.is-light:not(.has-text-color)) {
  color: #fff;
}
:where(.wp-block-cover-image.is-light:not(.has-text-color)):has(.has-background-dim-10), :where(.wp-block-cover-image.is-light:not(.has-text-color)):has(.has-background-dim-20), :where(.wp-block-cover-image.is-light:not(.has-text-color)):has(.has-background-dim-30), :where(.wp-block-cover.is-light:not(.has-text-color)):has(.has-background-dim-10), :where(.wp-block-cover.is-light:not(.has-text-color)):has(.has-background-dim-20), :where(.wp-block-cover.is-light:not(.has-text-color)):has(.has-background-dim-30) {
  color: #000;
}

/*-----------------------------------------------------------------------------
# CRITICAL BLOCK STYLES
-----------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------
# Columns and Column
-----------------------------------------------------------------------------*/
/* Padding for colored backgrounds on columns and individual column */
.wp-block-columns.has-background {
  padding: var(--wp--preset--spacing--60);
}

.wp-block-column.has-background {
  padding: var(--wp--preset--spacing--40);
}

/* 
 * Note: Breakpoint of 781 is what is hard-coded in WordPress 
 * v6.0+ to collapse columns
 */
@media only screen and (max-width: 781px) {
  /* 
   * If no global padding, then set colored columns like colored
   * groups 
   */
  .wp-block-columns.has-background,
  .wp-block-column.has-background {
    padding-left: calc(2 * var(--wp--style--block-gap));
    padding-right: calc(2 * var(--wp--style--block-gap));
  }
  /* If global padding, then OVERRIDE horizontal padding on mobile */
  .has-global-padding .wp-block-columns.has-background,
  .has-global-padding .wp-block-column.has-background {
    padding-left: var(--wp--style--root--padding-left) !important;
    padding-right: var(--wp--style--root--padding-right) !important;
  }
}
/*-----------------------------------------------------------------------------
# Columns and Column: Custom
-----------------------------------------------------------------------------*/
/* Columns no Gap */
.wp-block-columns.is-style-no-gap,
.wp-block-columns.is-style-no-gap .wp-block-column:not(.has-background),
.wp-block-columns.is-style-no-gap.has-background:not(.has-global-padding) {
  gap: 0 !important;
  padding: 0 !important;
}

/* Columns thick gap */
.wp-block-columns.is-style-thick-gap,
.wp-block-columns.is-style-thick-gap.has-background {
  gap: calc(2 * var(--wp--style--block-gap));
}

/* Column no padding */
.wp-block-column.is-style-no-padding {
  padding: 0;
}

/* Handle when columns collapse on mobile */
/* Breakpoint of 781 is what is hard-coded in WordPress v6.0+ to collapse columns */
@media only screen and (max-width: 781px) {
  /* Reduce row (vertical gap) when collapsing centered columns */
  .wp-block-columns.is-style-center-on-mobile {
    row-gap: var(--wp--preset--spacing--30);
  }
  /* Center left and right aligned text */
  .wp-block-columns.is-style-center-on-mobile .wp-block-column:not(.wp-block-navigation__responsive-container-content) > *,
  .wp-block-columns.is-style-center-on-mobile .wp-block-column:not(.wp-block-navigation__responsive-container-content) > .wp-block-template-part > * {
    display: flex;
    justify-content: center;
    --navigation-layout-justify: center;
  }
  /* OVERRIDE columns thick gap so vertical spacing matches up */
  .wp-block-columns.is-style-thick-gap,
  .wp-block-columns.is-style-thick-gap.has-background {
    gap: var(--wp--style--block-gap);
  }
}
/*-----------------------------------------------------------------------------
# Cover
-----------------------------------------------------------------------------*/
/* LIMIT cover image inner content to standard unless wide or full */
.wp-block-cover .wp-block-cover__inner-container > *:not(.alignfull):not(.alignwide) {
  max-width: var(--wp--style--global--content-size);
  margin-left: auto;
  margin-right: auto;
}

.wp-block-cover .wp-block-cover__inner-container > *.alignwide,
.wp-block-cover .wp-block-cover__inner-container > *.alignfull {
  max-width: var(--wp--style--global--wide-size);
  margin-left: auto;
  margin-right: auto;
}

/* If cover used as site header, make sure it is layered above other covers */
header > .wp-block-cover {
  overflow: visible;
  z-index: 3;
}

/*-----------------------------------------------------------------------------
# Group
-----------------------------------------------------------------------------*/
/* Padding for colored backgrounds on groups */
.wp-block-group.has-background {
  padding: var(--wp--preset--spacing--60);
}

/* 
 * If global padding, then OVERRIDE horizontal padding on mobile
 *
 * Note: Breakpoint of 781 is what is hard-coded in WordPress for tablet
 */
@media only screen and (max-width: 781px) {
  .site-header.has-global-padding.wp-block-group,
  .site-footer.has-global-padding.wp-block-group {
    padding-left: var(--wp--style--root--padding-left) !important;
    padding-right: var(--wp--style--root--padding-right) !important;
  }
}
/* Even when nowrap is set, go ahead and collapse on mobile
 * 
 * Note: Breakpoint of 601 is what is hard-coded in WordPress for mobile 
 */
@media only screen and (max-width: 601px) {
  .is-nowrap.is-layout-flex.wp-block-group {
    flex-wrap: wrap;
  }
}
/*-----------------------------------------------------------------------------
# Group: Custom
-----------------------------------------------------------------------------*/
.wp-block-group.is-style-rounded-border.is-layout-flex {
  overflow: hidden;
}

.wp-block-group.is-style-thick-rounded-border.is-layout-flex {
  overflow: hidden;
}

/* Group no padding */
.wp-block-group.is-style-no-padding {
  padding-top: 0;
  padding-bottom: 0;
}

.wp-block-group.is-style-no-padding:not(.has-global-padding) {
  padding-left: 0;
  padding-right: 0;
}

/* Group fixed header (position: sticky) */
header.wp-block-group.is-position-sticky,
.wp-block-group.is-style-fixed-header,
.wp-block-group.has-background.is-style-fixed-header {
  background-color: var(--wp--preset--color--base);
  box-shadow: var(--wp--custom--shadow--default);
}

/* Position the fixed header using sticky so we don't have to have top site margin */
.wp-site-blocks > header.wp-block-template-part:has(header.is-position-sticky),
.wp-site-blocks > header:has(.is-style-fixed-header) {
  position: sticky;
  top: 0;
  background-color: var(--wp--preset--color--base);
  z-index: 10;
}

/* If WordPress Admin Bar, then adjust fixed header position so its underneath it */
.admin-bar .wp-site-blocks > header.wp-block-template-part:has(header.is-position-sticky),
.admin-bar .wp-site-blocks > header:has(.is-style-fixed-header) {
  top: var(--wp-admin--admin-bar--height, 32px);
}

/* Line up menu close button with menu open button */
.wp-block-group.header.is-position-sticky .wp-block-navigation__responsive-container.is-menu-open,
.wp-block-group.is-style-fixed-header .wp-block-navigation__responsive-container.is-menu-open {
  padding-top: var(--wp--preset--spacing--50);
}

/* Position the fixed footer using sticky */
.wp-site-blocks > footer.wp-block-template-part:has(footer.is-position-sticky) {
  position: relative;
  bottom: 0;
  z-index: 9;
}

@media only screen and (min-width: 1100px) {
  .wp-site-blocks > footer.wp-block-template-part:has(footer.is-position-sticky) {
    position: sticky;
  }
}
/*-----------------------------------------------------------------------------
# Heading
-----------------------------------------------------------------------------*/
/* Match our padding on headings with backgrounds */
h1.has-background,
h2.has-background,
h3.has-background,
h4.has-background,
h5.has-background,
h6.has-background {
  padding: var(--wp--preset--spacing--40);
}

/*-----------------------------------------------------------------------------
# Image
-----------------------------------------------------------------------------*/
/* Prevent figures (images, tables) with hard-coded dimensions from breaking the 
 * layout. Note the figure line is for older block editor markup. 
 */
figure.wp-caption:not(.alignfull):not(.alignwide),
figure.wp-caption:not(.alignfull):not(.alignwide) img {
  max-width: min(100%, var(--wp--style--global--content-size)) !important;
  height: auto;
  margin-left: auto;
  margin-right: auto;
}

/* FIX rounded images when global image style has a border radius */
.wp-block-image .is-style-rounded img,
.wp-block-image.is-style-circle-mask img,
.wp-block-image.is-style-rounded img {
  border-radius: 9999px !important;
}

/*-----------------------------------------------------------------------------
# Image: Custom
-----------------------------------------------------------------------------*/
/* Image borders */
.is-style-image-border img {
  border: 1px solid var(--wp--custom--color--border);
  border-radius: var(--wp--custom--border--radius);
  padding: var(--wp--preset--spacing--20);
}

.wp-block-gallery.has-nested-images figure.is-style-image-border figcaption,
.wp-block-gallery.is-style-image-border.has-nested-images figure.wp-block-image figcaption {
  bottom: calc(1px + var(--wp--preset--spacing--20));
  left: calc(1px + var(--wp--preset--spacing--20));
  padding: 0 calc(1px + var(--wp--preset--spacing--20)) calc(1px + var(--wp--preset--spacing--20)) 0;
  width: calc(100% - (2px + 2 * var(--wp--preset--spacing--20)));
  border-bottom-left-radius: var(--wp--custom--border--radius);
  border-bottom-right-radius: var(--wp--custom--border--radius);
}

.is-style-image-round-border img {
  border: 1px solid var(--wp--custom--color--border);
  border-radius: 9999px; /*50%;*/
  padding: var(--wp--preset--spacing--20);
}

.wp-block-image.is-style-image-computer-screen img {
  border: var(--wp--preset--spacing--60) solid var(--wp--preset--color--almost-black);
  border-radius: var(--wp--preset--spacing--40);
  border-bottom: 3px solid var(--wp--preset--color--almost-black);
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.is-style-image-tablet-phone-screen img {
  border: var(--wp--preset--spacing--50) solid var(--wp--preset--color--almost-black);
  border-radius: var(--wp--preset--spacing--40);
}

/* Featured Image no border */
.is-style-image-no-border,
.is-style-image-no-border img {
  border: none;
  border-radius: 0;
  padding: 0;
}

/*-----------------------------------------------------------------------------
# Navigation
-----------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------
# Default settings for nav menus
-----------------------------------------------------------------------------*/
/* When the nav itself has a colored background, set link color and padding */
.wp-block-navigation.has-background:not(.has-text-color) .wp-block-navigation__responsive-container, .wp-block-navigation.has-background:not(.has-text-color) .wp-block-navigation__submenu-container {
  color: inherit;
}
.wp-block-navigation.has-background .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__container > .wp-block-navigation-item:not(:first-child) > a:not(.wp-element-button), .wp-block-navigation.has-background .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__container > .wp-block-navigation-submenu:not(:first-child) {
  padding-left: 0;
}
.wp-block-navigation.has-background .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__container > .wp-block-navigation-item:not(:last-child) > a:not(.wp-element-button), .wp-block-navigation.has-background .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__container > .wp-block-navigation-submenu:not(:last-child) {
  padding-right: 0;
}

/* Default nav link opacity on hover */
.wp-block-navigation .wp-block-navigation-item:hover > .wp-block-navigation-item__content.wp-block-navigation-item__content,
.wp-block-navigation .wp-block-navigation-item:active > .wp-block-navigation-item__content.wp-block-navigation-item__content {
  opacity: var(--wp--custom--color--link--hover-opacity, 0.8);
}

/*-----------------------------------------------------------------------------
# On HEADER MENU, highlight on HOVER and on CURRENT active menu item
-----------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------
# On DESKTOP, highlight TOP-LEVEL links
-----------------------------------------------------------------------------*/
header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__container > .wp-block-navigation-item:hover > .wp-block-navigation-item__content, header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__container > .wp-block-navigation-item:hover > .wp-block-navigation__submenu-icon, header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__container > .wp-block-navigation-item:active > .wp-block-navigation-item__content, header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__container > .wp-block-navigation-item:active > .wp-block-navigation__submenu-icon, header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__container .wp-block-page-list > .wp-block-pages-list__item:hover > a {
  color: var(--wp--custom--color--highlight, var(--wp--preset--color--highlight));
}
header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__container > .wp-block-navigation-item:has(.current-menu-ancestor) > .wp-block-navigation-item__content, header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__container > .wp-block-navigation-item:has(.current-menu-ancestor) > .wp-block-navigation__submenu-icon, header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__container > .wp-block-navigation-item.current-menu-item > a[aria-current=page], header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__container .wp-block-page-list > .wp-block-pages-list__item.current-menu-item > a {
  color: var(--wp--custom--color--highlight, var(--wp--preset--color--highlight));
  font-weight: var(--wp--custom--color--font-weight, bolder);
}

/*-----------------------------------------------------------------------------
# On MOBILE, highlight TOP-LEVEL links
-----------------------------------------------------------------------------*/
header .wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:not(.open-on-click):hover > .wp-block-navigation-item__content, header .wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:not(.open-on-click):hover > .wp-block-navigation__submenu-icon, header .wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:not(.open-on-click):active > .wp-block-navigation-item__content, header .wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:not(.open-on-click):active > .wp-block-navigation__submenu-icon, header .wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container .wp-block-page-list > .wp-block-pages-list__item:hover > a {
  color: var(--wp--preset--color--highlight-alt);
}
header .wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .current-menu-ancestor, header .wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content, header .wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container .wp-block-page-list > .wp-block-pages-list__item.current-menu-item > a {
  color: var(--wp--preset--color--highlight);
  font-weight: var(--wp--custom--color--font-weight, bolder);
}

/*-----------------------------------------------------------------------------
# Handle highlight on SUB MENU items WITHOUT it's own background
-----------------------------------------------------------------------------*/
header .wp-block-navigation:not(.has-background) .wp-block-navigation-submenu:not(.has-background) .wp-block-navigation-item:hover > .wp-block-navigation-item__content, header .wp-block-navigation:not(.has-background) .wp-block-navigation-submenu:not(.has-background) .wp-block-navigation-item:hover > .wp-block-navigation__submenu-icon, header .wp-block-navigation:not(.has-background) .wp-block-navigation-submenu:not(.has-background) .wp-block-navigation-item:active > .wp-block-navigation-item__content, header .wp-block-navigation:not(.has-background) .wp-block-navigation-submenu:not(.has-background) .wp-block-navigation-item:active > .wp-block-navigation__submenu-icon {
  color: var(--wp--preset--color--highlight-alt);
}
header .wp-block-navigation:not(.has-background) .wp-block-navigation-submenu:not(.has-background) .wp-block-navigation-item:has(.current-menu-ancestor), header .wp-block-navigation:not(.has-background) .wp-block-navigation-submenu:not(.has-background) .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content {
  color: var(--wp--preset--color--highlight);
  font-weight: var(--wp--custom--color--font-weight, bolder);
}

/*-----------------------------------------------------------------------------
# Handle highlight on SUB MENU items WITH it's own background
-----------------------------------------------------------------------------*/
header .wp-block-navigation.has-background .wp-block-navigation-submenu:not(.has-background) .wp-block-navigation-item:hover > .wp-block-navigation-item__content, header .wp-block-navigation.has-background .wp-block-navigation-submenu:not(.has-background) .wp-block-navigation-item:hover > .wp-block-navigation__submenu-icon, header .wp-block-navigation.has-background .wp-block-navigation-submenu:not(.has-background) .wp-block-navigation-item:active > .wp-block-navigation-item__content, header .wp-block-navigation.has-background .wp-block-navigation-submenu:not(.has-background) .wp-block-navigation-item:active > .wp-block-navigation__submenu-icon,
header .wp-block-navigation-submenu.has-background .wp-block-navigation-item:hover > .wp-block-navigation-item__content,
header .wp-block-navigation-submenu.has-background .wp-block-navigation-item:hover > .wp-block-navigation__submenu-icon,
header .wp-block-navigation-submenu.has-background .wp-block-navigation-item:active > .wp-block-navigation-item__content,
header .wp-block-navigation-submenu.has-background .wp-block-navigation-item:active > .wp-block-navigation__submenu-icon {
  color: var(--wp--custom--color--highlight, var(--wp--preset--color--highlight-alt));
}
header .wp-block-navigation.has-background .wp-block-navigation-submenu:not(.has-background) .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content,
header .wp-block-navigation-submenu.has-background .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content {
  color: var(--wp--custom--color--highlight, var(--wp--preset--color--highlight));
  font-weight: var(--wp--custom--color--font-weight, bolder);
}

/*-----------------------------------------------------------------------------
# On MOBILE nav, don't hover on non-clickable links
-----------------------------------------------------------------------------*/
header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item.open-on-click:hover > .wp-block-navigation-item__content {
  cursor: unset;
  opacity: 1;
}

/*-----------------------------------------------------------------------------
# Style the Mobile Nav Menu
-----------------------------------------------------------------------------*/
/* Style the mobile nav open and close buttons */
.wp-block-navigation .wp-block-navigation__responsive-container-open,
.wp-block-navigation .wp-block-navigation__responsive-container-close {
  background-color: rgba(0, 0, 0, 0.05);
  border: 1px solid var(--wp--custom--color--border, var(--wp--preset--color--neutral-alt));
  border-radius: var(--wp--custom--button--radius);
  padding: var(--wp--preset--spacing--20);
}

.has-modal-open .admin-bar .is-menu-open .wp-block-navigation__responsive-dialog {
  margin-top: var(--wp--preset--spacing--60);
}

/* 
 * On navs with colored backgrounds, round out the mobile nav container 
 * to match our open / close menu buttons
 */
.wp-block-navigation.has-background:has(.wp-block-navigation__responsive-container:not(.is-menu-open.is-menu-open)) {
  border-radius: var(--wp--custom--button--radius);
}

/*
 * Responsive menu container padding. This behavior may be built into the 
 * Block Editor in the future.
 */
.wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open {
  padding-top: var(--wp--preset--spacing--50);
  padding-bottom: var(--wp--preset--spacing--60);
  padding-right: var(--wp--style--root--padding-right, var(--wp--preset--spacing--50));
  padding-left: var(--wp--style--root--padding-left, var(--wp--preset--spacing--50));
}

/* Set padding on drop-down menus for mobile */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .has-child .wp-block-navigation__submenu-container {
  padding: 0 var(--wp--preset--spacing--40);
}

/* Increase animation TIME on nav menu drop-downs */
.wp-block-navigation .has-child .wp-block-navigation__submenu-container {
  -webkit-transition-duration: var(--wp--custom--animation--duration--short);
  -moz-transition-duration: var(--wp--custom--animation--duration--short);
  transition-duration: var(--wp--custom--animation--duration--short);
}

/* Increase animation DELAY on nav drop-downs when NOT requiring a click */
.wp-block-navigation .has-child:not(.open-on-click):hover > .wp-block-navigation__submenu-container {
  -webkit-transition-delay: var(--wp--custom--animation--duration--short);
  -moz-transition-delay: var(--wp--custom--animation--duration--short);
  transition-delay: var(--wp--custom--animation--duration--short);
}

/*-----------------------------------------------------------------------------
# Navigation: Custom Fixed Header
-----------------------------------------------------------------------------*/
/* Navigation Fixed menu */
nav.wp-block-navigation.is-style-fixed-menu .wp-block-navigation__responsive-container-open,
nav.wp-block-navigation.is-style-fixed-menu .wp-block-navigation__responsive-container-close {
  background: rgba(0, 0, 0, 0.25);
  padding: var(--wp--preset--spacing--20);
  color: white;
  border: none;
  border-radius: 0;
}

/* On the front-end, position the fixed nav menu to the top left */
.wp-site-blocks:not(.is-root-container) nav.wp-block-navigation.is-style-fixed-menu {
  position: fixed;
  top: calc(var(--wp--preset--spacing--60) + 1px * var(--wp--style--root--padding-top, 0));
  left: max(0.5 * (100% - var(--wp--style--global--wide-size)), var(--wp--style--root--padding-left, calc(2 * var(--wp--preset--spacing--50))));
  right: auto;
  z-index: 9999;
}

/* If WordPress Admin Bar, adjust fixed menu top position so its underneath */
.admin-bar .wp-site-blocks:not(.is-root-container) nav.wp-block-navigation.is-style-fixed-menu {
  top: calc(var(--wp--preset--spacing--60) + 1px * var(--wp--style--root--padding-top, 0) + var(--wp-admin--admin-bar--height, 0));
}

/* 
 * On the front-end and Editor, default the fixed menu's drop-down and close
 * button also to the left 
 */
nav.wp-block-navigation.is-style-fixed-menu .wp-block-navigation__responsive-container {
  width: 360px;
  left: 0;
  right: auto;
}

nav.wp-block-navigation.is-style-fixed-menu .wp-block-navigation__responsive-container-close {
  left: 0;
  right: auto;
}

/* If right justified, position the fixed menu and its drop-down to the right */
.site-header.is-content-justification-right > nav.wp-block-navigation.is-style-fixed-menu,
.site-header.is-content-justification-right > .wp-block-template-part > nav.wp-block-navigation.is-style-fixed-menu {
  right: max(0.5 * (100% - var(--wp--style--global--wide-size)), var(--wp--style--root--padding-right, calc(2 * var(--wp--preset--spacing--50))));
  left: auto;
}

.site-header.is-content-justification-right > nav.wp-block-navigation.is-style-fixed-menu .wp-block-navigation__responsive-container,
.site-header.is-content-justification-right > .wp-block-template-part > nav.wp-block-navigation.is-style-fixed-menu .wp-block-navigation__responsive-container {
  right: 0;
  left: auto;
}

.site-header.is-content-justification-right > nav.wp-block-navigation.is-style-fixed-menu .wp-block-navigation__responsive-container-close,
.site-header.is-content-justification-right > .wp-block-template-part > nav.wp-block-navigation.is-style-fixed-menu .wp-block-navigation__responsive-container-close {
  right: 0;
  left: auto;
}

/* 
 * If center justified, position the fixed menu and its drop-down in the 
 * center 
 */
.site-header.is-content-justification-center > nav.wp-block-navigation.is-style-fixed-menu,
.site-header.is-content-justification-center > .wp-block-template-part > nav.wp-block-navigation.is-style-fixed-menu {
  left: calc(50% - 12px - var(--wp--preset--spacing--20));
  right: auto;
}

.site-header.is-content-justification-center > nav.wp-block-navigation.is-style-fixed-menu .wp-block-navigation__responsive-container,
.site-header.is-content-justification-center > .wp-block-template-part > nav.wp-block-navigation.is-style-fixed-menu .wp-block-navigation__responsive-container {
  left: calc(50% - 180px);
  right: auto;
}

.site-header.is-content-justification-center > nav.wp-block-navigation.is-style-fixed-menu .wp-block-navigation__responsive-container-close,
.site-header.is-content-justification-center > .wp-block-template-part > nav.wp-block-navigation.is-style-fixed-menu .wp-block-navigation__responsive-container-close {
  left: calc(50% - 12px - 0.5 * var(--wp--preset--spacing--20));
  right: auto;
}

/*-----------------------------------------------------------------------------
# Paragraph
-----------------------------------------------------------------------------*/
.wp-block-paragraph.has-background {
  padding: var(--wp--preset--spacing--40);
}

/* 
 * Note: Breakpoint of 781 is what is hard-coded in WordPress 
 * v6.0+ to collapse columns
 */
@media only screen and (max-width: 781px) {
  /* 
   * If no global padding, then set paragraphs like colored
   * groups 
   */
  p.has-background:not(.has-global-padding) {
    padding-left: calc(2 * var(--wp--style--block-gap));
    padding-right: calc(2 * var(--wp--style--block-gap));
  }
  /* If global padding, then OVERRIDE horizontal padding on mobile */
  .has-global-padding p.has-background {
    padding-left: var(--wp--style--root--padding-left) !important;
    padding-right: var(--wp--style--root--padding-right) !important;
  }
}
/*-----------------------------------------------------------------------------
# Paragraph: Custom
-----------------------------------------------------------------------------*/
/* Alignwide */
p.is-style-alignwide {
  max-width: var(--wp--style--global--wide-size) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Arrow icon */
p.is-style-arrow-icon-no-text {
  font-size: 0; /* hide the text */
}

p.is-style-arrow-icon > a,
p.is-style-arrow-icon-no-text > a {
  color: inherit;
  display: block;
  text-decoration: none !important;
  outline: none !important;
  text-align: center;
  margin: var(--wp--style--block-gap) auto;
}

p.is-style-arrow-icon > a:focus,
p.is-style-arrow-icon > a:active,
p.is-style-arrow-icon-no-text > a:focus,
p.is-style-arrow-icon-no-text > a:active {
  opacity: 1;
}

p.is-style-arrow-icon > a:after,
p.is-style-arrow-icon-no-text > a:after {
  display: block;
  font-family: dashicons;
  content: "\f347";
  font-size: var(--wp--preset--font-size--larger);
  line-height: 1;
}

p.is-style-arrow-icon > a:after {
  white-space: pre-wrap; /* adds line break */
}

/*-----------------------------------------------------------------------------
# ADDITIONAL BASE STYLES
-----------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------
# Utilities
-----------------------------------------------------------------------------*/
/* 
 * Note: These utility classes must be added manually in the 
 * Advanced section of the block settings.
 */
/* 
 * Clearfix (Clear floats)
 * 
 * Note: Be carefull as this will mess up fixed headers, Row 
 * Groups (flex boxes), etc. We've tried to style around those 
 * though.
 */
.is-style-clearfix:not(.is-layout-flex):not(.is-style-fixed-header):after {
  content: "";
  clear: both;
  display: table;
}

/* Flexbox No Shrink
 * 
 * Note: This only works on elements within a Flex Box (Group)
 */
.is-layout-flex .is-style-no-shrink {
  flex-shrink: 0;
}

/*-----------------------------------------------------------------------------
# Dashicons
-----------------------------------------------------------------------------*/
/**
 * Override core WordPress base Dashicon styles. Don't let it
 * alter height, width, font-size or line-height. 
 *
 */
.dashicons {
  display: block;
  width: auto;
  height: auto;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  text-align: center;
  text-transform: inherit;
}

.dashicons:before {
  display: inline-block;
  width: auto;
  height: auto;
  font-family: dashicons;
  font-size: 1em;
  line-height: 1;
  font-weight: inherit;
  vertical-align: text-top;
}

/* Add some right margin on inline dashicons before the text */
.dashicons-before:before,
.dashicons-above:before,
.dashicons-below:before {
  font-family: dashicons;
  margin-right: var(--wp--preset--spacing--20, 4.5px);
}

.dashicons-after {
  display: flex;
}
.dashicons-after:before {
  font-family: dashicons;
  order: 2;
  margin-left: var(--wp--preset--spacing--20, 4.5px);
}

/* Don't underline dashicons links */
.dashicons a {
  text-decoration: none;
}

/* Nav menus already have transitions so don't add another one on
 * dashicons
 */
.wp-block-navigation .dashicons {
  transition: none;
  text-align: inherit;
}

/* Don't display the top-level icon on the drop-down menu */
.wp-block-navigation__submenu-container.dashicons:before {
  content: none;
}

/*-----------------------------------------------------------------------------
# Dashicons: Custom
-----------------------------------------------------------------------------*/
.is-style-no-icon:before {
  display: none;
}

/*------------------------------------------------------------------------------
# Margins (Vertical spacing)
------------------------------------------------------------------------------*/
/* 
 * Core Wordpress controls vertical spacing by adding the gap setting as top
 * margin between all blocks on the site. However, certain things like 
 * template parts get this too and we want the theme and users to be able to 
 * control it, so push this down to the block level.
 */
/* Remove top margin and padding from the containers */
header,
main,
footer,
.wp-block-template-part,
.wp-block-post-content {
  margin-block-start: 0 !important;
}

/* 
 * Add top margin to the container's first block and then between 
 * subsequent blocks 
 */
/*main > *:first-child:not(.wp-block-template-part, .wp-block-post-content, .wp-block-cover, .wp-block-query, header, footer, nav),
body .is-layout-constrained > * + .wp-block-template-part > *:first-child:not(.wp-block-template-part, .wp-block-post-content, .wp-block-cover, .wp-block-query, main, header, footer, nav),
body .is-layout-constrained .wp-block-template-part > * + *:not(.wp-block-template-part, .wp-block-post-content, .wp-block-cover, .wp-block-query, main, header, footer, nav),
.wp-block-query > *:first-child:not(.wp-block-cover),
.wp-block-post-content > *:first-child:not(.wp-block-cover) {*/
main > *:first-child:not(.wp-block-template-part):not(.wp-block-post-content):not(.wp-block-query),
.wp-block-query > *:first-child:not(.wp-block-cover),
.wp-block-post-content > *:first-child:not(.wp-block-cover) {
  margin-block-start: var(--wp--style--block-gap);
}

/* But don't add top or bottom margin to template part within a column. e.g. Footers. */
.wp-block-column > .wp-block-template-part > *:first-child {
  margin-block-start: 0;
  margin-block-end: 0;
}

/* Also add bottom margin on the last block for convenience */
.wp-block-query > *:last-child,
.wp-block-post-content > *:last-child {
  margin-block-end: var(--wp--style--block-gap);
}

/* But don't add bottom margin to a template part within a column. e.g. Footers. */
.wp-block-column > .wp-block-template-part > *:last-child {
  margin-block-end: 0;
}

/*-----------------------------------------------------------------------------
# Padding (Horizontal and vertical spacing)
-----------------------------------------------------------------------------*/
/* Remove padding from containers */
main.wp-block-group:not(.has-global-padding),
.wp-block-template-part {
  padding: 0;
}

/* FIX alignfull in WordPress.org theme preview */
.has-global-padding > #wporg-pattern-preview > div > .alignfull {
  margin-right: calc(var(--wp--style--root--padding-right) * -1);
  padding-right: var(--wp--style--root--padding-right);
  margin-left: calc(var(--wp--style--root--padding-left) * -1);
  padding-left: var(--wp--style--root--padding-left);
}

/*-----------------------------------------------------------------------------
# Flat Blocks Theme Compatibility with Prior Versions
-----------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------
# Flat Blocks Colors (for theme < v1.6)
-----------------------------------------------------------------------------*/
.has-foreground-color {
  color: var(--wp--preset--color--contrast);
}

.has-foreground-background-color {
  background-color: var(--wp--preset--color--contrast);
}

.has-foreground-border-color {
  border-color: var(--wp--preset--color--contrast);
}

.has-background-color {
  color: var(--wp--preset--color--base);
}

.has-background-background-color {
  background-color: var(--wp--preset--color--base);
}

.has-background-border-color {
  border-color: var(--wp--preset--color--base);
}

/*-----------------------------------------------------------------------------
# Flat Blocks Custom Styles (for theme < v1.6.4)
-----------------------------------------------------------------------------*/
.is-style-cover-rounded-corners {
  border-radius: var(--wp--custom--border--radius);
  overflow: hidden;
}

.is-style-cover-border,
.is-style-media-text-border {
  border: 1px solid var(--wp--custom--color--border);
  border-radius: var(--wp--custom--border--radius);
  padding: var(--wp--preset--spacing--40);
}

/*-----------------------------------------------------------------------------
# Flat Blocks Colors and Custom Styles (for theme < v1.6.6)
-----------------------------------------------------------------------------*/
/* Default group padding, but remove it on nested groups */
:where(.wp-block-group:not(main):not(.is-style-no-padding)) {
  padding-top: var(--wp--style--block-gap);
  padding-bottom: var(--wp--style--block-gap);
}

.wp-block-group > .wp-block-group:not(.has-background):not(.is-style-rounded-corners):not(.is-style-rounded-border):not(.is-style-thick-rounded-border) {
  padding: 0;
}

/*-----------------------------------------------------------------------------
# Color compatibility with other themes
-----------------------------------------------------------------------------*/
/* 
 * TwentyTwentyFour theme uses base and contrast in numbered 
 * shades. It also uses accent colors in numbered shades instead 
 * of primary, secondary, and tertiary.
 *
 * Note: TwentyTwentyThree theme uses the same base, contrast, 
 * primary, secondary, and tertiary colors as Flat Blocks.
 */
.has-base-2-color,
.has-base-3-color {
  color: var(--wp--preset--color--foreground-alt);
}

.has-base-2-background-color,
.has-base-3-background-color {
  background-color: var(--wp--preset--color--light-gray);
}

.has-base-2-border-color,
.has-base-3-border-color {
  border-color: var(--wp--preset--color--gray);
}

.has-contrast-2-color,
.has-contrast-3-color {
  color: var(--wp--preset--color--contrast);
}

.has-contrast-2-background-color,
.has-contrast-3-background-color {
  background-color: var(--wp--preset--color--contrast);
}

.has-contrast-2-border-color,
.has-contrast-3-border-color {
  border-color: var(--wp--preset--color--contrast);
}

.has-accent-color,
.has-accent-2-color,
.has-accent-3-color,
.has-accent-4-color,
.has-accent-5-color {
  color: var(--wp--preset--color--primary);
}

.has-accent-background-color,
.has-accent-2-background-color,
.has-accent-3-background-color,
.has-accent-4-background-color,
.has-accent-5-background-color {
  background-color: var(--wp--preset--color--primary);
}

.has-accent-border-color,
.has-accent-2-border-color,
.has-accent-3-border-color,
.has-accent-4-border-color,
.has-accent-5-border-color {
  border-color: var(--wp--preset--color--primary);
}