#navigationBar.navbar{
    background: var(--sticky-color);
    top: 0;
    min-width: 100%;
    z-index: 10000;
    height: 100%;
}

/*.navbar-collapse {*/
    /*display: flex !important;*/
    /*flex-basis: auto !important*/
/*}*/

.navbar-nav{
    flex-direction: row !important;
}

.form-inline{
    flex-flow: row !important;
}

/* Search button*/
.btn-outline-success:hover {
    color: var(--bg-color);
    background-color: var(--noactive-bg-color);
    border-color: var(--noactive-bg-color);
}

.btn-outline-success:not(:disabled):not(.disabled):active {
    color: var(--bg-color);
    background-color: var(--noactive-bg-color);
    border-color: var(--noactive-bg-color);
}

.btn-outline-success {
    color: var(--noactive-bg-color);
    background: transparent none;
    border-color: var(--noactive-bg-color);
}

.btn-outline-success.focus, .btn-outline-success:focus, .btn-outline-success:not(:disabled):not(.disabled):active:focus {
    box-shadow: 0 0 0 0.1rem var(--active-bg-color);
}

/*Toggle sidebar button*/
.btn-outline-dark {
    color: var(--noactive-bg-color);
    background: transparent none;
    border-color: var(--noactive-bg-color);
}

#sidebar.active {
    min-width: 100px;
    width: 100px;
    text-align: right;
    overflow-x: hidden;
}

.btn-outline-dark:hover {
    color: var(--bg-color);
    background-color: var(--noactive-bg-color);
    border-color: var(--noactive-bg-color);
}

.btn-outline-dark:not(:disabled):not(.disabled):active {
    color: var(--bg-color);
    background-color: var(--noactive-bg-color);
    border-color: var(--noactive-bg-color);
}

.btn-outline-dark.focus, .btn-outline-dark:focus, .btn-outline-dark:not(:disabled):not(.disabled):active:focus {
    box-shadow: 0 0 0 0.1rem var(--active-bg-color);
}

/* User dropmenu */

.dropdown-item:active {
    color: var(--bg-color);
    background-color: var(--noactive-bg-color);
    border-color: var(--noactive-bg-color);
}

.dropdown-item:focus, .dropdown-item:hover {
    color: var(--bg-color) !important;
    text-decoration: none;
    background-color: var(--noactive-bg-color);
}

a.q-drop:focus, a.q-drop:hover{
    color: var(--bg-color);
    text-decoration: none;
    background-color: var(--noactive-bg-color);   
}

/*color when a tab is selected*/
.nav-pills, .nav-pills .show>.nav-link {
    color:  var(--noactive-bg-color);
}
.nav-pills .nav-link{
    color: var(--noactive-bg-color);
}

.nav-item.nav-link.active{
    background-color: var(--noactive-bg-color);
}

.nav-link.active{
    background-color: var(--noactive-bg-color);
}

/* Style when the mouse hover a tab*/
.nav-item.nav-link:hover{
    color: var(--bg-color);
    background-color: var(--active-bg-color) !important;
    border-color: var(--noactive-bg-color);
}


.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {
    color: var(--bg-color) !important;
    border-color: var(--active-bg-color) !important;
    background-color: var(--active-bg-color) !important;
    /* font-weight: bolder; */
    transition: none;
}

.nav-tabs .nav-link:focus, .nav-tabs .nav-link.active {
    color: var(--noactive-bg-color) !important;
    border-color: var(--bg-secondary-color) !important;
    background-color: var(--bg-color) !important;
    border-top-width: 2px;
    border-right-width: 2px;
    border-left-width: 2px;
    /* font-weight: bolder; */
    transition: none;
}
.nav-tabs{
    border-color: var(--bg-secondary-color) !important;
    border-bottom-width: 2px;
}

.nav-tabs .nav-link:focus, .nav-tabs .nav-link{
    color: var(--noactive-bg-color) !important;
    border-color: var(--bg-secondary-color) !important;
    background-color: var(--bg-secondary-color) !important;
}

.clickable {
    cursor: pointer
}

.clickable:disabled {
    cursor: default
}

.tooltip{
    z-index: 99999999999 !important;
  }