/* Global Nav - Top Nav */

.clear {
	clear:both;
	}

 .global-nav {
	 background: #013E39;
	 width:100%;
	 line-height:2.3em;
	/* padding:6px; */
	 text-align:center;
	 vertical-align:middle;
	 clear:both;
	 }



 .global-nav ul {
 	  list-style-type:none;
 	  overflow: hidden;
	 }

 .global-nav ul li {
  display: inline;
	}


 .global-nav ul,  .global-nav ul li {
	  background: #013E39;
	  line-height:2em;
	  vertical-align:middle;

	 }

 .global-nav ul li  a{
 	  color: white;
	  background: #013E39;
	  line-height:2em;
	  vertical-align:middle;
	 /*  font-size:.8em; */
	  font-weight:600;
	  text-align: center;
	  padding:1px 8px;
	/*  display: inline-block;*/
	  border-radius:5px 5px 0 0;

	 }


/* Change the color of links on hover */
.global-nav a:hover {
  background-color: #ddd;
  color: #013e39;
  line-height:2em;

}

/* Change the color of links on active */
.global-nav a:active {
  background-color: #ccc;
  color: #013e39;
}

 .global-nav a.current-page {
  	background-color: #013E39;
  	color: #ccc;
  	cursor:default;

	}

 .global-nav a.current-page:hover {
  	background-color: #013E39;
  	color: #eee;
  	cursor:default;
  	 font-weight:900;

	}





	footer div.social, address > p {
		margin:1em 4em;
		display: flex;
 		justify-content: space-around;
  		flex-direction:row;
		justify-content:center;
		text-align:center;
	}

	.social i {
		margin:0 20px;
		}

	.global-nav#top-nav ul {
 	 	display:flex;
		}

	address {
		display:flex;
		justify-content:center;
		padding-left:18%;
		padding-bottom:20px;
		font-size:1em;
		text-align:center;
		}



/* ============================================================
   NAV BARS — consolidated 15 Aug 2026
   Everything above this point is kept for reference; these rules
   load last and are the ones that take effect.
   ============================================================ */

.global-nav {
    background: #013E39;
    width: 100%;
    text-align: left;
    overflow: visible;

    /* THE WHITE OVERLAY. fl2_headcms.css carried
           .global-nav, .global-nav a:hover { display:inline; }
       An inline box does not contain its children or establish
       normal block flow, so the page content after the bar was
       laid out over the top of it. 15 Aug 2026. */
    display: block;

    /* The generic  nav { min-height:5vw }  made the bar 128px tall
       on a 2560px screen while its links needed about 45px. The
       leftover green is what the white content sat on. The bar now
       sizes to its own content. */
    min-height: 0;
    }

.global-nav ul {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0 .4rem;
    margin: 0;
    padding: .45em 1.2em;
    background: transparent;
    overflow: visible;

    /* text-align does nothing to flex children — they are placed by
       justify-content, which was never set, so other stylesheets were
       deciding it. Stated explicitly. Change flex-start to center if
       you want the bars centred. 15 Aug 2026. */
    justify-content: flex-start;
    }

.global-nav ul li {
    display: inline-block;
    background: transparent;
    margin: 0;
    line-height: 1.9;
    }

.global-nav ul li a {
    display: inline-block;
    background: transparent;
    color: #fff;
    font-weight: 600;
    padding: .3em .85em;
    border-radius: 4px 4px 0 0;
    text-align: center;
    }

.global-nav ul li a:hover,
.global-nav ul li a:focus-visible {
    background: #dbe4e0;
    color: #013E39;
    }

/* Keyboard focus ring.
   outline-offset was 1px, which draws the ring detached from the tab —
   the tab's own filled shape plus a ring floating 1px outside it reads
   as two offset rectangles. Chrome keeps this ring showing after a
   click, so it appeared during hover too. Offset 0 makes the ring hug
   the tab edge and follow its rounded corners: one shape, not two.
   15 Aug 2026. */
.global-nav ul li a:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 0;
    }

/* ---------- you are here ---------- */

.global-nav a.current-page,
.global-nav a.current-page:hover {
    background: #fff;
    color: #013E39;
    font-weight: 700;
    cursor: default;
    box-shadow: inset 0 -3px 0 #9db3ab;
    }

/* ---------- gallery sub-nav ----------
   Revised 15 Aug 2026.

   Was #5B676d — a mid-tone that carried the same visual weight as the
   pine green above it, so the two bars competed instead of nesting.
   #5B676d is kept in the palette list at the top of fl2_headcms.css
   and is still free to use elsewhere.

   Now a pale blue-grey bar with dark pine green text: the sub-nav
   recedes, the main bar stays dominant, and the relationship reads as
   parent and child. Text contrast is 7.4:1, which passes AA and AAA.
   -------------------------------------------------------------- */

.global-nav.sub-nav {
    background: #C8D6D9;                /* pale blue-grey */
    border-top: 1px solid #B0C2C6;
    border-bottom: 1px solid #B0C2C6;
    }

.global-nav.sub-nav ul {
    padding: .3em 1.2em;
    gap: 0 .2rem;
    }

.global-nav.sub-nav ul li a {
    color: #013E39;                     /* dark pine green on the pale bar */
    font-size: .9em;
    font-weight: 500;
    border-radius: 3px 3px 0 0;
    }

.global-nav.sub-nav ul li a:hover,
.global-nav.sub-nav ul li a:focus-visible {
    background: #B0C2C6;
    color: #013E39;
    }

.global-nav.sub-nav ul li a:focus-visible {
    outline: 2px solid #013E39;
    outline-offset: 0;
    }

/* You are here: inverted, so it reads as selected on a pale bar
   rather than washing out the way a white tab would. */
.global-nav.sub-nav a.current-page,
.global-nav.sub-nav a.current-page:hover {
    background: #013E39;
    color: #fff;
    font-weight: 600;
    box-shadow: none;
    }

/* the Login / utility item stays right */
.global-nav .log {
    margin-left: auto;
    }
