:root {
    --primary: #0056ab;
    --secondary: #0080fa;
    --dark-primary: #1a4b7a;
    --light-primary: #558ac0;
    --success: #1d9e74;
    --danger: #eb445a;
    --warning: #e65d0d;
}

#active-page{
    background: linear-gradient(
            180deg
            , var(--primary) 100px, #ffffff 100px);
}

nav#w-top-nav{
    background-color: #ffffff;
}

nav#w-top-nav a{
    color: #333333;
    white-space: nowrap;
}

.dropdown-content li > a, .dropdown-content li > span {
    color: #333333;
}

nav#breadcrumbs{
    background-color: var(--primary);
}

nav#breadcrumbs .breadcrumb{
    /*color: var(--primary);*/
}

.toast.success{
    background-color: var(--success);
}

.toast.error {
    background-color: var(--danger);
}

.toast.warning{
    background-color: var(--warning);
}

.primary-text {
    color: var(--primary);
}

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

.secondary-text {
    color: var(--secondary);
}

.secondary {
    background-color: var(--secondary);
}

.btn, .btn-large, .btn-small{
    background-color: var(--primary);
}
.btn:hover, .btn-large:hover, .btn-small:hover{
    background-color: var(--secondary);
}
.collapsible li .collapsible-header{
    transition: .3s;
    background-color: #ececec;
}
.collapsible li.active .collapsible-header {
    background-color: var(--dark-primary);
    color: white;
}