﻿nav {position: sticky;top:0;z-index:9999; width:100%; -webkit-transform: translate3d(0,0,0);}

nav > ul {
    /*    border-bottom: 4px solid var(--wwwSec);*/
    font-family: Tahoma, Arial, sans-serif;
    font-size: 14px;
    font-weight: bold;

}

nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
}


nav .main-menu {
    display: none;
}

#tm:checked + .main-menu {
    display: block !important;
}

nav input[type="checkbox"],
nav ul span.drop-icon {
    display: none;
}

nav i.fa.dropIcon:before {
    content: "\f13a";
}

/*


nav li,
#toggle-menu,
nav .sub-menu {
    border-style: solid;
    border-color: rgba(0, 0, 0, .05);
}*/

/*
nav li,
#toggle-menu {
    border-width: 0 0 1px;
}*/

nav .sub-menu {
    /*   background-color: #444;
    border-width: 1px 1px 0;*/
    margin: 0 1em;
}

    nav .sub-menu li:last-child {
        border-width: 0;
    }

nav li,
#toggle-menu,
nav a {
    position: relative;
    display: block;
}

nav {
    background-color: var(--wwwLight);
}

#toggle-menu {
    background-color: var(--wwwLight);
    font-weight:bold;
}

#toggle-menu{
    padding: 1em 1.5em;
}

#toggle-menu span:last-child{float:right;}

/*
nav a {
    transition: all .125s ease-in-out;
    -webkit-transition: all .125s ease-in-out;
}

    nav a:hover {
        background-color: white;
        color: #09c;
    }
    */

nav .sub-menu {
    display: none;
}

nav input[type="checkbox"]:checked + .sub-menu {
    display: block;
}

/*
nav .sub-menu a:hover {
    color: #444;
}
    */

#toggle-menu .drop-icon,
nav li label.drop-icon {
    position: absolute;
    right: 0;
    top: 0;
}

nav label.drop-icon, #toggle-menu span.drop-icon {
    padding: 1em;
    font-size: 1em;
    text-align: center;
    background-color: rgba(0, 0, 0, .125);
    text-shadow: 0 0 0 transparent;
    color: rgba(255, 255, 255, .75);
}


nav ul li > label.hasSubMenu {
    display: table;
    padding: 0;
    width: 100%;
}

    nav ul li > label.hasSubMenu > * {
        display: table-cell;
    }

    .dropSpan{
        text-align:right;
        padding-left:0.5em;
    }

nav ul li > span.hasSubMenu *:last-child {
    text-align: right;
}

nav ul li a, nav ul li label {
    display: block;
    
    text-decoration: none;
    white-space: nowrap;
    text-align: left;
}

nav ul.main-menu li{padding-left:10px; padding-right:10px;}
/*nav ul li > * {
    padding: 1px 10px;
}*/

nav span.inlineLogo{display:inline-block;}

ul.sub-menu {border:1px solid black;}

nav > ul li img {
    vertical-align: middle;
}

nav li hr{margin-left:-10px;margin-right:-10px;}

nav {
    border-bottom: 4px solid var(--wwwDark)
}

nav, nav a, nav ul /* ul li *  */ {
    color: var(--wwwDark);
    background-color: var(--wwwLight)
}


    nav a:hover span.crewHD * {
        color: var(--wwwLight);
    }


    nav.crewHD ul li hr {
        border-color: var(--wwwDark)
    }

    nav span.smallLogo{width:140px;}
/* FOR NON-MOBILE*/
@media only screen and (min-width: 1024px) {
    nav ul {
        width: 100%;
        z-index: 9999;
    }
        nav ul:before, nav ul:after {
            content: " ";
            /* 1 */
            display: table;
            /* 2 */
        }
    nav ul:after{clear:both;}
    nav .main-menu {
        display: block;
        
    }

    #toggle-menu,
    nav ul.main-menu > li > label > span.dropSpan, nav ul.main-menu > div > li > label > span.dropSpan {
        display: none;
    }

    nav ul span.drop-icon {
        display: inline-block;
    }

    nav ul li {
        float: left;
        border-width: 0 1px 0 0;
    }

    nav .sub-menu li {
        float: none;
    }

    nav .sub-menu {
        border-width: 0;
        margin: 0;
        position: absolute;
        top: 100%;
        left: 0;
        width: auto;
        z-index: 3000;
    }

    nav .sub-menu,
    nav input[type="checkbox"]:checked + .sub-menu {
        display: none;
    }

        nav .sub-menu li {
            border-width: 0 0 1px;
        }

        nav .sub-menu .sub-menu {
            top: 0;
            left: 100%;
        }

    /*      nav .sub-menu .drop-icon {
            position: absolute;
            top: 0;
            right: 0;
            padding: 1em;
        }*/

    nav li:hover > input[type="checkbox"] + .sub-menu {
        display: block;
    }

    nav div.right{float:right;}

    nav ul.sub-menu label.hasSubMenu i.fa.dropIcon:before {
        content: "\f138";
    }

    nav ul.main-menu > li > a, nav ul.main-menu > li > label, nav ul.main-menu > div.right > li > label, nav ul.main-menu > div.right > li > a {
        height: 3em;
        line-height: 3em;
    }

    nav ul.main-menu div.right ul {
        left: auto;
        right: 0;
    }
    nav ul li:hover, nav ul li:hover > a, nav ul li:hover > label {
        background-color: var(--wwwDark);
        color: var(--wwwLight) !important;
    }
    
}
