/* CAREPA custom CSS - complete file. The WildApricot CSS editor REPLACES user.css on every Save, so always paste this entire file. */

/* 1. White panel behind the Join page membership application form */
#PAGEID_7743 .WaGadgetMembershipApplication {
  background: #ffffff;
  border-radius: 8px;
  padding: 24px 20px;
  box-sizing: border-box;
}
#PAGEID_7743 .WaGadgetMembershipApplication .formTitleOuterContainer,
#PAGEID_7743 .WaGadgetMembershipApplication .formTitleOuterContainer h3.formTitle,
#PAGEID_7743 .WaGadgetMembershipApplication .mandatoryFieldsTitle {
  color: #16266B;
}
#PAGEID_7743 .WaGadgetMembershipApplication .fieldSubContainer .fieldLabel,
#PAGEID_7743 .WaGadgetMembershipApplication .labelTitle,
#PAGEID_7743 .WaGadgetMembershipApplication .labelSubTitle {
  color: #222222;
}
#PAGEID_7743 .WaGadgetMembershipApplication .typeInstruction,
#PAGEID_7743 .WaGadgetMembershipApplication .levelDescription {
  color: #555555;
}

/* 2. Frame and widen the main content column */
.zoneMain .WaPlaceHolder > div {
  max-width: 1560px;
  border-left: 1px solid #ccd5e0;
  border-right: 1px solid #ccd5e0;
  box-shadow: -6px 0 12px -6px rgba(22,38,107,.18), 6px 0 12px -6px rgba(22,38,107,.18);
}

/* 3. White panel inside the framed content column */
.zoneMain .WaPlaceHolderContent > div {
  background: #ffffff;
}

/* 4. System content placeholder (Events list, Sponsors content): white inside the column, sides stay the page color */
#id_Footer {
  background-color: transparent !important;
}
#id_Footer > div {
  background-color: #ffffff;
}

/* 5. Menu: page names and sub page names in white (dropdown gets the navy brand background so white text stays readable) */
.WaGadgetMenuHorizontal.HorizontalMenuStyle001 .menuInner ul.firstLevel > li > .item > a,
.WaGadgetMenuHorizontal.HorizontalMenuStyle001 .menuInner ul.firstLevel > li.sel > .item > a {
  color: #ffffff;
}
.WaGadgetMenuHorizontal.HorizontalMenuStyle001 .menuInner ul.firstLevel > li > .item:hover > a,
.WaGadgetMenuHorizontal.HorizontalMenuStyle001 .menuInner ul.firstLevel > li.sel > .item:hover > a {
  color: #ffffff;
  background: rgba(255,255,255,.14);
}
.WaGadgetMenuHorizontal.HorizontalMenuStyle001 .menuInner ul ul {
  background: #16266B;
  border-color: #16266B;
}
.WaGadgetMenuHorizontal.HorizontalMenuStyle001 .menuInner ul ul li > .item > a,
.WaGadgetMenuHorizontal.HorizontalMenuStyle001 .menuInner ul ul li.sel > .item > a {
  color: #ffffff;
}
.WaGadgetMenuHorizontal.HorizontalMenuStyle001 .menuInner ul ul li > .item:hover > a,
.WaGadgetMenuHorizontal.HorizontalMenuStyle001 .menuInner ul ul li.sel > .item:hover > a {
  background: #CF1F26;
  color: #ffffff;
}

/* 6. Uniform side panels: header and footer bands live inside the framed column only, so the sides are one color top to bottom with no horizontal bands */
.zonePlace.zoneHeader1,
.zonePlace.zoneHeader2,
.zonePlace.zoneHeader3 {
  background-color: transparent;
}
#id_Header {
  background-image: none !important;
}
#id_Header > div {
  background-image: none;
  background-color: #EEF2FA;
}
#id_Header1 > div {
  background-color: #16266B;
}
#id_Footer1 {
  background-color: transparent !important;
}
#id_Footer1 > div {
  background-color: #16266B;
  border-top: 4px solid #CF1F26;
  padding: 24px 28px;
}

/* 7. Header2 placeholder carries real page content on template-built pages (Join intro, Board page) - keep it white */
#id_Header2 > div {
  background-color: #ffffff;
}

/* 8. Sticky footer: on short pages the gray footer band sits at the bottom of the screen instead of floating under the content */
.zoneMain {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
.zonePlace.zoneFooter1 {
  margin-top: auto;
}

/* 9. Join page: make the membership level choices stand out as soft cards with bold prices */
#PAGEID_7743 .WaGadgetMembershipApplication .levelPropertiesContainer {
  background: #eef2fa;
  border: 1px solid #c9d4ee;
  border-radius: 8px;
  padding: 14px 16px;
  margin-bottom: 12px;
}
#PAGEID_7743 .WaGadgetMembershipApplication .levelProperties .labelTitle {
  font-size: 19px;
  color: #16266B;
}
#PAGEID_7743 .WaGadgetMembershipApplication .levelProperties .labelSubTitle {
  font-size: 17px;
  font-weight: 700;
  color: #CF1F26;
}
#PAGEID_7743 .WaGadgetMembershipApplication input[type="radio"] {
  width: 18px;
  height: 18px;
  accent-color: #16266B;
  vertical-align: middle;
}

/* 10. Footer band: clean, tight lines in all three columns; bold labels; white links */
#id_Footer1 p {
  margin: 0 !important;
  padding: 0;
  line-height: 1.55;
}
#id_Footer1 .gadgetContentEditableArea p:first-child {
  font-weight: bold;
  letter-spacing: .5px;
  margin-bottom: 6px !important;
}
#id_Footer1 a {
  color: #ffffff;
}

/* 11. Homepage "CAREPA EVENT PICTURES" bar above the slideshow: brand navy with a red accent */
#id_FzflUbh .gadgetStyleBody h1 {
  background: #16266B !important;
  border-bottom: 4px solid #CF1F26;
  padding: 14px 10px 12px;
  margin: 0;
}
#id_FzflUbh .gadgetStyleBody h1 font {
  color: #ffffff;
}

/* === v15: Bylaws page (18053) document typography === */
#PAGEID_18053 .WaGadgetContent .gadgetStyleBody { max-width: 920px; margin: 0 auto; padding: 10px 26px 18px; }
#PAGEID_18053 .WaGadgetContent h1 { font-size: 25px !important; line-height: 1.35 !important; color: #16266B !important; text-align: center; margin: 6px 0 24px !important; padding-bottom: 16px; border-bottom: 3px solid #CF1F26; }
#PAGEID_18053 .WaGadgetContent h2 { font-size: 19px !important; line-height: 1.4 !important; color: #16266B !important; margin: 30px 0 10px !important; padding-bottom: 6px; border-bottom: 1px solid #dbe4f3; }
#PAGEID_18053 .WaGadgetContent p { font-size: 16px !important; line-height: 1.7 !important; color: #333333 !important; margin: 0 0 12px !important; }
#PAGEID_18053 .WaGadgetContent li { font-size: 16px !important; line-height: 1.7 !important; color: #333333 !important; margin-bottom: 6px; }

/* === v16: Bylaws page - override the document's built-in font tags === */
#PAGEID_18053 .WaGadgetContent h2, #PAGEID_18053 .WaGadgetContent h2 font, #PAGEID_18053 .WaGadgetContent h2 span, #PAGEID_18053 .WaGadgetContent h2 strong { color: #16266B !important; font-size: 19px !important; }
#PAGEID_18053 .WaGadgetContent p[align="center"] { border-bottom: 3px solid #CF1F26; padding-bottom: 16px; margin-bottom: 24px !important; }
#PAGEID_18053 .WaGadgetContent p[align="center"] font, #PAGEID_18053 .WaGadgetContent p[align="center"] span, #PAGEID_18053 .WaGadgetContent p[align="center"] strong { color: #16266B !important; font-size: 25px !important; line-height: 1.35 !important; }
#PAGEID_18053 .WaGadgetContent p font, #PAGEID_18053 .WaGadgetContent li font { font-size: 16px !important; color: #333333 !important; }
#PAGEID_18053 .WaGadgetContent blockquote { margin: 0 0 0 16px !important; padding: 0 !important; border: none !important; }
