﻿/*!
 * Site designed by: Jordan Zoucha of Sandhills Publishing.
 *
 * This code was ran through an auto prefixer to maximize compatibility. If you wish to run it through the same auto prefixer, you may find it at https://autoprefixer.github.io/
 *
 * Code was ran through CSS Comb to make it neater and easier to read. The designer recommends that any edits be ran through CSS Comb found at http://csscomb.com/online
 *
 */

/*--- HEADER STYLES ---------------------*/

header
{
    position: relative;
    z-index: 9999;

    display: flex !important;
    float: left;

    width: 94%;
    padding: 2% 3% 2% 3%;

    background: #091c3a;

    justify-content: space-between;
}
#logo
{
    float: left;

    margin-left: 3.125VW;
}
#topcontact
{
    float: right;

    margin-top: 8px;
    margin-right: 3.125VW;

    text-align: right;
}
#topcontact a
{
    color: white;
}
#topcontact > *
{
    font-size: calc(1.25rem + ((1vw - 19.2px) * .3984));
}
/*--- NAV STYLES ---------------------*/

nav.primary
{
    position: relative;
    z-index: 9999;

    float: left;

    width: 100%;
    margin: 0;

    border-top: 1px #fff solid;
    border-bottom: 1px #fff solid;
    background: #760017;
}
nav.primary ul li
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;

    height: 100%;

    border-left: solid #091c3a 1px;

    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
nav.primary ul li:first-of-type
{
    border-left: none;
}
nav ul li:hover
{
    color: #ccc;
    background: #091c3a;
}
nav ul li a:hover
{
    color: #ccc;
}
nav.primary ul
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;

    width: 100%;
    height: 100%;

    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
nav ul li a
{
    font-family: 'museo_sans500', Helvetica, Arial, sans-serif;
    font-size: 20px;
    font-weight: normal;

    padding: 22px 26px;

    text-decoration: none;

    color: #fff;
}
/* Appearance of the sub-level links */
nav.primary ul li li a
{
    font-family: 'museo_sans500', Helvetica, Arial, sans-serif;
    font-size: 16px;
    font-weight: normal;

    width: 100%;
    padding: 15px;

    text-decoration: none;

    color: #fff;
}
/* Appearance of the sub-level links on hover */
nav.primary ul li li a:hover
{
    background: #760017;
}
/* This controls the Primary nav dropdowns for sublinks. Should not have to edit this too muuch */
nav.primary ul ul
{
    position: absolute;

    display: none;
}
nav.primary ul li:hover > ul
{
    /* position: relative; */
    position: absolute;
    /* z-index: 99999; */

    display: block;

    width: 250px;
    padding-top: 133px;
}
nav.primary ul ul li
{
    /* position: relative; */
    /* display: block; */
    /* float: none; */
    /* width: 295px; */
    /* margin: 0; */
    height: 45px;
    /* height: 0; */

    -webkit-transition: all .25s ease;
        -ms-transition: all .25s ease;
         -o-transition: all .25s ease;
            transition: all .25s ease;

    background: #091c3a;
}
/*---MOBILE NAV STYLES ---------------------*/

#menu-button
{
    display: none;
}
nav.mobile
{
    display: none;
}

@media screen and (max-width: 650px)
{
    .slideDown
    {
        -webkit-animation: .4s ease-out 0s 1 slideIn;
                animation: .4s ease-out 0s 1 forwards slideIn;
    }
    .slideUp
    {
        -webkit-animation: .4s ease-out 0s 1 slideOut;
                animation: .4s ease-out 0s 1 slideOut;
    }
    nav.primary
    {
        display: none;
    }
    #menu-button
    {
        font-size: 24px;

        position: relative;
        /* line-height:60px; */
        z-index: 2; /* needs to be lower than nav.mobile, adjust as needed */

        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;

        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }
    #menu-button a
    {
        font-size: 23px;

        text-decoration: none;

        color: #fff;
    }
    nav.mobile
    {
        position: absolute;
        z-index: 9998; /* needs to be higher than #menu-button, adjust as needed */

        display: block;
        visibility: hidden;
        overflow: auto;
        /* left: -250px; */

        width: 100%;
        height: auto;
    }
    nav.mobile ul
    {
        font-weight: 300;

        margin: 0;
        padding: 0;

        list-style: none;

        border-bottom: 1px #fff solid;
        background: #760017;
    }
    nav.mobile ul li ul
    {
        margin: 10px 0 -10px 0;
    }
    nav.mobile ul li
    {
        padding: 10px 0;
    }
    nav.mobile ul a
    {
        font-size: 20px;
    }
    nav.mobile ul li
    {
        position: relative;

        border-top: 1.4px solid white;
    }
    nav.mobile ul li ul li
    {
        background: #091c3a;
    }
    nav.mobile ul li .fa
    {
        color: white;
    }
    /* FIRST LEVEL */
}

/*---RESPONSIVE STYLES ---------------------*/


@media screen and (max-width:1300px)
{
    nav ul li a
    {
        font-size: 1.52vw;

        padding: 1.6923076923076923VW 2vw;
    }
    nav.primary ul li li a
    {
        font-size: 1.2307692307692308VW;

        padding: 1.153846153846154VW;
    }
    nav.primary ul li:hover > ul
    {
        width: 19.230769230769234VW;
        padding-top: calc(4.125rem + ((.98vw - 6.51px) * 10.4777));
    }
}

@media only screen and (max-width: 650px)
{
    #menu-button
    {
        z-index: 9999;

        width: 100%;
        padding: 3px 0;

        border-top: 1px #fff solid;
        border-bottom: 1px #fff solid;
        background: #760017;
    }
}

@media screen and (max-width:450px)
{
    #menu-button
    {
        width: 100%;
    }
}

/*-------- FIREFOX ONLY STYLES --------*/

@-moz-document url-prefix()
{
    h2
    {
        margin-bottom: 20px !important;
    }
}

/*-------- IE ONLY STYLES --------*/

@media screen and (max-width:1300px)
{
    _:-ms-lang(x),
    nav.primary ul li:hover > ul
    {
        margin-top: calc(-1.0625rem + ((1vw - 6.5px) * 2.6154)) !important;
        margin-left: calc(-5.3125rem + ((1vw - 6.5px) * -13.0769)) !important;
    }
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none)
{
    nav.primary ul li:hover > ul
    {
        margin-left: -170px;
        padding-top: 33px !important;
    }
}
@supports (-ms-ime-align:auto)
{
    @media screen and (max-width:1300px)
    {
        nav.primary ul li:hover > ul
        {
            margin-left: 0 !important;
        }
    }
}
