/* =============================================================================
   Navigation Core Styles
   ========================================================================== */

nav {
    position: absolute;

}

.nav {
    background: var(--main-theme-color);
    float: left;
    min-width: 100%;
    width: 1500px;
}

.nav ul {
    text-align: center;
}

.nav ul li {
    float: left;
    display: inline;
}

.nav ul li:hover {
    background: linear-gradient(135deg, #2563eb, #3b82f6);
}

.top_nav_link {
    display: block;
    padding: 15px 0px 15px 0px;
    color: #fff;
    width: 150px;
}

.top_nav_link:hover {
    color: #fff;
    text-decoration: none
}

.nav ul li ul {
    position: absolute;
    width: 150px;
    background: #FFF;
}

.nav ul li ul li {
    margin: 0;
    padding: 0;
    width: 150px;
}

.nav ul li ul li a {
    display: block;
    padding: 15px 0px 15px;
    color: #333;
    border-bottom: 1px #fff solid;
    border-top: 1px #fff solid
}

.nav ul li ul li:hover a {
    border-bottom: 1px solid #06C;
    border-top: 1px solid #06C;
    color: #06C;
    text-decoration: none;
    background: #fff
}

.nav ul li ul.fallback {
    display: none;
}

.nav ul li:hover ul.fallback {
    display: block;
}

.nav ul li ul.right {
    right: 0;
}


/*NAV LEFT*/

.left_header {
    background-color:  var(--main-theme-color);
    color: white;
    padding: 10px;
    border-radius: 6px 6px 0 0;
}

.link_navleft {
    border-bottom: 1px gray solid;
    padding: 10px;
    display: block;
    cursor: pointer;
    background-color: white;
    color: gray;
}

.current_nav {
    background: linear-gradient(135deg, #2563eb, #3b82f6);
    color: white;
    border-bottom: 1px gray solid;
    padding: 10px;
    display: block;
    text-decoration: none;
    cursor: default
}

.current_nav:hover {
    text-decoration: none;
    color: white
}

.link_navleft:hover {
    color: black;
    background-color: #EEEEEE;
}


/*TAB*/

.tab {
    padding: 10px;
    text-align: center;
    width: 200px;
    display: inline-block;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    background-color: #CCCCCC;
    cursor: pointer;
    color: #666666
}

.tab:hover {
    background: linear-gradient(135deg, #2563eb, #3b82f6);
    color: white;
    text-decoration: none
}

.tab_active {
    padding: 10px;
    text-align: center;
    width: 200px;
    text-decoration: none;
    display: inline-block;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    background-color:  var(--main-theme-color);
    color: white;
    border-bottom: 1px #111 solid;
}

.tab_active:hover {
    color: white;
    text-decoration: none
}


/* start pagination */

.rowodd {
    background-color: #F2F2F2
}

.paging {
    padding: 5px 0px 2px 0px;
}

div.paging a {
    padding: 2px 8px 2px 8px;
    margin: 2px;
    border: 1px solid silver;
    background-color: #fff;
    text-decoration: none;
    /* no underline */
    color: gray;
}

div.paging a:active {
    border: 1px solid #fff;
    color: #000;
}

div.paging a:hover {
    border: 1px solid #fff;
    background-color: #09C;
    color: #fff;
}

div.paging a:focus {
    border: 1px solid #fff;
    background-color: #09C;
    color: #fff;
}

div.paging span.current {
    padding: 2px 8px 2px 8px;
    margin: 2px;
    border: 1px solid #F63;
    font-weight: bold;
    background-color: #F63;
    color: #FFF;
}

div.paging span.disabled {
    padding: 2px 5px 2px 5px;
    margin: 2px;
    border: 1px solid #EEE;
    color: gray;
}


/*end pagination style*/