/* =========================================================
   1) Small, site-specific helper styles
   ========================================================= */

/* Centers the logo inside its column */
#id_bLtkq94 {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/* Footer links on the main page */
.footer_links {
  color: white;
  font-family: Arial, sans-serif;
  font-style: normal;
  padding: 5px;
  line-height: 1.5;
}

/* Rounded corners on Board of Directors bio pictures */
.biopic {
  border-radius: 10px;
}

/* Right-align specific link blocks */
.mo_links {
  text-align: right;
  text-decoration: none;
}


/* =========================================================
   2) Global page + Skyline Midtown layout overrides
   GOALS:
   - Header, black banner, footer span full width
   - Main content has 20px left/right padding
   ========================================================= */

html,
body {
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  height: 100% !important;
  overflow-x: hidden !important;
}

#mLayout,
.mLayout,
.layoutMain {
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}

.container_12 {
  width: 100% !important;
  max-width: none !important;
}

.zoneInner,
.s1_grid_12,
.s2_grid_12,
.s3_grid_12 {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.zoneRoundedCorners {
  border-radius: 0 !important;
}

.zoneHeader,
.zoneHeader1,
.zoneHeader12,
.zoneContent,
.zoneFooter,
.zoneFooter1,
.zoneBranding {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.zoneContentInner {
  box-sizing: border-box !important;
  padding-left: 20px !important;
  padding-right: 20px !important;
}

.zoneHeaderOuter .zoneInner,
.zoneHeader1Outer .zoneInner,
.zoneHeader2Outer .zoneInner,
.zoneFooterOuter .zoneInner,
.zoneFooter1Outer .zoneInner,
.zoneBrandingOuter .zoneInner {
  box-sizing: border-box !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  background: white;
}

#id_kJFvoJ3 {
  width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  max-width: none !important;
  box-sizing: border-box !important;
}

#id_kJFvoJ3 .gadgetStyleBody {
  padding-left: 20px !important;
  padding-right: 20px !important;
  box-sizing: border-box !important;
}


/* =========================================================
   3) Sticky footer
   ========================================================= */

body.LayoutMain {
  min-height: 100vh !important;
  display: flex !important;
  flex-direction: column !important;
}

#mLayout {
  flex: 1 0 auto !important;
  display: flex !important;
  flex-direction: column !important;
  min-height: 100% !important;
}

.zoneContentOuter {
  flex: 1 0 auto !important;
}

.zoneFooterOuter,
.zoneFooter1Outer {
  flex: 0 0 auto !important;
}

.zoneFooter1Outer {
  padding-bottom: 40px;
  background: black;
}

.zoneBrandingOuter {
  display: none !important;
}


/* =========================================================
   4) Navigation menu behavior
   ========================================================= */

/* Make the menu gadget the positioning anchor */
#id_HFV4Tsg,
#id_HFV4Tsg .menuInner {
  position: relative !important;
}

/* -------------------------
   Desktop (>= 617px): even spacing
   ------------------------- */
@media (min-width: 617px) {
  #id_HFV4Tsg .menuInner > ul.firstLevel {
    display: flex !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
  }

  #id_HFV4Tsg .menuInner > ul.firstLevel > li {
    flex: 1 1 0 !important;
    float: none !important;
    display: flex !important;
    justify-content: center !important;
    margin: 0 !important;
  }

  #id_HFV4Tsg .menuInner > ul.firstLevel > li > .item,
  #id_HFV4Tsg .menuInner > ul.firstLevel > li > .item > a {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }

  #id_HFV4Tsg .menuInner > ul.firstLevel > li ul.secondLevel {
    width: auto !important;
  }
}

/* When nav is open, stop background scroll */
html.nav-lock,
body.nav-lock {
  overflow: hidden !important;
  height: 100% !important;
}


/* ============================================
   MOBILE NAV OVERLAY (<= 616px)
   GOAL:
   - Every SECTION header looks like "HOME"
   - Every CHILD item looks like "Is This You?"
   ============================================ */
@media (max-width: 616px) {

  /* Make sure the container itself does NOT clip the overlay. */
  #id_HFV4Tsg .menuInner.mobileView {
    position: static !important;
    overflow: visible !important;
    height: auto !important;
  }

  /* Full-screen overlay */
  #id_HFV4Tsg .menuInner.mobileView > ul.firstLevel {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;

    width: 100vw !important;
    min-height: 100vh !important;

    margin: 0 !important;
    padding: 64px 0 24px !important;

    list-style: none !important;
    background: #ffffff !important;
    z-index: 2000 !important;

    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  /* HARD RESET: stop WA floats/centering/italics leaking into the overlay */
  #id_HFV4Tsg .menuInner.mobileView ul,
  #id_HFV4Tsg .menuInner.mobileView li {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    float: none !important;
    width: 100% !important;
  }

  #id_HFV4Tsg .menuInner.mobileView .item,
  #id_HFV4Tsg .menuInner.mobileView a,
  #id_HFV4Tsg .menuInner.mobileView a span {
    text-align: left !important;
    font-style: normal !important;
    letter-spacing: normal !important;
  }

  /* Hide phantom label if it exists */
  #id_HFV4Tsg .menuInner.mobileView > ul.firstLevel > li.phantom > .item > a {
    display: none !important;
  }

  /* If WA uses phantom grouping on some pages, flatten it */
  #id_HFV4Tsg .menuInner.mobileView > ul.firstLevel > li.phantom > .item > ul.secondLevel {
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
  }

  /* -------------------------
     SECTION HEADERS (match HOME)
     This hits BOTH:
     - normal firstLevel items (HOME, ABOUT FREETHOUGHT, ...)
     - phantom-promoted sections (if WA ever uses them)
     ------------------------- */
  #id_HFV4Tsg .menuInner.mobileView > ul.firstLevel > li:not(.phantom) > .item > a,
  #id_HFV4Tsg .menuInner.mobileView > ul.firstLevel > li.phantom > .item > ul.secondLevel > li > .item > a {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;

    padding: 14px 20px !important;

    text-transform: uppercase !important;
    font-weight: 700 !important;
    font-style: normal !important;
    letter-spacing: 0.08em !important;

    /* don’t force a color: let WA keep active state color */
    color: inherit !important;

    border-top: 1px solid #e6e6e6 !important;
  }

  /* Ensure span inside header matches too (WA sometimes styles span separately) */
  #id_HFV4Tsg .menuInner.mobileView > ul.firstLevel > li:not(.phantom) > .item > a > span,
  #id_HFV4Tsg .menuInner.mobileView > ul.firstLevel > li.phantom > .item > ul.secondLevel > li > .item > a > span {
    display: inline !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    font-style: normal !important;
    letter-spacing: 0.08em !important;
    color: inherit !important;
  }

  /* -------------------------
     CHILD ITEMS (match "Is This You?")
     This hits:
     - children under normal dirs: firstLevel li.dir > ul.secondLevel > li
     - children under phantom dirs: phantom > secondLevel > li.dir > ul.secondLevel > li
     - any deeper nesting too
     ------------------------- */

  /* normalize ALL secondLevel lists: no weird indent/centering */
  #id_HFV4Tsg .menuInner.mobileView ul.secondLevel {
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
  }

  /* child links */
  #id_HFV4Tsg .menuInner.mobileView > ul.firstLevel > li.dir > .item > ul.secondLevel > li > .item > a,
  #id_HFV4Tsg .menuInner.mobileView > ul.firstLevel > li.phantom > .item > ul.secondLevel > li.dir > .item > ul.secondLevel > li > .item > a,
  #id_HFV4Tsg .menuInner.mobileView ul.secondLevel ul.secondLevel > li > .item > a {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;

    padding: 12px 20px !important;   /* same left edge as "Is This You?" */

    text-transform: none !important;
    font-weight: 400 !important;
    font-style: normal !important;
    letter-spacing: 0 !important;

    color: inherit !important;
  }

  /* span inside child links (WA sometimes styles the span) */
  #id_HFV4Tsg .menuInner.mobileView > ul.firstLevel > li.dir > .item > ul.secondLevel > li > .item > a > span,
  #id_HFV4Tsg .menuInner.mobileView > ul.firstLevel > li.phantom > .item > ul.secondLevel > li.dir > .item > ul.secondLevel > li > .item > a > span,
  #id_HFV4Tsg .menuInner.mobileView ul.secondLevel ul.secondLevel > li > .item > a > span {
    display: inline !important;
    text-transform: none !important;
    font-weight: 400 !important;
    font-style: normal !important;
    letter-spacing: 0 !important;
    color: inherit !important;
  }

  /* Hamburger button: fixed top-right */
  #id_HFV4Tsg .menuButton {
    position: fixed !important;
    top: 0px !important;
    right: 0px !important;
    left: auto !important;
    margin: 0 !important;
    z-index: 2100 !important;
    display: block !important;
    width: 100vw;
  }

  /* Close button: fixed top-left (injected by your JS) */
  .wa-mobile-close {
    position: fixed !important;
    top: 16px !important;
    left: 16px !important;
    z-index: 2101 !important;
    background: none !important;
    border: none !important;
    font-size: 28px !important;
    line-height: 1 !important;
    cursor: pointer !important;
  }












  /* =========
     CHILD ITEMS: indent + force identical typography everywhere
     ========= */

  /* Indent the whole child list under a section */
  #id_HFV4Tsg .menuInner.mobileView > ul.firstLevel > li.dir > .item > ul.secondLevel,
  #id_HFV4Tsg .menuInner.mobileView > ul.firstLevel > li.phantom > .item > ul.secondLevel > li.dir > .item > ul.secondLevel {
    padding-left: 0 !important;   /* keep UL clean */
    margin: 0 !important;
  }

  /* Every child link: bigger left padding than headers = indent */
  #id_HFV4Tsg .menuInner.mobileView > ul.firstLevel > li.dir > .item > ul.secondLevel > li > .item > a,
  #id_HFV4Tsg .menuInner.mobileView > ul.firstLevel > li.phantom > .item > ul.secondLevel > li.dir > .item > ul.secondLevel > li > .item > a,
  #id_HFV4Tsg .menuInner.mobileView ul.secondLevel ul.secondLevel > li > .item > a {
    padding: 12px 20px 12px 44px !important; /* <- INDENT HERE */
    box-sizing: border-box !important;

    /* normalize typography */
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1.35 !important;
    font-style: normal !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
  }

  /* WA often styles the span differently — force it too */
  #id_HFV4Tsg .menuInner.mobileView > ul.firstLevel > li.dir > .item > ul.secondLevel > li > .item > a > span,
  #id_HFV4Tsg .menuInner.mobileView > ul.firstLevel > li.phantom > .item > ul.secondLevel > li.dir > .item > ul.secondLevel > li > .item > a > span,
  #id_HFV4Tsg .menuInner.mobileView ul.secondLevel ul.secondLevel > li > .item > a > span {
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1.35 !important;
    font-style: normal !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
  }

  /* If WA marks the current page with .sel and changes weight/size, normalize it */
  #id_HFV4Tsg .menuInner.mobileView ul.secondLevel li.sel > .item > a,
  #id_HFV4Tsg .menuInner.mobileView ul.secondLevel li.sel > .item > a > span {
    font-size: 16px !important;
    font-weight: 400 !important; /* keep consistent; remove if you WANT current page bold */
  }











    /* Menu overlay should start at the very top */
  #id_HFV4Tsg .menuInner.mobileView > ul.firstLevel {
    top: 0 !important;
    padding-top: 56px !important;     /* space for the fixed X button */
    padding-bottom: 24px !important;  /* ensure last item can scroll into view */
    height: 100vh !important;
    box-sizing: border-box !important;
  }

  /* X button in top-right */
  .wa-mobile-close {
    left: auto !important;
    right: 16px !important;
    top: 16px !important;
  }

  /* Hide hamburger when overlay is open */
  html.nav-lock #id_HFV4Tsg .menuButton,
  body.nav-lock #id_HFV4Tsg .menuButton {
    display: none !important;
  }











    /* Hamburger button box */
  #id_HFV4Tsg .menuButton {
    background: #fff !important;     /* match page */
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;     /* optional: flat */
  }






.WaGadgetMenuHorizontal[class*=menuStyle] .menuInner .menuButton:before {
  color:black;
  float: right;
}
}