﻿
.mainNav {
    position: relative;
    padding: 0;
    z-index: 200 !important;
}
.mainNav li{
    display:inline-block;
}
    .mainNav a {
        display: inline-block;
        font-weight: bold;
        font-size: 11px;
        color: #f18316;
        text-decoration: none;
        padding: 3px 10px 3px 8px;
        border-right: 2px solid #f18316;
    }
    .mainNav a:hover {
        background: #f18316;
        color:#ffffff;
    }

.subNav {
    display: none;
    position: absolute;
    padding: 0;
    z-index:5;
}

.showMenu:hover .subNav {
    display: block;  
}
.subNav li {
    display: block;
    width: 125px;
    background: #e6e6e6;
    color: #000000 !important;
    font-weight: normal !important;
}
.subNav a {
    display: block;
    color: #000000;
    font-weight: normal;
    padding: 5px 0px 5px 5px;
    border-right:none;
}
.divide{
    padding:0 8px;
}

/*======================
     Mobile Stuff
======================*/
.navOverlay {
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    z-index:1;
    background: rgba(0,0,0,.8);
    opacity: 0;
    display: none;
    transition: opacity .2s ease-in-out;
    -webkit-transition: opacity .2s ease-in-out;
    -moz-transition: opacity .2s ease-in-out;
    -ms-transition: opacity .2s ease-in-out;
    -o-transition: opacity .2s ease-in-out;
}


.navBtn {
    cursor: pointer;
    display: none;
    color: white;
    width: 36px;
    height: 38px;
    position: fixed;
    top: 40px;
    right: 25px;
    bottom: 0;
    z-index: 60;
    padding: 0;
    transition: right .2s ease-in-out;
    -webkit-transition: right .2s ease-in-out;
    -moz-transition: right .2s ease-in-out;
    -ms-transition: right .2s ease-in-out;
    -o-transition: right .2s ease-in-out;
}

    .navBtn hr {
        border: none !important;
        background: white;
        height: 4px;
        width: 73%;
        margin-top: 7px;
    }

/*----------Subnav (Hidden)----------*/

.showSubNav {
    cursor: pointer;
    display: none;
    bottom: 0;
    width: 60px;
    height: 55px;
    position: absolute;
    top: 0;
    right: 0;
 
}

    .showSubNav:before {
        display: inline-block;
        text-align: center;
        position: absolute;
        top: 50%;
        left: 50%;
        font-family: FontAwesome !important;
        color: white;
        font-size: 2.5em;
        content: '\f0d7';
        transform: translate(-50%,-50%);
        -webkit-transform: translate(-50%,-50%);
        -moz-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
        -o-transform: translate(-50%,-50%);
        transition: all .3s ease-in-out;
        -webkit-transition: all .3s ease-in-out;
        -moz-transition: all .3s ease-in-out;
        -ms-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
    }

    .showSubNav.clicked:before {
        transform: translate(-50%,-50%) rotate(180deg);
        -webkit-transform: translate(-50%,-50%) rotate(180deg);
        -moz-transform: translate(-50%,-50%) rotate(180deg);
        -ms-transform: translate(-50%,-50%) rotate(180deg);
        -o-transform: translate(-50%,-50%) rotate(180deg);
    }

