
.indent30px {
    text-indent: 30px;
}
/* text to go on header size the same as header*/
#comingSoon {
    top: 0;
    left: 0;
    bottom: 0;
    position: absolute;
}
#comingSoon img {
    width: 100%
}
/* box containing the header */
#headerContainer {
    position: relative;
    width: 100%;
	background-color: black;
}
#headerContainer>#banner {
	max-width: 1550px;
	margin: 0 auto;
	display: block;
}						  
/* position and styles home link button */
#homeLink {
    position: absolute;
    top: 10px;
    right: 70px;
    width: 40px;
    display: block;
    z-index: 1;
    height: 30px;
    text-decoration: none;
    font-family: Copperplate Gothic Light, sans-serif;
}
/* next two hide text and display home image top right when display small */
#homeLink>span {
    display: none;
}
#homeLink>img {
    height: 32px;
}
/* hides check box that handles menu toggling */
#mainmenuToggle {
    display: none;
}
/* makes social media boxes */
#menu>li.smedia>a {
    display: inline-block;
    width:32px;
}
/* defines hamburger container */
#mmTogMenu {
    display:block;
    position: absolute;
    top: 15px;
    right: 0;
    width: 50px;
    cursor: pointer;
    overflow: hidden;
}
/* defines hamburger lines */
#mmTogMenu span {
    width: 30px;
    background-color: white;
    border-radius: 2px;
    height: 4px;
    margin-bottom: 7px;
    display: block;
}
/* defines text for screenreader for hamburger */
#mmTopMenu span.hl::after{
    content: 'Menu';
}
/* causes menu to appear from hamburger */
#mainmenuToggle:checked + #mainmenu {
    display: block;
}
#mainmenu * {
    text-align: left;
}
/* menu when hamburger is activated */
#mainmenu {
    width: 300px;
    display: none;
    text-align: left;
    z-index:1;
    position: absolute;
    top: 50px;
    right: 0;
}
/*Strip the ul of padding and list styling*/
#mainmenu ul {
    list-style-type: none;
    padding: 0;
    position: relative;
}
/* styles hamburger menu list */
#mainmenu > ul {
    position: relative;
    display:block;
}
#mainmenu > ul > li {
    padding: 2px 5px;
}
/* element styling of hamburger menu */
#mainmenu li {
    display: block;
    margin: 0 1px 0 0;
    padding: 0;
    font-size: 18px;
    white-space: nowrap;
}
/* styling of left most menu elements */
#mainmenu > ul > li > a,
#mainmenu > ul > li > span {
    text-align: left;
    height:32px;
    line-height:30px;
    font-size: 18px;
    width:100%;
    padding: 1px 0;
	display: block;
}
#mainmenu > ul > li > span > a {
    display:inline-block;
    width: auto;
    height: 32px;
}
/*Style for menu links*/
#mainmenu li a {
    display: block;
    width: 100%;
    height: 20px;
    line-height: 20px;
    text-decoration: none;
}
/*Style for dropdown links*/
#mainmenu li ul a  {
    height: 20px;
    line-height: 20px;
}
/*Hide dropdown links until they are needed*/
#mainmenu li ul {
    display: block;
    width:100%;
}
/*Make dropdown links vertical*/
#mainmenu li ul li {
    display: block;
    float: none;
    width:100%;
}
/*Prevent text wrapping*/
#mainmenu li ul li a {
    width: 100%;
    padding-left: 20px;
}
/*Show menu when invisible checkbox is checked*/
#menu {
    display: block;
}
/* handles larger screen sizes (over 600px) */
@media only screen and (min-width: 600px) {
    #headerContainer {
        width: 100%;
        max-width: 2500px;
        margin: 0 auto;
    }
    /* changes meanings of above elements to reflect large screen */
    #homeLink {
        top: 10px;
        bottom: auto;
        left: 25px;
        width: 140px;
        height: 30px;
        padding: 1px 0;
    }
    #homeLink>span {
        display: block;
        font-size: 18px;
        color: white;
        background-color: #7e7f82;
        border-radius: 15px;
        text-align: center;
        width: 100%;
        height: 30px;
        line-height: 30px;
    }
    #homeLink>img {
        display: none;
    }
    #mmTogMenu {
        display:none;
    }
    #mainTable {
        width:100%;
        position: relative;
    }
    #mainLeft {
        display:none;
    }
    #mainRight {
        position: relative;
    }
    #mainmenu * {
        text-align: left;
        z-index: 110;
        /*position: relative;*/
    }

    #mainmenu {
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        z-index: 110;
    }
    /*Strip the ul of padding and list styling*/
    #mainmenu ul {
        list-style-type: none;
        padding: 0;
        position: absolute;
    }
    #mainmenu > ul {
        position: absolute;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        width: 140px;
        top: 5px;
        right: 0;
        bottom: 10px;
    }
    /*Create a horizontal list with spacing*/
    #mainmenu li {
        display: inline-block;
        float: left;
        margin: 0 1px 0 0;
        padding: 0;
        font-size: 18px;
        white-space: nowrap;
    }
    #mainmenu > ul > li {
        margin: 0;
        text-align: center;
        padding: 0;
    }
    #mainmenu > ul > li > span>a {
        overflow: hidden;
        height: 30px;
    }
    #mainmenu > ul > li > a,
    #mainmenu > ul > li > span {
        height: 30px;
        padding: 1px 0;
        text-align: center;
        border-radius: 15px;
        display:block;
    }
    /*Style for menu links*/
    #mainmenu li a {
        display: block;
        text-decoration: none;
        overflow: hidden;
    }
    /*Style for dropdown links*/
    #mainmenu li:hover ul a,
    #mainmenu li:focus-within ul a {
        height: 30px;
        line-height: 30px;
    }
    /*Hide dropdown links until they are needed*/
    #mainmenu li ul {
        display: none;
        position: absolute;
        top: 0;
        right: 140px;
        bottom: 0;
        width: 255px;
        padding-right: 2px;
        flex-direction: column;
        justify-content: space-between;
    }
    /*Make dropdown links vertical*/
    #mainmenu li ul li {
        width: 255px;
        display: block;
        float: none;
        height: 30px;
    }
    /*Prevent text wrapping*/
    #mainmenu li ul>li>a {
        width: auto;
        max-width: 255px;
        height: 30px;
        padding: 0 20px;
        border-radius: 15px;
    }
    #mainmenu li:hover>a,
    #mainmenu li:focus-within>a{
        border-radius: 15px;
    }
    /*Display the dropdown on hover*/
    #mainmenu ul li:hover a + .hidden,
    #mainmenu .hidden:hover,
    #mainmenu ul li:focus-within a + .hidden,
    #mainmenu .hidden:focus-within {
        display: flex;
    }
    /*Show menu when invisible checkbox is checked*/
    #menu {
        display: block;
        margin:0;
    }
}


#mainmenu li a {
    color: white;
}
/* slate gray color from river */
#mainmenu li>a,
#mainmenu li>span {
    background-color: #8fa0bd;
}

#mainmenu li:hover>a,
#mainmenu li:focus-within>a, #homeLink:hover span, #homeLink:focus-within span {
    background: #9F9; /* mouse-over color */
    color: #000;
}

#mainmenu li:hover ul a,
#mainmenu li:focus-within ul a {
    background-color: #bac9e2; /* inner menu group color */
    color: black;
}

#mainmenu li:hover ul a:hover,
#mainmenu li:focus-within ul a:hover,
#mainmenu li:focus-within ul a:focus-within {
    background: #9F9; /* mouse-over color for inner group*/
    color: #000;
}
/* slate gray color from river (jmj) or stone (wep) */
#mainmenu > ul > li>a {
/*    background-color: #8fa0bd; */
	background-color: #7e7f82;
}