﻿/* Styles for Header
-----------------------------------------------------------*/
.navbar-wrapper
{
    position: relative;
    width: 100%;
    height:4.5em;
    z-index:1030;
}

.navbar-panel
{
    position:fixed;
    width: 100%;
    top: 0px;
    z-index:inherit;
}

.navbar-menu
{
    width: 100%;
    height:4.5em;
    background-color:#fbfbfb;
    border-bottom:1px solid #e8e8e8;
    position: relative;
    z-index:inherit;
    transition:0.2s;
}

.navbar-table-menu 
{
    width:100%;
    border-collapse:collapse;
}

.navbar-menu-opt2w
{
    display:none;
    border-bottom:1px solid #e8e8e8;
}

.navbar-menu-opt2 
{
    background-color:white;
    text-align:center;
    padding-top:1em;
    padding-bottom:1em;
    display:none;
}

.nav-usr-menu2
{
    background-color:white;
    text-align:center;
    padding-top:1em;
    padding-bottom:1em;
    display:none;
}

/* this is the parent menu */
.ul-navbar-menu 
{
    margin: 0;
    padding: 0;
    list-style: none;
}

.ul-navbar-menu .nav-menu-itm
{
    color: black;
    margin-left: 0.2em;
    margin-right: 0.2em;
    padding-right: 0.5em;
    padding-left: 0.5em;
}

.ul-navbar-menu.horizontal .nav-menu-itm
{
    display:inline-block;
    padding:0.5em;
}

.ul-navbar-menu.vertical .nav-menu-itm 
{
    height: 2.5em;
}

.menu-panel-useraccount 
{
    color:#800000 !important;
    font-weight:600 !important;
    font-size:1.1em !important;
    position:relative;
}

.ul-navbar-menu .nav-menu-itm .am1
{
    color:#353535;
    font: 13px proxima-nova,sans-serif;
    font-weight:500;
    text-decoration: none;
    text-align: center;
    cursor:pointer;
}

.ul-navbar-menu .nav-menu-itm.widsub:hover
{
    background-color: #f7f7f7 !important;
}

.ul-navbar-menu .nav-menu-itm:hover .am1
{
    color: #41a867 !important;
}

.ul-navbar-menu .nav-menu-itm:hover .am1::after
{
    border-top: 7px solid #41a867 !important;
}
/****************************************************************/

/*this is the sub menu*/
.ul-navbar-submenu 
{
    position: absolute;
    background-color: #f7f7f7;
    border-left: solid 1px #e9e9e9;
    border-right: solid 1px #e9e9e9;
    border-bottom: solid 1px #e9e9e9;
    text-align:center;
    list-style: none;
    padding:0.5em;
    display:none;
}

.ul-navbar-submenu .sub-menu-itm
{
    color: black;
    margin-left: 0.2em;
    margin-right: 0.2em;
    padding-right: 0.5em;
    padding-left: 0.5em;
    margin:0.5em;
}

.ul-navbar-submenu .sub-menu-itm a
{
    color:#353535;
    font: 13px proxima-nova,sans-serif;
    font-weight:500;
    text-decoration: none;
    text-align: center;
}

.ul-navbar-submenu .sub-menu-itm:hover a
{
    color: #41a867 !important;
}
/****************************************************************/

.td-navbar-menu-brand
{
    vertical-align:top;
}

.td-navbar-menu-links 
{
    text-align:right;
    vertical-align:central;
}

.nav-sys-menu 
{
    padding-right:3em;
}

.nav-usr-menu 
{
    width:9em;
}

/*Toggle for List and Close*/
.divListToggle 
{
    position:relative;
    width:30px;
    height:25px;
    cursor:pointer;
    display:none;
}

.spnListToggleLine
{
    display:block;
    position:absolute;
    height:3px;
    width:100%;
    border-radius:9px;
    opacity:1;
    left:0;
    -webkit-transform:rotate(0deg);
    transform:rotate(0deg);
    -webkit-transition:.25s ease-in-out;
    transition:.25s ease-in-out;
    background-color:#353535 !important;
}

.spnToggleLine1
{
    top:0;
}

.spnToggleCross1 {
    top: 11px;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
}

.spnToggleLine2
{
    top:10px;
}

.spnToggleCross2
{
    opacity: 0;
}

.spnToggleLine3
{
    top:20px;
}

.spnToggleCross3
{
    top: 11px;
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
}
/*************************************************/

/*for tablets*/
@media screen and (max-width:1100px) 
{
    .divListToggle 
    {
        display:inline-block;
    }

    .navbar-menu-opt2 
    {
        display:block;
    }

    .td-navbar-menu-brand
    {
        text-align:center;
    }

    .td-navbar-menu-links.nav-sys-menu
    {
        display:none;
    }
}

/*for tablets*/
@media screen and (max-width:959px) {
    
}

/*for phones*/
@media screen and (max-width:640px) {
    .td-navbar-menu-links.nav-usr-menu
    {
        display:none;
    }

    .td-navbar-xtra {
        display:none;
    }

    .nav-usr-menu2
    {
        display:block;
    }
}

/*smallest screen for phones*/
@media screen and (max-width:320px) {
    .navbar-wrapper, .navbar-panel
    {
        width:320px;
    }

    .td-navbar-menu-brand {
        text-align:left;
    }

    .td-navbar-toggle {
        width:4em !important;
    }
}