@import url('https://fonts.googleapis.com/css2?family=Barlow+Semi+Condensed:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

#header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 10; /* Ensure it's on top */
    height: 90px; /* Initial height */
    margin: 0px;
    border: none;
    display: flex;
    flex-direction: row; 
}

.nav-top-1280 {display:flex;flex-direction:row;font-size:12pt;}
.nav-top-667 {display:none;}
.nav-top-360 {display:none;}






.header-container-margin-left {
    width: calc((100vw - 1200px)/2);
    height: 100%;
    background-color: white;
    border-bottom: 1px solid black;
}

.header_button_mailing_list {
    width: 100%;
}

.header_button_mailing_list img {
    margin-right: 8px;
    margin-top: 11px;
    float: right;
}

.logo-container {
    overflow: hidden;
    width: 270px;
    min-width: 270px;
    height: 100%;
    background-color: white;
    background-image: url('/images4/nav-logo-bg.png');
    background-repeat: no-repeat;
    background-position: right top;
    background-size: auto 100%;
    border-bottom: 1px solid black;
    border-right: 1px solid black;
    border-bottom-right-radius: 10px;
}

.logo {
    height: 99%;
    margin-left: 5px;
}

.nav-container {
    overflow: hidden;
    width: 930px;
    height: 67px;
    background-color: #001e56;
    border-bottom: 1px solid black;
    border-bottom-left-radius: 10px;
}

.header-container-margin-right {
    width: calc((100vw - 1200px)/2);
    height: 67px;
    background-color: #001e56;
    border-bottom: 1px solid black;
}


.navlink {
    height: 100%;
    background-color: #001e56;
    text-align: center;
    padding-top: 27px;
}

.navlink-active {
    height: 100%;
    background-color: #c30005;
    text-align: center;
    padding-top: 27px;
}

.navlink a, .navlink-active a {
    padding-left: 18px;
    padding-right: 18px;
    text-transform: uppercase;
    text-decoration: none;
    font-family: "Barlow Semi Condensed", sans-serif;
    font-weight: 500;
    color: white;
    white-space: nowrap;
}
.navlink a:visited, .navlink-active a:visited, .navlink a:active, .navlink-active a:active {
    color:white;
}






    .nav-mobile {
        background-color: #001e56;
        border: 1px solid black;
        display: none;
        position: absolute;
        left: 338px;
        top: 80px;
        width: 200px;
        font-size: 12pt;
        z-index: 10;
        padding-bottom: 10px;
        border-bottom-left-radius: 12px;
        border-bottom-right-radius: 12px;
    }

    .nav-mobile a {
        color: white;
        margin-left: 10px;
        text-decoration: none;
        font-family: "Barlow Semi Condensed", sans-serif;
        white-space: nowrap;
    }
 
    .nav-mobile a:visited, .nav-mobile a:active {
        color: white;
    }




/* ------------------------------ */
/*    MOBILE DEVICES HORIZONTAL   */
/*         667px to 956/998px     */
/* ------------------------------ */
@media only screen and (max-width: 1025px) {
    #header { height: 60px; }

    .header-container-margin-left {width: 1px;} 
    .header-container-margin-right {width:1px;height:50px;}
    .logo-container {width:177px;min-width:177px;background-size: auto 60px;}
    .nav-container {width:calc(100vw - 180px);height:50px;} 
    
    .nav-top-360 {display:none;}
    .nav-top-667 {display:flex;flex-direction:row;}
    .nav-top-1280 {display:none;}

    .navlink, .navlink-active { padding-top: 15px; } 

    .navlink a, .navlink-active a {
        padding-left: 20px;
        padding-right: 20px;
    }

    .nav-mobile {
        left: 250px;
        top: 50px;
        font-size:13pt;
    }



    .header_button_mailing_list {
        width: 100%;
    }

    .header_button_mailing_list img {
        height:40px;
        margin-top: 5px;
        margin-right: 5px;
    }


     
}
     
/* ------------------------------ */
/*    MOBILE DEVICES VERTICAL     */
/*         360px to 450px         */
/* ------------------------------ */
@media only screen and (max-width: 450px) {
    #header { height: 60px; }
    
    .nav-top-360 {display:flex;flex-direction:row;}
    .nav-top-667 {display:none;}
    .nav-top-1280 {display:none;}

    .header-container-margin-left {width:1px;} 
    .header-container-margin-right {width:1px;height:50px;}
    .logo-container {width:177px;background-size: auto 60px;}
    .nav-container {width:calc(100vw - 180px);height:50px;} 

    .logo { height: 59px; }
    .navlink, .navlink-active { padding-top: 15px; }
    .main-container { margin-top: 70px; }

    .navlink a, .navlink-active a {
        padding-left: 20px;
        padding-right: 20px;
    }

    .nav-mobile {
        left: 187px;
        top: 50px;
        font-size: 12pt;
        width:calc(100vw - 195px);
    }


     
}
/* ------------------- */
/* END MOBILE DEVICES  */
/* ------------------- */