/* Add a black background color to the top navigation */
#nav_bar_top {
border-radius: 0px;
}

#nav_bar_top a {
    color: white;
}

#nav_bar_top a:hover {
    color: white;
}

#nav_bar_top a.active {
    color: white;
}

#nav_bar_toplogin {
    border-radius: 0px;
    }
    
#nav_bar_toplogin a {
        color: white;
    }
    
#nav_bar_toplogin a:hover {
        color: white;
    }
    
#nav_bar_toplogin a.active {
        color: white;
    }

#nav_bar_toplogin .navbar-brand a:hover {
    }

/* Add a black background color to the top navigation */
.bottomnav {
  background-color: #b3b3b3;
  overflow: hidden;
  overflow: hidden;
  position: fixed;
  bottom: 0;
  width: 100%;
}

/* Style the links inside the navigation bar */
.bottomnav a {
    /*float: left;*/
    display: block;
    color: white;
    /*text-align: center;*/
    padding: 8px 10px;
    text-decoration: none;
    font-size: 12px;
}

/* Change the color of links on hover */
.bottomnav a:hover {
    background-color: #b3b3b3;
    color: white;
}

/* Add a color to the active/current link */
.bottomnav a.active {
    background-color: #b3b3b3;
    color: white;
}

@media only screen and (max-width: 600px) {
    /* Add a black background color to the top navigation */
    .bottomnav {
        visibility: hidden;
        background-color: #b3b3b3;
        overflow: hidden;
        overflow: hidden;
        position: fixed;
        bottom: 0;
        width: 100%;
    }
    .bottomnav a {
        visibility: hidden;
        /*float: left;*/
        display: block;
        color: white;
        /*text-align: center;*/
        padding: 8px 10px;
        text-decoration: none;
        font-size: 12px;
    }

    /* Change the color of links on hover */
    .bottomnav a:hover {
        visibility: hidden;
        background-color: #b3b3b3;
        color: white;
    }

    /* Add a color to the active/current link */
    .bottomnav a.active {
        visibility: hidden;
        background-color: #b3b3b3;
        color: white;
    }



}

/* FOR THE NAV BAR TO AVOID OVERFLOW TO 2ND LINE */
/* hide mobile version by default */
.hidesmall .mobile {
    display: none;
}
/* when screen is less than 600px wide
   show mobile version and hide desktop */
@media only screen and (max-width: 1140px) {
    .hidesmall .mobile {
        display: block;
    }
    .hidesmall .desktop {
        display: none;
    }
}
@media only screen and (max-width: 1140px) and (min-width:750px) {
    .hidden-mobile {
        display: none !important;
    }
}