/* iFEEL – nested menu (flyout) hover fix
   Problem: sub-menus such as About Us > Annual Reports / Policy & Procedures
   closed before the pointer could reach them (flyout was opened upward and only
   touched the parent row at a corner). This keeps every flyout attached to its
   parent row, adds an invisible hover bridge and a short close delay (see js/nav-flyout-fix.js). */
@media (min-width:992px){
  /* every nested item is the positioning parent of its own flyout */
  #header #menuzord-right .menuzord-menu ul.dropdown li{position:relative}

  /* flyout opens beside its parent row, top-aligned (overrides the old "open upward" rule) */
  #header #menuzord-right .menuzord-menu ul.dropdown ul.dropdown{
    top:0 !important;
    bottom:auto !important;
    left:100% !important;
    right:auto !important;
    margin:0 !important;
    overflow:visible !important;
    max-height:none !important;
  }
  #header #menuzord-right .menuzord-menu ul.dropdown ul.dropdown.fly-left{left:auto !important;right:100% !important}

  /* invisible bridge so the pointer never "falls off" between parent row and flyout */
  #header #menuzord-right .menuzord-menu ul.dropdown ul.dropdown::before{
    content:"";position:absolute;top:-6px;bottom:-6px;left:-16px;width:16px;background:transparent;
  }
  #header #menuzord-right .menuzord-menu ul.dropdown ul.dropdown.fly-left::before{left:auto;right:-16px}

  /* kept open by JS (with a small delay) while the pointer travels to it */
  #header #menuzord-right .menuzord-menu li.fly-open > ul.dropdown{
    display:block !important;opacity:1 !important;visibility:visible !important;
  }

  /* make the row that owns the open flyout look active */
  #header #menuzord-right .menuzord-menu ul.dropdown li.fly-open > a{background:#01185c;color:#fff}
  #header #menuzord-right .menuzord-menu ul.dropdown li > a{transition:background .15s,color .15s}

}