:root{
    --primary: #111B54;
    --light: #ffffff;
    --grey: #efefef;
}

body {
 overflow: auto;
 font-family: 'Muli', sans-serif;  
 font-weight: 300;
 color: var(--primary);  
}

.bg-light {background-color: var(--light) !important;}
.bg-primary { background-color: var(--primary) !important;}
.bg-mix {background: linear-gradient(180deg, var(--light) 50%, var(--grey) 0);}
.bg-grey{ background-color: var(--grey) !important;}

.btn {
    border: 0;
}

.btn-primary:hover {
    background-color: var(--primary);
}

.btn-primary{
    background-color: var(--primary);
}

#sidebar-container {
    min-height:100vh;
}

#sidebar-container .logo {
    padding: .875rem 1.25rem;
}

#sidebar-container .menu {
    width: 15rem;
}

.btn-search {
    right: 0;
}

.btn-user {
    right: 0; padding: .875rem 1.25rem; font-weight: bold;
}

.avatar {
    max-width: 35px;
}

.content {
    overflow-y: auto;
    height:100vh;
    padding-bottom: 5rem;
}

.stat {
    border-right: 1px solid var(--grey)
}

.bg-mix {
    border-right: 1px solid var(--grey)
}

@media (max-width: 768px) {
    #sidebar-container {
        display: none;
    }
    .stat {
        border: 0;
    }
}