/* ================================================
   FAMILY TRUST FOUNDATION — MASTER CSS
   Wild Apricot Custom CSS
   Last updated: April 2026
   ================================================ */
 
 
/* ================================================
   GLOBAL TYPOGRAPHY
   ================================================ */
 
body, p, li, td {
    font-family: 'Poppins', sans-serif !important;
    font-size: 16px !important;
    line-height: 28px !important;
    color: #003366 !important;
}
 
/* Prevent span tags inside headings from inheriting body styles */
h1 span, h2 span, h3 span,
h4 span, h5 span, h6 span {
    font-family: 'Fraunces', serif !important;
    font-size: inherit !important;
    line-height: inherit !important;
    font-weight: inherit !important;
    color: inherit !important;
}
 
h1, .h1 {
    font-family: 'Fraunces', serif !important;
    font-size: 56px !important;
    line-height: 1.15 !important;
    font-weight: 400 !important;
    color: #003366 !important;
}
 
h2, .h2 {
    font-family: 'Fraunces', serif !important;
    font-size: 42px !important;
    line-height: 1.2 !important;
    font-weight: 400 !important;
    color: #003366 !important;
}
 
h3, .h3 {
    font-family: 'Fraunces', serif !important;
    font-size: 32px !important;
    line-height: 1.25 !important;
    font-weight: 400 !important;
    color: #003366 !important;
}
 
h4, .h4 {
    font-family: 'Fraunces', serif !important;
    font-size: 24px !important;
    line-height: 1.3 !important;
    font-weight: 400 !important;
    color: #003366 !important;
}
 
h5, .h5 {
    font-family: 'Fraunces', serif !important;
    font-size: 20px !important;
    line-height: 1.3 !important;
    font-weight: 400 !important;
    color: #003366 !important;
}
 
h6, .h6 {
    font-family: 'Fraunces', serif !important;
    font-size: 16px !important;
    line-height: 1.3 !important;
    font-weight: 400 !important;
    color: #003366 !important;
}
 
 
/* ================================================
   GLOBAL LINKS
   ================================================ */
 
a, a:link, a:visited {
    color: #003366 !important;
    text-decoration: none !important;
}
 
a:hover {
    color: #71B790 !important;
}
 
 
/* ================================================
   GLOBAL BUTTONS — PRIMARY (YELLOW)
   ================================================ */
 
a.buttonLike,
.buttonLike,
input[type="submit"],
input[type="button"],
button,
.WaGadgetDonateButton a,
.stylizedButton {
    background-color: #FBD872 !important;
    color: #003366 !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    padding: 12px 28px !important;
    border: none !important;
    border-radius: 0px !important;
    text-decoration: none !important;
    cursor: pointer !important;
}
 
/* Primary button hover */
a.buttonLike:hover,
.buttonLike:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
button:hover,
.stylizedButton:hover {
    background-color: #71B790 !important;
    color: #003366 !important;
}
 
/* Secondary button — Navy with white text */
.btn-secondary,
a.btn-secondary {
    background-color: #003366 !important;
    color: #ffffff !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    padding: 12px 28px !important;
    border: none !important;
    border-radius: 0px !important;
    text-decoration: none !important;
}
 
/* Secondary button hover */
.btn-secondary:hover,
a.btn-secondary:hover {
    background-color: #71B790 !important;
    color: #003366 !important;
}
 
/* Remove rounded corners globally */
a.buttonLike,
.buttonLike,
input[type="submit"],
input[type="button"],
button,
.stylizedButton,
[class*="linkStyle"] {
    border-radius: 0px !important;
}
 
 
/* ================================================
   NAVIGATION — HORIZONTAL (HEADER)
   ================================================ */
 
.WaGadgetMenuHorizontal .menuInner ul.firstLevel > li > .item > a,
.WaGadgetMenuHorizontal .menuInner ul.firstLevel > li > .item > a:link,
.WaGadgetMenuHorizontal .menuInner ul.firstLevel > li > .item > a:visited {
    color: #003366 !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 16px !important;
    line-height: 24px !important;
}
 
/* Nav hover */
.WaGadgetMenuHorizontal .menuInner ul.firstLevel > li > .item:hover > a {
    color: #71B790 !important;
}
 
/* Active/current page */
.WaGadgetMenuHorizontal .menuInner ul.firstLevel > li.sel > .item > a {
    color: #003366 !important;
}
 
/* Dropdown second level */
.WaGadgetMenuHorizontal .menuInner ul ul > li > .item > a {
    font-family: 'Poppins', sans-serif !important;
    font-size: 14px !important;
    color: #003366 !important;
}
 
 
/* ================================================
   NAVIGATION — VERTICAL (FOOTER)
   ================================================ */
 
#id_WSLxT6K .menuInner ul.firstLevel > li > .item > a,
#id_WSLxT6K .menuInner ul.firstLevel > li > .item > a:link,
#id_WSLxT6K .menuInner ul.firstLevel > li > .item > a:visited {
    color: #003366 !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 16px !important;
    line-height: 24px !important;
}
 
/* Footer nav hover */
#id_WSLxT6K .menuInner ul.firstLevel > li > .item:hover > a {
    color: #71B790 !important;
}
 
 
/* ================================================
   SOCIAL LINKS GADGET
   ================================================ */
 
a.Facebook,
a.Twitter,
a.Instagram,
a.LinkedIn,
a.YouTube,
a.Pinterest,
.WaGadgetSocialLinks a {
    color: #003366 !important;
}
 
a.Facebook:hover,
a.Twitter:hover,
a.Instagram:hover,
a.LinkedIn:hover,
a.YouTube:hover,
a.Pinterest:hover,
.WaGadgetSocialLinks a:hover {
    color: #71B790 !important;
}
 
a.Facebook::before,
a.Twitter::before,
a.Instagram::before,
a.LinkedIn::before,
a.YouTube::before,
a.Pinterest::before {
    color: #003366 !important;
}
 
a.Facebook:hover::before,
a.Twitter:hover::before,
a.Instagram:hover::before,
a.LinkedIn:hover::before {
    color: #71B790 !important;
}
 
 
/* ================================================
   FORMS
   ================================================ */
 
/* Labels */
.field-label,
label,
.fieldLabel {
    font-family: 'Poppins', sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #003366 !important;
    margin-bottom: 6px !important;
    display: block !important;
}
 
/* Inputs */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="password"],
textarea,
select {
    font-family: 'Poppins', sans-serif !important;
    font-size: 15px !important;
    color: #003366 !important;
    background-color: #ffffff !important;
    border: 1px solid #003366 !important;
    border-radius: 0px !important;
    padding: 10px 14px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}
 
/* Input focus */
input[type="text"]:focus,
input[type="email"]:focus,
textarea:focus,
select:focus {
    outline: none !important;
    border-color: #71B790 !important;
    box-shadow: 0 0 0 2px rgba(113, 183, 144, 0.2) !important;
}
 
/* Form field spacing */
.field,
.registrationField,
.formField {
    margin-bottom: 16px !important;
}
 
/* Error messages */
.field-error,
.validationError {
    color: #cc0000 !important;
    font-size: 13px !important;
    font-family: 'Poppins', sans-serif !important;
    margin-top: 4px !important;
}
 
 
/* ================================================
   NAV ALIGNMENT — RIGHT
   ================================================ */
 
/* Header nav right aligned */
.WaGadgetMenuHorizontal .menuInner ul.firstLevel {
    float: right !important;
}
 
/* Footer nav right aligned */
#id_WSLxT6K .menuInner ul.firstLevel {
    float: right !important;
}
 
 
/* ================================================
   HEADING SIZE FIX — EDITABLE AREAS
   ================================================ */
 
h4, .h4,
.gadgetContentEditableArea h4,
[class*="EditableArea"] h4,
.WaGadgetCustomHtmlEdit h4 {
    font-family: 'Fraunces', serif !important;
    font-size: 24px !important;
    line-height: 1.3 !important;
    font-weight: 400 !important;
    color: #003366 !important;
}
 
h5, .h5,
.gadgetContentEditableArea h5,
[class*="EditableArea"] h5,
.WaGadgetCustomHtmlEdit h5 {
    font-family: 'Fraunces', serif !important;
    font-size: 20px !important;
    line-height: 1.3 !important;
    font-weight: 400 !important;
    color: #003366 !important;
}
 
h6, .h6,
.gadgetContentEditableArea h6,
[class*="EditableArea"] h6,
.WaGadgetCustomHtmlEdit h6 {
    font-family: 'Fraunces', serif !important;
    font-size: 16px !important;
    line-height: 1.3 !important;
    font-weight: 400 !important;
    color: #003366 !important;
}
 
/* Max width centered content */
.max-width-md {
    max-width: 850px !important;
    margin: 0 auto !important;
}
 
/* Vertical align middle for hero and flex sections */
.hero [class^="WaLayoutItem"],
.flex-middle [class^="WaLayoutItem"] {
    vertical-align: middle !important;
    padding-top: 0px !important;
}
 
/* Column split utilities */
.split-60-40 [class^="WaLayoutItem"]:first-child {
    width: 60% !important;
}
.split-60-40 [class^="WaLayoutItem"]:last-child {
    width: 40% !important;
}
 
.split-40-60 [class^="WaLayoutItem"]:first-child {
    width: 40% !important;
}
.split-40-60 [class^="WaLayoutItem"]:last-child {
    width: 60% !important;
}
 
.split-65-35 [class^="WaLayoutItem"]:first-child {
    width: 65% !important;
}
.split-65-35 [class^="WaLayoutItem"]:last-child {
    width: 35% !important;
}
 
/* Centered content blocks */
.centered-block,
.centered-block p,
.centered-block h1,
.centered-block h2,
.centered-block h3,
.centered-block h4 {
    text-align: center !important;
}
 
 
/* ================================================
   DESKTOP — restore 100px padding on larger screens
   ================================================ */
 
@media only screen and (min-width: 768px) {
    .gadgetStyleBody.gadgetContentEditableArea {
        padding-left: 100px !important;
        padding-right: 100px !important;
    }
 
    /* Cards outer container — restore 100px margins on desktop */
    #id_gSJZVv3 {
        margin-left: 100px !important;
        margin-right: 100px !important;
    }
 
    /* Cards inner content — don't override their 32px padding */
    #id_9QVYwgC .gadgetStyleBody.gadgetContentEditableArea,
    #id_uw2i9r7 .gadgetStyleBody.gadgetContentEditableArea,
    #id_vCEVgUI .gadgetStyleBody.gadgetContentEditableArea {
        padding-left: 32px !important;
        padding-right: 32px !important;
    }
}
 
 
/* ================================================
   MOBILE — MAX 767px
   ================================================ */
 
@media only screen and (max-width: 767px) {
 
    /* --- TYPOGRAPHY --- */
    h1, .h1, h1 span {
        font-size: 32px !important;
        line-height: 1.2 !important;
    }
 
    h2, .h2, h2 span {
        font-size: 26px !important;
        line-height: 1.2 !important;
    }
 
    h3, .h3, h3 span {
        font-size: 22px !important;
        line-height: 1.25 !important;
    }
 
    h4, .h4, h4 span {
        font-size: 18px !important;
        line-height: 1.3 !important;
    }
 
    body, p, li {
        font-size: 15px !important;
        line-height: 26px !important;
    }
 
    /* --- LOGO --- */
    .zoneHeader1 img,
    .zoneHeader2 img,
    [class*="zoneHeader"] img {
        width: auto !important;
        max-width: 160px !important;
        height: auto !important;
    }
 
    /* --- NAV --- */
    .WaGadgetMenuHorizontal .menuInner ul.firstLevel {
        float: none !important;
        display: table !important;
    }
 
    .WaGadgetMenuHorizontal .menuInner ul.firstLevel > li > .item > a {
        font-size: 13px !important;
        padding: 5px 8px !important;
        height: auto !important;
    }
 
    /* --- ALL IMAGES FILL SCREEN --- */
    img {
        max-width: 100% !important;
        height: auto !important;
    }
 
    /* --- CARDS OUTER CONTAINER --- */
    #id_gSJZVv3 {
        margin-left: 20px !important;
        margin-right: 20px !important;
        margin-bottom: 40px !important;
    }
 
    /* --- BUTTONS --- */
    a.buttonLike,
    .buttonLike {
        display: inline-block !important;
        min-width: 140px !important;
        padding: 10px 20px !important;
    }
 
}
 
 
/* ================================================
   SMALL MOBILE — MAX 479px
   ================================================ */
 
@media only screen and (max-width: 479px) {
 
    h1, .h1, h1 span {
        font-size: 26px !important;
        line-height: 1.2 !important;
    }
 
    h2, .h2, h2 span {
        font-size: 22px !important;
        line-height: 1.2 !important;
    }
 
    h3, .h3, h3 span {
        font-size: 19px !important;
        line-height: 1.25 !important;
    }
 
}