﻿.navbar-collapse {
    font-weight:bold;
    font-variant-caps:all-petite-caps;
}

.mega-menu .dropdown-menu .row > div {
    /*border:2px solid white;*/
    padding:5px;
}

.mega-menu .dropdown-menu div ul {
    color:var(--main-dk-green);
    list-style:none;
    overflow:hidden;
    white-space:normal;
}

.mega-menu .dropdown-menu a {
    font-family:'Neuron';
    font-weight:normal;
    padding:5px!important;
    color:white;
    font-size:x-large;
    letter-spacing:0.125vw;
    z-index:60;
    width:100%;
    display:block;
    transition-duration:400ms;
}

.mega-menu .dropdown-menu h3 {
    font-size:xx-large;
    letter-spacing:0.25vw;
}

.mega-menu .dropdown-menu a:hover {
    letter-spacing:0.2vw;
    background-color:var(--main-dk-green);
    margin-left:-1%;
    transition-duration:300ms;
}

.mega-menu h4 {
    border-bottom:1px solid darkgreen;
    font-weight:bold;
    letter-spacing:0.125vw;
    text-align:center;
}

.navbar-default .navbar-nav > li > a {
    font-family     : 'NeuronBold', sans-serif;
    font-size       : 13px;
    font-weight     : bold;
    letter-spacing  : 0.125vw;
    transition-duration:400ms;
}

.navbar-default .navbar-nav>li>a:active, .navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>.open>a {
    color:var(--main-lt-green);
    transition-duration:200ms;
}

.navbar-default .navbar-nav > li > a:active {
    color:white;
    text-shadow:2px 3px 4px rgba(233,227,219, 0.5), -3px -2px 4px rgba(233,227,219, 0.5);
    transition-duration:200ms;
}

.navbar-default .navbar-nav>.open>a {
    background-color:lightgrey;
}



.BGIMAGE {    
    position:absolute;
    top:0;
    left:0;
    right:0;    
    bottom:0;
    overflow:hidden;
    z-index:-1;
    background-position:center left;
    background-size:cover;
    opacity:0.05;
}

#navAccordion {
    background-color:whitesmoke;
    margin-bottom:0;
}

#navAccordion .panel-default, #navAccordion .panel-heading {
    background-color:transparent;
    border:none;
    box-shadow:none;
}

#navAccordion .panel-title {
    text-align:left;
    font-size:large;
    font-family:'NeuronBold';
    letter-spacing:2px;
}


.nav-sign > .logout {
    display:inline-block;
    width:auto;
}




@media (min-width:1206px) {
    .BGIMAGE {
        opacity:1;
    }

    .navbar-nav .dropdown.open .dropdown-menu ul {        
        padding-left:1.5vw;
        padding-inline-start:1.5vw;
    }

    /*NAVBAR OVERRIDES*/
    .navbar-nav .dropdown .dropdown-menu {
        /*background-color:white;*/
        display: block;
        opacity:0;
        position: fixed !important;
        overflow: hidden;
        height: auto;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
        transition-duration: 200ms;
        bottom: 0;
        top: 93px;
        width: 100%;
        padding: 0;
        background-color:transparent;
        box-shadow:none;
    }

    .navbar-nav .dropdown.open .dropdown-menu {
        opacity:1;
        bottom: 0;
        top:0;
        width: 100%;
        transition-duration: 200ms;
        height:100vh;
    }

    dropdown-menu > .row {
        display:flex;
        flex:1;
        position:relative;
        max-height:100vh;
        margin:0;
        left:0;
        padding:0;
        overflow-y:scroll;
        background-position:center center;
        background-repeat:no-repeat;
        background-size:cover;
        background-attachment:fixed;
        animation-duration:1.5s;
        animation-timing-function:ease-out;
    }

    .navbar .row {
        height:100vh;
    }

    .navbar-nav .dropdown .dropdown-menu > .row > .animated {
        padding-bottom:20vw;
    }

    .navbar-nav .dropdown.open .dropdown-menu > .row > .animated {
        position: relative;
        padding-top: 95px;
        height: 100%;
        animation-duration: 750ms;
        animation-fill-mode: backwards;
        animation-timing-function: ease-out;
        animation-name: fadeInUpBig;
    }

    .navbar-nav .dropdown.open:not(.closing) .dropdown-menu > .row > .animated {
        animation-duration: 750ms;
        animation-fill-mode: backwards;
        animation-timing-function: ease-out;
        animation-name: fadeInUpBig;
    }

    .navbar-nav .dropdown.open.closing .dropdown-menu > .row > .animated {
        animation-duration: 750ms;
        animation-fill-mode: forwards;
        animation-timing-function: ease-out;
        animation-name: fadeOutUpBig;
    }

    .navbar-nav .dropdown.open.closing .mmHeader {
        animation-name:fadeInDown;
        animation-duration: 500ms;
        animation-fill-mode: backwards;
        animation-timing-function: ease-out;
    }

    .navbar-nav .dropdown.open.closing .mmHeader {
        animation-name:fadeOut;
        animation-duration: 300ms;
        animation-fill-mode: forwards;
        animation-timing-function: ease-out;
    }
    

.navbar-nav .dropdown.open .BGIMAGE {
    animation-name:fadeIn;
    animation-duration: 500ms;
    animation-fill-mode: backwards;
    animation-timing-function: ease-out;
}

.navbar-nav .dropdown.open.closing .BGIMAGE {
    animation-name:fadeOut;
    animation-duration: 500ms;
    animation-fill-mode: forwards;
    animation-timing-function: ease-out;
}

    .navbar-nav .dropdown .dropdown-menu > .row > div.animated:nth-child(3) {
        background-color: rgba(0, 80, 47, 0.9);
    }
    .navbar-nav .dropdown .dropdown-menu > .row > div.animated:nth-of-type(4) {
        background-color: rgba(0, 92, 61, 0.9);
    }
    .navbar-nav .dropdown .dropdown-menu > .row > div.animated:nth-child(5) {
        background-color: rgba(0, 104, 75, 0.9);
    }
    .navbar-nav .dropdown .dropdown-menu > .row > div.animated:nth-of-type(6) {
        background-color: rgba(0, 116, 89, 0.9);
    }
    .navbar-nav .dropdown .dropdown-menu > .row > div.animated:nth-child(7) {
        background-color: rgba(0, 128, 103, 0.9);
    }

    .dropdown-menu {
        z-index:-1;
        border-radius:0;
    }

    .navbar-nav .dropdown.open .dropdown-menu {
        z-index:5;
    }

    .navbar-nav .dropdown.open .dropdown-menu ul {
        list-style:none;
    }

    .navbar-nav .dropdown.open .dropdown-menu ul > li {
        margin-top:15px;
        font-size:large;
        letter-spacing:0.05vw;
    }

    .dropdown-menu > h2, .dropdown-menu > div h3 {
        margin-left:0.5vw;
        color:white;
        animation:none;
    }

    .dropdown.open .dropdown-menu div > h3 {
        animation-duration: 1000ms;
        animation-fill-mode:backwards;
        animation-name: fadeIn;
    }

    .imageDiv {
        position:absolute;
        bottom:0;
        left:0;right:0;
        background-position:center center;
        background-repeat:no-repeat;
        background-size:contain;
        margin:1vw;
        height:15vw;
    }

    .navbar-header tr:first-child > td:first-child img {
        /*max-width:156px;*/
        max-height:104px;
    }

    .navbar-header h1 {        
        margin-top:-2vw;
    }

    .mega-menu h4 {
        font-size:xx-large;
    }

    .navbar-nav .dropdown-menu {        
        max-height: 0;
        display: block;
        overflow: hidden;
        opacity: 0;
        visibility: hidden; 
        box-shadow:0 6px 12px rgba(0,0,0,.5);
    }

    .mega-menu .dropdown-menu {
        position:fixed;
        left:0;
        top:10vw;
        min-width:40vw;
        width:100vw;
        z-index:50;
        padding:5px;
    }

    .mega-menu .dropdown-menu {
        position:fixed;
        left:0;
        top:7.5vw;
        min-height:0;
        min-width:40vw;
        width:100vw;
        z-index:50;
        padding:0;
    }


    .mega-menu .dropdown-menu .row .mmHeader {
        position:absolute;
        width:100vw;
        left:0;
        right:0;
        top:0;
        height:auto;
        display:block;
        z-index:55;
        border:none!important;
        padding:10px 0 25px 0;
        overflow:hidden;
    }

    .mmHeader > h2 {        
        /*background-color:rgb(233,227,219);*/
        color:white;
        text-align:center;              
        letter-spacing:5px;
        font-weight:bold;
        font-family:'Encode Sans Semi Condensed', Arial, sans-serif;
        font-size:62px;
        white-space:normal;
        transform: scale(1, 1.5);
        max-width:100%;
    }
}

@media(max-width: 767px) {

    .nav-sign {
        right:0;
        left:120px;
        padding-bottom:2px;
        z-index:5005;
        background-color:darkslategray;
        border-bottom-left-radius:5px;
    }

    .nav-sign > .btn, .nav-sign > .logout, .nav-sign > .logout > button {
        padding:4px;
        padding-top:0;
    }

    .mega-menu .dropdown-menu div {
        min-height:unset!important;
    }

    .mega-menu .dropdown-menu a {
        font-size:medium;
    }

    .mega-menu .dropdown-menu {
        width: 100%;
        max-width:none;
        min-width:100%;
    }

    .mega-menu h4 {
        font-size:16px;
        margin:5px 0 0 0;
    }

    .navbar-default .navbar-nav > li > a {
        font-size:medium;
        letter-spacing: 2px;
    }

    .MMsection > h3 {
        border-left-color:var(--main-lt-green);
        display:inline-block;
        letter-spacing:1vw;
    }

    #navAccordion ul {
        padding-left:5vw;
        margin:0;
    }

    #navAccordion .panel-body a {
        z-index:5;
    }

    #navAccordion .panel-body .dropdown-menu {
        position: relative;
        display:block;
        box-shadow:none;
        border:none;
        background-color:var(--main-dk-green);
        margin:0;
        padding:0;
        border-top-left-radius:unset;
        border-top-right-radius:unset;
    }

    navbar-header tr:first-child > td:first-child a {
        position:absolute;
        display:block;
        height:100%;
        width:100%;
        z-index:60;
    }

    .navbar-header tr:first-child > td:first-child a > img {
        position:absolute;
        top:0;
        left:0;
        right:0;
        /*max-height:100%;*/
        max-width:120px;
        border-bottom-right-radius:5px;
        background-color:white;
        z-index:61;
    }

    #navAccordion .panel-body {
        padding:0;
        overflow:hidden;
    }

    #navAccordion .dropdown-menu {
        z-index:0;
    }

    .BGIMAGE {
        position:absolute;
    }
}

@media (max-width: 900px) {
    .navbar-header h1 > small {
        display: none;
    }

    .navbar-default .navbar-nav > li > a {
        font-size: large;
    }

    .navbar-header > table td {
        vertical-align: top;
    }

    .navbar-toggle {
        top: 10px;
    }

    .navbar-collapse.collapsing {
        margin-top: inherit !important;
        border-bottom: 1px solid none !important;
    }

    .navbar-header td > button {
        position:absolute;
        right: 0px;
        /*left: 45vw;*/
        width:auto;
        top:35px;
    }
}

@media (max-width: 767px) {    
    .navbar-header td > button {
        top:25px;
    }
}

@media (max-width: 1205px){
    .BGIMAGE {        
        background-position:center center;
    }

}
