@import url('//fonts.googleapis.com/css2?family=Asap:ital,wght@0,100..900;1,100..900&family=PT+Serif:ital,wght@0,400;0,700;1,400;1,700&display=swap');
/************ TEMPLATE  ************
COLORS (Gradients? | Include RGBs)
Primary: Blue 2F2D5B rgb(47,45,91)
Secondary: Red A51724 rgb(165,23,36)
Tertiary: Gold  AC8E4A rgb(172,142,74)

FONTS USED (Google)
Display: PT Serif
Body: Asap

IMAGES (Opacity | Blur Radius)
- Mission Statements: 88% Opacity. 2px blur.

************/

.site-3 {
    --primary-color: #2F2D5B;
    --secondary-color: #A51724;
    --tertiary-color: #AC8E4A;

    --primary-rgb: 47, 45, 91;
    --secondary-rgb: 165, 23, 36;
    --tertiary-rgb: 172, 142, 74;

    --default-white: #ffffff;
    --default-black: #000000;

    --title-font-family: 'PT Serif', serif;
    --body-font-family: 'Asap', serif;

    --heading-color: var(--primary-color);
    --heading-font-family: var(--title-font-family);

    --title-border-bottom: 1px solid var(--secondary-color);

    --home-title-font: var(--title-font-family);

    --transparent: rgba(255, 255, 255, 0);

    --default-box-shadow: 0px 0px 10px rgba(0, 0, 0, .5);

    --swiper-box-shadow: var(--default-box-shadow);

    --ql-title-color: var(--default-white);

    --hero-title-left-position: 5%;
}

.site-3 .ql-fa-toplinks {
    --ql-title-color: var(--primary-color);
}

.readon,
.button,
.btn,
p.readmore .btn,
.sprocket-lists-portrait-container>li .sprocket-lists-portrait-item>a span,
.listentobutton.moduletable a {
    background: var(--primary-color);
    font-family: var(--body-font-family);
}

/*************** ALL SITE *****************/
.item-image {
    display: none;
}

:is(.site-1-home, .site-2-home, .site-3-home) #g-page-surround .g-content {
    padding: 0;
}

:is(.site-1-home, .site-2-home, .site-3-home) #g-page-surround .g-array-item-text {
    margin: 0;
}

:is(.site-1-sub, .site-2-sub, .site-3-sub) section:not(#g-navigation, #g-bottom, #g-container-footer, #g-copyright) .g-content:not(.g-blockcontent-subcontent-block-content) {
    margin: 0.625rem !important;
    padding: 1.5rem !important;
}

:is(.site-1-sub, .site-2-sub, .site-3-sub) section:not(#g-navigation, #g-container-footer, #g-copyright) #grid-addpic .g-content {
    padding: 0 !important;
    margin: 0 !important;
}

:is(.site-1-sub, .site-2-sub, .site-3-sub) section#g-container-main #g-aside .g-content {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

@media (min-width: 50.99rem) {
    :is(.site-1-home, .site-2-home, .site-3-home) #g-top .modern-alert .g-joomla-articles {
        padding: 0 3% !important;
    }
}

/*************** HOMELAYOUT ***************/
/*************** OFFCANVAS ****************/
.g-offcanvas-toggle {
    color: var(--primary-color);
}

.g-offcanvas-toggle .fa-fw {
    text-shadow: none;
}

@media only screen and (max-width: 50.99rem) {
    .site-3 #g-offcanvas .g-social-items {
        display: flex;
        flex-direction: row;
        gap: 2rem;
        align-items: center;
        justify-content: center;
    }

    .site-3 #g-offcanvas .g-social-items a {
        color: var(--default-white);
    }

    .site-3 #g-offcanvas .g-social-items a:hover {
        color: var(--tertiary-color);
    }
}

/*************** TOP **********************/
/*************** NAVIGATION ***************/
@media only screen and (min-width: 50.99rem) {
    .site-3 #g-navigation {
        position: relative;
        z-index: 100;
    }

    .site-3 #g-navigation>.g-container>.g-grid:has(.ql-fa-toplinks) {
        padding: 1.5vw 2vw !important;
    }

    .site-3 #g-navigation>.g-container>.g-grid:has(.g-main-nav) {
        box-shadow: var(--default-box-shadow);
    }

    .site-3 #g-navigation .g-logo img {
        width: 100%;
    }
}

@media only screen and (min-width: 50.99rem) {
    .site-3 #g-navigation .ql-fa-toplinks {
        --ql-title-color: var(--primary-color);
        --ql-icon-color: var(--secondary-color);
        --ql-background-hover: rgba(var(--tertiary-rgb), .5);
        --ql-icon-hover: var(--primary-color);
        --ql-title-hover: var(--primary-color);
    }

    .site-3 #g-navigation .ql-fa-toplinks .g-blockcontent-subcontent-block {
        border-radius: 1rem;
    }

    .site-3 #g-navigation .ql-fa-toplinks .g-blockcontent-subcontent-block-content {
        gap: 1vw;
    }

    .site-3 #g-navigation .ql-fa-toplinks .g-blockcontent-subcontent-title-icon {
        font-size: 3.5vw;
        margin: 0;
        padding: 0;
        line-height: 1;
    }

    .site-3 #g-navigation .ql-fa-toplinks .g-blockcontent-subcontent-title-text {
        font-size: 1.5vw;
        font-family: var(--body-font-family);
        font-weight: 500;
    }

    .site-3 #g-navigation .ql-fa-toplinks .g-blockcontent-subcontent-block:not(.ql-fa-toplinks .g-blockcontent-subcontent-block:last-child) {
        border: none !important;
    }
}

@media only screen and (max-width: 50.99rem) {
    .site-3 #g-navigation .ql-fa-toplinks .g-blockcontent-subcontent {
        justify-content: center;
        gap: 3rem;
    }

    .site-3 #g-navigation .ql-fa-toplinks .g-blockcontent-subcontent-block {
        flex: unset;
    }

    .site-3 #g-navigation .ql-fa-toplinks .g-blockcontent-subcontent-block-content>.g-blockcontent-subcontent-title {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .site-3 #g-navigation .ql-fa-toplinks .g-blockcontent-subcontent-title-icon {
        color: var(--secondary-color);
    }

    .site-3 #g-navigation .ql-fa-toplinks .g-blockcontent-subcontent-title-text {
        color: var(--primary-color);
    }

    .site-3 #g-navigation .ql-fa-toplinks .g-blockcontent-subcontent-block:not(.ql-fa-toplinks .g-blockcontent-subcontent-block:last-child) {
        border: none !important;
    }
}

@media only screen and (min-width: 50.99rem) {
    .g-main-nav .g-toplevel>li>.g-menu-item-container>.g-menu-item-content {
        font-size: 1.25vw;
        font-family: var(--body-font-family);
    }

    .g-main-nav .g-sublevel>li>.g-menu-item-container>.g-menu-item-content>.g-menu-item-title {
        font-size: 1.25vw;
        font-family: var(--body-font-family);
    }

    .site-3 #g-navigation .g-social-items {
        display: flex;
        flex-direction: row;
        gap: 1vw;
        align-items: center;
    }

    .site-3 #g-navigation .g-social-items a {
        color: var(--default-white);
        font-size: 2vw;
    }

    .site-3 #g-navigation .g-social-items a:hover {
        color: var(--tertiary-color);
    }
}

@media only screen and (max-width: 50.99rem) {
    #g-navigation .g-logo {
        max-width: 65%;
        margin: 2rem auto;
    }
}

/*************** SLIDESHOW ****************/
@media only screen and (min-width: 50.99rem) {
    .site-3-home #g-slideshow {
        border-bottom: 2rem solid var(--secondary-color);
    }
}

@media only screen and (max-width: 50.99rem) {
    .site-3-home #g-slideshow {
        border-bottom: 1rem solid var(--secondary-color);
    }
}

@media only screen and (min-width: 50.99rem) {
    .swiper-overlay-links .ql-swiper-overlay {
        --ql-background-color: rgba(var(--tertiary-rgb), .8);
        --ql-background-hover: rgba(var(--tertiary-rgb), 1);
    }

    .swiper-overlay-links .g-container>.g-grid:nth-child(2) {
        top: 1vw;
        bottom: 1vw;
        height: calc(100% - 2vw);
        pointer-events: none !important;
    }

    .swiper-overlay-links .ql-swiper-overlay .g-blockcontent-subcontent-block {
        pointer-events: all !important;
    }

    .swiper-overlay-links .ql-swiper-overlay .g-blockcontent-subcontent-block-content:not(.ql-swiper-overlay .swiper-empty .g-blockcontent-subcontent-block-content) {
        padding: 2vw !important;
        justify-content: flex-start;
    }
}

@media only screen and (max-width: 50.99rem) {
    .swiper-overlay-links .ql-swiper-overlay .g-blockcontent-subcontent-block {
        background: rgba(var(--primary-rgb), .8);
    }

    .swiper-overlay-links .ql-swiper-overlay .g-blockcontent-subcontent-block:not(.ql-swiper-overlay .g-blockcontent-subcontent-block.swiper-logo, .ql-swiper-overlay .g-blockcontent-subcontent-block.swiper-empty):hover {
        background: rgba(var(--primary-rgb), 1);
    }

    .swiper-overlay-links .ql-swiper-overlay .g-blockcontent-subcontent-block-content:not(.ql-swiper-overlay .swiper-empty .g-blockcontent-subcontent-block-content) {
        padding: 1rem !important;
    }
}

/*************** HEADER *******************/
/*************** ABOVE ********************/
/*************** SHOWCASE *****************/
@media only screen and (min-width: 50.99rem) {
    .site-3-home #g-showcase>.g-container {
        padding: 4vw 5% !important;
        display: flex;
        flex-direction: column;
        gap: 2vw;
    }

    .calendar-container .g-title {
        margin: 0;
        padding: 0;
        color: var(--default-white);
        font-family: var(--title-font-family);
        line-height: 1;
        border-bottom: 3px solid var(--default-white);
        padding-bottom: .75vw;
        margin-bottom: 1.5vw;
        text-transform: none;
        font-variant-caps: normal;
        font-size: 4vw;
        font-weight: 400;
        letter-spacing: 2px;
    }

    .calendar-container p {
        margin: 0;
        padding: 0;
    }

    .calendar-container iframe {
        width: 100%;
        height: 42vw;
        border-radius: 1rem;
        overflow: hidden;
        box-shadow: var(--default-box-shadow);
    }

    .calendar-button .button {
        width: 37%;
        padding: 1vw;
        line-height: 1;
        font-family: var(--title-font-family);
        font-size: 1.5vw;
        font-weight: 700;
        color: var(--default-white);
        background: var(--tertiary-color);
        box-shadow: var(--default-box-shadow);
        letter-spacing: 2px;
    }

    .calendar-button .button:hover {
        transform: scale(1.05);
    }
}

@media only screen and (max-width: 50.99rem) {
    .site-3-home #g-showcase>.g-container {
        padding: 2rem !important;
        display: flex;
        flex-direction: column;
        gap: 1rem;
    }

    .calendar-container .g-title {
        margin: 0;
        padding: 0;
        color: var(--default-white);
        font-family: var(--title-font-family);
        line-height: 1;
        border-bottom: 3px solid var(--default-white);
        padding-bottom: .5rem;
        margin-bottom: 1rem;
        text-transform: none;
        font-variant-caps: normal;
        font-size: 10vw;
        font-weight: 400;
        letter-spacing: 2px;
        text-align: center;
    }

    .calendar-container p {
        margin: 0;
        padding: 0;
    }

    .calendar-container iframe {
        width: 100%;
        height: 150vw;
        border-radius: 1rem;
        overflow: hidden;
        box-shadow: var(--default-box-shadow);
    }

    .calendar-button .button {
        padding: 1rem;
        line-height: 1;
        font-family: var(--title-font-family);
        font-size: 4.5vw;
        font-weight: 700;
        color: var(--default-white);
        background: var(--tertiary-color);
        box-shadow: var(--default-box-shadow);
        letter-spacing: 2px;
    }

    .calendar-button .button:hover {
        transform: scale(1.05);
    }
}

/*************** UTILITY ******************/
/*************** FEATURE ******************/
@media only screen and (min-width: 50.99rem) {
    .site-3-home #g-feature>.g-container {
        padding: 4vw 5% !important;
    }

    .site-3-home #g-feature>.g-container>.g-grid {
        display: flex;
        flex-direction: row;
        gap: 3vw;
    }

    .site-3-home #g-feature>.g-container>.g-grid>.g-block:has(.social-feed-wrapper) {
        flex: 80;
        width: unset;
    }

    .site-3-home #g-feature>.g-container>.g-grid>.g-block:has(.admod.adside) {
        flex: unset;
        max-width: 165px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
}

@media only screen and (max-width: 50.99rem) {
    .site-3-home #g-feature>.g-container {
        padding: 2rem !important;
    }

    .site-3-home #g-feature>.g-container>.g-grid {
        display: flex;
        flex-direction: column;
        gap: 2rem;
    }

    .site-3-home #g-feature>.g-container>.g-grid>.g-block {
        width: 100%;
        flex: unset;
    }
}

@media only screen and (min-width: 50.99rem) {
    .cwu-container .g-title {
        margin: 0;
        padding: 0;
        color: var(--primary-color);
        font-family: var(--title-font-family);
        line-height: 1;
        border-bottom: 3px solid var(--primary-color);
        padding-bottom: .75vw;
        margin-bottom: 1.5vw;
        text-transform: none;
        font-variant-caps: normal;
        font-size: 4vw;
        font-weight: 400;
        letter-spacing: 2px;
    }

    .social-feed-wrapper {
        display: flex;
        flex-direction: row;
        gap: 5vw;
    }

    .social-feed-wrapper .social-feed {
        flex: 1;
    }

    .social-feed-wrapper .calendar-feed>.calendar-feed-wrapper:has(iframe) {
        display: flex;
        padding-bottom: 1.5vw;
    }

    .social-feed-wrapper .calendar-feed iframe {
        height: 70vw;
        border-radius: 1rem;
        overflow: hidden;
        box-shadow: var(--default-box-shadow);
    }

    .social-feed-wrapper .calendar-feed-wrapper>.button {
        width: 100%;
        padding: 1vw;
        font-family: var(--body-font-family);
        font-size: 1.5vw;
        letter-spacing: 2px;
        margin: 0;
    }

    .social-feed-wrapper .calendar-feed-wrapper>.button:hover {
        transform: scale(1.05);
    }

    .social-feed-wrapper .instagram-feed>.eapps-widget {
        border-radius: 1rem;
        overflow: hidden;
        box-shadow: var(--default-box-shadow);
    }

    .social-feed-wrapper .instagram-feed .eapps-instagram-feed-posts-grid-load-more-container {
        display: none !important;
    }

    .social-feed-wrapper .instagram-feed .eapps-instagram-feed-header {
        margin: 0;
        padding: 0;
    }

    .social-feed-wrapper .facebook-feed>.facebook-feed-wrapper {
        height: calc(100% - 6.25vw);
    }

    .social-feed-wrapper .facebook-feed>.facebook-feed-wrapper>.eapps-widget {
        height: 100%;
        border-radius: 1rem;
        overflow: hidden;
        box-shadow: var(--default-box-shadow);
    }

    .social-feed-wrapper .facebook-feed-wrapper>.eapps-widget>.eapps-widget {
        height: 100%;
    }

    .social-feed-wrapper .facebook-feed-wrapper>.eapps-widget>.eapps-widget>.eapps-facebook-feed-container {
        height: 100%;
    }

    .social-feed-wrapper .facebook-feed-wrapper>.eapps-widget>.eapps-widget>.eapps-facebook-feed-container>.eapps-facebook-feed-inner {
        height: 100%;
        display: flex;
        flex-direction: column;
    }

    .social-feed-wrapper .facebook-feed-wrapper>.eapps-widget>.eapps-widget>.eapps-facebook-feed-container>.eapps-facebook-feed-inner>.eapps-facebook-feed-content-container {
        /*height: unset!important;*/
        flex: 1 1 auto;
    }

}

@media only screen and (max-width: 50.99rem) {
    .cwu-container .g-title {
        margin: 0;
        padding: 0;
        color: var(--primary-color);
        font-family: var(--title-font-family);
        line-height: 1;
        border-bottom: 3px solid var(--primary-color);
        padding-bottom: .5rem;
        margin-bottom: 1rem;
        text-transform: none;
        font-variant-caps: normal;
        font-size: 10vw;
        font-weight: 400;
        letter-spacing: 2px;
        text-align: center;
    }

    .social-feed-wrapper {
        display: flex;
        flex-direction: column;
        gap: 2rem;
    }

    .social-feed-wrapper .instagram-feed .eapps-instagram-feed-posts-grid-load-more-container {
        display: none !important;
    }

    .social-feed-wrapper .instagram-feed .eapps-instagram-feed-header {
        margin: 0;
        padding: 0;
    }

    .social-feed-wrapper .instagram-feed>.eapps-widget {
        border-radius: 1rem;
        overflow: hidden;
        box-shadow: var(--default-box-shadow);
    }

    .social-feed-wrapper .facebook-feed>.eapps-widget {
        border-radius: 1rem;
        overflow: hidden;
        box-shadow: var(--default-box-shadow);
    }

    .social-feed-wrapper .calendar-feed>.calendar-feed-wrapper:has(iframe) {
        display: flex;
        padding-bottom: 1rem;
    }
}

/*************** MAIN *********************/
@media only screen and (min-width: 50.99rem) {
    .site-3-sub #g-mainbar {
        min-height: 30vh;
    }
}

@media only screen and (max-width: 50.99rem) {
    :is(.site-1-sub, .site-2-sub, .site-3-sub) #g-mainbar>.g-grid>.g-block>.g-content {
        margin: 0;
        padding: 0;
    }
}

/*************** EXPANDED *****************/
@media only screen and (min-width: 50.99rem) {
    .site-3-home #g-expanded {
        background: url('/images/template/bg-mission-eec.JPG') 50% 50% no-repeat;
        background-size: cover;
        background-attachment: fixed;
        border-bottom: 2rem solid var(--tertiary-color);
    }

    .site-3-home #g-expanded>.g-container {
        background: rgba(var(--secondary-rgb), .88);
        backdrop-filter: blur(2px);
        --webkit-backdrop-filter: blur(2px);
        padding: 2vw 10% !important;
    }
}

@media only screen and (max-width: 50.99rem) {
    .site-3-home #g-expanded {
        background: url('/images/template/bg-mission-eec.JPG') 50% 50% no-repeat;
        background-size: cover;
        border-bottom: 1rem solid var(--tertiary-color);
    }

    .site-3-home #g-expanded>.g-container {
        background: rgba(var(--secondary-rgb), .88);
        backdrop-filter: blur(2px);
        --webkit-backdrop-filter: blur(2px);
        padding: 2rem 1rem !important;
    }
}

@media only screen and (min-width: 50.99rem) {
    .mission-wrapper {
        display: flex;
        flex-direction: column;
        gap: 2vw;
        justify-content: center;
        align-items: center;
    }

    .mission-title-wrapper {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .mission-title-wrapper h1 {
        color: var(--default-white);
        font-family: var(--title-font-family);
        line-height: 1;
        margin: 0;
        padding: 0;
        text-transform: none;
        font-variant-caps: normal;
        font-size: 3.5vw;
        font-weight: 400;
        background: none;
        border: none;
        text-align: center;
        margin-bottom: .5vw;
    }

    .mission-title-wrapper h6 {
        color: var(--default-white);
        font-family: var(--title-font-family);
        line-height: 1;
        margin: 0;
        padding: 0;
        text-transform: none;
        font-variant-caps: normal;
        font-size: 1.75vw;
        font-weight: 500;
        background: none;
        border: none;
        text-align: center;
    }

    .mission-content {
        display: flex;
        flex-direction: column;
        gap: 2vw;
    }

    .mission-content p {
        margin: 0;
        padding: 0;
        color: var(--default-white);
        line-height: 1.5;
        font-family: var(--title-font-family);
        font-size: 1.25vw;
        font-weight: 600;
        text-align: center;
    }

    .mission-button .button {
        margin: 0;
        padding: 1vw 5vw;
        color: var(--default-white);
        letter-spacing: 2px;
        line-height: 1;
        font-family: var(--title-font-family);
        font-size: 1.5vw;
        border: 2px solid var(--default-white);
        border-radius: .75rem;
        background: transparent;
    }

    .mission-button .button:hover {
        transform: scale(1.05);
        background: var(--primary-color);
    }
}

@media only screen and (max-width: 50.99rem) {
    .mission-wrapper {
        display: flex;
        flex-direction: column;
        gap: 1rem;
        justify-content: center;
        align-items: center;
    }

    .mission-title-wrapper {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .mission-title-wrapper h1 {
        color: var(--default-white);
        font-family: var(--title-font-family);
        line-height: 1;
        margin: 0;
        padding: 0;
        text-transform: none;
        font-variant-caps: normal;
        font-size: 8vw;
        font-weight: 400;
        background: none;
        border: none;
        text-align: center;
        margin-bottom: .5rem;
    }

    .mission-title-wrapper h6 {
        color: var(--default-white);
        font-family: var(--title-font-family);
        line-height: 1;
        margin: 0;
        padding: 0;
        text-transform: none;
        font-variant-caps: normal;
        font-size: 6vw;
        font-weight: 500;
        background: none;
        border: none;
        text-align: center;
    }

    .mission-content {
        display: flex;
        flex-direction: column;
        gap: 1rem;
    }

    .mission-content p {
        margin: 0;
        padding: 0;
        color: var(--default-white);
        line-height: 1.7;
        font-family: var(--title-font-family);
        font-size: 3vw;
        font-weight: 600;
        text-align: center;
    }

    .mission-button {
        width: 100%;
    }

    .mission-button .button {
        margin: 0;
        padding: 1rem;
        color: var(--default-white);
        letter-spacing: 2px;
        line-height: 1;
        font-family: var(--title-font-family);
        font-size: 4.5vw;
        border: 2px solid var(--default-white);
        border-radius: .75rem;
        background: transparent;
        width: 100%;
    }

    .mission-button .button:hover {
        transform: scale(1.05);
        background: var(--primary-color);
    }
}

/*************** EXTENSION ****************/
/*************** BOTTOM *******************/
@media only screen and (min-width: 50.99rem) {
    .site-3 #g-bottom {
        padding: 2vw 0 !important;
    }

    .site-3 #g-bottom .admod td {
        padding: 0;
    }
}

@media only screen and (max-width: 50.99rem) {
    .site-3 #g-bottom {
        padding: 2rem 0 !important;
    }

    .site-3 #g-bottom .admod td {
        padding: 0;
    }
}

/*************** FOOTER *******************/
#g-footer .g-content-array {
    margin: 0;
}

#g-footer a {
    color: var(--default-white);
    transition: .3s all ease-in-out;
}

#g-footer a:hover {
    opacity: .5;
}

@media only screen and (min-width: 50.99rem) {
    .site-3 #g-footer>.g-container {
        padding: 3vw 5% !important;
    }

    .footer-wrapper {
        display: flex;
        flex-direction: row;
        gap: 3vw;
        align-items: center;
    }

    .footer-wrapper .footer-logo {
        flex: 12;
    }

    .footer-wrapper .footer-content {
        flex: 88;
    }

    .footer-wrapper .footer-content h1 {
        font-size: 2.5vw;
        font-weight: 700;
        text-transform: uppercase;
        margin: 0;
        padding: 0;
        line-height: 1;
        color: var(--default-white);
        font-family: var(--title-font-family);
        margin-bottom: 1.25vw;
    }

    .footer-wrapper .footer-content p {
        font-size: 1.25vw;
        font-weight: 400;
        text-decoration: underline;
        margin: 0;
        padding: 0;
        line-height: 1;
        color: var(--default-white);
        font-family: var(--body-font-family);
    }
}

@media only screen and (max-width: 50.99rem) {
    .site-3 #g-footer>.g-container {
        padding: 2rem 1rem !important;
    }

    .footer-wrapper {
        display: flex;
        flex-direction: column;
        gap: 1rem;
        justify-content: center;
        align-items: center;
    }

    .footer-wrapper .footer-logo {
        width: 50%;
    }

    .footer-wrapper .footer-content {
        width: 100%;
    }

    .footer-wrapper .footer-content h1 {
        font-size: 8vw;
        font-weight: 700;
        text-transform: uppercase;
        margin: 0;
        padding: 0;
        line-height: 1;
        color: var(--default-white);
        font-family: var(--title-font-family);
        margin-bottom: 1rem;
        text-align: center;
    }

    .footer-wrapper .footer-content p {
        font-size: 4vw;
        font-weight: 400;
        text-decoration: underline;
        margin: 0;
        padding: 0;
        line-height: 1.5;
        color: var(--default-white);
        font-family: var(--body-font-family);
        text-align: center;
    }
}

/*************** COPYRIGHT ****************/
@media only screen and (max-width: 50.99rem) {
    .web-policy {
        justify-content: flex-end;
        padding-right: 10px;
    }

    .site-3 .adminfootericon {
        bottom: 40px
    }

    .site-2 .adminfootericon {
        bottom: 40px
    }
}

/*************** MODULES ******************/
.moduletable .nav.menu,
.moduletable .unstyled {
    background: var(--primary-color);
}

.moduletable .nav.menu li.current.active a,
.moduletable .nav.menu li a:hover {
    color: var(--default-white);
    background: var(--secondary-color);
}

/*************** SECTIONS *****************/
/*************** MOBILE *******************/

.g-offcanvas-toggle {
    background: var(--default-white);
    display: grid;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    box-shadow: var(--default-box-shadow);
}

/*************** ADS **********************/

@media only screen and (min-width: 50.99rem) {
    #site-grid #g-container-main {
        padding-bottom: 3vw;
    }
}

@media only screen and (max-width: 50.99rem) {
    .grid.ph-sidebyside-mobile .g-array-item-read-more {
        opacity: 0;
    }

    .grid.ph-sidebyside-mobile .g-array-item-title {
        padding: 1rem;
    }
}

@media only screen and (min-width: 50.99rem) {
    .search-page button.btn {
        background: var(--primary-color) !important;
    }

    .search-page button.btn:hover {
        background: var(--secondary-color) !important;
    }
}

@media only screen and (max-width: 50.99rem) {
    .search-page button.btn {
        background: var(--primary-color) !important;
    }

    .search-page button.btn:hover {
        background: var(--secondary-color) !important;
    }
}

@media only screen and (max-width: 50.99rem) {
    .ph-sidebyside-mobile .g-array-item-read-more {
        opacity: 0;
    }

    .ph-sidebyside-mobile .g-array-item-title {
        padding: 1rem;
    }
}

@media only screen and (min-width: 50.99rem) {
    .bilingual {
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        gap: 2vw;
    }

    .bilingual .englishtext {
        flex: 1;
    }

    .bilingual .spanishtext {
        flex: 1;
        font-style: italic;
    }
}

@media only screen and (max-width: 50.99rem) {
    .bilingual {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }

    .bilingual .englishtext {
        flex: 1;
    }

    .bilingual .spanishtext {
        flex: 1;
        font-style: italic;
    }
}

@media only screen and (min-width: 50.99rem) {
    .bulletin-page #g-mainbar>.g-grid:nth-child(1) {
        display: none !important;
    }

    .bulletin-page .docman_category {
        display: none !important;
    }
}

@media only screen and (max-width: 50.99rem) {
    .bulletin-page #g-mainbar>.g-grid:nth-child(1) {
        display: none !important;
    }

    .bulletin-page .docman_category {
        display: none !important;
    }
}

/* Image Paths for Particle Template */
/* All images used in the particle template need to be updated here */

.style-1303 #g-footer:has([class*="-1303"]) {
    background-image: url('/images/template/parallax1.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

@media (min-width: 50.99rem) {
    .style-201 .g-container:has([class*="-201"]) {
        background-image: url('/images/template/header-church-transparent-background.png');
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
    }

    .style-202 .g-container:has([class*="-202"]) {
        background-image: url("/images/template/header-church-transparent-background.png");
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
    }

    .style-301 .mass-times-301 {
        background: url('/images/template/masstimes.jpg') 0% no-repeat;
        background-size: cover;
        background-position: center;
    }

    .style-303 .mass-times-303 {
        background: url('/images/template/masstimes.jpg') 0% no-repeat;
        background-size: cover;
        background-position: center;
    }

    .style-304 .mass-times-304 {
        background: url('/images/template/masstimes.jpg') 0% no-repeat;
        background-size: cover;
        background-position: center;
    }

    .style-305 .mass-times-305 {
        background: url('/images/template/masstimes.jpg') 0% no-repeat;
        background-size: cover;
        background-position: center;
    }

    .style-1001 :is(#g-navigation, #g-slideshow, #g-header, #g-above, #g-feature, #g-showcase, #g-utility, #g-container-main, #g-expanded, #g-extension, #g-bottom, #g-footer, #g-copyright):has([class*="-1001"]) {
        background: url('/images/template/parallax1.jpg') 50% 50% no-repeat;
    }

    .mockup-ads.particle-template .g-block:has(div.adside) .adside {
        background-image: url("/images/template/side-ads.png");
    }

    .mockup-ads.particle-template .adhorizontal {
        background-image: url("/images/template/horizontal-ads.png");
    }
}

@media (max-width: 50.99rem) {
    .mockup-ads.particle-template .g-block:has(div.adside) .adside {
        background-image: url("/images/template/side-ads.png");
    }

    .mockup-ads.particle-template .adhorizontal {
        background-image: url("/images/template/horizontal-ads-mobile.png");
    }
}

@media only screen and (min-width: 50.99rem) {
    body[class*="-sub"] #g-mainbar.section-padding-5>.g-grid>.g-block>.g-content {
        margin: 0 !important;
        padding: 0 !important;
    }

    body[class*="-sub"] #g-mainbar.section-padding-5:has(.page-header)>.g-grid>.g-block>.g-content {
        margin: .625rem 0 !important;
        padding: 1.5rem 0 !important;
    }

    body[class*="-sub"] #g-container-main:has(#g-mainbar.section-padding-5, #g-aside) {
        margin: 0 !important;
        padding: 0 5% !important;
    }

    body[class*="-sub"] #g-container-main:has(#g-mainbar.section-padding-5, #g-aside) #g-mainbar.section-padding-5 {
        margin: 0 !important;
        padding: 0 !important
    }

    body[class*="-sub"] #g-container-main:has(#g-mainbar.section-padding-5, #g-aside) #g-mainbar.section-padding-5>.g-grid>.g-block>.g-content {
        margin: 0 !important;
        padding: 0 5% 0 0 !important;
    }

    body[class*="-sub"] #g-container-main:has(#g-mainbar.section-padding-5, #g-aside) #g-mainbar.section-padding-5:has(.page-header)>.g-grid>.g-block>.g-content {
        margin: .625rem 0 !important;
        padding: 1.5rem 5% 1.5rem 0 !important;
    }
}

@media only screen and (max-width: 50.99rem) {
    body[class*="-sub"] #g-mainbar.section-padding-5>.g-grid>.g-block>.g-content {
        margin: 0 !important;
        padding: 0 !important;
    }
}

/*  */

@media only screen and (min-width: 50.99rem) {
    #g-top-nav {
        display: none !important;
    }

    #g-mobile-fixed-nav {
        display: none !important;
    }
}

@media only screen and (max-width: 50.99rem) {
    #g-top-nav {
        display: none !important;
    }

    #g-mobile-fixed-nav {
        display: none !important;
    }
}

body {
    background-color: var(--primary-color);
}

@media only screen and (max-width: 50.99rem) {
    @media (display-mode: standalone) {
        #g-top-nav {
            display: flex !important;
        }

        #g-mobile-fixed-nav {
            display: flex !important;
        }

        #g-top.modern-alert-padding {
            padding: 2rem 5% !important;
        }

        body {
            background-color: var(--primary-color);
        }

        #g-offcanvas {
            height: calc(100% - 120pt);
            top: 40pt;
            bottom: 80pt;
        }

        #g-top {
            margin-top: 40pt !important;
        }

        #g-navigation .g-logo {
            display: none;
        }

        #g-top-nav .g-particle:has(.g-logo) {
            width: 100%;
        }

        #g-top-nav .g-logo {
            text-align: center;
            display: flex;
            align-items: center;
            justify-content: center;
            width: 100%;
            height: 40pt;
        }

        #g-top-nav .g-logo img {
            height: 80%;
            width: auto;
        }

        #g-page-surround .g-offcanvas-toggle {
            display: none;
        }

        #g-page-surround {
            background: var(--primary-color);
        }

        #g-top-nav {
            display: flex;
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            width: 100%;
            height: 40pt;
            background: var(--primary-color);
            z-index: 100;
            box-shadow: var(--default-box-shadow);
        }

        .g-offcanvas-toggle {
            position: fixed !important;
            z-index: 101;
            top: 0;
            left: 10pt;
            height: 40pt;
            font-size: 23pt;
            display: flex;
            justify-content: center;
            align-items: center;
            background: none !important;
            border-radius: unset;
            box-shadow: unset;
        }

        .g-offcanvas-toggle {
            color: var(--default-white);
        }

        .g-offcanvas-toggle .fa-fw {
            text-shadow: none;
        }

        #g-container-footer {
            padding-bottom: 80pt !important;
        }

        #g-mobile-fixed-nav {
            display: flex;
            height: 80pt;
            background: var(--primary-color);
            color: var(--default-white);
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            z-index: 100;
            position: fixed;
            bottom: 0;
            left: 0;
            right: 0;
            width: 100%;
            box-shadow: var(--default-box-shadow)
        }

        .mobile-nav-link {
            color: var(--default-white);
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            text-align: center;
            height: 60pt;
        }

        .mobile-nav-link:hover {
            color: var(--secondary-color);
        }

        .mobile-fixed-nav {
            width: 100%;
            height: 60pt;
        }

        .mobile-fixed-nav {
            margin: 0;
            padding: 0;
            display: flex;
            width: 100%;
            align-items: center;
            overflow: hidden;
        }

        .mobile-fixed-nav .g-particle {
            margin: 0;
            padding: 0;
            width: 100%;
        }

        .mobile-fixed-nav .g-particle>div {
            margin: 0;
            padding: 0;
        }

        .mobile-fixed-nav .g-blockcontent {
            margin: 0;
            padding: 0;
        }

        .mobile-fixed-nav .g-blockcontent-subcontent {
            margin: 0;
            padding: 0;
            display: flex;
            flex-direction: row;
            flex-wrap: nowrap;
            gap: 1pt;
        }

        .mobile-fixed-nav .g-blockcontent-subcontent-block {
            margin: 0;
            padding: 0;
            flex: 1;
            position: relative;
        }

        .mobile-fixed-nav .g-blockcontent-subcontent-block-content {
            margin: 0;
            padding: 0;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
        }

        .mobile-fixed-nav .g-blockcontent-subcontent-title-icon {
            margin: 0;
            padding: 0;
            order: 1;
            color: var(--default-white);
            font-size: 5vw;
        }

        .mobile-fixed-nav .g-blockcontent-subcontent-title {
            margin: 0;
            padding: 0;
            order: 2;
        }

        .mobile-fixed-nav .g-blockcontent-subcontent-title-text {
            margin: 0;
            padding: 0;
            color: var(--default-white);
            font-size: 4vw;
            font-family: var(--body-font-family);
        }

        .mobile-fixed-nav .g-blockcontent-buttons {
            margin: 0;
            padding: 0;
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            height: 100%;
            width: 100%;
            opacity: 0;
        }

        .mobile-fixed-nav .g-blockcontent-buttons a {
            margin: 0;
            padding: 0;
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            height: 100%;
            width: 100%;
            opacity: 0;
        }
    }
}

@media only screen and (min-width: 50.99rem) {
    .site-3 #g-navigation .ql-fa-toplinks .g-blockcontent-subcontent-img {
        width: 4.5vw;
        height: 4.5vw;
    }
}

@media only screen and (max-width: 50.99rem) {
    .site-3 #g-navigation .ql-fa-toplinks .g-blockcontent-subcontent-img {
        width: 3rem;
        height: 3rem;
    }

    .site-3 #g-navigation .ql-fa-toplinks .g-blockcontent-subcontent-block {
        flex: 1;
        align-items: flex-start;
    }

    .site-3 #g-navigation .ql-fa-toplinks .g-blockcontent-subcontent-block-content {
        justify-content: flex-start;
        align-items: center;
    }
}

/*  */

/* Container Scoping */
.bs-challenge-wrapper {
    font-family: 'Helvetica Neue', Arial, sans-serif;
    color: #333;
    line-height: 1.6;
    max-width: 1000px;
    margin: 0 auto;
    padding: 20px;
}

/* Typography */
.bs-main-title {
    color: #333399;
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 25px;
    border-bottom: 2px solid #333399;
    padding-bottom: 10px;
}

.bs-section-title {
    color: #333399;
    font-size: 24px;
    margin-top: 0;
}

.bs-underline {
    text-decoration: underline;
}

/* Grid System */
.bs-row {
    display: flex;
    flex-wrap: wrap;
    margin: 20px 0;
    gap: 20px;
}

.bs-col-7 {
    flex: 7;
    min-width: 300px;
}

.bs-col-5 {
    flex: 5;
    min-width: 300px;
}

.bs-align-center {
    align-items: center;
}

/* Responsive Image Handling */
.bs-responsive-img {
    max-width: 100%;
    height: auto;
    border-radius: 4px;
}

.bs-image-full {
    margin: 30px 0;
    text-align: center;
}

/* Buttons */
.bs-button {
    display: inline-block;
    background-color: #333399;
    color: #ffffff !important;
    padding: 15px 30px;
    text-decoration: none;
    font-weight: bold;
    border-radius: 5px;
    transition: background 0.3s ease;
}

.bs-button:hover {
    background-color: #222266;
}

/* Components */
.bs-match-box {
    background-color: #f4f4f9;
    padding: 20px;
    border-left: 5px solid #333399;
    margin: 25px 0;
}

.bs-cta-box {
    background-color: #fff;
    border: 1px solid #ddd;
    padding: 20px;
    margin: 20px 0;
}

.bs-divider {
    border: 0;
    border-top: 1px solid #eee;
    margin: 30px 0;
}

.bs-link {
    color: #333399;
    font-weight: bold;
}

.bs-text-center {
    text-align: center;
}

.bs-mt-2 {
    margin-top: 2rem;
}

/* Mobile Optimization */
@media (max-width: 768px) {
    .bs-row {
        flex-direction: column;
    }

    .bs-reverse-mobile {
        flex-direction: column-reverse;
    }

    .bs-main-title {
        font-size: 24px;
    }
}