/* Disable Transisions - Used by HTML on Load and JS in global.js to prevent unwanted animations on load */
.no-transition-on-load,
.no-transition-on-load * { transition: none !important; }

/* Helper Classes */
.opacity-half { opacity: 0.5; }

.hidden { display: none !important; }
.hide-mobile { display: none; }
.show-mobile { display: block; }
@media (min-width: 1025px) {
  .hide-mobile { display: block; }
  .show-mobile { display: none; }
}

/* Aspect Ratio */
.aspect-ratio-1-1 { object-fit: cover; aspect-ratio: 1 / 1; }
.aspect-ratio-1-2 { object-fit: cover; aspect-ratio: 1 / 2; }
.aspect-ratio-2-1 { object-fit: cover; aspect-ratio: 2 / 1; }
.aspect-ratio-3-1 { object-fit: cover; aspect-ratio: 3 / 1; }
.aspect-ratio-4-3 { object-fit: cover; aspect-ratio: 4 / 3; }
.aspect-ratio-16-9 { object-fit: cover; aspect-ratio: 16 / 9; }

/* Heights */
body .h-100 { height: 6.25rem; }
body .h-200 { height: 12.5rem; }
body .h-300 { height: 18.75rem; }
body .h-400 { height: 25rem; }
body .h-500 { height: 31.25rem; }
body .h-600 { height: 37.5rem; }
body .h-700 { height: 43.75rem; }
body .h-800 { height: 50rem; }
body .h-900 { height: 56.25rem; }
body .h-1000 { height: 62.5rem; }

body .h-100 > img,
body .h-200 > img,
body .h-300 > img,
body .h-400 > img,
body .h-500 > img,
body .h-600 > img,
body .h-700 > img,
body .h-800 > img,
body .h-900 > img,
body .h-1000 > img { width: 100%; height: 100%; object-fit: cover; }

.img-wrap { background: hsl(var(--black)); }
.img-wrap > img { opacity: 0.8; }

/* Floats and Clears */
@media (min-width: 768px) {
  .float-left { float: left; margin: 0 1rem 1rem 0 !important; }
  .float-right { float: right; margin: 0 0 1rem 1rem !important; }
}
.clear-left { clear: left; }
.clear-right { clear: right; }
.clear-float { clear: both; }

.border-none,
.border-none:before,
.border-none:after { border: none !important; }

.drop-shadow { box-shadow: 0 0 hsl(var(--black)), 0 0 hsl(var(--black)), 0 0 hsl(var(--black)), 0 0 hsl(var(--black)), 0 0.625rem 0.9375rem -0.1875rem hsla(var(--black), 0.25), 0 0.25rem 0.375rem -0.25rem hsla(var(--black), 0.25); }
img.drop-shadow { box-shadow: 0 0 hsl(var(--black)), 0 0 hsl(var(--black)), 0 0 hsl(var(--black)), 0 0 hsl(var(--black)), 0 0.625rem 0.9375rem -0.1875rem hsla(var(--black), 0.1), 0 0.25rem 0.375rem -0.25rem hsla(var(--black), 0.1); }

.title:has(.title-bar) { display: flex; align-items: center; gap: 1rem; margin-bottom: 2rem; }
.title:has(.title-bar) span { flex-shrink: 0; }
.title-bar { opacity: 0.7; flex-grow: 1; display: inline-flex; height: 0.0625rem; background: linear-gradient(to right, transparent, hsl(var(--siteColor1)), transparent); }
.title .title-bar:first-child { flex-shrink: 1; background: linear-gradient(to left, hsla(var(--siteColor1), 0.7), transparent); }
.title .title-bar:last-child { flex-shrink: 1; background: linear-gradient(to right, hsla(var(--siteColor1), 0.7), transparent); }

.text-muted { color: inherit !important; opacity: 0.75; }
.fs-double { font-size: 2rem; }
.fs-normal { font-size: 1rem; }
.text-lg { font-size: 1.25rem; line-height: 1.75rem; }
.text-md { font-size: 1.125rem; line-height: 1.75rem; }

.text-upper { text-transform: uppercase !important; }
.text-lower { text-transform: lowercase !important; }
.text-cap { text-transform: capitalize !important; }

/* Scoll Indicator for Overflow */
.mobile-scroller { display: block; margin: 0.625rem 0; font-size: 1rem; font-weight: var(--wBold); text-align: center; }
@media (min-width: 768px) {
  .mobile-scroller { display: none; }
}

.pulse { --pulseColor: var(--trueRed); box-shadow: 0 0 0 0 hsla(var(--pulseColor), 1); animation: pulse 2s 1; }

/* Lazy Load Image Placeholder */
.lazy { opacity: 1; animation-duration: 1.5s; animation-fill-mode: forwards; animation-iteration-count: infinite; animation-name: lazyLoadPlaceholder; animation-timing-function: linear; background: transparent; background: linear-gradient(to right, #eeeeee 8%, #dddddd 18%, #eeeeee 33%); background-size: 100% 100%; transition: all ease-in-out 0.2s; }
.lazy.loaded { background: inherit; animation: none; }