/* Theme CSS */
/* Theme Start */
/* ==========================================================
   Base Theme CSS — Phase 1: Variable Consumption
   
   Every color now reads from a CSS custom property with the 
   original hex as a fallback. When WizardCssGenerator sets 
   the variable in :root, the value flows through automatically.
   When no wizard CSS is present (initial setup), the fallback 
   keeps the theme looking correct.
   
   CHANGE LOG vs original:
   - Navigation colors → var(--navbar-bg), var(--navbar-text)
   - Button colors    → var(--button-bg), var(--button-text)
   - Signup colors    → var(--signup-bg), var(--signup-text)
   - Footer colors    → var(--footer-bg), var(--footer-text)
   - Typography       → var(--color-secondary) for headings
   - Links            → var(--color-accent) for anchor color
   - Widget accents   → var(--color-primary)
   ========================================================== */


/* ── Type Scale ───────────────────────────────────────────
   Fluid sizes using clamp(min, preferred, max).
   The generator can override these in :root per-site.
   ────────────────────────────────────────────────────────── */

:root {
    --text-body:  clamp(15px, calc(14px + 0.15vw), 18px);
    --text-lg:    clamp(16px, calc(15px + 0.2vw),  20px);
    --text-sm:    clamp(13px, calc(12px + 0.1vw),  15px);
    --text-xs:    clamp(11px, calc(10px + 0.08vw), 13px);
    --text-xxs:   clamp(10px, calc(9px + 0.07vw),  12px);
    --text-h1:    clamp(24px, calc(20px + 0.55vw), 32px);
    --text-h2:    clamp(20px, calc(18px + 0.35vw), 26px);
    --text-h3:    clamp(18px, calc(16px + 0.25vw), 22px);
    --text-h4:    clamp(16px, calc(15px + 0.15vw), 19px);
    --line-height-body: 1.6;
    --line-height-heading: 1.2;
}


/* ── Base ────────────────────────────────────────────────── */

body {
    background-color: #fff;
    font-family: 'Open Sans', Arial, sans-serif;
    font-size: var(--text-body, 16px);
    line-height: var(--line-height-body, 1.5);
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

a {
    color: var(--color-accent, inherit);
    transition: color 0.15s ease;
}

hr {
    border: 0;
    height: 1px;
    margin: 20px auto;
    width: 100%;
    background-image: linear-gradient(to right, #EAF0F5, #DEE6ED, #EAF0F5);
    color: #E6E7EB;
}


/* ── Layout ──────────────────────────────────────────────── */

#container {
    background-color: #FFF;
    margin: 0 auto;
    padding-top: 0;
    width: 100% !important;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    justify-content: center;
}

#mid,
.content-group {
    display: flex;
    flex-direction: row;
    flex-grow: 1;
    justify-content: center;
    position: relative;
    padding-top: clamp(40px, 6vw, 80px);
    padding-bottom: clamp(40px, 6vw, 80px);
}

/* ── Full-bleed color bands ──────────────────────────────
   Bug fix: when a contained-content block sits inside a
   full-bleed band, the layout re-emits .content-group inside
   the section, and the group's top-gradient ::before painted
   on the inner content column. The gradient belongs to the
   band (the outer container), so suppress it inside any
   colored section...
   ────────────────────────────────────────────────────────── */
[data-bg] #mid::before,
[data-bg] .content-group::before {
    display: none;
}

/* ...and the band's own padding already provides the vertical
   rhythm, so the inner group's padding shouldn't stack on top
   of it (was doubling to as much as 160px). */
[data-bg] .content-group {
    padding-top: 0;
    padding-bottom: 0;
}

/* Per-block gradient on the band itself. The layout adds
   .section-gradient when the block's gradient toggle is on;
   this mirrors the #mid::before treatment. */
section.section-ctx {
    position: relative;
}

section.section-gradient::before {
    content: '';
    background: linear-gradient(to bottom,
        rgba(46, 145, 218, 1) 0%,
        rgba(46, 145, 218, 0.6) 30%,
        rgba(46, 145, 218, 0.2) 60%,
        rgba(46, 145, 218, 0) 100%);
    mix-blend-mode: multiply;
    opacity: 0.09;
    position: absolute;
    top: 0;
    left: 0;
    height: 7.5vw;
    width: 100%;
    pointer-events: none;
    z-index: 0;
}



#mid::before,
.content-group::before {
    content: '';
    background: linear-gradient(to bottom,
        rgba(46, 145, 218, 1) 0%,
        rgba(46, 145, 218, 0.6) 30%,
        rgba(46, 145, 218, 0.2) 60%,
        rgba(46, 145, 218, 0) 100%);
    mix-blend-mode: multiply;
    opacity: 0.09;
    position: absolute;
    top: 0;
    left: 0;
    height: 7.5vw;
    width: 100%;
    pointer-events: none;
    z-index: 0;
}

#content,
.content-area {
    color: #484848;
    float: left;
    line-height: var(--line-height-body, 1.6);
    margin: 10px;
    padding: 0;
    width: 100%;
    max-width: 1250px;
}

#content a,
.content-area a {
    color: var(--color-accent, #484848);
}

#content img,
.content-area img {
    max-width: 100%;
}

#contentInterior,
.contentInterior {
    padding: 0 !important;
    flex: none !important;
}

/* Intentionally inert — layout controlled by #content */
#homeContent {
    width: unset !important;
    margin: 0;
    display: block;
    flex-grow: unset;
    flex-direction: unset;
}

#sidebar {
    background-color: #F5F6F8;
    border: 0;
    color: #484848;
    float: right;
    font-size: var(--text-xs, 12px);
    margin: 10px;
    margin-left: unset;
    padding: 10px;
    width: 264px;
    box-sizing: border-box;
}


/* ── Header (hidden by default) ──────────────────────────── */

#headWrap {
    background-color: var(--logo-banner-bg, #fff);
    color: var(--logo-banner-text, inherit);
    padding-top: 10px;
    width: 100%;
    display: none;
}

#header {
    margin: 0 auto;
    padding: 10px 0 5px;
    width: 100%;
    max-width: 960px;
}

#header img {
    border: 0;
    max-width: 100%;
    height: auto;
    display: block;
}

#header a {
    color: var(--logo-banner-text, inherit);
}


/* ── Navigation ──────────────────────────────────────────── */

#navigation {
    background-color: var(--navbar-bg, #fff);
    min-height: 70px;   /* was: height: 70px */
    height: auto;
    overflow: visible;
    padding: 5px;
    border-top: 0;
    border-bottom: 0;
    display: flex;
    align-items: center;
    transition: ease .3s;
    z-index: 99999;
    box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.2);
}

.navigation-locked {
    width: 100% !important;
    position: fixed;
    top: 0;
    z-index: 99999;
}


/* ── Inline Logo ─────────────────────────────────────────── */

.tinyLogo {
    display: unset;
    margin-right: auto;
    margin-left: clamp(16px, 4vw, 60px);
}

.tinyLogo img {
    height: 100% !important;
    width: auto;
    max-height: 50px;
}

.tinyLogo a {
    color: var(--navbar-text, inherit);
}


/* ── Desktop Menu ────────────────────────────────────────── */

.menu {
    height: 40px;
    margin: 0 clamp(16px, 4vw, 60px) 0 0;
    padding: 5px 0 0;
    text-align: right;
    overflow: hidden;
}

.menu li {
    color: var(--navbar-text, #FFF);
    display: inline-block;
    font-family: 'Open Sans', Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: bold;
    list-style: none outside none;
    text-align: left;
    text-shadow: none;
    text-transform: uppercase;
}

.menu li a:link,
.menu li a:visited {
    border-right: 0;
    color: var(--navbar-text, #00324d);
    display: block;
    margin: 0;
    padding: .5em 2em;
    text-decoration: none;
}

.menu li:last-child a {
    border: 0;
}

.menu li a {
    color: var(--navbar-text, #00324d);
    font-family: 'Open Sans Condensed';
    font-size: 20px;
    line-height: 20px;
    text-shadow: none;
    text-transform: none;
    transition: color 0.35s ease;
}


/* ── Dropdown Submenus ───────────────────────────────────── */

.menu li ul {
    transition: none;
    background-color: var(--navbar-bg, #fff);
    border-radius: 0 4px 4px 4px;
    box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.3);
    margin: 0;
    min-height: 40px;
    padding: 10px 5px;
    position: absolute;
    visibility: hidden;
    z-index: 99999;
}

.menu li ul li {
    transition: none;
    border: 0;
    display: inline;
    float: none;
    text-shadow: none;
    width: auto;
}

.menu li ul li a:link,
.menu li ul li a:visited {
    transition: background-color 0.15s ease;
    background-color: transparent;
    border: 0;
    color: var(--navbar-text-muted, #484848);
    font-weight: normal;
    min-width: 200px;
}


/* ── Nav Highlight (Donate Button) ───────────────────────── */

.nav-highlight {
    background: var(--button-bg, linear-gradient(135deg, #C5242E 0%, #B51E28 100%));
    border-radius: 4px;
}

ul.menu li.nav-highlight a {
    color: var(--button-text, #fff);
}


/* ── Typography ──────────────────────────────────────────── */

h1 {
    color: var(--color-secondary, #2672a6);
    font-family: 'Open Sans', Arial, sans-serif;
    font-size: var(--text-h1, 24px);
    font-weight: 600;
    line-height: var(--line-height-heading, 1.2);
    letter-spacing: -0.02em;
}

h2 {
    color: var(--color-secondary, inherit);
    font-size: var(--text-h2, 20px);
    font-weight: normal;
    line-height: var(--line-height-heading, 1.2);
}

h3 {
    color: var(--color-secondary, #496D83);
    font-size: var(--text-h3, 18px);
    font-weight: normal;
    line-height: var(--line-height-heading, 1.2);
    margin: 0;
}

h3 a {
    color: var(--color-secondary, #496D83);
}


/* ── Breadcrumbs ─────────────────────────────────────────── */

.breadCrumbs {
    font-size: var(--text-xs, 11px);
    padding: 10px 0 5px;
    text-decoration: none;
    visibility: hidden;
}

.breadCrumbs,
.breadCrumbs a {
    color: #75A4C9;
}

.breadCrumbs a {
    text-decoration: none;
}

.breadCrumbs a:hover {
    text-decoration: underline;
}


/* ── News ────────────────────────────────────────────────── */

.newsDate {
    font-size: var(--text-xs, 11px);
    line-height: 2.3em;
    text-transform: uppercase;
    color: var(--color-secondary, #1A284D);
}

#newsSection {
    margin: 0 auto;
    padding: 0;
}

#newsSection h3 {
    margin-top: 10px;
}

#newsCol h3,
#newsCol h3 a,
#eventsWrapper h3 a {
    color: var(--color-secondary, #2672a6);
    font-family: "Open Sans", Arial, sans-serif;
    font-size: var(--text-h3, 18px);
    font-weight: bold;
}

#recent_news {
    margin: 20px auto;
    width: 220px;
    border-top: 2px solid #E9E9EB;
    border-bottom: 2px solid #E9E9EB;
    padding-top: 10px;
}

#recent_news a {
    color: #484848;
    text-decoration: none;
}

#recent_news a:hover {
    text-decoration: underline;
}

#recent_news p {
    font-size: var(--text-sm, 14px);
}

#recent_news p a {
    color: var(--color-secondary, #00324D);
}


/* ── Events ──────────────────────────────────────────────── */

#eventsBar {
    background-color: var(--color-primary, #154176);
    background-image: none;
    border: 0;
    color: #FFF;
    margin: 0 0 10px;
    padding: 10px;
    text-align: center;
}

#eventsBar a {
    color: #FFF;
}

#eventsTopLinks {
    margin-bottom: 5px;
    text-align: center;
}

.pad {
    padding: 0 10px;
}

#eventsWrapper {
    border: 0;
    width: 100%;
    padding: 0;
    margin: 10px 0;
}

.eventItem {
    padding: 20px;
    padding-left: 0;
    margin-left: 0;
}


/* ── Gallery & Photos ────────────────────────────────────── */

.galleryPageThumb {
    float: left;
    margin-right: 20px;
    text-align: center;
    width: 125px;
}

.galleryPageThumb img {
    border: 2px solid #fff;
    box-shadow: 3px 3px 3px #999;
}

#photoContainer img {
    border: 2px solid #fff !important;
    box-shadow: 5px 5px 5px #999;
}

#photoContainer img:hover {
    box-shadow: 5px 5px 5px #888;
    border: 1px solid #fff;
}

.photoWrap {
    border: 1px solid #ccc;
    width: 280px;
    flex: none;
}


/* ── Social Sharing (sprite-based) ───────────────────────── */

.socialShare {
    overflow: hidden;
}

.socialShare a {
    transition: all 0.2s ease-in-out;
    background-position: left top;
    display: block;
    float: right;
    height: 16px;
    margin: 0 3px;
    text-indent: -9999px;
    width: 16px;
}

.socialShare a:hover {
    background-position: left bottom;
}

.socialShare a#fb-icon {
    background-image: url(/images/share_facebook_sprite.png);
}

.socialShare a#tw-icon {
    background-image: url(/images/share_twitter_sprite.png);
    width: 24px;
}

.socialShare a#em-icon {
    background-image: url("/images/share_email_sprite.png");
    width: 23px;
}

.socialShare a#gp-icon {
    width: 16px;
    background-image: url(/images/gplus_share_sprite.png);
}

.socialShare a#ln-icon {
    width: 16px;
    background-image: url(/images/linkedin_share_sprite.png);
}


/* ── Social Media ────────────────────────────────────────── */

#social_media img {
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
}

#social_media img:hover {
    box-shadow: 0 2px 6px #777;
}


/* ── Slideshow ───────────────────────────────────────────── */

#rotatorBG {
    background-color: var(--color-secondary, #31628D);
    background-image: url(/images/flag_slideshow_bg.png);
    background-size: 100% auto;
    width: 100%;
}

#slideshow div {
    margin: auto;
    display: block;
}

#slideshow div img {
    margin: auto;
    display: block;
}


/* ── Sidebar ─────────────────────────────────────────────── */

#sidebar h3 {
    color: var(--color-secondary, #00324D);
    font-family: "Open Sans", Arial, sans-serif;
    font-size: var(--text-lg, 20px);
    font-weight: 600;
    text-transform: uppercase;
    text-align: center;
}

.sidebar-button {
    max-width: unset;
    line-height: unset !important;
    padding: 18px 8px 22px;
    min-height: 0;
    height: auto;
}


/* ── Footer / Bottom ─────────────────────────────────────── */

#bottom-wrapper {
    background-color: var(--footer-bg, #F5F6F8);
    color: var(--footer-text, inherit);
}

#bottom,
#bottom-both-wrapper,
#footer,
#bottom-social-wrapper {
    background: none !important;
}

#bottom {
    border-top: 0;
    padding: 20px 40px;
    margin-top: auto;
    color: var(--footer-text-muted, inherit);
}

#bottom-both-wrapper {
    padding: 10px 0;
    min-height: 60px;
}

#bottom-nav-wrapper {
    min-height: 30px;
}

#footer {
    font-size: var(--text-sm, 14px);
    margin: 0;
    padding: 0;
    text-align: center;
}

#subFooter {
    padding: 0;
    text-align: center;
}


/* ── Bottom Navigation ───────────────────────────────────── */

.bottom-nav-menu {
    display: flex;
    list-style-type: none;
    max-width: 960px;
    margin: 30px auto;
    padding: 20px;
    flex-wrap: wrap;
    justify-content: center;
}

.bottom-nav-menu li {
    flex-grow: 1;
    padding: 0;
    margin: 0;
    text-align: center;
}

.bottom-nav-menu a {
    color: var(--footer-text, #00324d);
    text-transform: uppercase;
    text-decoration: none;
    transition: color 0.2s ease;
}

.bottom-nav-menu li a {
    font-family: 'Open Sans Condensed';
    font-weight: 700;
    font-size: var(--text-lg, 17px);
    text-transform: none;
}


/* ── Bottom Social ───────────────────────────────────────── */

#bottom-social-wrapper {
    text-align: center;
    font-size: 48px;
    letter-spacing: 30px;
    margin: 0 auto;
    padding-bottom: 30px;
}

#bottom-social-wrapper a {
    color: var(--footer-text, #00324d);
    text-decoration: none;
    padding: 20px;
    transition: color 0.2s ease;
}


/* ── Paid For / Campaign Partner ─────────────────────────── */

#paidFor {
    color: var(--footer-text-muted, #00324D);
    font-size: var(--text-xs, 11px);
    font-family: 'Lato', sans-serif;
    border: 1px solid var(--footer-text-muted, #00324D);
    margin: 10px auto;
    padding: 10px;
    text-align: center;
    width: 300px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

#paidFor a {
    color: var(--footer-text-muted, #00324D);
}

#campaignPartner {
    color: var(--footer-text-muted, #00324D);
    font-size: var(--text-xxs, 10px);
    font-family: 'Lato', sans-serif;
    margin: 20px auto;
    text-align: center;
    text-decoration: none;
    width: 100%;
    text-transform: uppercase;
    letter-spacing: 1px;
}

#campaignPartner a {
    color: var(--footer-text-muted, #00324D);
    font-size: var(--text-xxs, 10px);
    font-family: 'Lato', sans-serif;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 1px;
}

#campaignPartner a:hover {
    text-decoration: underline;
}


/* ── Buttons ─────────────────────────────────────────────── */

.formButton,
.readyButton {
    background-color: var(--button-bg, #BA363B);
    color: var(--button-text, #fff);
    border: 2px solid var(--button-bg, #BA363B);
    transition: background-color 0.3s ease, border-color 0.3s ease;
}

.formButton:active,
.readyButton:active {
    background: var(--button-bg, #BA363B);
}

.amountLink {
    background: var(--button-bg, linear-gradient(135deg, #dc2626 0%, #b91c1c 100%));
    color: var(--button-text, #fff);
    transition: background 0.3s ease, transform 0.3s ease;
    transform: scale(1);
}

#amountsSection {
    border-radius: 16px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

.horizontalButtons a {
    background-color: var(--button-bg, #338DD6);
    color: var(--button-text, #fff);
}

#volunteer_button,
#contribute_button,
#voting_button {
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
}


/* ── Signup / Email ──────────────────────────────────────── */

#signupWrapper {
    margin: 0 auto;
    background-color: var(--signup-bg, #338DD6);
    color: var(--signup-text, #fff);
    border-radius: 16px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

#emailSignupHeader {
    color: var(--signup-text, #fff) !important;
}

#emailSignup .textfield {
    border-color: var(--signup-border, rgba(255, 255, 255, 0.35));
}

#subButton {
    background-color: var(--signup-overlay, rgba(255, 255, 255, 0.18));
    color: var(--signup-text, #fff);
    border: 2px solid var(--signup-border, rgba(255, 255, 255, 0.35));
    transition: filter 0.35s ease;
}

.signupDisclaimer,
.signupDisclaimer .disclaimer-text {
    color: var(--signup-text, #fff);
}

#signupThanks {
    color: var(--signup-text, #fff);
}


/* ── Widget (RWZ) ────────────────────────────────────────── */

.rwzProgress {
    background-color: var(--color-primary, #2B9CD9);
}

.rwzButton {
    background-color: var(--color-primary, #2B9CD9);
    border-color: var(--color-primary, #2B9CD9);
    width: 100%;
    max-width: 410px;
    margin: 0 auto !important;
    text-align: center;
}

.rwzSelected .rwzLink .rwzText::before {
    background-color: var(--color-primary, #2B9CD9);
}

.radio-button input[type="radio"]:checked+label {
    background-color: var(--color-primary, #2B9CD9);
    color: #fff;
}


/* ── Donation Widget ─────────────────────────────────────── */

#amountsTitle {
    color: var(--color-secondary, inherit);
}

#amountsText {
    color: var(--color-secondary, inherit);
}


/* ── Overlay (Mobile Menu) ───────────────────────────────── */

.overlay {
    background-color: var(--navbar-bg, #fff);
}

.overlay a {
    color: var(--navbar-text, #00324d);
    font-size: var(--text-h1, 24px);
    font-family: 'Open Sans Condensed', sans-serif;
    font-weight: 400;
}

.overlay-close {
    color: var(--navbar-text, #00324d);
    border-color: var(--navbar-text, #00324d);
}

#overlay-social i,
#overlay-social a {
    color: var(--navbar-text, #00324d);
}

.menu-open-button a {
    color: var(--navbar-text, #00324d);
    font-family: 'Open Sans Condensed';
}

.menu-open-button .menu-toggle {
    color: var(--navbar-text, #00324d);
}

.hamburger span {
    background-color: var(--navbar-text, #00324d);
}

.btn-open {
    color: var(--navbar-text, #00324d);
}


/* ── Selection Highlight ─────────────────────────────────── */

::selection {
    background-color: var(--color-primary, #2672a6);
    color: #fff;
}


/* ── Utility / Misc ──────────────────────────────────────── */

#secureText {
    text-align: center;
}

#issuesSection {
    max-width: 1250px;
    width: 100%;
    margin: 20px auto;
    box-sizing: border-box;
}

#HLNext,
#HLPrevious {
    color: #fff !important;
}

.mobileLink {
    text-align: center;
    font-size: 12px;
    color: #fff;
    margin: 10px auto 20px;
}

.mobileLink a {
    color: #fff;
    text-decoration: none;
}

.mobileLink a:hover {
    text-decoration: underline;
}


/* ── Payment buttons ─────────────────────────────────────── */

.payment-button {
    background: var(--button-bg, #BA363B);
    color: var(--button-text, #fff);
    border: 2px solid var(--button-bg, #BA363B);
    transition: background 0.3s ease, border-color 0.3s ease;
}

.form-nav {
    background: var(--button-bg, #BA363B);
    color: var(--button-text, #fff);
    transition: background 0.3s ease;
}


/* ── Endorsement Link ────────────────────────────────────── */

#makeEndorsement .endorsementLink {
    background: var(--button-bg, #BA363B);
    color: var(--button-text, #fff);
    border-color: var(--button-bg, #BA363B);
    transition: background 0.3s ease, border-color 0.3s ease;
}


/* ── Horizontal Action Buttons ───────────────────────────── */

.horizontalButtons .horizontalButton1,
.horizontalButtons .horizontalButton2,
.horizontalButtons .horizontalButton3 {
    background: var(--button-bg, #338DD6);
    color: var(--button-text, #fff);
    border-color: var(--button-bg, #338DD6);
    transition: background 0.3s ease, border-color 0.3s ease;
}


/* ── Scroll to Top ───────────────────────────────────────── */

#backToTop {
    background: var(--color-accent, #e74c3c);
    color: var(--button-text, #fff);
    border: none;
    border-radius: 10px;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

#backToTop:focus-visible {
    outline: 2px solid var(--color-accent, #e74c3c);
    outline-offset: 3px;
}


/* ── Section Color Contexts ──────────────────────────────
   Full-width blocks wrapped in <section data-bg="role">
   auto-contrast text, headings, and links against the
   background. Variables are set per-role by the generator.
   ────────────────────────────────────────────────────────── */

[data-bg] {
    padding: clamp(40px, 6vw, 80px) clamp(20px, 5vw, 80px);
}

[data-bg] h1,
[data-bg] h2,
[data-bg] h3,
[data-bg] h4 {
    color: var(--section-heading);
}

[data-bg] a {
    color: var(--section-link);
}

[data-bg] hr {
    background-image: none;
    background-color: var(--section-border);
}

/* Inner content container for readability */
[data-bg] .section-inner {
    max-width: 1250px;
    margin: 0 auto;
}

/* Feature components inside a context inherit section colors */
[data-bg] .newsDate {
    color: var(--section-muted);
}

[data-bg] #newsCol h3,
[data-bg] #newsCol h3 a,
[data-bg] #eventsWrapper h3 a {
    color: var(--section-heading);
}

[data-bg] #eventsBar {
    background-color: var(--section-border);
}


/* ── Pointer-device hover effects ────────────────────────
   All visual hover feedback is gated behind this query
   so touch devices never get sticky hover states.
   ────────────────────────────────────────────────────────── */

@media (hover: hover) and (pointer: fine) {

    /* Links */
    a:hover { color: var(--color-accent-hover, inherit); }

    /* Desktop nav links */
    .menu li a:hover {
        color: var(--navbar-text, #2B9CD9);
        background-color: transparent;
    }

    /* Dropdown items */
    .menu li ul li a:hover {
        background-color: var(--navbar-dropdown-hover, rgba(0, 0, 0, 0.06));
        color: var(--navbar-text, #00324d);
        text-decoration: underline;
    }

    /* Donate / nav-highlight button */
    ul.menu li.nav-highlight a:hover {
        background: var(--button-bg-hover, linear-gradient(135deg, #ef4444 0%, #dc2626 100%));
        border-radius: 4px;
        text-decoration: none !important;
    }

    /* Footer nav */
    .bottom-nav-menu a:hover {
        color: var(--footer-text-muted, #2B9CD9);
    }

    /* Footer social icons */
    #bottom-social-wrapper a:hover {
        color: var(--footer-text-muted, #2B9CD9);
    }

    /* Buttons */
    .formButton:hover,
    .readyButton:hover {
        background-color: var(--button-bg-hover, #9C2D32);
        border-color: var(--button-bg-hover, #9C2D32);
    }

    /* Donation amount links */
    .amountLink:hover {
        background: var(--button-bg-hover, linear-gradient(135deg, #ef4444 0%, #dc2626 100%));
        transform: scale(1.02);
        text-decoration: none !important;
    }

    /* Signup submit */
    #subButton:hover {
        filter: brightness(1.15);
    }

    /* Payment & form-nav buttons */
    .payment-button:hover {
        background: var(--button-bg-hover, #9C2D32);
        border-color: var(--button-bg-hover, #9C2D32);
    }
    .form-nav:hover {
        background: var(--button-bg-hover, #9C2D32);
    }

    /* Endorsement */
    #makeEndorsement .endorsementLink:hover {
        background: var(--button-bg-hover, #9C2D32);
        border-color: var(--button-bg-hover, #9C2D32);
    }

    /* Horizontal action buttons */
    .horizontalButtons .horizontalButton1:hover,
    .horizontalButtons .horizontalButton2:hover,
    .horizontalButtons .horizontalButton3:hover {
        background: var(--button-bg-hover, #2a7ab8);
        border-color: var(--button-bg-hover, #2a7ab8);
    }

    /* Scroll to top */
    #backToTop:hover {
        background: var(--color-accent-hover, #c0392b);
        transform: scale(1.08);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
    }
}


/* ── Responsive ──────────────────────────────────────────── */

@media screen and (max-width: 959px) {

    #sidebar {
        order: 2 !important;
        float: unset;
        width: auto;
        margin: 0;
        min-width: unset !important;
    }

    #content,
    .content-area {
        order: 1 !important;
        float: unset;
        margin-left: 0;
        margin-right: 0;
        margin-bottom: 0;
    }

    #container {
        margin-bottom: 0;
        border: 0;
        box-shadow: none;
    }

    #contentInterior,
    .contentInterior {
        width: 90%;
        margin: 10px auto;
    }

    #contentInterior img,
    .contentInterior img {
        max-width: 100%;
        height: auto !important;
        float: none !important;
        display: block;
        margin: 10px auto !important;
    }

    #paidFor {
        max-width: 500px;
        width: 80%;
    }

    #campaignPartner {
        max-width: 400px;
        width: 80%;
    }

    .tinyLogo {
        margin-right: auto;
        margin-left: 10px;
    }

    .btn-open {
        line-height: 40px !important;
        font-size: 20px !important;
        display: unset;
        font-family: 'Lato', sans-serif;
        font-weight: 700;
    }

    .menu-open-button {
        margin: unset;
        margin-right: 10px;
    }

    #overlay-social i {
        font-size: 48px;
    }

    .overlay-close {
        text-transform: uppercase;
    }

    .news-wrapper {
        width: 90% !important;
    }
}

.signup-preview-container .textfield::placeholder {
    color: color-mix(in srgb, currentColor 62%, transparent);
    opacity: 1;
}/* Theme End */
/* Content group style matching */
#sidebarSocial { margin: 20px auto; text-align: center; }
#sidebarSocial img { box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3); }
.fb-like-box { background-color: #ffffff; padding: 5px 0 10px; margin: 10px auto 10px -3px!important; border: 1px solid #ccc; }
#fbFeedWrapper { margin: 10px auto 10px 20px; width: 232px; }
.nButtonWrapper { width: 222px; text-align: center; padding-top: 5px; margin: 8px auto; }
#newbuttons { text-align: center; margin-top: 10px; padding-top: 5px; width: 222px; margin: 10px auto; }
.nButtonWrapper a, #newbuttons a { box-shadow: 0px 2px 5px rgba(0,0,0,0.3); padding: 8px 0; border-radius: 0; cursor: pointer; text-align: center; text-decoration: none; transition: background-color 0.15s ease-out 0s; width: 222px; height: 44px; font-family: 'Open Sans', Helvetica, Arial; vertical-align: middle !important; font-weight: normal; font-size: 17px; text-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1); display: table-cell; }
#newbuttons a:hover { transition: all 0.25s ease 0s; text-decoration: none !important; box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1); }
/****** HELLO ******/
.mediumBlueButton { background-color:#2775B2; border:1px solid #005785; color: #fff; font-size: px; background: rgba(42,124,190,1);
background: -moz-linear-gradient(top, rgba(42,124,190,1) 0%, rgba(33,104,156,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(42,124,190,1)), color-stop(100%, rgba(33,104,156,1)));
background: -webkit-linear-gradient(top, rgba(42,124,190,1) 0%, rgba(33,104,156,1) 100%);
background: -o-linear-gradient(top, rgba(42,124,190,1) 0%, rgba(33,104,156,1) 100%);
background: -ms-linear-gradient(top, rgba(42,124,190,1) 0%, rgba(33,104,156,1) 100%);
background: linear-gradient(to bottom, rgba(42,124,190,1) 0%, rgba(33,104,156,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2a7cbe', endColorstr='#21689c', GradientType=0 ); }
.mediumBlueButton:hover { opacity: .85; transition: all 0.25s ease 0; }
.mediumGreenButton { background-color:#76A06F; border:1px solid #5A875A; color: #fff; font-size: px; background: rgba(133,173,133,1);
background: -moz-linear-gradient(top, rgba(133,173,133,1) 0%, rgba(95,141,95,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(133,173,133,1)), color-stop(100%, rgba(95,141,95,1)));
background: -webkit-linear-gradient(top, rgba(133,173,133,1) 0%, rgba(95,141,95,1) 100%);
background: -o-linear-gradient(top, rgba(133,173,133,1) 0%, rgba(95,141,95,1) 100%);
background: -ms-linear-gradient(top, rgba(133,173,133,1) 0%, rgba(95,141,95,1) 100%);
background: linear-gradient(to bottom, rgba(133,173,133,1) 0%, rgba(95,141,95,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#85ad85', endColorstr='#5f8d5f', GradientType=0 ); }
.mediumGreenButton:hover { opacity: .85; transition: all 0.25s ease 0; }
.goldButton { background-color:#DDB52D; border:1px solid #B69526; color: #fff; font-size: px; background: rgba(239,196,49,1);
background: -moz-linear-gradient(top, rgba(239,196,49,1) 0%, rgba(180,148,37,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(239,196,49,1)), color-stop(100%, rgba(180,148,37,1)));
background: -webkit-linear-gradient(top, rgba(239,196,49,1) 0%, rgba(180,148,37,1) 100%);
background: -o-linear-gradient(top, rgba(239,196,49,1) 0%, rgba(180,148,37,1) 100%);
background: -ms-linear-gradient(top, rgba(239,196,49,1) 0%, rgba(180,148,37,1) 100%);
background: linear-gradient(to bottom, rgba(239,196,49,1) 0%, rgba(180,148,37,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#efc431', endColorstr='#b49425', GradientType=0 ); }
.goldButton:hover { opacity: .85; transition: all 0.25s ease 0; }
/* Button Fix */
.blackButton,
.brightBlueButton,
.brightBlue2,
.brightRedButton,
.brightRed2,
.championBlue,
.championRed,
.darkBlueButton,
.darkBlue2,
.darkGreenButton,
.fadedBlueButton,
.fadedRedButton,
.flatRedButton,
.freedomBlue,
.freedomRed,
.goldButton,
.goldButtonGradient,
.independenceBlue,
.independenceRed,
.libertyBlue,
.libertyRed,
.lightBlueButton,
.mediumBlueButton,
.mediumBlueButtonGradient,
.mediumGreenButton,
.mediumGreenButtonGradient,
.mediumRedButton,
.nationalRed,
.plymouthBlue,
.plymouthRed,
.saturatedRedButton {
    color: #fff !important;
}
#s-bb474ff4a8e24956a80012c98ac990f1 { vertical-align:middle!important; font-size:17px!important; font-family:'gotham_mediumregular'!important; }
#z-bb474ff4-a8e2-4956-a800-12c98ac990f1 { font-size:17px!important; font-family:'gotham_mediumregular'; text-decoration:none; text-shadow:0px 2px 2px rgba(0, 0, 0, 0.2) }
#s-83aea29bd1514f17a342cd4c820513c3 { vertical-align:middle!important; font-size:17px!important; font-family:'gotham_mediumregular'!important; }
#z-83aea29b-d151-4f17-a342-cd4c820513c3 { font-size:17px!important; font-family:'gotham_mediumregular'; text-decoration:none; text-shadow:0px 2px 2px rgba(0, 0, 0, 0.2) }
#s-4160d1bb727f4f548ba6475d4ff590b0 { vertical-align:middle!important; font-size:17px!important; font-family:'gotham_mediumregular'!important; }
#z-4160d1bb-727f-4f54-8ba6-475d4ff590b0 { font-size:17px!important; font-family:'gotham_mediumregular'; text-decoration:none; text-shadow:0px 2px 2px rgba(0, 0, 0, 0.2) }
/* Responsive Navigation Scaling */
#navigation .menu,
#navigation[data-template="campaign-1"] .menu,
#navigation[data-template="campaign-2"] .menu {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: clamp(4px, 1.5vw, 0px) !important;
    height: auto !important;
    min-height: auto !important;
    list-style: none !important;
    padding: 0 !important;
}
#navigation .menu li a:link,
#navigation .menu li a:visited,
#navigation[data-template="campaign-1"] .menu li a:link,
#navigation[data-template="campaign-1"] .menu li a:visited,
#navigation[data-template="campaign-2"] .menu li a:link,
#navigation[data-template="campaign-2"] .menu li a:visited {
    font-size: clamp(18px, calc(11.4px + 0.83vw), 23px) !important;
    padding: clamp(4px, 0.8vw, 12px) clamp(8px, 1.2vw, 16px) !important;
    line-height: 1.1 !important;
    display: block !important;
}
#navigation .menu li:last-child,
#navigation[data-template="campaign-1"] .menu li:last-child,
#navigation[data-template="campaign-2"] .menu li:last-child {
    margin-right: clamp(4px, 1.5vw, 0px) !important;
}
/* JavaScript control classes with template specificity */
#navigation.js-mobile-mode .menu,
#navigation[data-template="campaign-1"].js-mobile-mode .menu,
#navigation[data-template="campaign-2"].js-mobile-mode .menu {
    display: none !important;
}
#navigation.js-mobile-mode .menu-open-button,
#navigation[data-template="campaign-1"].js-mobile-mode .menu-open-button,
#navigation[data-template="campaign-2"].js-mobile-mode .menu-open-button {
    display: inline !important;
}
#navigation.js-desktop-mode .menu,
#navigation[data-template="campaign-1"].js-desktop-mode .menu,
#navigation[data-template="campaign-2"].js-desktop-mode .menu {
    display: flex !important;
}
#navigation.js-desktop-mode .menu-open-button,
#navigation[data-template="campaign-1"].js-desktop-mode .menu-open-button,
#navigation[data-template="campaign-2"].js-desktop-mode .menu-open-button {
    display: none !important;
}
#navigation .menu {margin-right:20px!important;}
/* Campaign-2 overrides */
.menu li a { font-size: clamp(13px, 1.2vw, 17px) !important; padding-left: clamp(8px, 1.5vw, 35px) !important; padding-right: clamp(8px, 1.5vw, 35px) !important; line-height: 1.1 !important; }
.menu { height: auto !important; min-height: auto !important; }
@media screen and (max-width: 959px) { #navigation .menu { display: flex !important; } }
@media screen and (max-width: 500px) { #navigation .menu { display: none !important; } }
/* Theme fixes */

/* Sidebar Button CSS */
#sidebarSocial { margin: 20px auto; text-align: center; }
#sidebarSocial img { box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3); }
.fb-like-box { background-color: #ffffff; padding: 5px 0 10px; margin: 10px auto 10px -3px!important; border: 1px solid #ccc; }
#fbFeedWrapper { margin: 10px auto 10px 20px; width: 232px; }
.nButtonWrapper { width: 222px; text-align: center; padding-top: 5px; margin: 8px auto; }
#newbuttons { text-align: center; margin-top: 10px; padding-top: 5px; width: 222px; margin: 10px auto; }
.nButtonWrapper a, #newbuttons a { box-shadow: 0px 2px 5px rgba(0,0,0,0.3); padding: 8px 0; border-radius: 0; cursor: pointer; text-align: center; text-decoration: none; transition: background-color 0.15s ease-out 0s; width: 222px; height: 44px; font-family: 'Open Sans', Helvetica, Arial; vertical-align: middle !important; font-weight: normal; font-size: 17px; text-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1); display: table-cell; }
#newbuttons a:hover { transition: all 0.25s ease 0s; text-decoration: none !important; box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1); }
/****** HELLO ******/
.mediumBlueButton { background-color:#2775B2; border:1px solid #005785; color: #fff; font-size: px; background: rgba(42,124,190,1);
background: -moz-linear-gradient(top, rgba(42,124,190,1) 0%, rgba(33,104,156,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(42,124,190,1)), color-stop(100%, rgba(33,104,156,1)));
background: -webkit-linear-gradient(top, rgba(42,124,190,1) 0%, rgba(33,104,156,1) 100%);
background: -o-linear-gradient(top, rgba(42,124,190,1) 0%, rgba(33,104,156,1) 100%);
background: -ms-linear-gradient(top, rgba(42,124,190,1) 0%, rgba(33,104,156,1) 100%);
background: linear-gradient(to bottom, rgba(42,124,190,1) 0%, rgba(33,104,156,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2a7cbe', endColorstr='#21689c', GradientType=0 ); }
.mediumBlueButton:hover { opacity: .85; transition: all 0.25s ease 0; }
.mediumGreenButton { background-color:#76A06F; border:1px solid #5A875A; color: #fff; font-size: px; background: rgba(133,173,133,1);
background: -moz-linear-gradient(top, rgba(133,173,133,1) 0%, rgba(95,141,95,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(133,173,133,1)), color-stop(100%, rgba(95,141,95,1)));
background: -webkit-linear-gradient(top, rgba(133,173,133,1) 0%, rgba(95,141,95,1) 100%);
background: -o-linear-gradient(top, rgba(133,173,133,1) 0%, rgba(95,141,95,1) 100%);
background: -ms-linear-gradient(top, rgba(133,173,133,1) 0%, rgba(95,141,95,1) 100%);
background: linear-gradient(to bottom, rgba(133,173,133,1) 0%, rgba(95,141,95,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#85ad85', endColorstr='#5f8d5f', GradientType=0 ); }
.mediumGreenButton:hover { opacity: .85; transition: all 0.25s ease 0; }
.goldButton { background-color:#DDB52D; border:1px solid #B69526; color: #fff; font-size: px; background: rgba(239,196,49,1);
background: -moz-linear-gradient(top, rgba(239,196,49,1) 0%, rgba(180,148,37,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(239,196,49,1)), color-stop(100%, rgba(180,148,37,1)));
background: -webkit-linear-gradient(top, rgba(239,196,49,1) 0%, rgba(180,148,37,1) 100%);
background: -o-linear-gradient(top, rgba(239,196,49,1) 0%, rgba(180,148,37,1) 100%);
background: -ms-linear-gradient(top, rgba(239,196,49,1) 0%, rgba(180,148,37,1) 100%);
background: linear-gradient(to bottom, rgba(239,196,49,1) 0%, rgba(180,148,37,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#efc431', endColorstr='#b49425', GradientType=0 ); }
.goldButton:hover { opacity: .85; transition: all 0.25s ease 0; }
/* Button Fix */
.blackButton,
.brightBlueButton,
.brightBlue2,
.brightRedButton,
.brightRed2,
.championBlue,
.championRed,
.darkBlueButton,
.darkBlue2,
.darkGreenButton,
.fadedBlueButton,
.fadedRedButton,
.flatRedButton,
.freedomBlue,
.freedomRed,
.goldButton,
.goldButtonGradient,
.independenceBlue,
.independenceRed,
.libertyBlue,
.libertyRed,
.lightBlueButton,
.mediumBlueButton,
.mediumBlueButtonGradient,
.mediumGreenButton,
.mediumGreenButtonGradient,
.mediumRedButton,
.nationalRed,
.plymouthBlue,
.plymouthRed,
.saturatedRedButton {
    color: #fff !important;
}
#s-bb474ff4a8e24956a80012c98ac990f1 { vertical-align:middle!important; font-size:17px!important; font-family:'gotham_mediumregular'!important; }
#z-bb474ff4-a8e2-4956-a800-12c98ac990f1 { font-size:17px!important; font-family:'gotham_mediumregular'; text-decoration:none; text-shadow:0px 2px 2px rgba(0, 0, 0, 0.2) }
#s-83aea29bd1514f17a342cd4c820513c3 { vertical-align:middle!important; font-size:17px!important; font-family:'gotham_mediumregular'!important; }
#z-83aea29b-d151-4f17-a342-cd4c820513c3 { font-size:17px!important; font-family:'gotham_mediumregular'; text-decoration:none; text-shadow:0px 2px 2px rgba(0, 0, 0, 0.2) }
#s-4160d1bb727f4f548ba6475d4ff590b0 { vertical-align:middle!important; font-size:17px!important; font-family:'gotham_mediumregular'!important; }
#z-4160d1bb-727f-4f54-8ba6-475d4ff590b0 { font-size:17px!important; font-family:'gotham_mediumregular'; text-decoration:none; text-shadow:0px 2px 2px rgba(0, 0, 0, 0.2) }
/* Font CSS */

/* Customer Font Selections */
.news-feed h1, #content h1{padding-bottom:0;font-family: 'Outfit', sans-serif; color:#B02038;line-height:clamp(0.95em, calc(0.929em + 0.0057vw), 1.00em); font-size:clamp(24px, calc(20.57px + 0.914vw), 32px); font-weight:700!important;}
#amountsTitle, .news-feed h3, #newsCol h3, #content h3{padding-bottom:0;font-family: 'Outfit', sans-serif; color:#B02038!important; line-height:clamp(0.95em, calc(0.929em + 0.0057vw), 1.00em); font-size:clamp(24px, calc(21.43px + 0.686vw), 30px); font-weight:700!important;}
#issuesSection h3 a, .news-feed h3 a, #newsCol h3 a, #eventsWrapper h3 a, #content h3 a{padding-bottom:0;font-family: 'Outfit', sans-serif; color:#B02038!important; line-height:clamp(0.95em, calc(0.929em + 0.0057vw), 1.00em); font-size:clamp(24px, calc(21.43px + 0.686vw), 30px); font-weight:700!important;}
#issuesSection h3 a:hover, .news-feed h3 a:hover, #newsCol h3 a:hover, #eventsWrapper h3 a:hover, #content h3 a:hover{color:#c35769!important;}
#issuesSection, .news-feed{font-family: 'Mulish', sans-serif; color:#333333; line-height:clamp(1.53em, calc(1.457em + 0.0194vw), 1.70em); font-size:clamp(16px, calc(15.14px + 0.229vw), 18px); font-weight:400!important;}
#issuesSection a, .news-feed a{color:#B02038} #content a:hover{color:#c35769;}
#amountsText,#content {font-family: 'Mulish', sans-serif; color:#333333; line-height:clamp(1.53em, calc(1.457em + 0.0194vw), 1.70em); font-size:clamp(16px, calc(15.14px + 0.229vw), 18px); font-weight:400!important;}
#content a{color:#B02038} #content a:hover{color:#c35769;}
.horizontalButtons{display:flex;flex-flow:column wrap;text-align:center;max-width:500px;margin:20px auto}.horizontalButtons a{background-color:#29aae1;font-family: 'Outfit', sans-serif; padding:20px;color:#fff!important;font-size:18px;font-weight:600;text-align:center;text-decoration:none;text-transform:uppercase;display:block;flex-direction:column;flex-basis:auto;flex-grow:1;justify-content:center;align-items:center; margin:1px;}.horizontalButtons a:hover{opacity:.85;transition:all .25s ease 0}#emailSignupHeader{font-family: 'Outfit', sans-serif;}
/* Content block font matching */
/* Customer Font Selections */
.news-feed h1, .content-area h1{padding-bottom:0;font-family: 'Outfit', sans-serif; color:#B02038;line-height:clamp(0.95em, calc(0.929em + 0.0057vw), 1.00em); font-size:clamp(24px, calc(20.57px + 0.914vw), 32px); font-weight:700!important;}
#amountsTitle, .news-feed h3, #newsCol h3, .content-area h3{padding-bottom:0;font-family: 'Outfit', sans-serif; color:#B02038!important; line-height:clamp(0.95em, calc(0.929em + 0.0057vw), 1.00em); font-size:clamp(24px, calc(21.43px + 0.686vw), 30px); font-weight:700!important;}
#issuesSection h3 a, .news-feed h3 a, #newsCol h3 a, #eventsWrapper h3 a, .content-area h3 a{padding-bottom:0;font-family: 'Outfit', sans-serif; color:#B02038!important; line-height:clamp(0.95em, calc(0.929em + 0.0057vw), 1.00em); font-size:clamp(24px, calc(21.43px + 0.686vw), 30px); font-weight:700!important;}
#issuesSection h3 a:hover, .news-feed h3 a:hover, #newsCol h3 a:hover, #eventsWrapper h3 a:hover, .content-area h3 a:hover{color:#c35769!important;}
.content-area a:hover{color:#c35769;}
#amountsText,.content-area{font-family: 'Mulish', sans-serif; color:#333333; line-height:clamp(1.53em, calc(1.457em + 0.0194vw), 1.70em); font-size:clamp(16px, calc(15.14px + 0.229vw), 18px); font-weight:400!important;}
.content-area a{color:#B02038}
.content-area a:hover{color:#c35769;}

/* Slideshow CSS */

/* Slides */

.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;}
.slide-box{font-size:clamp(0.4em, 1.2vw, 0.5em); padding:clamp(6px, 1.5vw, 10px) clamp(12px, 3vw, 20px); line-height:2.8em; border:1px solid #fff; display:inline-block; margin-top:clamp(8px, 2vw, 16px); transition:background-color 0.2s ease, color 0.2s ease;}
.slide-box:hover{background-color:rgba(255,255,255,0.15);}
.slide-link{display:block; width:100%; height:100%; position:absolute; top:0; left:0; z-index:1; text-decoration:none;}
.cycle-slideshow > div:not(:first-child):not(.cycle-sentinel):not(.cycle-caption){position:absolute; top:0; left:0; opacity:0; visibility:hidden;}
.cycle-slideshow > div:first-child{position:relative; opacity:1; visibility:visible;}
/* Text/mixed slides — configured height, JS scales proportionally */
#slideshow-6d2e69f2-7cb8-4047-8fc5-f3272f3c8d3b {width: 100%; min-height:200px; height: 33vh!important; margin: 0 auto; position:relative; overflow:hidden;}
#slideshow-6d2e69f2-7cb8-4047-8fc5-f3272f3c8d3b div { width: 100% !important; height: 100%!important; display: flex; align-items: center; justify-content: center; }
#slideshow-6d2e69f2-7cb8-4047-8fc5-f3272f3c8d3b div img { height: auto !important; width: 100% !important; }
#rotatorBG-6d2e69f2-7cb8-4047-8fc5-f3272f3c8d3b{min-height: 33vh!important;background-color:#003070; overflow:hidden;}
 

#div-9b22661c-ea05-4ec1-8b23-85de0d5386ba {}

#wrapper-9b22661c-ea05-4ec1-8b23-85de0d5386ba {max-width:960px; width:100%; display:flex!important; align-items:center; justify-content:center; padding:clamp(16px, 4vw, 40px); box-sizing:border-box;}

#content-9b22661c-ea05-4ec1-8b23-85de0d5386ba {text-align:center; flex-direction:column; line-height:1.5; color:#FFFFFF; font-weight: 700; font-size: clamp(22px, 3.5vw, 44px); font-family: 'Poppins', sans-serif; }

#content-9b22661c-ea05-4ec1-8b23-85de0d5386ba a{color:#FFFFFF; text-decoration:none; }

#content-9b22661c-ea05-4ec1-8b23-85de0d5386ba a:hover{color:#FFFFFF; text-decoration:none; }

#content-9b22661c-ea05-4ec1-8b23-85de0d5386ba .slide-box{color:#FFFFFF; }

#div-5cb8578f-dc2c-4d8d-8ca2-62e27c1c802a { visibility:hidden; }

#wrapper-5cb8578f-dc2c-4d8d-8ca2-62e27c1c802a {max-width:960px; width:100%; display:flex!important; align-items:center; justify-content:center; padding:clamp(16px, 4vw, 40px); box-sizing:border-box;}

#content-5cb8578f-dc2c-4d8d-8ca2-62e27c1c802a {text-align:center; flex-direction:column; line-height:1.5; color:#FFFFFF; font-weight: 700; font-size: clamp(22px, 3.5vw, 44px); font-family: 'Poppins', sans-serif; }

#content-5cb8578f-dc2c-4d8d-8ca2-62e27c1c802a a{color:#FFFFFF; text-decoration:none; }

#content-5cb8578f-dc2c-4d8d-8ca2-62e27c1c802a a:hover{color:#FFFFFF; text-decoration:none; }

#content-5cb8578f-dc2c-4d8d-8ca2-62e27c1c802a .slide-box{color:#FFFFFF; }

#div-ab464226-b7a0-4a1e-ba5c-494a7291063e { visibility:hidden; }

#wrapper-ab464226-b7a0-4a1e-ba5c-494a7291063e {max-width:960px; width:100%; display:flex!important; align-items:center; justify-content:center; padding:clamp(16px, 4vw, 40px); box-sizing:border-box;}

#content-ab464226-b7a0-4a1e-ba5c-494a7291063e {text-align:center; flex-direction:column; line-height:1.5; color:#FFFFFF; font-weight: 700; font-size: clamp(22px, 3.5vw, 44px); font-family: 'Poppins', sans-serif; }

#content-ab464226-b7a0-4a1e-ba5c-494a7291063e a{color:#FFFFFF; text-decoration:none; }

#content-ab464226-b7a0-4a1e-ba5c-494a7291063e a:hover{color:#FFFFFF; text-decoration:none; }

#content-ab464226-b7a0-4a1e-ba5c-494a7291063e .slide-box{color:#FFFFFF; }
/* Countdown CSS */
/* Hero CSS */
/* Signup CSS */

/* Signup Widget */

#signupWrapper {background-color: #002D72!important;}
#emailSignupHeader {color: #FFFFFF!important;}
#signupDisclaimer {color: #FFFFFF!important;}
#signupThanks {color: #FFFFFF!important;}
#subButton {background-color: #961B30!important;}
#subButton:hover{background-color: #961B30!important;opacity:0.8}
#subButton {color: #FFFFFF!important;}
#signupWrapper { max-width: 100%; border-radius: 0; }
.signupDisclaimer{ text-align:center; margin: 10px 10px 0 10px; }
/* Icon CSS */
.icon-container { display: flex; flex-wrap: wrap; justify-content: center; gap: 5px; /* Reduced from 12px to 5px for closer spacing */ margin: 25px 0; }
.social-icon { display: inline-flex; justify-content: center; align-items: center; width: 40px; height: 40px; border-radius: 6px; /* Rounded edges */ transition: all 0.3s ease; }
.social-icon:hover { transform: scale(1.1); box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2); cursor: pointer; }
.social-icon i { color: white !important; /* White icons for contrast */ font-size: 22px; }
.facebook { background-color: #3b5998; }
.x-twitter { background-color: #000000; color: #ffffff !important; }
.youtube { background-color: #FF0000; }
.instagram { background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%); }
.tumblr { background-color: #36465d; }
.linkedin { background-color: #0077b5; }
.tiktok { background-color: #000000; }
.whatsapp { background-color: #25D366; }
.threads { background: linear-gradient(135deg, #000000, #333333); }
.bluesky { background-color: #1DA1F2; }
.medium { background-color: #000000; }
.flickr { background: linear-gradient(90deg, #0063dc 50%, #ff0084 50%); }
.threads i { font-size: 20px; }
.bluesky i { font-size: 22px; }


/* Multi-level Nav CSS */
/* Responsive Logo CSS */
.tinyLogo { display: flex; align-items: center; max-width: 100%; flex-shrink: 0; }
.tinyLogo img { max-width: 100%; height: auto; display: block; width: auto; object-fit: contain; }
@media (max-width: 768px) { .tinyLogo img { max-width: 150px; min-width: 100px; } }
@media (min-width: 769px) and (max-width: 1024px) { .tinyLogo img { max-width: 200px; } }
@media (min-width: 1025px) { .tinyLogo img { max-width: 250px; } }
.tinyLogo img { max-height: 60px; width: auto; aspect-ratio: auto; }
.tinyLogo img[src$=".svg"] { max-width: 100%; max-height: 60px; width: auto; height: auto; object-fit: contain; }
@media screen and (-webkit-min-device-pixel-ratio: 2) { .tinyLogo img { transform: translateZ(0); -webkit-backface-visibility: hidden; } }

#eventsBar{color:#000;}
#eventsTopLinks {display: flex; background: #f8f9fa; border-radius: 6px; overflow: hidden; margin: 10px 0;}
#eventsTopLinks a {flex: 1; text-align: center; padding: 12px 8px; text-decoration: none; color: #000; background: #e9ecef; border-right: 1px solid #dee2e6; transition: background-color 0.2s ease;}
#eventsTopLinks a:hover {background: #dee2e6; color:#000;}
#eventsTopLinks a:last-child {border-right: none;}
#eventsTopLinks .pad {display: none;}
#eventsBar {display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; margin: 10px 0; padding: 10px; background: #f8f9fa; border-radius: 6px;}
#eventsBar a {color: #000; text-decoration: none;}
#eventsBar a:hover {text-decoration: underline;}
#eventsBar .pad {display: none;}
#eventsBar > span:not(.pad) {text-align: center; color: #000;}
@media (max-width: 600px) {
    #eventsTopLinks a {padding: 10px 4px; font-size: 14px;}
    #eventsBar {grid-template-columns: 1fr 2fr 1fr; gap: 8px; padding: 8px;}
}
@media (max-width: 480px) {
    #eventsTopLinks a {padding: 8px 2px; font-size: 12px;}
    #eventsBar {font-size: 12px;}
}