/*CSS FOR THIS TEMPLATE*/
#idCustomJsContainer { display: none; }
/* Font Awesome CDN for Icons and Google Fonts */
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css');
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600&family=Montserrat:wght@600&display=swap');
@font-face {
    font-family: 'Open Sans';
    src: local('Open Sans Regular'), local('OpenSans-Regular'), url(/resources/Theme_Overrides/whiteboard_maya_blue.v3.0/Fonts/opensans_normal_400.woff2) format('woff2'), url(/resources/Theme_Overrides/whiteboard_maya_blue.v3.0/Fonts/opensans_normal_400.woff) format('woff');
    font-style: normal;
    font-weight: 400;
}
/* Wild Apricot-Compatible CSS with State Farm Red Branding */

/*Basics*/
* { margin: 0; padding: 0; box-sizing: border-box; font-family: 'Open Sans', Arial, sans-serif; /* Fallback for Wild Apricot */ }
body, [class*="EditableArea"] { font: 16px/1.6 'Lato','Arial',sans-serif; }
body { color: #272330; background: #f4f7fa; /* Light gray background */ }
.layout2026 { max-width: 1230px; margin: 0 auto; padding: 40px 15px; box-sizing: border-box; }
.WaPlaceHolder>div { padding: 0; }
[class*='EditableArea'] ul { margin: 1em 0 1em 18px; padding: 0; list-style: disc; }
[class*="EditableArea"] ul:last-child, [class*="EditableArea"] h2:last-child { margin-bottom: 1em; }

[class*="WaGadget"] h1, [class*="WaGadget"]:not(.WaGadgetHeadline) [class*='EditableArea'] h1:last-child { font-size: 40px;  text-align: center; text-transform: uppercase; color: #272330; margin-bottom: 1.5rem !important; font-family: 'Montserrat', sans-serif; line-height: 1.29; }
section { max-width: 900px; margin: 3rem auto; margin-top: 0; }
p { margin-bottom: 1rem; }
[class*=gadgetStyle] .gadgetContentEditableArea { overflow: visible; height: auto !important; }
h2 { font-size: 27px; color: #c42121; margin-bottom: 1rem; margin-top: 0; font-family: 'Montserrat', sans-serif; text-transform: uppercase; }
h3 { color: #c42121; margin-bottom: 0.5rem; font-size: 1.4rem; font-family: 'Montserrat', sans-serif; }

/*Login button*/
.btn-cta { z-index: 1000; display: flex; align-items: center; justify-content: end; }
.btn-cta a { background: #c42121; color: #ffffff; text-decoration: none; width: 100px; text-align: center; max-width: 100%; padding: 0.5rem; }
.btn-cta a:hover { text-decoration: underline; background: #9d9ea2; }

/* Navigation (Wild Apricot Menu Widget) */
.nav-container { z-index: 1000; display: flex; align-items: center; justify-content: end; padding: 1rem; }
.logo > div, .head div[class*="-8"] { align-content: center; }
.logo img { max-height: 100px; /* Adjust based on actual logo size */ width: auto; padding-bottom: 16px; }
.logo a:hover { opacity: 0.8; }

.nav-container > ul { list-style: none; display: flex; gap: 1em; flex-wrap: wrap; margin: 0 !important; }
/*.nav-container > ul li { margin: 0 1.5rem; }*/
.nav-container ul li a { text-decoration: none; font-size: 1.1rem !important; font-weight: 700; color: #c42121 !important; /* State Farm red for nav links */ transition: color 0.3s; position: relative; padding: 0.5em; }
.nav-container ul li a:hover { color: #A62A2A; text-decoration: underline; /* Darker red on hover */ }

.nav-container ul li .sub:after { content: " "; display: inline-block; position: absolute; top: 50%; margin: 2px 0 0 5px; vertical-align: middle; border: 5px solid transparent; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-left: 5px solid #c42121; -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.42s ease-in-out; transition: all 0.2s ease-in-out; -webkit-transform: scale(0.98) translateY(-50%); -ms-transform: scale(0.98) translateY(-50%); transform: scale(0.98) translateY(-50%); }

.nav-container ul li.open { position: relative; }
.nav-container ul li.open .sub:after { -webkit-transform: scale(0.98) translateY(-25%) rotate(90deg); -ms-transform: scale(0.98) translateY(-25%) rotate(90deg); transform: scale(0.98) translateY(-25%) rotate(90deg); }


.nav-container ul li.open .dd-options { z-index: 999; opacity: 1; visibility: visible; }

/*Dropdown Options*/
.dd-options { background: #f4f7fa; border: 1px solid; opacity: 0; overflow: visible; visibility: hidden; position: absolute; padding: 0; min-width: 320px; text-align: left; list-style: none; left: 0; top: 125%; }
.dd-options li { list-style: none; }
.dd-options a { color: inherit; position: relative; padding: 1em 2em; display: block; }
.dd-options a:hover { }
.nav-container > ul > li:nth-last-child(3) .dd-options { left: auto; right: 0; }
.nav-container ul li.open .dd-options a { font-weight: 400; }

/* Footer (Wild Apricot Footer Widget) */
.footer .footer-links { background: #c42121; /* State Farm red footer */ color: #fefdfd; text-align: center; padding: 2rem; margin-top: 2rem; }
.footer-links a { color: #f4f7fa; text-decoration: none; margin: 0 1rem; }
.footer-links a:hover { color: #fefdfd; text-decoration: underline; /* White on hover for contrast */ }
.tf { display: flex; justify-content: center; gap: 0.5em; }
.zoneWAbranding { margin: 0; }

/*Hamburger*/
.hamburger { display: none; cursor: pointer; border: none; background: none; padding: 10px; justify-self: right; }
.hamburger span { display: block; width: 25px; height: 3px; background-color: #000; margin: 5px 0; transition: 0.4s; }
.hamburger.active span:nth-child(1) { transform: rotate(45deg); position: relative; top: 8px; /* move down */ }
.hamburger.active span:nth-child(2) { opacity: 0; }
.hamburger.active span:nth-child(3) { transform: rotate(-45deg); position: relative; top: -8px; /* move up */ }

[class^="WaGadget"] { margin-bottom: 0; overflow: initial; height: auto !important; }
#idFooterPoweredByContainer { height: auto; margin-bottom: 0.1em; }
.WaCustomLayoutContainerFirst { margin-bottom: 0; }

/* Responsive Design for Wild Apricot */
@media (max-width: 767px) {
    .btn-cta { padding-top: 0.5em; }
    .nav-container { display: none; background: #fefdfd; }
    .nav-container.active { display: flex; flex-direction: column; align-items: center; }
    .nav-container ul { flex-direction: column; margin-left: 0; gap: 0; min-width: 100%; }
.nav-container ul li { margin: 0.5rem 0; }
.hamburger { display: block; }
.dd-options { display: none; opacity: 1; position: relative; top: 0; border: none; }
.nav-container ul li.open .dd-options { display: block; }
.logo img { padding-bottom: 0; }
.WaLayoutRow .WaLayoutPlaceHolder.placeHolderContainer > div { padding: 0 !important; }
[class*="WaGadget"] h1, [class*="WaGadget"]:not(.WaGadgetHeadline) [class*='EditableArea'] h1:last-child { font-size: 35px; }
}
@media (max-width: 479px) {
    body { min-width: 0; }
    .tf, .tf span { display: block; }
    .logo { height: auto !important; }
}

.row { display: flex; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; }
.col-sm-4, .col-sm-8, .col-md-4, .col-md-8 { position: relative; width: 100%; min-height: 1px; padding-right: 15px; padding-left: 15px; }
@media (min-width: 768px) {
    .col-md-4 { -webkit-box-flex: 0; -ms-flex: 0 0 66.666667%; flex: 0 0 33.333333%%; max-width: 33.333333%; }
    .col-md-8 { -webkit-box-flex: 0; -ms-flex: 0 0 66.666667%; flex: 0 0 66.666667%; max-width: 66.666667%; }
}
@media (min-width: 576px) {
    .col-sm-4 { -webkit-box-flex: 0; -ms-flex: 0 0 66.666667%; flex: 0 0 33.333333%; max-width: 33.333333%; }
    .col-sm-8 { -webkit-box-flex: 0; -ms-flex: 0 0 66.666667%; flex: 0 0 66.666667%; max-width: 66.666667%; }
}