/* *{transition: 0.5s linear;} */
body{
    background-color:rgb(255, 255, 255);
}
.top-navbar {
    background-color: rgb(255, 255, 255);
    border-bottom: 1px solid #bcc1c5
}

.navbar-brand {
    width: 150px;
    height: auto;
    margin: 5px;
}

.top-navbar .nav-item .nav-link.logout {
    background-color: transparent;
    border: none;
    outline: none;
}

.top-navbar .nav-item .nav-link {
    color: rgba(17, 38, 56, 0.7);
    font-weight: 500;
    transition: 0.1s linear;
}

.top-navbar .navbar-nav .nav-item .nav-link:hover {
    color: rgba(17, 38, 56, 1);
}

.navbar-toggler {
    font-size: medium;
}
.sidebar {
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 100; /* Behind the navbar */
    box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);
}

.sidebar-sticky {
    position: relative;
    top: 0;
    height: 100vh;
    padding-top: 20px;
    overflow-x: hidden;
    overflow-y: auto; /* Scrollable contents if viewport is shorter than content.*/
}

@supports ((position: -webkit-sticky) or (position: sticky)) {
    .sidebar-sticky {
      position: -webkit-sticky;
      position: sticky;
    }
}

.sidebar .nav-link {
    font-weight: 500;
    color: #333;
    font-size: 0.95rem;
    transition: 0.1s linear;
}

#sidebar {
    min-width: 230px;
    max-width: 230px;
    background-color: #112638;
    transition: 0.3s linear;
}

#sidebar.active {
    margin-left: -200px;
}

@media (max-width: 768px) {
    #sidebar {
        margin-left: -200px;
    }
    #sidebar.active {
        margin-left: 0;
    }

    .navbar-brand {
        height: 30px;
        width: auto;
    }
    #la{
        margin-right: 1rem!important;
    }
}
#la{
    margin-right: 3rem!important;
}

.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover {
    color: rgba(255,255,255,.95);
}

main {
    background-color: rgb(255, 255, 255);
    width: 100%;
    /* padding-top: 30px; */

}
.dropdown {
    position: relative;
    display: inline-block;
  }

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    padding: 12px 16px;
    z-index: 1;
  }
.dropdown:hover .dropdown-content {display: block;}
.dropdown-content a:hover {background-color: #efefef;}
.dropdown-content , .dropdown{transition: 0.1s linear;}
.table td, .table th {
    vertical-align: baseline;
}
table {
    border: 1px solid #dee2e6;
}

.header-table{
    border: 1px solid #e9ecef;
}

#sidebarCollapse{
    display: initial !important;
    margin-right: 2rem;
}

.modal-load {
    display:    none;
    position:   fixed;
    z-index:    1000;
    top:        0;
    left:       0;
    height:     100%;
    width:      100%;
    background: rgba( 255, 255, 255, .8 )
                url('http://i.stack.imgur.com/FhHRx.gif')
                50% 50%
                no-repeat;
}

/* When the body has the loading class, we turn
   the scrollbar off with overflow:hidden */
body.loading .modal-load {
    overflow: hidden;
}

/* Anytime the body has the loading class, our
   modal element will be visible */
body.loading .modal-load {
    display: block;
}

.opacity-50 {
    opacity: 50%;
}
.settings-grid{
    display: grid;
    grid-template-columns: auto auto
}