/** 
 * Theme Name: Mostholyeucharist
 * Author: Central States Marketing
 * Author URI: https://www.centralstatesmarketing.com/
 * Description: This site was built by Central States Marketing. For more information about the site or this custom WordPress theme, you can contact Central States Marketing at: info@csm.marketing or call us at: 309-693-2345.
 * Version: 1.0.0
 *
 * @package most-holy-eucharist
 * @charset "UTF-8"
 */



/* ----- CSS CUSTOM PROPERTIES ----- */
:root {
	--primary-base: 32.7% 0.1189 23.45;
	--secondary-base: 22.27% 0.0804 15.74;
	--tertiary-base: 64.73% 0.117 69.12;
	--tertiary-dark-base: 54.73% 0.117 69.12;
	--tan-base-color: 0.0315 61.97;
	--tan-base-light: 59.19%;
	--tan-base-dark: 49.19%;
	--white-base: 100% 0 0;
	--black-base: 0% 0 0;

	--primary: oklch(var(--primary-base));
	--secondary: oklch(var(--secondary-base));
	--tertiary: oklch(var(--tertiary-base));
	--tertiary-dark: oklch(var(--tertiary-dark-base));
	--tan: oklch(var(--tan-base-light) var(--tan-base-color));
	--white: oklch(var(--white-base));
	--white-hover: oklch(var(--white-base) / 75%);
	--black: oklch(var(--black-base));

	--shadow-color: oklch(var(--black-base) / 0.25);
	--shadow-color-hover: oklch(var(--black-base) / 0.4);

	--shadow: 0 0 10px var(--shadow-color);
	--shadow-hover: 0 0 10px var(--shadow-color-hover);

	--blur: blur(0.25rem);

	--gutter: 3rem;
	--page-max-width: 104rem;
	--max-w-text: 50rem;
	--row-spacing: 6rem;

	--ff-heading: 'aboreto', sans-serif;
	--ff-body: 'poppins', sans-serif;

	--fs-sm: clamp(0.73rem, 0.11vi + 0.7rem, 0.8rem);
	--fs-base: clamp(0.88rem, 0.29vi + 0.8rem, 1.06rem);
	--fs-md: clamp(1rem, 0.45vi + 0.81rem, 1.2rem);
	--fs-lg: clamp(1.12rem, 0.60vi + 0.82rem, 1.56rem);
	--fs-xl: clamp(1.20rem, 0.76vi + 0.96rem, 1.86rem);
	--fs-2xl: clamp(1.36rem, 0.95vi + 1.02rem, 2.2rem);
	--fs-3xl: clamp(1.81rem, 2.32vi + 1.23rem, 3.32rem);

	--header-height: 9.375rem;
	--admin-bar-height: 32px;

	--in: all 0.2s ease-in;
	--out: all 0.15s ease-out;
}
@media (width <= 1024px) {
	:root {
		--gutter: 2rem;
		--header-height: 5.625rem;
	}
}
@media (width <= 782px) {
	:root {
		--admin-bar-height: 46px;
	}
}



/* ----- RESET ----- */
*,
*::before,
*::after {
	box-sizing: inherit;
}
html {
	box-sizing: border-box;
	line-height: 1.5;
	-webkit-text-size-adjust: 100%;
}
body {
	margin: 0;
	font-family: var(--ff-body);
	font-size: var(--fs-base);
}
html, body {
	overflow-x: clip;
	scroll-behavior: smooth;
}
[id] {
	scroll-margin-top: calc(var(--admin-bar-height) + var(--header-height) + 2rem);
}
body.no-scroll {
	overflow-y: hidden;
	height: 100vh;
}
button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-size: 100%;
	line-height: 1.15;
	margin: 0;
}
b,
strong {
	font-weight: bolder;
}
embed,
iframe,
object {
	max-width: 100%;
}
img {
	height: auto;
	max-width: 100%;
}
.wp-block-embed {
	margin: 0;
}
.wp-block-embed iframe {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
}
@media (prefers-reduced-motion: reduce) {
	html:focus-within {
		scroll-behavior: auto;
	}
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}



/* ----- TEMPLATE SPECIFIC ----- */
.post-edit-link a {
	display: block;
    width: fit-content;
    color: var(--white);
    text-transform: uppercase;
    background: var(--tertiary);
    text-decoration: none;
    max-width: var(--page-max-width);
    margin: 2rem auto;
	padding: 0.5rem var(--gutter) 0.3rem var(--gutter);
    transition: var(--in);
	&:hover {
		color: var(--white);
		background-color: var(--primary);
		transition: var(--out);
	}
}



/* ----- GLOBALS ----- */
:where(h1, h2, h3, h4, h5, h6) {
	--heading-color: var(--secondary);
	color: var(--heading-color);
	font-family: var(--ff-heading);
	font-weight: 400;
	line-height: 1;
	margin-block: 1rem;
	position: relative;
}
h1 {
	font-size: var(--fs-3xl);
	margin-block: 0.67em;
}
h2 {
	font-size: var(--fs-2xl);
}
h3 {
	font-size: var(--fs-xl);
}
h4 {
	font-size: var(--fs-lg);
	font-family: var(--ff-body);
    font-weight: 700;
}
h5 {
	font-size: var(--fs-md);
	font-family: var(--ff-body);
    font-weight: 700;
	color: var(--primary);
}
h6 {
	font-size: var(--fs-base);
	font-family: var(--ff-body);
    font-weight: 700;
	color: var(--primary);
}
hr {
	width: 100%;
	height: 2px;
	border: none;
	margin: 2em 0;
	background-color: var(--gray-25);
}
svg {
	fill: currentColor;
}
a:has(svg) {
	display: flex;
}
a:not(.btn) {
	color: var(--primary);
	text-decoration: none;
	transition: var(--in);
}
a:not(.btn):hover {
	color: var(--tertiary);
	transition: var(--out);
}



/* ----- UTILS ----- */
.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
.wrapper-max {
	max-width: var(--max-w-max);
	margin-inline: auto;
}
.wrapper-content {
	max-width: var(--max-w-content);
	margin-inline: auto;
	padding-inline: var(--gutter);
}
.wrapper-text {
	max-width: var(--max-w-text);
	margin-inline: auto;
}
.fs-sm {
	font-size: var(--fs-sm) !important;
}
.fs-base {
	font-size: var(--fs-base) !important;
}
.fs-md {
	font-size: var(--fs-md) !important;
}
.fs-lg {
	font-size: var(--fs-lg) !important;
}
.fs-xl {
	font-size: var(--fs-xl) !important;
}
.fs-2xl {
	font-size: var(--fs-2xl) !important;
}
.fs-3xl {
	font-size: var(--fs-3xl) !important;
}
@media (width > 1024px) {
	.desktop-only {
		display: inherit!important;
	}
	.mobile-only {
		display: none!important;
	}
}
@media (width <= 1024px) {
	.desktop-only {
		display: none!important;
	}
	.mobile-only {
		display: inherit!important;
	}
}



/* ----- BUTTONS ----- */
.entry-content .wp-block-kadence-advancedbtn {
	margin-top: 1rem;
	gap: 2rem!important;
}
.btn,
.wp-block-kadence-advancedbtn .kb-button.button, 
input[type="submit"] {
	font-size: var(--fs-md);
	text-decoration: none;
	text-align: center;
	color: var(--white);
	padding: 1rem 3.5rem 0.8rem 3.5rem;
	border-radius: 0!important;
	height: fit-content;
	width: fit-content;
    cursor: pointer;
    display: inline-block;
    transition: var(--in);
}
.btn.wide,
.wp-block-kadence-advancedbtn .kb-button.wide {
	padding-right: 7rem;
	padding-left: 7rem;
} 
.btn.shadow,
.wp-block-kadence-advancedbtn .kb-button.shadow {
	filter: drop-shadow(0 0.2rem 0.1rem rgba(0, 0, 0, 0.25));
}
.btn.move,
.wp-block-kadence-advancedbtn .kb-button.move {
	transform: translateY(0);
}
.btn:hover, 
.wp-block-kadence-advancedbtn .kb-button:hover, 
input[type="submit"]:hover {
	transition: var(--out);
}
.btn.shadow:hover,
.wp-block-kadence-advancedbtn .kb-button.shadow:hover {
	filter: drop-shadow(0 0.4rem 0.15rem rgba(0, 0, 0, 0.2));
}
.btn.move:hover,
.wp-block-kadence-advancedbtn .kb-button.move:hover {
	transform: translateY(-0.2rem);
}
.btn.primary, 
.wp-block-kadence-advancedbtn .kb-button.primary, 
input[type="submit"] {
	background: var(--primary);
}
.btn.primary:hover, 
.wp-block-kadence-advancedbtn .kb-button.primary:hover, 
input[type="submit"]:hover {
	background: var(--tertiary-dark);
}
.btn.secondary, 
.wp-block-kadence-advancedbtn .kb-button.secondary {
	background: var(--secondary);
}
.btn.secondary:hover, 
.wp-block-kadence-advancedbtn .kb-button.secondary:hover {
	background: var(--tertiary-dark);
}
.btn.tertiary, 
.wp-block-kadence-advancedbtn .kb-button.tertiary {
	background: var(--tertiary);
}
.btn.tertiary:hover, 
.wp-block-kadence-advancedbtn .kb-button.tertiary:hover {
	background: var(--tertiary-dark);
}
.wp-block-kadence-advancedbtn .kb-button .kb-svg-icon-wrap {
	vertical-align: middle;
	margin-right: 0.5rem;
}
input[type="submit"] {
	border: none;
	margin-top: 0; 
}
.btn-row {
	display: flex;
	gap: 1.5rem; 
}



/* ------ NAVIGATION ----- */
.site-header {
	position: fixed;
	top: 0;
	z-index: 100;
	padding-inline: var(--gutter);
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: var(--header-height);
	width: 100vw;
	background: oklch(var(--secondary-base) / 0%);
	transition: var(--in);
}
.site-header.is-locked {
	box-shadow: 0 0 1rem rgba(0, 0, 0, 0.5);
	background: var(--secondary);
	transition: var(--out);
}
body:not(.home) .site-header {
	background: var(--secondary);
}
:root {
	--logo-margin: 1rem;
}
.site-logo {
	margin-block: var(--logo-margin);
}
.site-logo img {
	height: 100%;
	width: 100%;
}
.main-navigation {
	display: flex;
	justify-self: end;
}
.main-navigation .menu-toggle, 
.main-navigation .search-toggle {
	padding: 0;
    border: none;
    background: none;
	cursor: pointer;
	line-height: 0;
	opacity: 1;
	transition: var(--in);
}
.main-navigation .menu-toggle:hover, 
.main-navigation .search-toggle:hover {
	opacity: 0.6;
	transition: var(--out);
}
.main-navigation .menu {
	display: flex;
	align-items: flex-end;
	gap: 3rem;
}
:where(.menu, .menu ul, .sub-menu) {
	margin: 0;
	padding: 0;
	list-style: none;
}
.main-navigation .sub-menu {
	position: absolute;
	align-items: center;
}
.main-navigation .sub-menu .menu-item {
	width: 100%;
	padding: 0;
}
.main-navigation .menu-item:has(.sub-menu):hover .sub-menu {
	display: flex;
	flex-direction: column;
}
.site-branding {
	display: block;
	height: 100%;
	transition: var(--in);
}
.site-logo {
	display: block;
	height: calc(100% - var(--logo-margin) * 2);
	transition: var(--in);
}
@media (width > 1760px) {
	.menu-toggle {
		display: none;
	}
}
@media (width <= 1760px) {
	.menu-toggle {
		display: block;
	}
	.main-navigation .menu-main-menu-container {
		display: none;
	}
	.menu-toggle img {
		height: 2rem;
		width: 3rem;
	}
}
@media (width <= 1024px) {
	.menu-toggle img {
		height: inherit;
		width: inherit;
	}
}

/* MENU ITEM STYLING */
.menu-item {
	position: relative;
}
.menu-item a {
	color: var(--white);
	text-decoration: none;
	position: relative;
	padding: 0.75rem 0;
	transition: var(--in);
}
.menu-item a:hover {
	transition: var(--out);
}
.main-navigation #primary-menu > .menu-item:last-of-type > a {
	padding: 0.75rem 2.75rem;
	background: var(--tertiary);
}
.main-navigation #primary-menu > .menu-item:last-of-type > a:hover {
	color: var(--white);
	background: var(--tertiary-dark);
}
.main-navigation #primary-menu > .current-menu-item > a {
	color: var(--tertiary);
}
.main-navigation #primary-menu > .current-menu-item > a:hover {
	color: var(--white);
}
.main-navigation #primary-menu > .menu-item:last-of-type.current-menu-item > a {
	color: var(--white);
}
.main-navigation .menu-item-has-children > a:before {
	content: '+';
	display: inline-block;
	margin-right: 0.25rem;
}
.main-navigation #primary-menu > .menu-item > a:after {
	content: url('/wp-content/themes/Most Holy Eucharist/images/holy-glow.svg');
	display: block;
	height: 1.75rem;
    width: 2.25rem;
	position: absolute;
	bottom: 1.85rem;
    left: 50%;
    transform: translateX(-50%);
	-webkit-mask: radial-gradient(circle at bottom center, rgba(0, 0, 0, 0) 1%, rgba(0, 0, 0, 1) 2%) 
    	content-box 50% / var(--_s, 0% 0%) no-repeat;
	mask-position: bottom center;
	opacity: 0;
	transition: var(--in);
}
.main-navigation #primary-menu > .menu-item:hover > a:after {
	--_s: 100% 100%;
	opacity: 1;
	transition: var(--out);
}
.main-navigation #primary-menu > .menu-item:last-of-type > a:after {
	display: none;
}
.site-header .menu > .menu-item .sub-menu .menu-item a {
	display: block;
	padding: 0.75rem 1.5rem;
}
.site-header .menu > .menu-item, 
.site-header .menu > .menu-item > .sub-menu > .menu-item {
	position: relative;
}
.site-header .menu > .menu-item > .sub-menu {
	opacity: 0;
	visibility: hidden;
	background: var(--white);
	box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.3);
	align-items: flex-start;
	position: absolute;
	top: calc(100% + 0.45rem);
	z-index: 2;
	width: max-content;
	transform: translateY(-1rem);
	transition: var(--in);
}
.site-header .menu > .menu-item > .sub-menu a {
	color: var(--primary);
}
.site-header .menu > .menu-item > .sub-menu a:hover {
	background: var(--tertiary);
	color: var(--white);
}
.site-header .menu > .menu-item:hover > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
	transition: var(--out);
}
.site-header .menu > .menu-item > .sub-menu > .menu-item > .sub-menu {
	opacity: 0;
	visibility: hidden;
	background: var(--white);
	box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.3);
	position: absolute;
	left: 100%;
	top: 0;
	width: max-content;
	transform: translateX(-1rem);
	transition: var(--in);
}
.site-header .menu > .menu-item > .sub-menu > .menu-item:hover > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateX(0);
	transition: var(--out);
}



/* ----- ADMIN BAR FIXES ----- */
#wpadminbar {
	position: fixed!important;
}
body.admin-bar.no-scroll {
	height: calc(100vh - var(--admin-bar-height));
}
.admin-bar .site-header,
.admin-bar .drawer {
	top: var(--admin-bar-height);
}
.admin-bar .hero .metaslider .flex-viewport,
.admin-bar .hero .metaslider .slides,
.admin-bar .hero .metaslider .slides li,
.admin-bar .hero .metaslider .flexslider img {
	height: calc(100vh -  var(--admin-bar-height));
	max-height: calc(100vh - var(--admin-bar-height));
}
@media (width <= 781px) {
	body.admin-bar.no-scroll {
		height: calc(100vh - var(--admin-bar-height));
	}
	.admin-bar .site-header,
	.admin-bar .drawer {
		top: var(--admin-bar-height);
	}
	.admin-bar .hero .metaslider .flex-viewport,
	.admin-bar .hero .metaslider .slides,
	.admin-bar .hero .metaslider .slides li,
	.admin-bar .hero .metaslider .flexslider img {
		height: calc(100vh -  var(--admin-bar-height));
		max-height: calc(100vh - var(--admin-bar-height));
	}	
}



/* ----- DRAWER ----- */
.drawer {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	width: min(100%, 40rem);
	height: 100vh;
	background: linear-gradient(45deg, var(--secondary) 0%, oklch(var(--secondary-base) / 85%) 100%);
	z-index: 100000;
	transform: translateX(100%);
	backdrop-filter: var(--blur);
	box-shadow: rgba(0, 0, 0, 0) 0 0 0;
	transition: var(--in);
}
.drawer.is-open {
	transform: translateX(0px);
	box-shadow: rgba(0, 0, 0, 0.45) -0.5rem 0.8rem 1.2rem;
	transition: var(--out);
}
.drawer-wrapper {
	display: flex;
	flex-direction: column;
	align-items: end;
	justify-content: space-between;
	height: 100%;
	padding: 3.75rem var(--gutter) 4rem;
}
.drawer .drawer__menu-toggle {
	fill: var(--white);
	cursor: pointer;
	width: 3rem;
    height: 2rem;
}
.drawer-navigation {
	width: 100%;
	height: 100%;
	overflow-y: auto;
}
.drawer .menu-main-menu-container {
	height: 100%;
}
.drawer .menu {
	display: flex;
	flex-direction: column;
	height: 100%;
}
.drawer .menu-item a {
	display: block;
	font-size: var(--fs-md);
	padding-block: 1rem;
}
.drawer .menu-item-has-children > a:before {
	display: none;
}
.drawer .sub-menu .menu-item a {
	padding-block: 0.5rem;
}
.drawer .sub-menu {
    padding-left: 1rem;
    margin-left: 1rem;
    position: relative;
}
.drawer .menu-item-has-children .sub-menu:before {
    content: '';
    display: block;
    background: linear-gradient(to right, var(--white) 0%, transparent 75%);
    height: 100%;
    width: 0.75rem;
    position: absolute;
    top: 0;
    left: -1rem;
    -webkit-mask-image: radial-gradient(black 50%, transparent 72%);
    mask-image: radial-gradient(black 50%, transparent 72%);
    -webkit-mask-position: left center;
    mask-position: right center;
    -webkit-mask-size: 200% 100%;
    mask-size: 200% 100%;
    opacity: 0.25;
}
.drawer .sub-menu .menu-item a {
	font-size: var(--fs-md);
}
@media (width <= 1024px) {
	.drawer-wrapper {
		padding: 2rem var(--gutter) 0;
	}
	.drawer .drawer__menu-toggle {
		width: 28px;
		height: 28px;
	}
}



/* ----- CONTENT ----- */
.content .page > .entry-footer,
.content .post > .entry-footer{
	display: none;
}
.content .entry-content > .wp-block-kadence-rowlayout > .kt-row-column-wrap {
	padding-inline: var(--gutter);
	max-width: var(--page-max-width);
	margin: 0 auto;
}
.content .entry-content .full-width > .kt-row-column-wrap {
	max-width: 100%;
}
.content span.post-edit-link {
	display: block;
}
.content .balance {
	text-wrap: balance;
}
.content .row {
	display: grid;
	padding-top: var(--row-spacing);
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 2rem;
}
.content .row.no-btm-padding {
	padding-bottom: 0;
}
.content > section > .row:last-of-type {
	padding-bottom: var(--row-spacing);
}
.content .row .row-inner {
	width: 100%;
	max-width: var(--page-max-width);
	padding-inline: var(--gutter);
	justify-self: center;
	display: grid;
	grid-template-columns: 1fr;
	grid-gap: 2rem;
	position: relative;
}
.content .row .center-v-align {
	align-self: center;
}
.content .row .two-col {
	grid-template-columns: 1fr 1fr;
}
.content .row .three-col {
	grid-template-columns: 1fr 1fr 1fr;
}
.content .row .four-col {
	grid-template-columns: 1fr 1fr 1fr 1fr;
}
.content .row .five-col {
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}
.content .row .six-col {
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
}
.content .row .seven-col {
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
}
.content .row .eight-col {
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
}
@media (width <= 1350px) {
	.content .row .two-col {
		grid-template-columns: 1fr!important;
	}
	.content .row .four-col {
		grid-template-columns: 1fr 1fr!important;
	}
	.content .row .six-col {
		grid-template-columns: 1fr 1fr 1fr!important;
	}
	.content .row .eight-col {
		grid-template-columns: 1fr 1fr 1fr 1fr!important;
	}
}
@media (width <= 1024px) {
	.content .row .row-inner,
	.content .kb-row-layout-wrap .kt-row-column-wrap {
		grid-template-columns: 1fr!important;
	}
	.content .kb-row-layout-wrap.keep-cols .kt-has-2-columns {
		grid-template-columns: repeat(2, minmax(0, 1fr))!important;
	}
}
@media (width <= 782px) {
	.content .kb-row-layout-wrap.keep-cols .kt-has-2-columns {
		grid-template-columns: 1fr!important;
	}
}



/* ----- HERO ----- */
.hero {
	position: relative;
}
.hero .metaslider .flex-viewport,
.hero .metaslider .slides,
.hero .metaslider .slides li,
.hero .metaslider .flexslider img {
	height: 100vh;
	min-height: 675px;
	max-height: 100vh;
}
.hero .metaslider .slides li {
	position: relative;
	background-color: var(--secondary)!important;
}
.hero .metaslider .flexslider {
	margin-bottom: 0;
}
.hero .metaslider .flexslider img {
	position: relative;
	width: 100%;
	object-fit: cover;
	object-position: center center;
	align-self: center;
}
.hero .metaslider .caption-wrap {
	background: none!important;
	opacity: 1!important;
	height: 100%;
	padding-inline: var(--gutter);
	position: absolute;
	left: 50%;
    transform: translateX(-50%);
	display: flex;
	align-items: center;
	justify-content: left;
}
.hero .metaslider .slides .caption-wrap:before {
	content: '';
	display: block;
	height: 100%;
	width: 50%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	background: linear-gradient(to right, rgba(0, 0, 0, 0.40) 10%, transparent 65%);
}
.hero .metaslider .slides .caption-wrap:after {
	content: '';
	display: block;
	height: 100%;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	background: linear-gradient(to bottom, var(--secondary) 10%, transparent 65%);
	opacity: 0.85;
	mix-blend-mode: multiply;
}
.hero .metaslider .caption {
	padding: 0;
	position: relative;
	width: calc(var(--page-max-width) - var(--gutter) * 2);
	margin: 0 auto;
}
.hero .metaslider .caption h2 {
	color: var(--white);
	padding-left: 1.5rem;
	position: relative;
    z-index: 2;
}
.hero .metaslider .caption-bg {
	background: var(--white);
	padding: 1.5rem;
	max-width: 31rem;
	position: relative;
	z-index: 3;
	box-shadow: rgba(0, 0, 0, 0.45) 0.5rem 0.8rem 1.2rem;
}
.hero .metaslider .caption-bg p {
	color: var(--secondary);
	margin: 1rem 0 2rem 0!important;
}
.hero .metaslider .caption:before,
.hero .metaslider .caption:after,
.hero .metaslider .caption-bg:before,
.hero .metaslider .caption-bg:after {
	content: '';
	display: block;
	position: absolute;
	z-index: 2;
}
.hero .metaslider .caption:before,
.hero .metaslider .caption:after {
	width: 0.4rem;
}
.hero .metaslider .caption:before {
	height: calc(50vh - 50% + var(--fs-lg) - var(--header-height) + 2rem);
	background: linear-gradient(to top, var(--tertiary) 0%, transparent 100%);
	top: calc((50vh - 50%) * -1 + var(--fs-lg) + var(--header-height));
	left: 0;
}
.hero .metaslider .caption:after {
	height: calc(50vh - 50%);
	background: linear-gradient(to bottom, var(--tertiary) 0%, transparent 100%);
	bottom: calc((50vh - 50%)* -1);
	left: 0;
}
.hero .metaslider .caption-bg:before,
.hero .metaslider .caption-bg:after {
	height: 0.4rem;
}
.hero .metaslider .caption-bg:before {
	width: calc((100vw - var(--page-max-width)) / 2 + var(--gutter));
	background: linear-gradient(to left, var(--tertiary) 0%, transparent 100%);
	top: 0;
	left: calc((100vw - var(--page-max-width)) / 2* -1 - var(--gutter));
}
.hero .metaslider .caption-bg:after {
	/* var(--page-max-width) - 100%  ===  space left on right */
	/* (100vw - var(--page-max-width)) / 2  ===  single side margin */
	width: calc(
		(
			var(--page-max-width) - 100%
		)
		+
		(
			(
				100vw - var(--page-max-width)
			) 
			/
			2
		)  
	);
	background: linear-gradient(to right, var(--tertiary) 0%, transparent 100%);
	top: 0;
	/* (var(--page-max-width) - 100%)  * -1  ===  space left on right, inversed */
	/* ( (100vw - var(--page-max-width)) / 2 ) * -1)  ===  single side margin, inversed */
	right: calc(
		( 
			(
				var(--page-max-width) - 100%
			)
			+  
			(
				(
					(
						100vw - var(--page-max-width)
					)
					/
					2
				) 
			)
		) 
		*
		-1
	);
}
.hero .metaslider .flex-control-nav {
	bottom: 20px;
}
.hero .metaslider .flex-control-nav li a {
	border-radius: 0;
	border: 2px solid var(--white);
	background: oklch(var(--white-base) / 25%)!important;
	transform: rotate(45deg);
	transition: var(--in);
}
.hero .metaslider .flex-control-nav li a.flex-active {
	background: var(--white)!important;
	transition: var(--out);
}
@media (width <= 1664px) {
	.hero .metaslider .caption-bg:before {
		width: var(--gutter);
		left: calc(var(--gutter) * -1);
	}
	.hero .metaslider .caption-bg:after {
		width: calc(100vw - 100% - var(--gutter));
		background: linear-gradient(to right, var(--tertiary) 0%, transparent 100%);
		top: 0;
		right: calc(
			(
			100vw - 100%
			- 
			var(--gutter)
			) 
			*
			-1
		);
	}
}
@media (height <= 675px) {
	.hero .metaslider .caption:before {
		top: -0.5rem;
        height: 5rem;
	}
}
.hero .mass-times-overlay {
	position: absolute;
	bottom: var(--gutter);
	right: var(--gutter);
}
.hero .mass-times-link {
	height: 10rem;
	width: 10rem;
	padding: 1rem;
	border: solid 2px var(--white);
	background: rgba(0,0,0,0.5);
	backdrop-filter: var(--blur);
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-content: center;
    flex-wrap: wrap;
	gap: 0.5rem;
	color: var(--white);
	text-align: center;
	text-decoration: none;
	transform: scale(100%);
	transition: var(--in);
}
.hero .mass-times-link:hover {
	background: rgba(0,0,0,0.75);
	transform: scale(105%);
	transition: var(--out);
}
.hero .mass-times-link img {
	width: 3rem;
	margin: 0 auto;
}




/* ----- FRONT PAGE ----- */

/* Intro */
.intro .row {
	padding: 0;
	overflow: hidden;
}
.intro .row .row-inner {
	display: grid;
	grid-template-columns: 1fr 0.66fr;
	gap: 0;
}
.intro .column-welcome-text {
	display: flex;
	justify-content: right;
	margin-left: calc(var(--gutter)* -1);
}
.intro .welcome-text {
	display: flex;
	flex-direction: column;
	gap: 2rem;
	padding: 5rem 8rem 5rem var(--gutter);
}
.intro .column-jesus-quote {
	padding-right: var(--gutter);
	margin-right: -100vw;
	background: oklch(var(--tan-base-dark) var(--tan-base-color) / 100%);
}
.intro .jesus-quote {
	height: 100%;
	padding: 5rem 3rem;
	background: linear-gradient(to right, oklch(var(--tan-base-light) var(--tan-base-color) / 100%) 0%, oklch(var(--tan-base-dark) var(--tan-base-color) / 100%) 100%);
	width: calc(var(--page-max-width)* 0.4);
	position: relative;
}
.intro .jesus-quote:before {
	content: '';
	display: block;
	height: 120%;
	width: 100vw;
	position: absolute;
	bottom: 0;
	left: 0;
	pointer-events: none;
	box-shadow: 0 0 1rem rgba(0,0,0,0.5) inset;
}
.intro .jesus-quote:after {
	content: '';
	display: block;
	height: 100%;
	width: 100vw;
	position: absolute;
	z-index: 1;
	top: 0;
	left: 45%;
	background: url('/wp-content/themes/Most Holy Eucharist/images/jesus-no-bg.png');
	background-repeat: no-repeat;
	background-size: contain;
	background-position: bottom left;
}
.intro .jesus-quote .text {
	width: max(calc(100% * 0.4* 0.55), 22rem);
	color: var(--white);
}
.intro .jesus-quote .text .quote {
	font-family: var(--ff-heading);
    font-size: var(--fs-md);
}
@media (width <= 1780px) {
	.intro .column-jesus-quote {
		height: 44rem;
	}
	.intro .jesus-quote:after {
		width: 70%;
        left: 32%;
	}
	.intro .jesus-quote .text {
		width: 21rem;
	}
}
@media (width <= 1350px) {
	.intro .row .row-inner {
		grid-template-columns: 1fr;
	}
	.intro .welcome-text {
		padding: 5rem var(--gutter);
	}
	.intro .column-jesus-quote {
		margin-right: 0;
		height: 30rem;
	}
	.intro .jesus-quote:before {
		top: 0;
	}
	.intro .jesus-quote {
		width: 100vw;
		margin-left: calc(var(--gutter)* -1);
        margin-right: calc(var(--gutter)* -1);
	}
	.intro .jesus-quote:after {
		width: 70%;
        top: auto;
        bottom: 0;
        right: -10%;
        left: auto;
        background-size: contain;
        background-position: bottom right;
	}
	.intro .jesus-quote .text {
		width: 60%;
	}
}
@media (width <= 782px) {
	.intro .column-jesus-quote {
		height: 40rem;
	}
	.intro .jesus-quote {
		padding: 3rem var(--gutter);
	}
	.intro .jesus-quote .text {
		width: 100%;
	}
	.intro .jesus-quote:after {
        width: 120%;
        right: -33%;
        top: 34%;
        left: auto;
        bottom: auto;
        background-position: top left;
    }
}

/* Locations */
.content .church-locations .row .row-inner.two-col {
	grid-column-gap: 1rem;
    grid-row-gap: 5rem;
	align-items: stretch;
}
.church-locations .location {
	display: flex;
	flex-direction: column;
	flex: 1;
}
.church-locations .location .body {
	filter: drop-shadow(0 1rem 1rem rgba(0, 0, 0, 0.25));
	border-top: 1rem solid var(--tertiary);
	background: var(--white);
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}
.church-locations .location .body .location-btn {
	width: 100%;
	padding: 2rem 3.5rem 1.8rem 3.5rem;
	margin-top: auto;
	filter: none;
	transform: none;
	background: var(--secondary);
}
.church-locations .location .body .location-btn:hover {
	background: var(--primary);
}
.church-locations .location .info {
	padding: 4rem;
	display: grid;
	grid-template-columns: auto auto;
	grid-template-rows: auto 1fr;
	grid-column-gap: 8rem;
	grid-row-gap: 3rem;
}
.church-locations .info .mass,
.church-locations .info .confession,
.church-locations .info .eucharistic-adoration {
	height: 100%;
	display: flex;
	flex-direction: column;
	gap: 1rem;
}
.church-locations .info .mass {
	grid-column: 1;
	grid-row: span 2;
	position: relative;
}
.church-locations .mass:after {
	content: '';
    display: block;
    background: linear-gradient(to left, black 0%, transparent 75%);
    height: 95%;
    width: 0.75rem;
    position: absolute;
    top: 0;
    right: -4.375rem;
    -webkit-mask-image: radial-gradient(black 50%, transparent 72%);
    mask-image: radial-gradient(black 50%, transparent 72%);
    -webkit-mask-position: left center;
    mask-position: left center;
    -webkit-mask-size: 200% 100%;
    mask-size: 200% 100%;
    opacity: 0.25;
}
.church-locations .info .confession {
	grid-column: 2;
	grid-row: 1;
}
.church-locations .info .eucharistic-adoration {
	grid-column: 2;
	grid-row: 2;
}
.church-locations .info h4 {
	margin-bottom: 0;
}
.church-locations .info .date,
.date.shortcode {
	border-left: 0.33rem solid var(--primary);
    padding: 0.5rem 1rem;
}
.date.shortcode {
	margin-bottom: 1rem;
}
.date.shortcode:last-of-type {
	margin-bottom: 0;
}
.church-locations .info .mass .date:nth-of-type(odd),
.date.shortcode:nth-of-type(odd) {
	background: oklch(var(--primary-base) / 10%);
}
.church-locations .info .confession .date:nth-of-type(even) {
	background: oklch(var(--primary-base) / 10%);
}
.church-locations .info .eucharistic-adoration .date:nth-of-type(odd) {
	background: oklch(var(--primary-base) / 10%);
}
.church-locations .info .date:only-child,
.kt-inside-inner-col > .date.shortcode:only-child {
	background: none;
}
.church-locations .info .date p,
.date.shortcode p {
	margin: 0 0 0.5rem 0.5rem;
    line-height: var(--fs-base);
}
.church-locations .info .date p:last-of-type,
.date.shortcode p:last-of-type {
	margin-bottom: 0;
}
.church-locations .info .date h5,
.date.shortcode h5 {
	text-transform: uppercase;
	margin: 0 0 0.5rem 0;
}
@media (width <= 1350px) {
	.church-locations .location .info {
		padding: 2rem 3rem 3rem 3rem;
		grid-column-gap: 3rem;
	}
	.church-locations .mass:after {
		display: none;
	}
}
@media (width <= 1024px) {
	.content .church-locations .row .row-inner.two-col {
		padding-inline: 0;
	}
	.content .church-locations .location h3 {
		padding-inline: var(--gutter);
	}
	.church-locations .location .info {
		padding: 3rem var(--gutter) 4rem var(--gutter);
		grid-column-gap: var(--gutter);
	}
	.church-locations .info .date,
	.date.shortcode {
		padding: 0.5rem;
	}
	.church-locations .info .date p,
	.date.shortcode p {
		margin-left: 0;
	}
}

/* Important Links */
.important-links .row .row-inner {
	max-width: 100%;
	padding-inline: 0;
	gap: 0;
}
.important-links .link {
	display: block;
	height: 100%;
	width: 100%;
	position: relative;
	overflow: clip;
	text-decoration: none;
	display: flex;
	align-content: center;
	flex-wrap: wrap;
}
.important-links .link .outline {
	position: relative;
	top: 0;
	left: 0;
	z-index: 3;
	min-height: fit-content;
	height: 100%;
    width: 100%;
	padding: 15%;
	display: flex;
	align-content: center;
	justify-content: center;
	flex-wrap: wrap;
	transition: var(--in);
}
.important-links .link:hover .outline {
	padding: 10%;
	backdrop-filter: blur(0);
	transition: var(--out);
}
.important-links .link .outline h3 {
	position: relative;
	z-index: 3;
	color: var(--white);
	font-size: var(--fs-lg);
	font-family: var(--ff-body);
	text-align: center;
	line-height: 1.4;
	height: 100%;
	width: 100%;
	border: 2px solid var(--white);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	padding: 1rem 2rem;
	margin: 0;
	transition: var(--in);
}
.important-links .link .shade {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	height: 100%;
	width: 100%;
	mix-blend-mode: multiply;
	opacity: 0.6;
}
.important-links .link:nth-of-type(1) .shade,
.important-links .link:nth-of-type(2) .shade {
	background: var(--primary);
}
.important-links .link:nth-of-type(3) .shade,
.important-links .link:nth-of-type(4) .shade {
	background: var(--tertiary-dark);
}
.important-links .link .background {
	position: absolute;
	top: 0;
	z-index: 1;
	height: 100%;
	width: 100%;
	object-fit: cover;
	object-position: center center;
	filter: blur(0.25rem);
	transform: scale(1.05);
	transition: var(--in);
}
.important-links .link:nth-of-type(2) .background {
	object-position: center 30%!important;
}
.important-links .link:hover .background {
	filter: blur(0);
	transform: scale(1.1);
	transition: var(--out);
}
@media (width <= 1024px) {
	.important-links .row .row-inner {
		grid-template-columns: 1fr 1fr!important;
	}
	.important-links .link {
		overflow: visible;
		height: 50vw;
	}
	.important-links .link .outline,
	.important-links .link:hover .outline {
		padding: 2rem;
	}
	.important-links .link .background,
	.important-links .link:hover .background {
		filter: blur(0);
		transform: scale(1);
	}
}

/* Serve & Give */
.serve-give .row {
	padding: 0;
}
.serve-give .row .row-inner {
	max-width: 100%;
	padding-inline: 0;
	padding-block: 3rem;
	column-gap: 8rem;
}
.serve-give .row .row-inner > div {
	display: grid;
}
.serve-give .row .row-inner .serve {
	grid-template-columns: 1fr 1.5fr;
}
.serve-give .row .row-inner .give {
	grid-template-columns: 1.5fr 1fr;
}
.serve-give .image {
	opacity: 0.25;
	position: relative;
}
.serve-give .image img {
	height: 100%;
    width: 100%;
	position: absolute;
	object-fit: contain;
}
.serve-give .serve .image img {
	object-position: left center;
}
.serve-give .give .image img {
	object-position: right center;
}
.serve-give .text {
	margin-left: 3rem;
	display: flex;
	flex-direction: column;
	justify-self: center;
	gap: 2rem;
	max-width: 29rem;
	padding-block: 3rem;
	padding-inline: 2rem;
}
.serve-give .btn-row {
	flex-grow: 1;
	align-items: flex-end;
}
@media (width <= 1350px) {
	.serve-give .row .row-inner {
		row-gap: 4rem;
	}
	.serve-give .row .row-inner .serve,
	.serve-give .row .row-inner .give {
		grid-template-columns: 2.5fr 1fr;
	}
	.serve-give .text {
		max-width: 100%;
	}
	.serve-give .serve .image {
		order: 2;
	}
	.serve-give .serve .image img,
	.serve-give .give .image img {
		object-position: right center;
	}
	.serve-give .serve .image img {
		object-position: left center;
		transform: scale(-1, 1);
	}
}
@media (width <= 1024px) {
	.serve-give .row .row-inner {
		padding-inline: var(--gutter);
	}
	.serve-give .row .row-inner > div {
		display: flex;
	}
	.serve-give .row .row-inner .serve,
	.serve-give .row .row-inner .give {
		position: relative;
	}
	.serve-give .text {
		max-width: 100%;
		padding: 0;
		margin-left: 0;
		position: relative;
		z-index: 2;
		order: 1;
	}
	.serve-give .image {
		height: 100%;
        width: 100%;
		position: absolute;
		z-index: 1;
		left: var(--gutter);
        order: 2;
		opacity: 0.2;
	}
}



/* ----- FOOTER ----- */
.site-footer {
	background: linear-gradient(to bottom, oklch(var(--secondary-base) / 93%) 0%, oklch(var(--secondary-base) / 100%) 50%);
	padding: 4rem var(--gutter) 2rem var(--gutter);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	gap: 4rem;
	width: 100%;
}
.site-footer .top-site-info {
	display: flex;
	align-items: center;
    justify-content: space-between;
    width: 100%;
}
.site-footer .top-site-info .site-logo {
	height: 7.5rem;
	margin-block: 0;
}
.site-footer .site-search {
	height: fit-content;
	display: flex;
	justify-items: center;
}
.site-footer .site-search .searchbar {
	min-width: 20rem;
	padding: 0.5rem;
	border-top: 2px solid var(--white);
	border-right: none;
	border-bottom: 2px solid var(--white);
	border-left: 2px solid var(--white);
	background: none;
	color: var(--white);
}
.site-footer .site-search .submit {
	padding: 0.5rem;
	border: none;
    background: var(--tertiary);
	display: flex;
	justify-items: center;
	transition: var(--in);
	cursor: pointer;
}
.site-footer .site-search .submit:hover {
	background: var(--tertiary-dark);
	transition: var(--out);
}
.site-footer .site-search .submit .icon {
	height: 1.5rem;
}
.site-footer .bottom-site-info {
	display: flex;
	gap: 5rem;
	justify-content: space-between;
	width: 100%;
}
.site-footer .bottom-site-info > div {
	display: flex;
	gap: 5rem;
}
.site-footer .bottom-site-info .right {
	flex-direction: column;
	justify-content: flex-end;
	align-items: end;
	gap: var(--gutter);
}
.site-footer .footer-navigation .menu {
	padding-left: 2rem;
	text-align: left;
	display: flex;
	flex-direction: column;
	gap: 1rem;
}
.site-footer .footer-navigation .menu-item a {
	color: var(--white);
	text-decoration: underline;
	padding: 0;
}
.site-footer .footer-navigation .menu-item a:hover {
	color: var(--white-hover);
}
.site-footer .footer-navigation .sub-menu {
	display: none;
}
.site-footer .locations {
	display: flex;
	gap: 5rem;
}
.site-footer .locations .location {
	height: fit-content;
	border-left: 3px solid var(--tertiary);
	padding-left: 2rem;
	text-align: left;
	display: flex;
	flex-direction: column;
	gap: 2rem;
}
.site-footer .locations .location a {
	color: var(--white);
	text-decoration: none;
}
.site-footer .locations .location h2 {
	color: var(--white);
	margin: 0;
}
.site-footer .locations .location .contact {
	display: flex;
	gap: 1.5rem;
	align-items: center;
	opacity: 1;
	transition: var(--in);
}
.site-footer .locations .location .contact:hover {
	opacity: 0.75;
	transition: var(--out);
}
.site-footer .locations .location .address .street,
.site-footer .locations .location .address .state-zip {
	display: inline-block;
}
.footer-socials, .footer-socials .section {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: end;
	gap: 2rem;
}
.footer-socials .section {
	gap: 1rem;
}
.footer-socials p {
	display: block;
	width: 100%;
	margin: 0;
	text-align: right;
	color: var(--white);
	font-size: var(--fs-md);
}
.footer-socials .icons {
	display: flex;
	gap: 1rem;
}
.footer-socials .icons a {
	display: flex;
	align-items: center;
	color: var(--white);
	padding: 0.25rem;
	border: 2px solid var(--white);
	transition: var(--in);
}
.footer-socials .icons a:hover {
	opacity: 0.75;
	transition: var(--out);
}
.site-footer .btn {
	font-size: var(--ff-body);
}
.footer-copyright p {
	color: var(--white);
	font-size: var(--fs-sm);
	margin: 0;
}
.footer-copyright a {
	text-decoration: none;
	color: var(--white);
}
@media (width <= 1350px) {
	.site-footer .bottom-site-info {
		flex-direction: column;
	}
	.site-footer .bottom-site-info .left {
		justify-content: space-around;
	}
	.site-footer .bottom-site-info .right {
		align-items: center;
	}
	.footer-socials {
		align-items: center;
	}
}
@media (width <= 1024px) {
	.site-footer {
		gap: 3rem;
	}
	.site-footer .top-site-info {
		align-items: center;
		justify-content: center;
	}
	.site-footer .bottom-site-info {
		flex-direction: column;
		gap: 3rem;
	}
	.site-footer .bottom-site-info .left {
		justify-content: center;
		flex-direction: column;
        align-items: center;
		gap: 3rem;
	}
	.site-footer .locations {
		gap: 3rem;
	}
	.site-footer .locations .location {
		border-left: none;
		border-top: 3px solid var(--tertiary);
		padding-left: 0;
		padding-top: 1rem;
		gap: 1rem;
	}
	.site-footer .locations .location h2 {
		text-align: center;
	}
	.site-footer .locations .location .contact {
		gap: 0.5rem;
		justify-content: center;
	}
	.site-footer .footer-navigation .menu {
		padding-left: 0;
		text-align: center;
	}
	.site-footer .locations {
		flex-direction: column;
	}
	.site-footer .site-search {
		align-self: center;
	}
	.site-footer .footer-copyright {
		margin-top: 3rem;
	}
}



/* ----- INSIDE PAGES ----- */
.wp-block-kadence-image img {
	display: block;
}

/* Featured Image */
.site > .featured {
	height: 500px;
	width: 100%;
	position: relative;
	margin-top: var(--header-height);
}
.featured .featured-image {
	height: 100%;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
.featured .featured-image img {
	height: 100%;
	width: 100%;
	object-fit: cover;
	object-position: top center;
}
.featured .featured-title {
	height: 100%;
	width: 100%;
	position: relative;
	display: flex;
	align-items: center;
}
.featured .featured-title:before {
	content: '';
	display: block;
	height: 100%;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	mix-blend-mode: multiply;
	background: linear-gradient(to right, var(--primary) 0%, transparent 100%);
}
.featured .featured-title h1 {
	color: var(--white);
	width: var(--page-max-width);
	padding-inline: var(--gutter);
    margin: 0 auto;
}
/* Priest List */
.content .priest-list-container {
	position: relative;
	width: 100%;
}
.content .priest-list-container > .kt-inside-inner-col {
	max-width: calc(var(--page-max-width) - (var(--gutter) * 2));
	margin: 0 auto;
}
.content .priest-list-container:after {
	content: '';
	display: block;
	height: calc(100% - 1.75rem - (((var(--page-max-width) - 18rem) / 3) / 2));
	width: 100%;
	border: 2px solid var(--black);
	position: absolute;
	top: calc(((var(--page-max-width) - 18rem) / 3) / 2);
	left: 0;
}
.content .priest-list-container .priest-list .priest-item h3 {
	flex-grow: 1;
}
@media (width <= 1665px) {
	.content .priest-list-container > .kt-inside-inner-col {
		max-width: calc(100vw - (var(--gutter) * 4));
	}
	.content .priest-list-container:after {
		height: calc(100% + 0.25rem - ((100vw / 3) / 2));
		top: calc(((100vw - 12rem) / 3) / 2);
	}
}
@media (width <= 1024px) {
	.content .priest-list-container:after {
		height: calc(100% - 1.75rem - ((100vw / 3) / 2));
        top: calc(((100vw - 0rem) / 3) / 2);
	}
}

/* School List */
.content .school-list {
	width: 100vw;
    position: relative;
    left: calc(
		(
			(
				100vw - var(--page-max-width)
			)
			/
			-2
		)
		-
		(
			var(--gutter)
		)
	);
}
.content .school-list .school {
	height: 100%;
    width: 100%;
    position: relative;
    overflow: clip;
    display: flex;
    align-content: center;
    flex-wrap: wrap;
}
.content .school-list .school .kt-inside-inner-col {
	position: relative;
	inset: 0;
	height: 100%;
	width: 100%;
}
.content .school-list .school .outline {
    position: relative;
    top: 0;
    left: 0;
    z-index: 3;
    min-height: fit-content;
    height: 100%;
    width: 100%;
    padding: max(4rem, 10%) max(4rem, 15%);
    display: flex;
    align-content: center;
    justify-content: center;
    flex-wrap: wrap;
    transition: var(--in);
}
.content .school-list .school:hover .outline {
	padding: max(3rem, 7%) max(3rem, 12%);
    backdrop-filter: blur(0);
    transition: var(--out);
}
.content .school-list .school .outline > .kt-inside-inner-col {
	position: static;
}
.content .school-list h3 {
	position: relative;
    z-index: 3;
    color: var(--white);
    font-size: var(--fs-lg);
    font-family: var(--ff-body);
    text-align: center;
    line-height: 1.4;
    height: 100%;
    width: 100%;
    border: 2px solid var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    padding: 4rem;
    margin: 0;
    transition: var(--in);
}
.content .school-list .shade {
	position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    height: 100%;
    width: 100%;
    mix-blend-mode: multiply;
    opacity: 0.6;
}
.content .school-list .school:nth-of-type(1) .shade {
    background: var(--primary);
}
.content .school-list .school:nth-of-type(2) .shade {
    background: var(--tertiary-dark);
}
.content .school-list .school .background {
	position: absolute;
    top: 0;
	left: 0;
    z-index: 1;
    height: 100%;
    width: 100%;
	margin: 0;
    object-position: center center;
    transition: var(--in);
}
.content .school-list .school .background img {
	position: absolute;
    top: 0;
    z-index: 1;
    height: 100%;
    width: 100%;
	margin: 0;
    object-fit: cover;
    object-position: center center;
    filter: blur(0.25rem);
    transform: scale(1.05);
    transition: var(--in);
}
.content .school-list .school:hover .background img {
	filter: blur(0);
    transform: scale(1.1);
    transition: var(--out);
}
@media (width <= 1665px) {
	.content .school-list {
		left: calc( var(--gutter) * -1);
	}
}
@media (width <= 1024px) {
	.content .school-list .school {
		overflow: visible;
		height: 50vw;
	}
	.content .school-list.kb-row-layout-wrap .kt-row-column-wrap {
		grid-template-columns: 1fr 1fr!important;
	}
	.content .school-list .school,
	.content .school-list .school:hover {
		padding: 0;
	}
	.content .school-list .school .background img,
	.content .school-list .school:hover .background img {
		filter: blur(0);
		transform: scale(1);
	}
}

/* Newsletter */
.content .newsletter .kt-row-column-wrap .wp-block-kadence-column:nth-child(2) {
    margin: -3rem calc(var(--gutter) * -1) -3rem 0;
	position: relative;
}
.content .newsletter .kt-row-column-wrap .wp-block-kadence-column:nth-child(2):after {
	content: '';
	display: block;
	height: 100%;
	width: 100%;
	position: absolute;
	top: 0;
	left: -1px;
	background: linear-gradient(to right, var(--tan) 0%, transparent 100%);
}
/* Search Page */
body.search .site-search {
	height: fit-content;
	display: flex;
	justify-items: center;
}
body.search .no-results .site-search .searchbar {
	min-width: 20rem;
	padding: 0.5rem;
	border-top: 2px solid var(--primary);
	border-right: none;
	border-bottom: 2px solid var(--primary);
	border-left: 2px solid var(--primary);
	background: none;
	color: var(--primary);
}
body.search .no-results .site-search .submit {
	padding: 0.5rem;
	border: none;
    background: var(--tertiary);
	display: flex;
	justify-items: center;
	transition: var(--in);
	cursor: pointer;
}
body.search .no-results .site-search .submit:hover {
	background: var(--tertiary-dark);
	transition: var(--out);
}
body.search .no-results .site-search .submit .icon {
	height: 1.5rem;
}
body.search .content {
	width: var(--page-max-width);
	padding-inline: var(--gutter);
	padding-block: 6.5rem;
	margin: 0 auto;
}
body.search .content article {
	margin-bottom: 4rem;
}
body.search .content article:last-of-type {
	margin-bottom: 0;
}
body.search .content article a {
	text-decoration: none;
}
body.search .content article p {
	width: var(--max-w-text);
	margin-bottom: 0;
}



/* ----- GENERAL DESIGN ELEMENTS ----- */

/* Left Blur Border */
.content .left-blur-border {
    position: relative;
	width: fit-content;
}
.content .left-blur-border:before {
	content: '';
    display: block;
    background: linear-gradient(to left, black 0%, transparent 75%);
    height: 100%;
    width: 0.75rem;
    position: absolute;
    top: 0;
    left: -2.75rem;
    -webkit-mask-image: radial-gradient(black 50%, transparent 72%);
    mask-image: radial-gradient(black 50%, transparent 72%);
    -webkit-mask-position: left center;
    mask-position: left center;
    -webkit-mask-size: 200% 100%;
    mask-size: 200% 100%;
    opacity: 0.25;
}

/* Headline Cross */
.content h2:before {
	content: '';
    display: block;
    background: url('/wp-content/themes/Most Holy Eucharist/images/golden-cross.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    height: 4rem;
    width: 2rem;
    position: absolute;
    top: -1rem;
    left: -3rem;
}
.content h2.no-cross:before {
	display: none;
}
@media (width <= 1024px) {
	.content h2:before {
		top: -1.75rem;
		left: -2rem;
	}
	.content .left-blur-border:before {
		left: -1.75rem;
	}
}

/* Row Image Bleed */
.content .image-bleed-right {
	padding-left: calc((100vw - var(--page-max-width)) / 2);
}
.content .image-bleed-right > .kt-row-column-wrap {
	max-width: 100%!important;
	grid-template-columns: minmax(0, 800px) 1fr;
	gap: 4rem;
}
.content .image-bleed-right .text {
	align-items: flex-start;
}
.content .image-bleed-right .text .kt-inside-inner-col,
.content .image-bleed-left .text .kt-inside-inner-col {
	max-width: 700px;	
}
.content .parish-news .image-bleed-right .text {
	align-content: center;
}
.content .parish-news .image-bleed-right .text *:first-child {
	margin-top: 0!important;
}
.content .image-bleed-right .text > .kt-inside-inner-col {
	width: fit-content;
}
.content .image-bleed-left {
	padding-right: calc((100vw - var(--page-max-width)) / 2);
}
.content .image-bleed-left > .kt-row-column-wrap {
	max-width: 100%!important;
	grid-template-columns: 0.9fr minmax(0, 800px);
	gap: 4rem;
}
.content .image-bleed-left .text {
	align-items: flex-end;
	padding-left: 3rem;
}
.content .image-bleed-left .text > .kt-inside-inner-col {
	width: fit-content;
}
@media (width <= 1665px) {
	.content .image-bleed-right > .kt-row-column-wrap {
		grid-template-columns: minmax(0, 1.5fr) 1fr;
	}
	.content .image-bleed-left > .kt-row-column-wrap {
		grid-template-columns: 0.9fr minmax(0, 1.5fr);
	}
	.content .image-bleed-right,
	.content .image-bleed-left {
		padding-right: 0;
		padding-left: 0;
	}
}
@media (width <= 1024px) {
	.content .bg-offset-right:after {
		right: 0!important;
	}
	.content .image-bleed-right > .kt-row-column-wrap {
		grid-template-columns: minmax(0, 1.5fr) 1fr;
		padding-top: 4rem;
		gap: 3rem;
	}
	.content .bg-offset-left:after {
		left: 0!important;
	}
	.content .image-bleed-left > .kt-row-column-wrap {
		grid-template-columns: 0.9fr minmax(0,1.5fr);
		padding-top: 3rem;
		gap: 3rem;
	}
	.content .image-bleed-right > .kt-row-column-wrap
	.content .image-bleed-right .image,
	.content .image-bleed-left .image {
		order: 2;
	}
	.content .image-bleed-right .text,
	.content .image-bleed-left .text {
		align-items: flex-start;
		padding-inline: 0;
	}
}

/* Background Offset */
.content .bg-offset-left:after {
	content: '';
	display: block;
	height: 100%;
	width: 100vw;
	background: oklch(var(--primary-base) / 10%);
	position: absolute;
	top: 0;
	left: calc(var(--gutter) + 2rem);
}
.content .bg-offset-right:after {
	content: '';
	display: block;
	height: 100%;
	width: 100vw;
	background: oklch(var(--primary-base) / 10%);
	position: absolute;
	top: 0;
	right: calc(var(--gutter) + 2rem);
}

/* Drop Shadow */
.content .drop-shadow {
	filter: drop-shadow(0 1rem 1rem rgba(0, 0, 0, 0.25));
}

/* Sticky Elements */
.content .kb-section-is-sticky>.kt-inside-inner-col {
	top: calc(var(--admin-bar-height) + var(--header-height) + 2rem)!important;
}

/* Sticky Elements */
.content .kb-table tr td {
	vertical-align: top;
}

/* Quotes */
.content .quote {
	font-family: var(--ff-heading);
    font-size: var(--fs-md);
}



/* ----- 404 ERROR PAGE ----- */
body.error404 .content .quote {
	font-family: var(--ff-heading);
    font-size: var(--fs-md);
}
body.error404 .content .site-search {
    height: fit-content;
    display: flex;
    justify-items: center;
	margin-top: 2rem;
}
body.error404 .content .site-search .searchbar {
    min-width: 20rem;
    padding: 0.5rem;
    border-top: 2px solid var(--primary);
    border-right: none;
    border-bottom: 2px solid var(--primary);
    border-left: 2px solid var(--primary);
    background: none;
    color: var(--primary);
}
body.error404 .content .site-search .submit {
    padding: 0.5rem;
    border: none;
    background: var(--tertiary);
    display: flex;
    justify-items: center;
    transition: var(--in);
    cursor: pointer;
}
body.error404 .content .site-search .submit:hover {
    background: var(--tertiary-dark);
    transition: var(--out);
}
body.error404 .content .site-search .submit .icon {
    height: 1.5rem;
}



/* ----- PARISH NEWS ARCHIVE PAGE ----- */
.wp-block-kadence-postgrid .kt-post-grid-layout-grid-wrap .kt-blocks-post-grid-item .kt-blocks-above-categories {
	display: flex;
    gap: 0.5rem;
}
.wp-block-kadence-postgrid .kt-post-grid-layout-grid-wrap {
	margin-bottom: 3rem;
}
.wp-block-kadence-postgrid .kt-post-grid-layout-grid-wrap .kt-blocks-post-grid-item .entry-title {
	text-wrap: balance;
}
.kt-blocks-page-nav .nav-links > a, 
.kt-blocks-page-nav .nav-links > span {
	border: 2px solid var(--primary)!important;
	color: var(--primary)!important;
	transition: var(--in);
}
.kt-blocks-page-nav .nav-links > a:hover {
	background: var(--tertiary);
	color: var(--white)!important;
	border-color: var(--tertiary)!important;
	transition: var(--out);
}
.kt-blocks-page-nav .nav-links>.current {
	background: var(--primary)!important;
	color: var(--white)!important;
}



/* ----- CALENDAR PAGE ----- */
.tribe-events-notices {
	background: oklch(var(--primary-base) / 10%);
    border-radius: 0;
    border: 1px solid var(--primary);
    color: var(--primary);
    text-shadow: none;
}
.tribe-block__organizer__details h3 a {
	color: var(--primary);
	transition: var(--in);
}
.tribe-block__organizer__details h3 a:hover {
	color: var(--tertiary);
	transition: var(--out);
}
.tribe-events-single-event-title {
	opacity: 0!important;
	font-size: 0.1rem!important;
}
.tribe-events-single-event-title:before {
	content: '';
    display: block;
    background: url('/wp-content/themes/Most Holy Eucharist/images/golden-cross.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    height: 4rem;
    width: 2rem;
    position: absolute;
    top: -1rem;
    left: -3rem;
}
.tribe-events-schedule h2:before {
	display: none;
}
.tribe-common .tribe-common-h3,
.tribe-common .tribe-common-h4,
.tribe-common .tribe-common-h5,
.tribe-common .tribe-common-h6,
.tribe-common .tribe-common-h7, 
.tribe-common .tribe-common-h8,
.tribe-common .tribe-common-b3,
.tribe-events .tribe-events-calendar-month__calendar-event-datetime,
.tribe-common .tribe-common-c-btn-border-small, 
.tribe-common a.tribe-common-c-btn-border-small {
	font-family: var(--ff-body)!important;
}
.tribe-events-c-top-bar__datepicker-time {
	color: var(--primary);
}
#tribe-events-pg-template,
.tribe-common--breakpoint-medium.tribe-events .tribe-events-l-container {
    padding-block: var(--row-spacing)!important;
	padding-inline: var(--gutter)!important;
	max-width: var(--page-max-width)!important;
}
.tribe-common--breakpoint-medium.single-tribe_events .tribe-events-c-subscribe-dropdown, 
.tribe-common--breakpoint-medium.tribe-events .tribe-events-c-subscribe-dropdown {
	margin-bottom: 0!important;
}
#tribe-events-footer {
	padding-bottom: 0;
}
.single-tribe_events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button, 
.tribe-events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button {
	padding: 1rem 3.5rem 0.8rem 3.5rem;
	border: none;
	border-radius: 0;
	background: var(--secondary)!important;
	font-family: var(--ff-body);
	font-size: var(--fs-md);
	font-weight: normal;
	color: var(--white);
	transform: translateY(0);
	transition: var(--in);
}
.single-tribe_events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button:focus, 
.tribe-events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button:focus,
.tribe-events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button:focus-within,
.tribe-events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button.tribe-events-c-subscribe-dropdown__button--active, 
 {
	background: var(--tertiary)!important;
	transition: var(--out);
}
.single-tribe_events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button:hover, 
.tribe-events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button:hover {
	background: var(--tertiary)!important;
	transform: translateY(-0.2rem);
	transition: var(--out);
}
body.single-tribe_events #facility-reservations {
	display: none;
}
.tribe-events .datepicker .day.active, 
.tribe-events .datepicker .day.active.focused, 
.tribe-events .datepicker .day.active:focus, 
.tribe-events .datepicker .day.active:hover, 
.tribe-events .datepicker .month.active, 
.tribe-events .datepicker .month.active.focused, 
.tribe-events .datepicker .month.active:focus, 
.tribe-events .datepicker .month.active:hover, 
.tribe-events .datepicker .year.active, 
.tribe-events .datepicker .year.active.focused, 
.tribe-events .datepicker .year.active:focus, 
.tribe-events .datepicker .year.active:hover {
	background: var(--primary)!important;
}
.tribe-common--breakpoint-medium.tribe-events .tribe-events-calendar-month__day:after {
	height: 0;
	transition: var(--in);
}
.tribe-common--breakpoint-medium.tribe-events .tribe-events-calendar-month__day:hover:after {
	background-color: var(--tertiary);
	height: 1rem;
	transition: var(--out);
}
.tribe-events .tribe-events-calendar-month__day-date-daynum {
	color: var(--secondary);
}
.tribe-events .tribe-events-calendar-month__day--current .tribe-events-calendar-month__day-date, 
.tribe-events .tribe-events-calendar-month__day--current .tribe-events-calendar-month__day-date-link {
	color: var(--tertiary);
}
.tribe-events .tribe-events-calendar-month__day--current .tribe-events-calendar-month__day-date:hover, 
.tribe-events .tribe-events-calendar-month__day--current .tribe-events-calendar-month__day-date-link:hover {
	color: var(--tertiary-dark);
}
.tribe-events .tribe-events-calendar-month__events {
	padding-bottom: 1rem;
}
.tribe-events .tribe-events-calendar-series-archive__container {
	display: none;
}
.tribe-common--breakpoint-medium.tribe-events .tribe-events-calendar-list__event,
.tribe-events .tribe-events-calendar-day__time-separator+.tribe-events-calendar-day__event {
	padding-top: 1rem;
}
.tribe-common--breakpoint-medium.tribe-events .tribe-events-calendar-day__event:before,
.tribe-events-single ul.tribe-related-events li .tribe-related-events-thumbnail,
.tribe-related-event-info .tribe-events-calendar-series-archive__container--pill {
	display: none;
}
.tribe-events .tribe-events-calendar-month__calendar-event {
	padding-block: 0.5rem!important;
}
.tribe-events .cat_st-patrick-church-of-merna {
	background-color: oklch(var(--tertiary-base) / 20%);
}
.tribe-events .tribe-events-calendar-month__calendar-event .cat_st-patrick-church-of-merna h3 a:after {
	content: '@ St. Patrick of Merna';
}
.tribe-events .cat_st-mary-church-in-downs {
	background-color: oklch(var(--primary-base) / 20%);
}
.tribe-events .tribe-events-calendar-month__calendar-event .cat_st-mary-church-in-downs h3 a:after {
	content: '@ St. Mary in Downs';
}
.tribe-events .tribe-events-calendar-month__calendar-event:last-child {
	padding-bottom: 0.5rem;
}
.tribe-block__venue {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 4rem;
}
.tribe-block__organizer__details,
.tribe-block__venue {
	max-width: 100%;
    padding: 0!important;
    border: none!important;
}
.tribe-block__venue:before,
.tribe-block__venue:after {
	display: none;
}
.tribe-block__venue.tribe-block__venue--has-map .tribe-block__venue__meta,
.tribe-block__venue.tribe-block__venue--has-map .tribe-block__venue__map {
	width: 100%!important;
}
.tribe_events .left-blur-border {
	width: 100%!important;
	padding-block: 0.5rem;
	margin-top: 1.5rem;
}
.tribe_events .venue-section-title {
	margin-top: 4rem;
}
.tribe_events .organizer-section {
	margin-bottom: 2rem;
}
.tribe_events .tribe-block {
	margin-block: 0.5rem!important;
}
.tribe-block__events-link {
	border-bottom: 1px solid var(--primary);
	padding-bottom: 4rem!important;
}
.tribe-events-single {
	margin-bottom: -8rem!important;
}
.tribe-events-single .tribe-block__venue__meta {
	margin: 0;
}
#tribe-events-footer,
a.tribe-events-gmap {
	display: none!important;
}
.tribe_events .tribe-events-schedule__date,
.tribe_events .tribe-events-schedule__separator,
.tribe_events .tribe-events-schedule__time,
.tribe_events .tribe-events-schedule__time {
	font-size: var(--fs-xl)!important;
	font-family: var(--ff-heading);
    color: var(--secondary);
}
.tribe-block__related-events__title {
	margin-top: 5rem;
}
.tribe-events-schedule h2 {
	--heading-color: var(--secondary);
    color: var(--heading-color);
	font-size: var(--fs-2xl)!important;
	font-weight: 400!important;
	position: relative;
	margin-top: 3rem;
}
.tribe-events-schedule h2:before {
	content: '';
    display: block;
    background: url(/wp-content/themes/Most Holy Eucharist/images/golden-cross.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    height: 4rem;
    width: 2rem;
    position: absolute;
    top: -1rem;
    left: -3rem;
}
.tribe-block__organizer__details h3,
.tribe-block__venue .tribe-block__venue__meta .tribe-block__venue__name h3 {
	font-size: var(--fs-xl)!important;
	line-height: 1.2;
}



/* ----- KEYFRAMES ----- */



/* ----- LIVE FIXES ----- */