/* HorizNavigation Bar at Top of Page */


/* get ul to center without, older, CENTER command */
.menu { text-align:center; }
.menu ul { display:inline-table;}
.menu ul li {display:inline;}

/* For Horz CSS Nav Bar with Dropdowns  - Start */
/* as the current Web Page takes on different color this code MUST be in all web pages!! */
ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #5F8AC5;
}

li {
    float: left; 
    border-right: 1px solid #A9A9A9;
}

/* prevents last menu item from having vertical line after */
li:last-child {
    border-right: none;
}

li a, .dropbtn {
    display: inline-block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

/* main menu item background color when doing drop down for upper lever item #111=black */
li a:hover, .dropdown:hover .dropbtn {
    background-color: #A9A9A9;/* was #111'or #111111'(RGB=17,17,17)=Black, then white, now #A9A9A9=Gray */
}

li.dropdown {
    display: inline-block;
}

/* drop down menu item list effects */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #5F8AC5;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 9999; /* MUST BE HERE  to force menu Dropdowns to be on top of any pics/text -THIS ONE MUST HAVE - MAY be needed other places */
}

/* drop down menu items in list effects */
.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    font: 17px Helvetica; /* Font size for items inside drop down */
}

/* drop down menu items mouse hover over color - #f1f1f1=black */
.dropdown-content a:hover {
    background-color: #f1f1f1;
}

.dropdown:hover .dropdown-content {
    display: block;
}

.center {
    margin: auto;
    width: 825px;  /* was set to 58%, but to stop 'stacking menu' changed to SET size and REMed @media section - This controls how wide Selector will be - if add Major selections, this needs to be increased - was 800 */
    border: 3px solid #5F8AC5; /* was, originally, to be different color, then didn't want border A9A9A9 */
    padding: 10px; 
}

body {margin: 0;}

ul.topnav {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #5F8AC5;
    font: 20px Helvetica; /* Font size for items inside top menu line */
}

/*
ul.topnav li {float: center;}
*/

ul.topnav li a {
    display: block;
    color: #0F1F7A; /* #0F1F7A=Text Color - was white, now same Dark Blue as found in Logo */
    text-align: left;
    padding: 14px 16px;
    text-decoration: none;
}

ul.topnav li a:hover:not(.active) {background-color: #A9A9A9;} /* Mouse over color - #111'or #111111'(RGB=17,17,17)=Black, then white, now #A9A9A9=Gray */

ul.topnav li a.active {background-color: #A9A9A9;} /* currently active menu item #A9A9A9=Gray */

ul.topnav ul.right {
    float: right; 
    list-style-type: none;
}

/* to stop 'stacking menu' REM this section and set .center to set 800px from 58%
@media screen and (max-width: 800px){
    ul.topnav ul.right, 
    ul.topnav li {float: none;}
}
to stop 'stacking menu' REM this section and set .center to set 800px from 58% */
/* For Active Top Nav Bar - End */