/* ==============================================
 A
=============================================== */
a.text-blue {
    color: #36b9cc;
}
a.text-blue:hover {
    color: #66b2bd !important;
}
a.text-blue.active,
a.text-blue:active {
    color: #66b2bd;
}
a.text-blue.focus,
a.text-blue:focus {
    color: #2c93a2 !important;
}
a.text-blue.disabled,
a.text-blue:disabled {
    color: #36b9ccD9;
}

/* ==============================================
 ALERT
=============================================== */
.alert.blue {
    color: #ffffff;
    background-color: #2c93a2;
    border-color: #36b9cc;
}
.alert.blue hr {
    border-top-color: #ffffff;
}
.alert.blue .alert-link {
    color: #ffffff;
}

/* ==============================================
 AUTOCOMPLETE
=============================================== */
.autocomplete.blue .dropdown-item.active,
.autocomplete.blue .dropdown-item:active {
    color: #ffffff;
    text-decoration: none;
    background-color: #36b9cc;
}

/* ==============================================
 BADGE
=============================================== */
.badge.blue {
    color: #ffffff;
    background-color: #36b9cc;
}
a.badge.blue:hover,
a.badge.blue:hover {
    color: #ffffff;
    background-color: #2c93a2;
}
.badge.blue a {
    color: #ffffff !important;
}
.badge.blue a.hover,
.badge.blue a:hover {
    color: #ffffff !important;
}
a.badge.blue.focus,
a.badge.blue:focus {
    box-shadow: 0 0 0 0.2rem #36b9cc80;
}
.badge-avatar.blue {
    border-color: #36b9cc;
}

/* ==============================================
 BACKGROUND
=============================================== */
.bg-blue {
    background-color: #36b9cc !important;
}
.bg-blue-lighten {
    background-color: #36b9cc88 !important;
}
a.bg-blue:focus,
a.bg-blue:hover,
button.bg-blue:focus,
button.bg-blue:hover {
    background-color: #2c93a2 !important;
}
.bg-gradient-blue {
    background-color: #36b9cc;
    background-image: linear-gradient(180deg, #36b9cc 10%, #36b9cc 100%);
}
.bg-blue,
.bg-blue.text-blue,
.bg-blue-lighten,
.bg-blue-lighten.text-blue,
.bg-gradient-blue,
.bg-gradient-blue.text-blue {
    color: #ffffff !important;
}

/* ==============================================
 BORDER
=============================================== */
.border-blue {
    border: 0.25rem solid #36b9cc !important;
}
.border-top-blue {
    border-top: 0.25rem solid #36b9cc !important;
}
.border-right-blue {
    border-right: 0.25rem solid #36b9cc !important;
}
.border-bottom-blue {
    border-bottom: 0.25rem solid #36b9cc !important;
}
.border-left-blue {
    border-left: 0.25rem solid #36b9cc !important;
}
.border-thin-blue {
    border: 1px solid #36b9cc !important;
}
.border-top-thin-blue {
    border-top: 1px solid #36b9cc !important;
}
.border-right-thin-blue {
    border-right: 1px solid #36b9cc !important;
}
.border-bottom-thin-blue {
    border-bottom: 1px solid #36b9cc !important;
}
.border-left-thin-blue {
    border-left: 3px solid #36b9cc !important;
}
.border-thick-blue {
    border: 3px solid #36b9cc !important;
}
.border-top-thick-blue {
    border-top: 3px solid #36b9cc !important;
}
.border-right-thick-blue {
    border-right: 3px solid #36b9cc !important;
}
.border-bottom-thick-blue {
    border-bottom: 3px solid #36b9cc !important;
}
.border-left-thick-blue {
    border-left: 3px solid #36b9cc !important;
}

/* ==============================================
 BUTTON
=============================================== */
.btn.blue.focus,
.btn.blue:focus {
    box-shadow: 0 0 0 0.2rem #36b9cc40;
}
.btn.blue {
    color: #ffffff;
    background-color: #36b9cc;
    border-color: #36b9cc;
}
.btn.blue.hover,
.btn.blue:hover {
    color: #ffffff;
    background-color: #36b9cc;
    border-color: #2c93a2;
}
.btn.blue.focus,
.btn.blue:focus {
    color: #ffffff;
    background-color: #36b9cc;
    border-color: #2c93a2;
    box-shadow: 0 0 0 0.2rem #36b9cc80;
}
.btn.blue.disabled,
.btn.blue:disabled {
    color: #ffffff;
    background-color: #36b9cc;
    border-color: #36b9cc;
}
.btn.blue:not(:disabled):not(.disabled).active,
.btn.blue:not(:disabled):not(.disabled):active,
.show > .btn.blue.dropdown-toggle {
    color: #ffffff;
    background-color: #2c93a2;
    border-color: #36b9cc;
}
.btn.blue:not(:disabled):not(.disabled).active:focus,
.btn.blue:not(:disabled):not(.disabled):active:focus,
.show > .btn.blue.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem #36b9cc80;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.blue {
    color: #36b9cc;
    background-color: #ffffff;
    border-color: #36b9cc;
}
.btn-outline.blue:hover {
    color: #36b9cc;
    background-color: #ffffff;
    border-color: #36b9cc;
}
.btn-outline.blue.focus,
.btn-outline.blue:focus {
    color: #36b9cc;
    background-color: #ffffff;
    border-color: #36b9cc;
    box-shadow: 0 0 0 0.2rem #36b9cc80;
}
.btn-outline.blue.disabled, .btn-outline.blue:disabled {
    color: #36b9cc;
    background-color: #ffffff;
    border-color: #2c93a2;
}
.btn-outline.blue:not(:disabled):not(.disabled).active,
.btn-outline.blue:not(:disabled):not(.disabled):active,
.show > .btn-outline.blue.dropdown-toggle {
    color: #36b9cc;
    background-color: #ffffff;
    border-color: #36b9cc;
}
.btn-outline.blue:not(:disabled):not(.disabled).active:focus,
.btn-outline.blue:not(:disabled):not(.disabled):active:focus,
.show > .btn-outline.blue.dropdown-toggle:focus {
    color: #2c93a2;
    background-color: #ffffff;
    border-color: #2c93a2;
    box-shadow: 0 0 0 0.2rem #36b9cc80;
}
.btn-outline.blue:not(:disabled):not(.disabled).active:hover,
.btn-outline.blue:not(:disabled):not(.disabled):active:hover,
.show > .btn-outline.blue.dropdown-toggle:hover {
    color: #2c93a2;
    background-color: #ffffff;
    border-color: #2c93a2;
    box-shadow: 0 0 0 0.2rem #36b9ccBF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.blue > .btn-blue.active {
    color: #ffffff;
    background-color: #36b9cc;
    border-color: #2c93a2;
}

.btn-group.blue .btn-outline:not(:active):not(.active) {
    color: #36b9cc;
    border-color: #36b9cc;
}
.btn-group.blue .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.blue .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #36b9cc !important;
    border-color: #36b9cc;
}
.btn-group.blue .btn-outline:not(:disabled):not(.disabled).active:focus,
.btn-group.blue .btn-outline:not(:disabled):not(.disabled):active:focus {
    color: #ffffff;
    background-color: #2c93a2 !important;
    border-color: #2c93a2;
    box-shadow: 0 0 0 0.2rem #36b9cc80;
}
.btn-group.blue .btn-outline:not(:disabled):not(.disabled).active:hover,
.btn-group.blue .btn-outline:not(:disabled):not(.disabled):active:hover {
    color: #ffffff;
    background-color: #2c93a2 !important;
    border-color: #2c93a2;
    box-shadow: 0 0 0 0.2rem #36b9ccBF;
}

/* ==============================================
 BUTTON LINK
=============================================== */
.btn-link.blue {
    color: #36b9cc;
}
.btn-link.blue.hover,
.btn-link.blue:hover {
    color: #66b2bd;
}
.btn-link.blue.disabled,
.btn-link.blue:disabled {
    color: #66b2bd;
}

/* ==============================================
BREADCRUMBS
=============================================== */
.breadcrumb.blue .breadcrumb-item a {
    color: #36b9cc;
}
.breadcrumb.blue .breadcrumb-item a:hover {
    text-decoration: underline;
}
.navbar.blue .breadcrumb .breadcrumb-item a {
    color: #ffffff;
}
.navbar.blue .breadcrumb .breadcrumb-item a:hover {
    text-decoration: underline;
}
.navbar.blue .breadcrumb .breadcrumb-item.active {
    color: #ffffffB3;
    text-decoration: none;
}
.navbar.blue .breadcrumb .breadcrumb-item+.breadcrumb-item::before {
    color: #ffffffB3;
}

/* ==============================================
 CARD
=============================================== */
.card.blue {
    color: #ffffff !important;
    background-color: #36b9cc !important;
}
.card.blue a,
.card.blue p,
.card.blue i,
.card.blue em,
.card.blue strong {
    color: #ffffff !important;
}

/* ==============================================
 CHECKBOX
=============================================== */
.custom-checkbox.blue .custom-control-input:indeterminate ~ .custom-control-label::before {
    border-color: #36b9cc;
    background-color: #36b9cc;
}
.custom-checkbox.blue .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #36b9cc4D;
}
.custom-checkbox.blue .custom-control-input:disabled:indeterminate ~ .custom-control-label::before {
    background-color: #36b9cc4D;
}

/* ==============================================
 CUSTOM CONTROL
=============================================== */
.custom-control.blue .custom-control-input:checked ~ .custom-control-label::before {
    color: #ffffff;
    border-color: #ffffff;
    background-color: #36b9cc;
}
.custom-control.blue .custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: 0 0 0.2rem #36b9cc40;
}
.custom-control.blue .custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
    border-color: #bac8f3;
}
.custom-control.blue .custom-control-input:disabled ~ .custom-control-label,
.custom-control-input[disabled] ~ .custom-control-label {
    color: #858796;
}

/* ==============================================
 CUSTOM RADIO
=============================================== */
.custom-radio.blue .custom-control-label:before {
    background-color: #ffffff;
}
.custom-radio.blue .custom-control-input:checked~.custom-control-label::before {
    border-color: #ffffff;
    background-color: #36b9cc;
}
.custom-radio.blue .custom-control-input:disabled~.custom-control-label::before {
    background-color: #36b9cc4D;
}
.custom-radio.blue .custom-control-input:focus~.custom-control-label::before {
    box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem #36b9cc66;
}
.custom-radio.blue .custom-control-input:checked~.custom-control-label::after {
    color: #36b9cc;
}

/* ==============================================
 CUSTOM RANGE
=============================================== */
.blue .custom-range:focus::-webkit-slider-thumb {
    box-shadow: 0 0 0 1px #36b9cc, 0 0 0.2rem #36b9cc40;
}
.blue .custom-range:focus::-moz-range-thumb {
    box-shadow: 0 0 0 1px #36b9cc, 0 0 0.2rem #36b9cc40;
}
.blue .custom-range:focus::-ms-thumb {
    box-shadow: 0 0 0 1px #36b9cc, 0 0 0.2rem #36b9cc40;
}
.blue .custom-range::-webkit-slider-thumb {
    background-color: #36b9cc;
    appearance: none;
}
.blue .custom-range::-moz-range-thumb {
    background-color: #36b9cc;
}
.blue .custom-range::-ms-thumb {
    background-color: #36b9cc;
}

/* ==============================================
 CUSTOM SWITCH
=============================================== */
.custom-switch.blue .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #36b9cc80;
}

/* ==============================================
 DATEPICKER
=============================================== */
.datepicker.blue .datepicker-header {
    color: #ffffff;
    background-color: #36b9cc;
}
.datepicker.blue .datepicker-content .active {
    color: #ffffff;
    background-color: #36b9cc;
}
.datepicker.blue .datepicker-controls .form-control:focus,
.datepicker.blue .datepicker-controls .form-control.focus {
    box-shadow: 0 0 0 0.2rem #36b9cc0A !important;
}

/* ==============================================
 DROPDOWN
=============================================== */
.dropdown-item.blue.active,
.dropdown-item.blue:active {
    color: #ffffff;
    background-color: #36b9cc;
}
.dropdown-item.blue.disabled,
.dropdown-item.blue:disabled {
    color: #36b9cc4D;
}
.dropdown.blue .dropdown-item.active,
.dropdown.blue .dropdown-item:active {
    color: #ffffff !important;
    background-color: #36b9ccE6 !important;
}
.dropdown.blue .dropdown-item:active .text-blue {
    color: #ffffff !important;
}
.dropdown.blue .dropdown-item.focus,
.dropdown.blue .dropdown-item:focus {
    color: #ffffff !important;
    background-color: #36b9ccE6 !important;
}
.dropdown.blue .dropdown-item:focus .text-blue {
    color: #ffffff !important;
}
.dropdown.blue .dropdown-item.hover,
.dropdown.blue .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #36b9ccCC !important;
}
.dropdown.blue .dropdown-item:hover .text-blue {
    color: #ffffff !important;
}

/* ==============================================
 ERROR
=============================================== */
.error.blue:before {
    text-shadow: 1px 0 #36b9cc;
    color: #66b2bd;
    background: #f8f9fc;
}

/* ==============================================
 HR
=============================================== */
hr.blue {
    border-top: 1px solid #36b9cc1a;
}

/* ==============================================
 ICONS
=============================================== */
.mdi-blue {
    color: #36b9cc;
}

/* ==============================================
INPUT
=============================================== */
.input-field.blue .form-control:focus,
.form-control.blue:focus {
    box-shadow: 0 0 0 0.1rem #36b9cc40 !important;
}

/* ==============================================
 JUMBOTRON
=============================================== */
.jumbotron.blue {
    color: #ffffff;
    background-color: #36b9cc;
}
.jumbotron.blue a,
.jumbotron.blue p,
.jumbotron.blue i,
.jumbotron.blue em,
.jumbotron.blue strong {
    color: #ffffff;
}

/* ==============================================
 LIST GROUP
=============================================== */
.list-group-item.blue,
.list-group.blue .list-group-item {
    color: #ffffff;
    background-color: #36b9cc !important;
}
.list-group.blue .list-group-item:focus,
.list-group.blue .list-group-item:hover,
.list-group-item.blue.list-group-item:focus,
.list-group-item.blue.list-group-item:hover {
    color: #ffffff;
    background-color: #2c93a2 !important;
}
.list-group.blue .list-group-item.list-group-item-action:focus,
.list-group.blue .list-group-item.list-group-item-action:hover,
.list-group-item.blue.list-group-item-action:focus,
.list-group-item.blue.list-group-item-action:hover {
    color: #ffffff;
    background-color: #2c93a2 !important;
}
.list-group.blue .list-group-item.active,
.list-group-item.blue.active {
    color: #ffffff;
    background-color: #2c93a2 !important;
    border-color: #2c93a2;
}
.list-group.blue .list-group-item.disabled,
.list-group-item.blue.disabled {
    color: #ffffff;
    background-color: #66b2bdA9 !important;
}

/* ==============================================
 LOADING
=============================================== */
.loading.blue .spinner-border {
    color: #36b9cc !important;
}

/* ==============================================
 MODAL
=============================================== */
.modal-header.blue {
    background-color: #36b9cc;
    color: #ffffff;
}
.modal-header.blue a {
    color: #ffffff;
}
.modal-header.text-blue .modal-title,
.modal-header.text-blue a {
    color: #36b9cc;
}
.modal .nav-tabs.bg-blue {
    background-color: #36b9cc !important;
    color: #ffffff !important;
    border: 1px solid #36b9cc !important;
}
.modal .nav-tabs.bg-blue .nav-link {
    border: 1px solid #36b9cc !important;
}
.modal .nav-tabs.bg-blue .nav-link:hover,
.modal .nav-tabs.bg-blue .nav-link.hover,
.modal .nav-tabs.bg-blue .nav-link:active,
.modal .nav-tabs.bg-blue .nav-link.active {
    text-decoration: underline !important;
}

/* ==============================================
 NAV
=============================================== */
.nav.blue {
    color: #36b9cc;
}
.nav.blue .nav-link {
    color: #36b9cc;
}
.nav.blue .nav-link.disabled {
    color: #36b9cc80 !important;
}
.nav.blue .nav-link.bordered {
    border: 1px solid #36b9cc;
}

.nav-link.blue a {
    color: #36b9cc;
}
.nav-link.blue.disabled {
    color: #36b9cc4D;
}

.nav.bg-blue,
.nav.bg-blue .nav-link,
.nav.bg-blue .nav-link.active {
    background-color: #36b9cc;
    color: #ffffff;
    border: 1px solid #2c93a2;
}
.nav.bg-blue .nav-link.active {
    text-decoration: underline;
}

/* ==============================================
 NAV VERTICAL
=============================================== */
.nav-vertical.blue .nav-item a {
    color: #757575;
}
.nav-vertical.blue .nav-item a:hover {
    border-left: 1px solid #36b9cc !important;
}
.nav-vertical.blue .nav-item a.active {
    border-left: 2px solid #36b9cc !important;
}
.nav-vertical.blue .nav-link.disabled {
    cursor: not-allowed;
    color: #36b9ccBF !important;
}

/* ==============================================
 NAV PILLS
=============================================== */
.nav-pills.blue a {
    color: #36b9cc;
}
.nav-pills.blue a.disabled {
    color: #36b9cc80 !important;
}
.nav-pills.blue .nav-link.active,
.nav-pills.blue .show > .nav-link {
    color: #ffffff;
    background-color: #36b9cc;
    border: 1px solid #36b9cc;
}

.nav-pills .nav-item.blue a {
    color: #36b9cc;
}
.nav-pills .nav-item.blue a.disabled {
    color: #36b9cc80 !important;
}
.nav-pills .nav-item.blue .nav-link.active,
.nav-pills .nav-item.blue .show > .nav-link {
    color: #ffffff;
    background-color: #36b9cc;
    border: 1px solid #36b9cc;
}

/* ==============================================
NAV BORDER
=============================================== */
.nav-border-top.blue {
    border-top: .15rem solid #36b9cc !important;
}
.nav-border-top.white a {
    color: #36b9cc;
}
.nav-border-right.blue {
    border-right: .15rem solid #36b9cc !important;
}
.nav-border-right.blue a {
    color: #36b9cc;
}
.nav-border-bottom.blue {
    border-bottom: .15rem solid #36b9cc !important;
}
.nav-border-bottom.blue a {
    color: #36b9cc;
}
.nav-border-left.blue {
    border-left: .15rem solid #36b9cc !important;
}
.nav-border-left.blue a {
    color: #36b9cc;
}

/* ==============================================
 NAVBAR
=============================================== */
.navbar.blue {
    color: #ffffffE6 !important;
    background-color: #36b9cc !important;
}
.navbar.blue #sidebarToggleTop,
.navbar.blue #sidebarToggleTop i {
    color: #ffffffE6 !important;
    background-color: #36b9cc !important;
    border: none;
}
.navbar.blue #sidebarToggleTop:active {
    border-color: #36b9ccE6;
}
.navbar.blue .navbar-brand {
    color: #ffffffE6;
}
.navbar.blue .navbar-brand:hover,
.navbar.blue .navbar-brand:focus {
    color: #ffffffE6;
}
.navbar.blue .navbar-nav .nav-link {
    color: #ffffffE6;
}
.navbar.blue .navbar-nav .nav-link:hover,
.navbar.blue .navbar-nav .nav-link:focus {
    color: #ffffffCC;
}
.navbar.blue .navbar-nav .nav-link.disabled {
    color: #ffffff4D;
}
.navbar.blue .navbar-nav .show > .nav-link,
.navbar.blue .navbar-nav .active > .nav-link,
.navbar.blue .navbar-nav .nav-link.show,
.navbar.blue .navbar-nav .nav-link.active {
    color: #ffffffE6;
}
.navbar.blue .navbar-toggler {
    color: #ffffff80 !important;
    border-color: #36b9cc1A;
}
.navbar.blue .navbar-text {
    color: #ffffff80;
}
.navbar.blue .navbar-text a {
    color: #ffffffE6;
}
.navbar.blue .navbar-text a:hover,
.navbar.blue .navbar-text a:focus {
    color: #ffffffE6;
}

/* ==============================================
 PAGINATION
=============================================== */
.pagination.blue .page-link {
    color: #36b9cc;
    border: 1px solid #dddfeb;
}
.pagination.blue .page-link.hover,
.pagination.blue .page-link:hover {
    color: #ffffff;
    background-color: #36b9ccBF;
    border-color: #dddfeb;
}
.pagination.blue .page-link.focus,
.pagination.blue .page-link:focus {
    box-shadow: 0 0 0.2rem #36b9cc40 !important;
}
.pagination.blue .page-item.active .page-link {
    color: #ffffff;
    background-color: #36b9cc;
    border-color: #36b9cc;
}
.pagination.blue .page-item.disabled .page-link,
.pagination.blue .page-item:disabled .page-link {
    color: #858796;
    border-color: #dddfeb;
}

/* ==============================================
 PROGRESS
=============================================== */
.progress.blue .progress-bar {
    color: #ffffff;
    background-color: #36b9cc;
}

/* ==============================================
PULSE
=============================================== */
.pulse.mdi-blue,
.pulse.blue {
    box-shadow: 0 0 0 #36b9cc66;
    animation: pulse-blue 2s infinite;
}

@-webkit-keyframes pulse-blue {
    0% {
        -webkit-box-shadow: 0 0 0 0 #36b9cc66;
    }
    70% {
        -webkit-box-shadow: 0 0 0 10px #36b9cc00;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 #36b9cc00;
    }
}
@keyframes pulse-blue {
    0% {
        -moz-box-shadow: 0 0 0 0 #36b9cc66;
        box-shadow: 0 0 0 0 #36b9cc66;
    }
    70% {
        -moz-box-shadow: 0 0 0 10px #36b9cc00;
        box-shadow: 0 0 0 10px #36b9cc00;
    }
    100% {
        -moz-box-shadow: 0 0 0 0 #36b9cc00;
        box-shadow: 0 0 0 0 #36b9cc00;
    }
}

/* ==============================================
 SELECT
=============================================== */
.blue select option:checked,
.blue select option:hover {
    box-shadow: 0 0 10px 100px #36b9cc inset;
}
.blue select:focus > option:checked {
    color: #ffffff !important;
    background-color: #36b9cc40 !important;
}
.blue .custom-select {
    color: #6e707e;
}
.blue .custom-select:focus {
    border-color: #bac8f3;
    box-shadow: 0 0 0.2rem #36b9cc40;
}
.blue .custom-select:focus::-ms-value {
    color: #6e707e;
}
.blue .custom-select:disabled {
    color: #858796;
    background-color: #eaecf4;
}

.blue .bootstrap-select .dropdown-item.active,
.blue .bootstrap-select .dropdown-item:active {
    color: #ffffff !important;
    background-color: #36b9cc !important;
}
.blue .bootstrap-select .dropdown-item.hover,
.blue .bootstrap-select .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #36b9ccBF !important;
}
.blue .bootstrap-select.show-tick .dropdown-menu .selected span.check-mark {
    color: #36b9cc;
}

/* ==============================================
 SIDEBAR
=============================================== */
.sidebar.blue .nav-item .collapse .collapse-inner .collapse-item.active,
.sidebar.blue .nav-item .collapsing .collapse-inner .collapse-item.active {
    color: #36b9cc;
}
.sidebar.blue {
    color: #ffffff;
    background-color: #36b9cc;
}
.sidebar.blue .sidebar-brand {
    color: #ffffff;
}
.sidebar.blue hr.sidebar-divider {
    border-top: 1px solid #ffffff26;
}
.sidebar.blue .sidebar-heading {
    color: #ffffff66;
}
.sidebar.blue .nav-item .nav-link {
    color: #ffffffCC;
}
.sidebar.blue .nav-item .nav-link a {
    color: #ffffffCC;
}
.sidebar.blue .nav-item .nav-link i {
    color: #ffffff4D;
}
.sidebar.blue .nav-item .nav-link:focus,
.sidebar.blue .nav-item .nav-link:hover,
.sidebar.blue .nav-item .nav-link:focus a,
.sidebar.blue .nav-item .nav-link:hover a,
.sidebar.blue .nav-item .nav-link:focus i,
.sidebar.blue .nav-item .nav-link:hover i {
    color: #ffffff;
}

.sidebar.blue .nav-item .nav-link:active,
.sidebar.blue .nav-item .nav-link a:active,
.sidebar.blue .nav-item .nav-link i:active {
    color: #ffffff;
}
.sidebar.blue .nav-item .collapse .collapse-inner .collapse-item,
.sidebar.blue .nav-item .collapsing .collapse-inner .collapse-item {
    color: #ffffffCC;
}
.sidebar.blue .nav-item .collapse .collapse-inner .collapse-item a,
.sidebar.blue .nav-item .collapsing .collapse-inner .collapse-item a {
    color: #ffffffCC;
}
.sidebar.blue .nav-item .nav-link[data-toggle=collapse].collapsed::after {
    color: #ffffff80;
}
.sidebar.blue .nav-item .nav-link[data-toggle="collapse"]::after {
    color: #ffffff80;
}
.sidebar.blue .nav-item .collapse-inner .collapse-header {
    color: #ffffff80 !important;
}
.sidebar.blue .nav-item .collapse .collapse-inner,
.sidebar.blue .nav-item .collapsing .collapse-inner {
    color: #ffffffCC;
    background-color: #66b2bd;
}
.sidebar.blue .nav-item .collapse .collapse-inner .collapse-item:active,
.sidebar.blue .nav-item .collapsing .collapse-inner .collapse-item:active
.sidebar.blue .nav-item .collapse .collapse-inner .collapse-item a:active,
.sidebar.blue .nav-item .collapsing .collapse-inner .collapse-item a:active {
    color: #ffffffCC;
    opacity: 0.9;
    background-color: #66b2bd;
}
.sidebar.blue .nav-item .collapse .collapse-inner .collapse-item:hover,
.sidebar.blue .nav-item .collapsing .collapse-inner .collapse-item:hover,
.sidebar.blue .nav-item .collapse .collapse-inner .collapse-item a:hover,
.sidebar.blue .nav-item .collapsing .collapse-inner .collapse-item a:hover {
    color: #ffffff80;
    opacity: 0.9;
    background-color: #66b2bd;
}
.sidebar.blue .nav-item.active .nav-link,
.sidebar.blue .nav-item.active .nav-link a,
.sidebar.blue .nav-item.active .nav-link i {
    color: #ffffff;
}
.sidebar.blue #sidebarToggle {
    background-color: #36b9cc33;
}
.sidebar.blue #sidebarToggle::after {
    color: #ffffff80;
}
.sidebar.blue #sidebarToggle:hover {
    background-color: #ffffff40;
}
.sidebar.blue.toggled #sidebarToggle::after {
    color: #ffffff80;
}
.sidebar.blue .sidebar-card {
    color: #ffffff;
}
@media (min-width: 768px) {
    .sidebar.blue .nav-item .nav-link[data-toggle=collapse].collapsed::after {
        font-family: "Material Design Icons";
        content: "\F035F";
        color: #ffffff80;
    }
    .sidebar.blue .nav-item .nav-link[data-toggle="collapse"]::after {
        font-family: "Material Design Icons";
        content: "\F035D";
        color: #ffffff80;
    }
}

/* ==============================================
  SHADOW
=============================================== */
.blue.shadow-sm-right {
    box-shadow: 0.125rem 0 0 #36b9cc1A !important;
}

/* ==============================================
  STAR
=============================================== */
.blue input.star:checked ~ label.star:before {
    color: #36b9cc !important;
}

/* ==============================================
 STEPS
=============================================== */
.steps.blue .step.active:before {
    color: #36b9cc;
}
.steps.blue .step.active:before,
.steps.blue .step.active:after {
    background: #36b9cc;
}

/* ==============================================
TABLE
=============================================== */
table.blue td.highlight {
    color: #ffffff;
    background-color: #36b9cc80;
}
table.blue th.highlight {
    color: #ffffff;
    background-color: #36b9ccA0;
}
th.highlight.blue {
    color: #ffffff;
    background-color: #36b9ccA0;
}
td.highlight.blue {
    color: #ffffff;
    background-color: #36b9cc80;
}

/* ==============================================
TABLE OF CONTENTS
=============================================== */
.table-of-contents.blue a.hover,
.table-of-contents.blue a:hover {
    border-left: 1px solid #36b9cc !important;
}
.table-of-contents.blue a.active {
    border-left: 2px solid #36b9cc !important;
}

/* ==============================================
 TEXT
=============================================== */
.text-blue {
    color: #36b9cc !important;
}
.text-blue.active,
.text-blue:active {
    color: #66b2bd !important;
}
.text-blue.disabled,
.text-blue:disabled {
    color: #36b9ccD9 !important;
}

/* ==============================================
 TOAST
=============================================== */
.toast.blue {
    color: #ffffff !important;
    background-color: #36b9cc !important;
}
.toast.blue a,
.toast.blue i {
    color: #ffffff !important;
}

/* ==============================================
 TOPBAR
=============================================== */
.topbar.blue .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #36b9cc !important;
    border: 1px solid #36b9cc !important;
}
.topbar .dropdown.blue .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #36b9cc !important;
    border-color: #36b9cc !important;
}
/* ==============================================
 A
=============================================== */
a.text-green {
    color: #51d5aa;
}
a.text-green:hover {
    color: #69c4a6 !important;
}
a.text-green.active,
a.text-green:active {
    color: #69c4a6;
}
a.text-green.focus,
a.text-green:focus {
    color: #43b18d !important;
}
a.text-green.disabled,
a.text-green:disabled {
    color: #51d5aaD9;
}

/* ==============================================
 ALERT
=============================================== */
.alert.green {
    color: #ffffff;
    background-color: #43b18d;
    border-color: #51d5aa;
}
.alert.green hr {
    border-top-color: #ffffff;
}
.alert.green .alert-link {
    color: #ffffff;
}

/* ==============================================
 AUTOCOMPLETE
=============================================== */
.autocomplete.green .dropdown-item.active,
.autocomplete.green .dropdown-item:active {
    color: #ffffff;
    text-decoration: none;
    background-color: #51d5aa;
}

/* ==============================================
 BADGE
=============================================== */
.badge.green {
    color: #ffffff;
    background-color: #51d5aa;
}
a.badge.green:hover,
a.badge.green:hover {
    color: #ffffff;
    background-color: #43b18d;
}
.badge.green a {
    color: #ffffff !important;
}
.badge.green a.hover,
.badge.green a:hover {
    color: #ffffff !important;
}
a.badge.green.focus,
a.badge.green:focus {
    box-shadow: 0 0 0 0.2rem #51d5aa80;
}
.badge-avatar.green {
    border-color: #51d5aa;
}

/* ==============================================
 BACKGROUND
=============================================== */
.bg-green {
    background-color: #51d5aa !important;
}
.bg-green-lighten {
    background-color: #51d5aa88 !important;
}
a.bg-green:focus,
a.bg-green:hover,
button.bg-green:focus,
button.bg-green:hover {
    background-color: #43b18d !important;
}
.bg-gradient-green {
    background-color: #51d5aa;
    background-image: linear-gradient(180deg, #51d5aa 10%, #51d5aa 100%);
}
.bg-green,
.bg-green.text-green,
.bg-green-lighten,
.bg-green-lighten.text-green,
.bg-gradient-green,
.bg-gradient-green.text-green {
    color: #ffffff !important;
}

/* ==============================================
 BORDER
=============================================== */
.border-green {
    border: 0.25rem solid #51d5aa !important;
}
.border-top-green {
    border-top: 0.25rem solid #51d5aa !important;
}
.border-right-green {
    border-right: 0.25rem solid #51d5aa !important;
}
.border-bottom-green {
    border-bottom: 0.25rem solid #51d5aa !important;
}
.border-left-green {
    border-left: 0.25rem solid #51d5aa !important;
}
.border-thin-green {
    border: 1px solid #51d5aa !important;
}
.border-top-thin-green {
    border-top: 1px solid #51d5aa !important;
}
.border-right-thin-green {
    border-right: 1px solid #51d5aa !important;
}
.border-bottom-thin-green {
    border-bottom: 1px solid #51d5aa !important;
}
.border-left-thin-green {
    border-left: 3px solid #51d5aa !important;
}
.border-thick-green {
    border: 3px solid #51d5aa !important;
}
.border-top-thick-green {
    border-top: 3px solid #51d5aa !important;
}
.border-right-thick-green {
    border-right: 3px solid #51d5aa !important;
}
.border-bottom-thick-green {
    border-bottom: 3px solid #51d5aa !important;
}
.border-left-thick-green {
    border-left: 3px solid #51d5aa !important;
}

/* ==============================================
 BUTTON
=============================================== */
.btn.green.focus,
.btn.green:focus {
    box-shadow: 0 0 0 0.2rem #51d5aa40;
}
.btn.green {
    color: #ffffff;
    background-color: #51d5aa;
    border-color: #51d5aa;
}
.btn.green.hover,
.btn.green:hover {
    color: #ffffff;
    background-color: #51d5aa;
    border-color: #43b18d;
}
.btn.green.focus,
.btn.green:focus {
    color: #ffffff;
    background-color: #51d5aa;
    border-color: #43b18d;
    box-shadow: 0 0 0 0.2rem #51d5aa80;
}
.btn.green.disabled,
.btn.green:disabled {
    color: #ffffff;
    background-color: #51d5aa;
    border-color: #51d5aa;
}
.btn.green:not(:disabled):not(.disabled).active,
.btn.green:not(:disabled):not(.disabled):active,
.show > .btn.green.dropdown-toggle {
    color: #ffffff;
    background-color: #43b18d;
    border-color: #51d5aa;
}
.btn.green:not(:disabled):not(.disabled).active:focus,
.btn.green:not(:disabled):not(.disabled):active:focus,
.show > .btn.green.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem #51d5aa80;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.green {
    color: #51d5aa;
    background-color: #ffffff;
    border-color: #51d5aa;
}
.btn-outline.green:hover {
    color: #51d5aa;
    background-color: #ffffff;
    border-color: #51d5aa;
}
.btn-outline.green.focus,
.btn-outline.green:focus {
    color: #51d5aa;
    background-color: #ffffff;
    border-color: #51d5aa;
    box-shadow: 0 0 0 0.2rem #51d5aa80;
}
.btn-outline.green.disabled, .btn-outline.green:disabled {
    color: #51d5aa;
    background-color: #ffffff;
    border-color: #43b18d;
}
.btn-outline.green:not(:disabled):not(.disabled).active,
.btn-outline.green:not(:disabled):not(.disabled):active,
.show > .btn-outline.green.dropdown-toggle {
    color: #51d5aa;
    background-color: #ffffff;
    border-color: #51d5aa;
}
.btn-outline.green:not(:disabled):not(.disabled).active:focus,
.btn-outline.green:not(:disabled):not(.disabled):active:focus,
.show > .btn-outline.green.dropdown-toggle:focus {
    color: #43b18d;
    background-color: #ffffff;
    border-color: #43b18d;
    box-shadow: 0 0 0 0.2rem #51d5aa80;
}
.btn-outline.green:not(:disabled):not(.disabled).active:hover,
.btn-outline.green:not(:disabled):not(.disabled):active:hover,
.show > .btn-outline.green.dropdown-toggle:hover {
    color: #43b18d;
    background-color: #ffffff;
    border-color: #43b18d;
    box-shadow: 0 0 0 0.2rem #51d5aaBF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.green > .btn-green.active {
    color: #ffffff;
    background-color: #51d5aa;
    border-color: #43b18d;
}

.btn-group.green .btn-outline:not(:active):not(.active) {
    color: #51d5aa;
    border-color: #51d5aa;
}
.btn-group.green .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.green .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #51d5aa !important;
    border-color: #51d5aa;
}
.btn-group.green .btn-outline:not(:disabled):not(.disabled).active:focus,
.btn-group.green .btn-outline:not(:disabled):not(.disabled):active:focus {
    color: #ffffff;
    background-color: #43b18d !important;
    border-color: #43b18d;
    box-shadow: 0 0 0 0.2rem #51d5aa80;
}
.btn-group.green .btn-outline:not(:disabled):not(.disabled).active:hover,
.btn-group.green .btn-outline:not(:disabled):not(.disabled):active:hover {
    color: #ffffff;
    background-color: #43b18d !important;
    border-color: #43b18d;
    box-shadow: 0 0 0 0.2rem #51d5aaBF;
}

/* ==============================================
 BUTTON LINK
=============================================== */
.btn-link.green {
    color: #51d5aa;
}
.btn-link.green.hover,
.btn-link.green:hover {
    color: #69c4a6;
}
.btn-link.green.disabled,
.btn-link.green:disabled {
    color: #69c4a6;
}

/* ==============================================
BREADCRUMBS
=============================================== */
.breadcrumb.green .breadcrumb-item a {
    color: #51d5aa;
}
.breadcrumb.green .breadcrumb-item a:hover {
    text-decoration: underline;
}
.navbar.green .breadcrumb .breadcrumb-item a {
    color: #ffffff;
}
.navbar.green .breadcrumb .breadcrumb-item a:hover {
    text-decoration: underline;
}
.navbar.green .breadcrumb .breadcrumb-item.active {
    color: #ffffffB3;
    text-decoration: none;
}
.navbar.green .breadcrumb .breadcrumb-item+.breadcrumb-item::before {
    color: #ffffffB3;
}

/* ==============================================
 CARD
=============================================== */
.card.green {
    color: #ffffff !important;
    background-color: #51d5aa !important;
}
.card.green a,
.card.green p,
.card.green i,
.card.green em,
.card.green strong {
    color: #ffffff !important;
}

/* ==============================================
 CHECKBOX
=============================================== */
.custom-checkbox.green .custom-control-input:indeterminate ~ .custom-control-label::before {
    border-color: #51d5aa;
    background-color: #51d5aa;
}
.custom-checkbox.green .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #51d5aa4D;
}
.custom-checkbox.green .custom-control-input:disabled:indeterminate ~ .custom-control-label::before {
    background-color: #51d5aa4D;
}

/* ==============================================
 CUSTOM CONTROL
=============================================== */
.custom-control.green .custom-control-input:checked ~ .custom-control-label::before {
    color: #ffffff;
    border-color: #ffffff;
    background-color: #51d5aa;
}
.custom-control.green .custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: 0 0 0.2rem #51d5aa40;
}
.custom-control.green .custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
    border-color: #bac8f3;
}
.custom-control.green .custom-control-input:disabled ~ .custom-control-label,
.custom-control-input[disabled] ~ .custom-control-label {
    color: #858796;
}

/* ==============================================
 CUSTOM RADIO
=============================================== */
.custom-radio.green .custom-control-label:before {
    background-color: #ffffff;
}
.custom-radio.green .custom-control-input:checked~.custom-control-label::before {
    border-color: #ffffff;
    background-color: #51d5aa;
}
.custom-radio.green .custom-control-input:disabled~.custom-control-label::before {
    background-color: #51d5aa4D;
}
.custom-radio.green .custom-control-input:focus~.custom-control-label::before {
    box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem #51d5aa66;
}
.custom-radio.green .custom-control-input:checked~.custom-control-label::after {
    color: #51d5aa;
}

/* ==============================================
 CUSTOM RANGE
=============================================== */
.green .custom-range:focus::-webkit-slider-thumb {
    box-shadow: 0 0 0 1px #51d5aa, 0 0 0.2rem #51d5aa40;
}
.green .custom-range:focus::-moz-range-thumb {
    box-shadow: 0 0 0 1px #51d5aa, 0 0 0.2rem #51d5aa40;
}
.green .custom-range:focus::-ms-thumb {
    box-shadow: 0 0 0 1px #51d5aa, 0 0 0.2rem #51d5aa40;
}
.green .custom-range::-webkit-slider-thumb {
    background-color: #51d5aa;
    appearance: none;
}
.green .custom-range::-moz-range-thumb {
    background-color: #51d5aa;
}
.green .custom-range::-ms-thumb {
    background-color: #51d5aa;
}

/* ==============================================
 CUSTOM SWITCH
=============================================== */
.custom-switch.green .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #51d5aa80;
}

/* ==============================================
 DATEPICKER
=============================================== */
.datepicker.green .datepicker-header {
    color: #ffffff;
    background-color: #51d5aa;
}
.datepicker.green .datepicker-content .active {
    color: #ffffff;
    background-color: #51d5aa;
}
.datepicker.green .datepicker-controls .form-control:focus,
.datepicker.green .datepicker-controls .form-control.focus {
    box-shadow: 0 0 0 0.2rem #51d5aa0A !important;
}

/* ==============================================
 DROPDOWN
=============================================== */
.dropdown-item.green.active,
.dropdown-item.green:active {
    color: #ffffff;
    background-color: #51d5aa;
}
.dropdown-item.green.disabled,
.dropdown-item.green:disabled {
    color: #51d5aa4D;
}
.dropdown.green .dropdown-item.active,
.dropdown.green .dropdown-item:active {
    color: #ffffff !important;
    background-color: #51d5aaE6 !important;
}
.dropdown.green .dropdown-item:active .text-green {
    color: #ffffff !important;
}
.dropdown.green .dropdown-item.focus,
.dropdown.green .dropdown-item:focus {
    color: #ffffff !important;
    background-color: #51d5aaE6 !important;
}
.dropdown.green .dropdown-item:focus .text-green {
    color: #ffffff !important;
}
.dropdown.green .dropdown-item.hover,
.dropdown.green .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #51d5aaCC !important;
}
.dropdown.green .dropdown-item:hover .text-green {
    color: #ffffff !important;
}

/* ==============================================
 ERROR
=============================================== */
.error.green:before {
    text-shadow: 1px 0 #51d5aa;
    color: #69c4a6;
    background: #f8f9fc;
}

/* ==============================================
 HR
=============================================== */
hr.green {
    border-top: 1px solid #51d5aa1a;
}

/* ==============================================
 ICONS
=============================================== */
.mdi-green {
    color: #51d5aa;
}

/* ==============================================
INPUT
=============================================== */
.input-field.green .form-control:focus,
.form-control.green:focus {
    box-shadow: 0 0 0 0.1rem #51d5aa40 !important;
}

/* ==============================================
 JUMBOTRON
=============================================== */
.jumbotron.green {
    color: #ffffff;
    background-color: #51d5aa;
}
.jumbotron.green a,
.jumbotron.green p,
.jumbotron.green i,
.jumbotron.green em,
.jumbotron.green strong {
    color: #ffffff;
}

/* ==============================================
 LIST GROUP
=============================================== */
.list-group-item.green,
.list-group.green .list-group-item {
    color: #ffffff;
    background-color: #51d5aa !important;
}
.list-group.green .list-group-item:focus,
.list-group.green .list-group-item:hover,
.list-group-item.green.list-group-item:focus,
.list-group-item.green.list-group-item:hover {
    color: #ffffff;
    background-color: #43b18d !important;
}
.list-group.green .list-group-item.list-group-item-action:focus,
.list-group.green .list-group-item.list-group-item-action:hover,
.list-group-item.green.list-group-item-action:focus,
.list-group-item.green.list-group-item-action:hover {
    color: #ffffff;
    background-color: #43b18d !important;
}
.list-group.green .list-group-item.active,
.list-group-item.green.active {
    color: #ffffff;
    background-color: #43b18d !important;
    border-color: #43b18d;
}
.list-group.green .list-group-item.disabled,
.list-group-item.green.disabled {
    color: #ffffff;
    background-color: #69c4a6A9 !important;
}

/* ==============================================
 LOADING
=============================================== */
.loading.green .spinner-border {
    color: #51d5aa !important;
}

/* ==============================================
 MODAL
=============================================== */
.modal-header.green {
    background-color: #51d5aa;
    color: #ffffff;
}
.modal-header.green a {
    color: #ffffff;
}
.modal-header.text-green .modal-title,
.modal-header.text-green a {
    color: #51d5aa;
}
.modal .nav-tabs.bg-green {
    background-color: #51d5aa !important;
    color: #ffffff !important;
    border: 1px solid #51d5aa !important;
}
.modal .nav-tabs.bg-green .nav-link {
    border: 1px solid #51d5aa !important;
}
.modal .nav-tabs.bg-green .nav-link:hover,
.modal .nav-tabs.bg-green .nav-link.hover,
.modal .nav-tabs.bg-green .nav-link:active,
.modal .nav-tabs.bg-green .nav-link.active {
    text-decoration: underline !important;
}

/* ==============================================
 NAV
=============================================== */
.nav.green {
    color: #51d5aa;
}
.nav.green .nav-link {
    color: #51d5aa;
}
.nav.green .nav-link.disabled {
    color: #51d5aa80 !important;
}
.nav.green .nav-link.bordered {
    border: 1px solid #51d5aa;
}

.nav-link.green a {
    color: #51d5aa;
}
.nav-link.green.disabled {
    color: #51d5aa4D;
}

.nav.bg-green,
.nav.bg-green .nav-link,
.nav.bg-green .nav-link.active {
    background-color: #51d5aa;
    color: #ffffff;
    border: 1px solid #43b18d;
}
.nav.bg-green .nav-link.active {
    text-decoration: underline;
}

/* ==============================================
 NAV VERTICAL
=============================================== */
.nav-vertical.green .nav-item a {
    color: #757575;
}
.nav-vertical.green .nav-item a:hover {
    border-left: 1px solid #51d5aa !important;
}
.nav-vertical.green .nav-item a.active {
    border-left: 2px solid #51d5aa !important;
}
.nav-vertical.green .nav-link.disabled {
    cursor: not-allowed;
    color: #51d5aaBF !important;
}

/* ==============================================
 NAV PILLS
=============================================== */
.nav-pills.green a {
    color: #51d5aa;
}
.nav-pills.green a.disabled {
    color: #51d5aa80 !important;
}
.nav-pills.green .nav-link.active,
.nav-pills.green .show > .nav-link {
    color: #ffffff;
    background-color: #51d5aa;
    border: 1px solid #51d5aa;
}

.nav-pills .nav-item.green a {
    color: #51d5aa;
}
.nav-pills .nav-item.green a.disabled {
    color: #51d5aa80 !important;
}
.nav-pills .nav-item.green .nav-link.active,
.nav-pills .nav-item.green .show > .nav-link {
    color: #ffffff;
    background-color: #51d5aa;
    border: 1px solid #51d5aa;
}

/* ==============================================
NAV BORDER
=============================================== */
.nav-border-top.green {
    border-top: .15rem solid #51d5aa !important;
}
.nav-border-top.white a {
    color: #51d5aa;
}
.nav-border-right.green {
    border-right: .15rem solid #51d5aa !important;
}
.nav-border-right.green a {
    color: #51d5aa;
}
.nav-border-bottom.green {
    border-bottom: .15rem solid #51d5aa !important;
}
.nav-border-bottom.green a {
    color: #51d5aa;
}
.nav-border-left.green {
    border-left: .15rem solid #51d5aa !important;
}
.nav-border-left.green a {
    color: #51d5aa;
}

/* ==============================================
 NAVBAR
=============================================== */
.navbar.green {
    color: #ffffffE6 !important;
    background-color: #51d5aa !important;
}
.navbar.green #sidebarToggleTop,
.navbar.green #sidebarToggleTop i {
    color: #ffffffE6 !important;
    background-color: #51d5aa !important;
    border: none;
}
.navbar.green #sidebarToggleTop:active {
    border-color: #51d5aaE6;
}
.navbar.green .navbar-brand {
    color: #ffffffE6;
}
.navbar.green .navbar-brand:hover,
.navbar.green .navbar-brand:focus {
    color: #ffffffE6;
}
.navbar.green .navbar-nav .nav-link {
    color: #ffffffE6;
}
.navbar.green .navbar-nav .nav-link:hover,
.navbar.green .navbar-nav .nav-link:focus {
    color: #ffffffCC;
}
.navbar.green .navbar-nav .nav-link.disabled {
    color: #ffffff4D;
}
.navbar.green .navbar-nav .show > .nav-link,
.navbar.green .navbar-nav .active > .nav-link,
.navbar.green .navbar-nav .nav-link.show,
.navbar.green .navbar-nav .nav-link.active {
    color: #ffffffE6;
}
.navbar.green .navbar-toggler {
    color: #ffffff80 !important;
    border-color: #51d5aa1A;
}
.navbar.green .navbar-text {
    color: #ffffff80;
}
.navbar.green .navbar-text a {
    color: #ffffffE6;
}
.navbar.green .navbar-text a:hover,
.navbar.green .navbar-text a:focus {
    color: #ffffffE6;
}

/* ==============================================
 PAGINATION
=============================================== */
.pagination.green .page-link {
    color: #51d5aa;
    border: 1px solid #dddfeb;
}
.pagination.green .page-link.hover,
.pagination.green .page-link:hover {
    color: #ffffff;
    background-color: #51d5aaBF;
    border-color: #dddfeb;
}
.pagination.green .page-link.focus,
.pagination.green .page-link:focus {
    box-shadow: 0 0 0.2rem #51d5aa40 !important;
}
.pagination.green .page-item.active .page-link {
    color: #ffffff;
    background-color: #51d5aa;
    border-color: #51d5aa;
}
.pagination.green .page-item.disabled .page-link,
.pagination.green .page-item:disabled .page-link {
    color: #858796;
    border-color: #dddfeb;
}

/* ==============================================
 PROGRESS
=============================================== */
.progress.green .progress-bar {
    color: #ffffff;
    background-color: #51d5aa;
}

/* ==============================================
PULSE
=============================================== */
.pulse.mdi-green,
.pulse.green {
    box-shadow: 0 0 0 #51d5aa66;
    animation: pulse-green 2s infinite;
}

@-webkit-keyframes pulse-green {
    0% {
        -webkit-box-shadow: 0 0 0 0 #51d5aa66;
    }
    70% {
        -webkit-box-shadow: 0 0 0 10px #51d5aa00;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 #51d5aa00;
    }
}
@keyframes pulse-green {
    0% {
        -moz-box-shadow: 0 0 0 0 #51d5aa66;
        box-shadow: 0 0 0 0 #51d5aa66;
    }
    70% {
        -moz-box-shadow: 0 0 0 10px #51d5aa00;
        box-shadow: 0 0 0 10px #51d5aa00;
    }
    100% {
        -moz-box-shadow: 0 0 0 0 #51d5aa00;
        box-shadow: 0 0 0 0 #51d5aa00;
    }
}

/* ==============================================
 SELECT
=============================================== */
.green select option:checked,
.green select option:hover {
    box-shadow: 0 0 10px 100px #51d5aa inset;
}
.green select:focus > option:checked {
    color: #ffffff !important;
    background-color: #51d5aa40 !important;
}
.green .custom-select {
    color: #6e707e;
}
.green .custom-select:focus {
    border-color: #bac8f3;
    box-shadow: 0 0 0.2rem #51d5aa40;
}
.green .custom-select:focus::-ms-value {
    color: #6e707e;
}
.green .custom-select:disabled {
    color: #858796;
    background-color: #eaecf4;
}

.green .bootstrap-select .dropdown-item.active,
.green .bootstrap-select .dropdown-item:active {
    color: #ffffff !important;
    background-color: #51d5aa !important;
}
.green .bootstrap-select .dropdown-item.hover,
.green .bootstrap-select .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #51d5aaBF !important;
}
.green .bootstrap-select.show-tick .dropdown-menu .selected span.check-mark {
    color: #51d5aa;
}

/* ==============================================
 SIDEBAR
=============================================== */
.sidebar.green .nav-item .collapse .collapse-inner .collapse-item.active,
.sidebar.green .nav-item .collapsing .collapse-inner .collapse-item.active {
    color: #51d5aa;
}
.sidebar.green {
    color: #ffffff;
    background-color: #51d5aa;
}
.sidebar.green .sidebar-brand {
    color: #ffffff;
}
.sidebar.green hr.sidebar-divider {
    border-top: 1px solid #ffffff26;
}
.sidebar.green .sidebar-heading {
    color: #ffffff66;
}
.sidebar.green .nav-item .nav-link {
    color: #ffffffCC;
}
.sidebar.green .nav-item .nav-link a {
    color: #ffffffCC;
}
.sidebar.green .nav-item .nav-link i {
    color: #ffffff4D;
}
.sidebar.green .nav-item .nav-link:focus,
.sidebar.green .nav-item .nav-link:hover,
.sidebar.green .nav-item .nav-link:focus a,
.sidebar.green .nav-item .nav-link:hover a,
.sidebar.green .nav-item .nav-link:focus i,
.sidebar.green .nav-item .nav-link:hover i {
    color: #ffffff;
}

.sidebar.green .nav-item .nav-link:active,
.sidebar.green .nav-item .nav-link a:active,
.sidebar.green .nav-item .nav-link i:active {
    color: #ffffff;
}
.sidebar.green .nav-item .collapse .collapse-inner .collapse-item,
.sidebar.green .nav-item .collapsing .collapse-inner .collapse-item {
    color: #ffffffCC;
}
.sidebar.green .nav-item .collapse .collapse-inner .collapse-item a,
.sidebar.green .nav-item .collapsing .collapse-inner .collapse-item a {
    color: #ffffffCC;
}
.sidebar.green .nav-item .nav-link[data-toggle=collapse].collapsed::after {
    color: #ffffff80;
}
.sidebar.green .nav-item .nav-link[data-toggle="collapse"]::after {
    color: #ffffff80;
}
.sidebar.green .nav-item .collapse-inner .collapse-header {
    color: #ffffff80 !important;
}
.sidebar.green .nav-item .collapse .collapse-inner,
.sidebar.green .nav-item .collapsing .collapse-inner {
    color: #ffffffCC;
    background-color: #69c4a6;
}
.sidebar.green .nav-item .collapse .collapse-inner .collapse-item:active,
.sidebar.green .nav-item .collapsing .collapse-inner .collapse-item:active
.sidebar.green .nav-item .collapse .collapse-inner .collapse-item a:active,
.sidebar.green .nav-item .collapsing .collapse-inner .collapse-item a:active {
    color: #ffffffCC;
    opacity: 0.9;
    background-color: #69c4a6;
}
.sidebar.green .nav-item .collapse .collapse-inner .collapse-item:hover,
.sidebar.green .nav-item .collapsing .collapse-inner .collapse-item:hover,
.sidebar.green .nav-item .collapse .collapse-inner .collapse-item a:hover,
.sidebar.green .nav-item .collapsing .collapse-inner .collapse-item a:hover {
    color: #ffffff80;
    opacity: 0.9;
    background-color: #69c4a6;
}
.sidebar.green .nav-item.active .nav-link,
.sidebar.green .nav-item.active .nav-link a,
.sidebar.green .nav-item.active .nav-link i {
    color: #ffffff;
}
.sidebar.green #sidebarToggle {
    background-color: #51d5aa33;
}
.sidebar.green #sidebarToggle::after {
    color: #ffffff80;
}
.sidebar.green #sidebarToggle:hover {
    background-color: #ffffff40;
}
.sidebar.green.toggled #sidebarToggle::after {
    color: #ffffff80;
}
.sidebar.green .sidebar-card {
    color: #ffffff;
}
@media (min-width: 768px) {
    .sidebar.green .nav-item .nav-link[data-toggle=collapse].collapsed::after {
        font-family: "Material Design Icons";
        content: "\F035F";
        color: #ffffff80;
    }
    .sidebar.green .nav-item .nav-link[data-toggle="collapse"]::after {
        font-family: "Material Design Icons";
        content: "\F035D";
        color: #ffffff80;
    }
}

/* ==============================================
  SHADOW
=============================================== */
.green.shadow-sm-right {
    box-shadow: 0.125rem 0 0 #51d5aa1A !important;
}

/* ==============================================
  STAR
=============================================== */
.green input.star:checked ~ label.star:before {
    color: #51d5aa !important;
}

/* ==============================================
 STEPS
=============================================== */
.steps.green .step.active:before {
    color: #51d5aa;
}
.steps.green .step.active:before,
.steps.green .step.active:after {
    background: #51d5aa;
}

/* ==============================================
TABLE
=============================================== */
table.green td.highlight {
    color: #ffffff;
    background-color: #51d5aa80;
}
table.green th.highlight {
    color: #ffffff;
    background-color: #51d5aaA0;
}
th.highlight.green {
    color: #ffffff;
    background-color: #51d5aaA0;
}
td.highlight.green {
    color: #ffffff;
    background-color: #51d5aa80;
}

/* ==============================================
TABLE OF CONTENTS
=============================================== */
.table-of-contents.green a.hover,
.table-of-contents.green a:hover {
    border-left: 1px solid #51d5aa !important;
}
.table-of-contents.green a.active {
    border-left: 2px solid #51d5aa !important;
}

/* ==============================================
 TEXT
=============================================== */
.text-green {
    color: #51d5aa !important;
}
.text-green.active,
.text-green:active {
    color: #69c4a6 !important;
}
.text-green.disabled,
.text-green:disabled {
    color: #51d5aaD9 !important;
}

/* ==============================================
 TOAST
=============================================== */
.toast.green {
    color: #ffffff !important;
    background-color: #51d5aa !important;
}
.toast.green a,
.toast.green i {
    color: #ffffff !important;
}

/* ==============================================
 TOPBAR
=============================================== */
.topbar.green .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #51d5aa !important;
    border: 1px solid #51d5aa !important;
}
.topbar .dropdown.green .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #51d5aa !important;
    border-color: #51d5aa !important;
}
/* ==============================================
 A
=============================================== */
a.text-primary {
    color: #113366;
}
a.text-primary:hover {
    color: #294877 !important;
}
a.text-primary.active,
a.text-primary:active {
    color: #294877;
}
a.text-primary.focus,
a.text-primary:focus {
    color: #113366 !important;
}
a.text-primary.disabled,
a.text-primary:disabled {
    color: #113366D9;
}

/* ==============================================
 ALERT
=============================================== */
.alert.primary {
    color: #ffffff;
    background-color: #113366;
    border-color: #113366;
}
.alert.primary hr {
    border-top-color: #ffffff;
}
.alert.primary .alert-link {
    color: #ffffff;
}

/* ==============================================
 AUTOCOMPLETE
=============================================== */
.autocomplete.primary .dropdown-item.active,
.autocomplete.primary .dropdown-item:active {
    color: #ffffff;
    text-decoration: none;
    background-color: #113366;
}

/* ==============================================
 BADGE
=============================================== */
.badge.primary {
    color: #ffffff;
    background-color: #113366;
}
a.badge.primary:hover,
a.badge.primary:hover {
    color: #ffffff;
    background-color: #0E2A55;
}
.badge.primary a {
    color: #ffffff !important;
}
.badge.primary a.hover,
.badge.primary a:hover {
    color: #ffffff !important;
}
a.badge.primary.focus,
a.badge.primary:focus {
    box-shadow: 0 0 0 0.2rem #11336680;
}
.badge-avatar.primary {
    border-color: #113366;
}

/* ==============================================
 BACKGROUND
=============================================== */
.bg-primary {
    background-color: #113366 !important;
}
.bg-primary-lighten {
    background-color: #11336688 !important;
}
a.bg-primary:focus,
a.bg-primary:hover,
button.bg-primary:focus,
button.bg-primary:hover {
    background-color: #0E2A55 !important;
}
.bg-gradient-primary {
    background-color: #113366;
    background-image: linear-gradient(180deg, #113366 10%, #113366 100%);
}
.bg-primary,
.bg-primary.text-primary,
.bg-primary-lighten,
.bg-primary-lighten.text-primary,
.bg-gradient-primary,
.bg-gradient-primary.text-primary {
    color: #ffffff !important;
}

/* ==============================================
 BORDER
=============================================== */
.border-primary {
    border: 0.25rem solid #113366 !important;
}
.border-top-primary {
    border-top: 0.25rem solid #113366 !important;
}
.border-right-primary {
    border-right: 0.25rem solid #113366 !important;
}
.border-bottom-primary {
    border-bottom: 0.25rem solid #113366 !important;
}
.border-left-primary {
    border-left: 0.25rem solid #113366 !important;
}
.border-thin-primary {
    border: 1px solid #113366 !important;
}
.border-top-thin-primary {
    border-top: 1px solid #113366 !important;
}
.border-right-thin-primary {
    border-right: 1px solid #113366 !important;
}
.border-bottom-thin-primary {
    border-bottom: 1px solid #113366 !important;
}
.border-left-thin-primary {
    border-left: 3px solid #113366 !important;
}
.border-thick-primary {
    border: 3px solid #113366 !important;
}
.border-top-thick-primary {
    border-top: 3px solid #113366 !important;
}
.border-right-thick-primary {
    border-right: 3px solid #113366 !important;
}
.border-bottom-thick-primary {
    border-bottom: 3px solid #113366 !important;
}
.border-left-thick-primary {
    border-left: 3px solid #113366 !important;
}

/* ==============================================
 BUTTON
=============================================== */
.btn.primary.focus,
.btn.primary:focus {
    box-shadow: 0 0 0 0.2rem #11336640;
}
.btn.primary {
    color: #ffffff;
    background-color: #113366;
    border-color: #113366;
}
.btn.primary.hover,
.btn.primary:hover {
    color: #ffffff;
    background-color: #113366;
    border-color: #0E2A55;
}
.btn.primary.focus,
.btn.primary:focus {
    color: #ffffff;
    background-color: #113366;
    border-color: #0E2A55;
    box-shadow: 0 0 0 0.2rem #11336680;
}
.btn.primary.disabled,
.btn.primary:disabled {
    color: #ffffff;
    background-color: #113366;
    border-color: #113366;
}
.btn.primary:not(:disabled):not(.disabled).active,
.btn.primary:not(:disabled):not(.disabled):active,
.show > .btn.primary.dropdown-toggle {
    color: #ffffff;
    background-color: #0E2A55;
    border-color: #113366;
}
.btn.primary:not(:disabled):not(.disabled).active:focus,
.btn.primary:not(:disabled):not(.disabled):active:focus,
.show > .btn.primary.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem #11336680;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.primary {
    color: #113366;
    background-color: #ffffff;
    border-color: #113366;
}
.btn-outline.primary:hover {
    color: #113366;
    background-color: #ffffff;
    border-color: #113366;
}
.btn-outline.primary.focus,
.btn-outline.primary:focus {
    color: #113366;
    background-color: #ffffff;
    border-color: #113366;
    box-shadow: 0 0 0 0.2rem #11336680;
}
.btn-outline.primary.disabled, .btn-outline.primary:disabled {
    color: #113366;
    background-color: #ffffff;
    border-color: #113366;
}
.btn-outline.primary:not(:disabled):not(.disabled).active,
.btn-outline.primary:not(:disabled):not(.disabled):active,
.show > .btn-outline.primary.dropdown-toggle {
    color: #113366;
    background-color: #ffffff;
    border-color: #113366;
}
.btn-outline.primary:not(:disabled):not(.disabled).active:focus,
.btn-outline.primary:not(:disabled):not(.disabled):active:focus,
.show > .btn-outline.primary.dropdown-toggle:focus {
    color: #0E2A55;
    background-color: #ffffff;
    border-color: #0E2A55;
    box-shadow: 0 0 0 0.2rem #11336680;
}
.btn-outline.primary:not(:disabled):not(.disabled).active:hover,
.btn-outline.primary:not(:disabled):not(.disabled):active:hover,
.show > .btn-outline.primary.dropdown-toggle:hover {
    color: #0E2A55;
    background-color: #ffffff;
    border-color: #0E2A55;
    box-shadow: 0 0 0 0.2rem #113366BF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.primary > .btn-primary.active {
    color: #ffffff;
    background-color: #113366;
    border-color: #0E2A55;
}

.btn-group.primary .btn-outline:not(:active):not(.active) {
    color: #113366;
    border-color: #113366;
}
.btn-group.primary .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.primary .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #113366 !important;
    border-color: #113366;
}
.btn-group.primary .btn-outline:not(:disabled):not(.disabled).active:focus,
.btn-group.primary .btn-outline:not(:disabled):not(.disabled):active:focus {
    color: #ffffff;
    background-color: #0E2A55 !important;
    border-color: #0E2A55;
    box-shadow: 0 0 0 0.2rem #11336680;
}
.btn-group.primary .btn-outline:not(:disabled):not(.disabled).active:hover,
.btn-group.primary .btn-outline:not(:disabled):not(.disabled):active:hover {
    color: #ffffff;
    background-color: #0E2A55 !important;
    border-color: #0E2A55;
    box-shadow: 0 0 0 0.2rem #113366BF;
}

/* ==============================================
 BUTTON LINK
=============================================== */
.btn-link.primary {
    color: #113366;
}
.btn-link.primary.hover,
.btn-link.primary:hover {
    color: #294877;
}
.btn-link.primary.disabled,
.btn-link.primary:disabled {
    color: #294877;
}

/* ==============================================
BREADCRUMBS
=============================================== */
.breadcrumb.primary .breadcrumb-item a {
    color: #113366;
}
.breadcrumb.primary .breadcrumb-item a:hover {
    text-decoration: underline;
}
.navbar.primary .breadcrumb .breadcrumb-item a {
    color: #ffffff;
}
.navbar.primary .breadcrumb .breadcrumb-item a:hover {
    text-decoration: underline;
}
.navbar.primary .breadcrumb .breadcrumb-item.active {
    color: #ffffffB3;
    text-decoration: none;
}
.navbar.primary .breadcrumb .breadcrumb-item+.breadcrumb-item::before {
    color: #ffffffB3;
}

/* ==============================================
 CARD
=============================================== */
.card.primary {
    color: #ffffff !important;
    background-color: #113366 !important;
}
.card.primary a,
.card.primary p,
.card.primary i,
.card.primary em,
.card.primary strong {
    color: #ffffff !important;
}

/* ==============================================
 CHECKBOX
=============================================== */
.custom-checkbox.primary .custom-control-input:indeterminate ~ .custom-control-label::before {
    border-color: #113366;
    background-color: #113366;
}
.custom-checkbox.primary .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #1133664D;
}
.custom-checkbox.primary .custom-control-input:disabled:indeterminate ~ .custom-control-label::before {
    background-color: #1133664D;
}

/* ==============================================
 CUSTOM CONTROL
=============================================== */
.custom-control.primary .custom-control-input:checked ~ .custom-control-label::before {
    color: #ffffff;
    border-color: #ffffff;
    background-color: #113366;
}
.custom-control.primary .custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: 0 0 0.2rem #11336640;
}
.custom-control.primary .custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
    border-color: #bac8f3;
}
.custom-control.primary .custom-control-input:disabled ~ .custom-control-label,
.custom-control-input[disabled] ~ .custom-control-label {
    color: #858796;
}

/* ==============================================
 CUSTOM RADIO
=============================================== */
.custom-radio.primary .custom-control-label:before {
    background-color: #ffffff;
}
.custom-radio.primary .custom-control-input:checked~.custom-control-label::before {
    border-color: #ffffff;
    background-color: #113366;
}
.custom-radio.primary .custom-control-input:disabled~.custom-control-label::before {
    background-color: #1133664D;
}
.custom-radio.primary .custom-control-input:focus~.custom-control-label::before {
    box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem #11336666;
}
.custom-radio.primary .custom-control-input:checked~.custom-control-label::after {
    color: #113366;
}

/* ==============================================
 CUSTOM RANGE
=============================================== */
.primary .custom-range:focus::-webkit-slider-thumb {
    box-shadow: 0 0 0 1px #113366, 0 0 0.2rem #11336640;
}
.primary .custom-range:focus::-moz-range-thumb {
    box-shadow: 0 0 0 1px #113366, 0 0 0.2rem #11336640;
}
.primary .custom-range:focus::-ms-thumb {
    box-shadow: 0 0 0 1px #113366, 0 0 0.2rem #11336640;
}
.primary .custom-range::-webkit-slider-thumb {
    background-color: #113366;
    appearance: none;
}
.primary .custom-range::-moz-range-thumb {
    background-color: #113366;
}
.primary .custom-range::-ms-thumb {
    background-color: #113366;
}

/* ==============================================
 CUSTOM SWITCH
=============================================== */
.custom-switch.primary .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #11336680;
}

/* ==============================================
 DATEPICKER
=============================================== */
.datepicker.primary .datepicker-header {
    color: #ffffff;
    background-color: #113366;
}
.datepicker.primary .datepicker-content .active {
    color: #ffffff;
    background-color: #113366;
}
.datepicker.primary .datepicker-controls .form-control:focus,
.datepicker.primary .datepicker-controls .form-control.focus {
    box-shadow: 0 0 0 0.2rem #1133660A !important;
}

/* ==============================================
 DROPDOWN
=============================================== */
.dropdown-item.primary.active,
.dropdown-item.primary:active {
    color: #ffffff;
    background-color: #113366;
}
.dropdown-item.primary.disabled,
.dropdown-item.primary:disabled {
    color: #1133664D;
}
.dropdown.primary .dropdown-item.active,
.dropdown.primary .dropdown-item:active {
    color: #ffffff !important;
    background-color: #113366E6 !important;
}
.dropdown.primary .dropdown-item:active .text-primary {
    color: #ffffff !important;
}
.dropdown.primary .dropdown-item.focus,
.dropdown.primary .dropdown-item:focus {
    color: #ffffff !important;
    background-color: #113366E6 !important;
}
.dropdown.primary .dropdown-item:focus .text-primary {
    color: #ffffff !important;
}
.dropdown.primary .dropdown-item.hover,
.dropdown.primary .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #113366CC !important;
}
.dropdown.primary .dropdown-item:hover .text-primary {
    color: #ffffff !important;
}

/* ==============================================
 ERROR
=============================================== */
.error.primary:before {
    text-shadow: 1px 0 #113366;
    color: #294877;
    background: #f8f9fc;
}

/* ==============================================
 HR
=============================================== */
hr.primary {
    border-top: 1px solid #1133661a;
}

/* ==============================================
 ICONS
=============================================== */
.mdi-primary {
    color: #113366;
}

/* ==============================================
INPUT
=============================================== */
.input-field.primary .form-control:focus,
.form-control.primary:focus {
    box-shadow: 0 0 0 0.1rem #11336640 !important;
}

/* ==============================================
 JUMBOTRON
=============================================== */
.jumbotron.primary {
    color: #ffffff;
    background-color: #113366;
}
.jumbotron.primary a,
.jumbotron.primary p,
.jumbotron.primary i,
.jumbotron.primary em,
.jumbotron.primary strong {
    color: #ffffff;
}

/* ==============================================
 LIST GROUP
=============================================== */
.list-group-item.primary,
.list-group.primary .list-group-item {
    color: #ffffff;
    background-color: #113366 !important;
}
.list-group.primary .list-group-item:focus,
.list-group.primary .list-group-item:hover,
.list-group-item.primary.list-group-item:focus,
.list-group-item.primary.list-group-item:hover {
    color: #ffffff;
    background-color: #113366 !important;
}
.list-group.primary .list-group-item.list-group-item-action:focus,
.list-group.primary .list-group-item.list-group-item-action:hover,
.list-group-item.primary.list-group-item-action:focus,
.list-group-item.primary.list-group-item-action:hover {
    color: #ffffff;
    background-color: #113366 !important;
}
.list-group.primary .list-group-item.active,
.list-group-item.primary.active {
    color: #ffffff;
    background-color: #0E2A55 !important;
    border-color: #0E2A55;
}
.list-group.primary .list-group-item.disabled,
.list-group-item.primary.disabled {
    color: #ffffff;
    background-color: #294877A9 !important;
}

/* ==============================================
 LOADING
=============================================== */
.loading.primary .spinner-border {
    color: #113366 !important;
}

/* ==============================================
 MODAL
=============================================== */
.modal-header.primary {
    background-color: #113366;
    color: #ffffff;
}
.modal-header.primary a {
    color: #ffffff;
}
.modal-header.text-primary .modal-title,
.modal-header.text-primary a {
    color: #113366;
}
.modal .nav-tabs.bg-primary {
    background-color: #113366 !important;
    color: #ffffff !important;
    border: 1px solid #113366 !important;
}
.modal .nav-tabs.bg-primary .nav-link {
    border: 1px solid #113366 !important;
}
.modal .nav-tabs.bg-primary .nav-link:hover,
.modal .nav-tabs.bg-primary .nav-link.hover,
.modal .nav-tabs.bg-primary .nav-link:active,
.modal .nav-tabs.bg-primary .nav-link.active {
    text-decoration: underline !important;
}

/* ==============================================
 NAV
=============================================== */
.nav.primary {
    color: #113366;
}
.nav.primary .nav-link {
    color: #113366;
}
.nav.primary .nav-link.disabled {
    color: #11336680 !important;
}
.nav.primary .nav-link.bordered {
    border: 1px solid #113366;
}

.nav-link.primary a {
    color: #113366;
}
.nav-link.primary.disabled {
    color: #1133664D;
}

.nav.bg-primary,
.nav.bg-primary .nav-link,
.nav.bg-primary .nav-link.active {
    background-color: #113366;
    color: #ffffff;
    border: 1px solid #0E2A55;
}
.nav.bg-primary .nav-link.active {
    text-decoration: underline;
}

/* ==============================================
 NAV VERTICAL
=============================================== */
.nav-vertical.primary .nav-item a {
    color: #757575;
}
.nav-vertical.primary .nav-item a:hover {
    border-left: 1px solid #113366 !important;
}
.nav-vertical.primary .nav-item a.active {
    border-left: 2px solid #113366 !important;
}
.nav-vertical.primary .nav-link.disabled {
    cursor: not-allowed;
    color: #113366BF !important;
}

/* ==============================================
 NAV PILLS
=============================================== */
.nav-pills.primary a {
    color: #113366;
}
.nav-pills.primary a.disabled {
    color: #11336680 !important;
}
.nav-pills.primary .nav-link.active,
.nav-pills.primary .show > .nav-link {
    color: #ffffff;
    background-color: #113366;
    border: 1px solid #113366;
}

.nav-pills .nav-item.primary a {
    color: #113366;
}
.nav-pills .nav-item.primary a.disabled {
    color: #11336680 !important;
}
.nav-pills .nav-item.primary .nav-link.active,
.nav-pills .nav-item.primary .show > .nav-link {
    color: #ffffff;
    background-color: #113366;
    border: 1px solid #113366;
}

/* ==============================================
NAV BORDER
=============================================== */
.nav-border-top.primary {
    border-top: .15rem solid #113366 !important;
}
.nav-border-top.white a {
    color: #113366;
}
.nav-border-right.primary {
    border-right: .15rem solid #113366 !important;
}
.nav-border-right.primary a {
    color: #113366;
}
.nav-border-bottom.primary {
    border-bottom: .15rem solid #113366 !important;
}
.nav-border-bottom.primary a {
    color: #113366;
}
.nav-border-left.primary {
    border-left: .15rem solid #113366 !important;
}
.nav-border-left.primary a {
    color: #113366;
}

/* ==============================================
 NAVBAR
=============================================== */
.navbar.primary {
    color: #ffffffE6 !important;
    background-color: #113366 !important;
}
.navbar.primary #sidebarToggleTop,
.navbar.primary #sidebarToggleTop i {
    color: #ffffffE6 !important;
    background-color: #113366 !important;
    border: none;
}
.navbar.primary #sidebarToggleTop:active {
    border-color: #113366E6;
}
.navbar.primary .navbar-brand {
    color: #ffffffE6;
}
.navbar.primary .navbar-brand:hover,
.navbar.primary .navbar-brand:focus {
    color: #ffffffE6;
}
.navbar.primary .navbar-nav .nav-link {
    color: #ffffffE6;
}
.navbar.primary .navbar-nav .nav-link:hover,
.navbar.primary .navbar-nav .nav-link:focus {
    color: #ffffffCC;
}
.navbar.primary .navbar-nav .nav-link.disabled {
    color: #ffffff4D;
}
.navbar.primary .navbar-nav .show > .nav-link,
.navbar.primary .navbar-nav .active > .nav-link,
.navbar.primary .navbar-nav .nav-link.show,
.navbar.primary .navbar-nav .nav-link.active {
    color: #ffffffE6;
}
.navbar.primary .navbar-toggler {
    color: #ffffff80 !important;
    border-color: #1133661A;
}
.navbar.primary .navbar-text {
    color: #ffffff80;
}
.navbar.primary .navbar-text a {
    color: #ffffffE6;
}
.navbar.primary .navbar-text a:hover,
.navbar.primary .navbar-text a:focus {
    color: #ffffffE6;
}

/* ==============================================
 PAGINATION
=============================================== */
.pagination.primary .page-link {
    color: #113366;
    border: 1px solid #dddfeb;
}
.pagination.primary .page-link.hover,
.pagination.primary .page-link:hover {
    color: #ffffff;
    background-color: #113366BF;
    border-color: #dddfeb;
}
.pagination.primary .page-link.focus,
.pagination.primary .page-link:focus {
    box-shadow: 0 0 0.2rem #11336640 !important;
}
.pagination.primary .page-item.active .page-link {
    color: #ffffff;
    background-color: #113366;
    border-color: #113366;
}
.pagination.primary .page-item.disabled .page-link,
.pagination.primary .page-item:disabled .page-link {
    color: #858796;
    border-color: #dddfeb;
}

/* ==============================================
 PROGRESS
=============================================== */
.progress.primary .progress-bar {
    color: #ffffff;
    background-color: #113366;
}

/* ==============================================
PULSE
=============================================== */
.pulse.mdi-primary,
.pulse.primary {
    box-shadow: 0 0 0 #11336666;
    animation: pulse-primary 2s infinite;
}

@-webkit-keyframes pulse-primary {
    0% {
        -webkit-box-shadow: 0 0 0 0 #11336666;
    }
    70% {
        -webkit-box-shadow: 0 0 0 10px #11336600;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 #11336600;
    }
}
@keyframes pulse-primary {
    0% {
        -moz-box-shadow: 0 0 0 0 #11336666;
        box-shadow: 0 0 0 0 #11336666;
    }
    70% {
        -moz-box-shadow: 0 0 0 10px #11336600;
        box-shadow: 0 0 0 10px #11336600;
    }
    100% {
        -moz-box-shadow: 0 0 0 0 #11336600;
        box-shadow: 0 0 0 0 #11336600;
    }
}

/* ==============================================
 SELECT
=============================================== */
.primary select option:checked,
.primary select option:hover {
    box-shadow: 0 0 10px 100px #113366 inset;
}
.primary select:focus > option:checked {
    color: #ffffff !important;
    background-color: #11336640 !important;
}
.primary .custom-select {
    color: #6e707e;
}
.primary .custom-select:focus {
    border-color: #bac8f3;
    box-shadow: 0 0 0.2rem #11336640;
}
.primary .custom-select:focus::-ms-value {
    color: #6e707e;
}
.primary .custom-select:disabled {
    color: #858796;
    background-color: #eaecf4;
}

.primary .bootstrap-select .dropdown-item.active,
.primary .bootstrap-select .dropdown-item:active {
    color: #ffffff !important;
    background-color: #113366 !important;
}
.primary .bootstrap-select .dropdown-item.hover,
.primary .bootstrap-select .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #113366BF !important;
}
.primary .bootstrap-select.show-tick .dropdown-menu .selected span.check-mark {
    color: #113366;
}

/* ==============================================
 SIDEBAR
=============================================== */
.sidebar.primary .nav-item .collapse .collapse-inner .collapse-item.active,
.sidebar.primary .nav-item .collapsing .collapse-inner .collapse-item.active {
    color: #113366;
}
.sidebar.primary {
    color: #ffffff;
    background-color: #113366;
}
.sidebar.primary .sidebar-brand {
    color: #ffffff;
}
.sidebar.primary hr.sidebar-divider {
    border-top: 1px solid #ffffff26;
}
.sidebar.primary .sidebar-heading {
    color: #ffffff66;
}
.sidebar.primary .nav-item .nav-link {
    color: #ffffffCC;
}
.sidebar.primary .nav-item .nav-link a {
    color: #ffffffCC;
}
.sidebar.primary .nav-item .nav-link i {
    color: #ffffff4D;
}
.sidebar.primary .nav-item .nav-link:focus,
.sidebar.primary .nav-item .nav-link:hover,
.sidebar.primary .nav-item .nav-link:focus a,
.sidebar.primary .nav-item .nav-link:hover a,
.sidebar.primary .nav-item .nav-link:focus i,
.sidebar.primary .nav-item .nav-link:hover i {
    color: #ffffff;
}

.sidebar.primary .nav-item .nav-link:active,
.sidebar.primary .nav-item .nav-link a:active,
.sidebar.primary .nav-item .nav-link i:active {
    color: #ffffff;
}
.sidebar.primary .nav-item .collapse .collapse-inner .collapse-item,
.sidebar.primary .nav-item .collapsing .collapse-inner .collapse-item {
    color: #ffffffCC;
}
.sidebar.primary .nav-item .collapse .collapse-inner .collapse-item a,
.sidebar.primary .nav-item .collapsing .collapse-inner .collapse-item a {
    color: #ffffffCC;
}
.sidebar.primary .nav-item .nav-link[data-toggle=collapse].collapsed::after {
    color: #ffffff80;
}
.sidebar.primary .nav-item .nav-link[data-toggle="collapse"]::after {
    color: #ffffff80;
}
.sidebar.primary .nav-item .collapse-inner .collapse-header {
    color: #ffffff80 !important;
}
.sidebar.primary .nav-item .collapse .collapse-inner,
.sidebar.primary .nav-item .collapsing .collapse-inner {
    color: #ffffffCC;
    background-color: #294877;
}
.sidebar.primary .nav-item .collapse .collapse-inner .collapse-item:active,
.sidebar.primary .nav-item .collapsing .collapse-inner .collapse-item:active
.sidebar.primary .nav-item .collapse .collapse-inner .collapse-item a:active,
.sidebar.primary .nav-item .collapsing .collapse-inner .collapse-item a:active {
    color: #ffffffCC;
    opacity: 0.9;
    background-color: #294877;
}
.sidebar.primary .nav-item .collapse .collapse-inner .collapse-item:hover,
.sidebar.primary .nav-item .collapsing .collapse-inner .collapse-item:hover,
.sidebar.primary .nav-item .collapse .collapse-inner .collapse-item a:hover,
.sidebar.primary .nav-item .collapsing .collapse-inner .collapse-item a:hover {
    color: #ffffff80;
    opacity: 0.9;
    background-color: #294877;
}
.sidebar.primary .nav-item.active .nav-link,
.sidebar.primary .nav-item.active .nav-link a,
.sidebar.primary .nav-item.active .nav-link i {
    color: #ffffff;
}
.sidebar.primary #sidebarToggle {
    background-color: #11336633;
}
.sidebar.primary #sidebarToggle::after {
    color: #ffffff80;
}
.sidebar.primary #sidebarToggle:hover {
    background-color: #ffffff40;
}
.sidebar.primary.toggled #sidebarToggle::after {
    color: #ffffff80;
}
.sidebar.primary .sidebar-card {
    color: #ffffff;
}
@media (min-width: 768px) {
    .sidebar.primary .nav-item .nav-link[data-toggle=collapse].collapsed::after {
        font-family: "Material Design Icons";
        content: "\F035F";
        color: #ffffff80;
    }
    .sidebar.primary .nav-item .nav-link[data-toggle="collapse"]::after {
        font-family: "Material Design Icons";
        content: "\F035D";
        color: #ffffff80;
    }
}

/* ==============================================
  SHADOW
=============================================== */
.primary.shadow-sm-right {
    box-shadow: 0.125rem 0 0 #1133661A !important;
}

/* ==============================================
  STAR
=============================================== */
.primary input.star:checked ~ label.star:before {
    color: #113366 !important;
}

/* ==============================================
 STEPS
=============================================== */
.steps.primary .step.active:before {
    color: #113366;
}
.steps.primary .step.active:before,
.steps.primary .step.active:after {
    background: #113366;
}

/* ==============================================
TABLE
=============================================== */
table.primary td.highlight {
    color: #ffffff;
    background-color: #11336680;
}
table.primary th.highlight {
    color: #ffffff;
    background-color: #113366A0;
}
th.highlight.primary {
    color: #ffffff;
    background-color: #113366A0;
}
td.highlight.primary {
    color: #ffffff;
    background-color: #11336680;
}

/* ==============================================
TABLE OF CONTENTS
=============================================== */
.table-of-contents.primary a.hover,
.table-of-contents.primary a:hover {
    border-left: 1px solid #113366 !important;
}
.table-of-contents.primary a.active {
    border-left: 2px solid #113366 !important;
}

/* ==============================================
 TEXT
=============================================== */
.text-primary {
    color: #113366 !important;
}
.text-primary.active,
.text-primary:active {
    color: #294877 !important;
}
.text-primary.disabled,
.text-primary:disabled {
    color: #113366D9 !important;
}

/* ==============================================
 TOAST
=============================================== */
.toast.primary {
    color: #ffffff !important;
    background-color: #113366 !important;
}
.toast.primary a,
.toast.primary i {
    color: #ffffff !important;
}

/* ==============================================
 TOPBAR
=============================================== */
.topbar.primary .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #113366 !important;
    border: 1px solid #113366 !important;
}
.topbar .dropdown.primary .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #113366 !important;
    border-color: #113366 !important;
}
/* ==============================================
 A
=============================================== */
a.text-red {
    color: #f44336;
}
a.text-red:hover {
    color: #e53935 !important;
}
a.text-red.active,
a.text-red:active {
    color: #e53935;
}
a.text-red.focus,
a.text-red:focus {
    color: #ef5350 !important;
}
a.text-red.disabled,
a.text-red:disabled {
    color: #f44336D9;
}

/* ==============================================
 ALERT
=============================================== */
.alert.red {
    color: #ffffff;
    background-color: #ef5350;
    border-color: #f44336;
}
.alert.red hr {
    border-top-color: #ffffff;
}
.alert.red .alert-link {
    color: #ffffff;
}

/* ==============================================
 AUTOCOMPLETE
=============================================== */
.autocomplete.red .dropdown-item.active,
.autocomplete.red .dropdown-item:active {
    color: #ffffff;
    text-decoration: none;
    background-color: #f44336;
}

/* ==============================================
 BADGE
=============================================== */
.badge.red {
    color: #ffffff;
    background-color: #f44336;
}
a.badge.red:hover,
a.badge.red:hover {
    color: #ffffff;
    background-color: #d32f2f;
}
.badge.red a {
    color: #ffffff !important;
}
.badge.red a.hover,
.badge.red a:hover {
    color: #ffffff !important;
}
a.badge.red.focus,
a.badge.red:focus {
    box-shadow: 0 0 0 0.2rem #f4433680;
}
.badge-avatar.red {
    border-color: #f44336;
}

/* ==============================================
 BACKGROUND
=============================================== */
.bg-red {
    background-color: #f44336 !important;
}
.bg-red-lighten {
    background-color: #f4433688 !important;
}
a.bg-red:focus,
a.bg-red:hover,
button.bg-red:focus,
button.bg-red:hover {
    background-color: #d32f2f !important;
}
.bg-gradient-red {
    background-color: #f44336;
    background-image: linear-gradient(180deg, #f44336 10%, #f44336 100%);
}
.bg-red,
.bg-red.text-red,
.bg-red-lighten,
.bg-red-lighten.text-red,
.bg-gradient-red,
.bg-gradient-red.text-red {
    color: #ffffff !important;
}

/* ==============================================
 BORDER
=============================================== */
.border-red {
    border: 0.25rem solid #f44336 !important;
}
.border-top-red {
    border-top: 0.25rem solid #f44336 !important;
}
.border-right-red {
    border-right: 0.25rem solid #f44336 !important;
}
.border-bottom-red {
    border-bottom: 0.25rem solid #f44336 !important;
}
.border-left-red {
    border-left: 0.25rem solid #f44336 !important;
}
.border-thin-red {
    border: 1px solid #f44336 !important;
}
.border-top-thin-red {
    border-top: 1px solid #f44336 !important;
}
.border-right-thin-red {
    border-right: 1px solid #f44336 !important;
}
.border-bottom-thin-red {
    border-bottom: 1px solid #f44336 !important;
}
.border-left-thin-red {
    border-left: 3px solid #f44336 !important;
}
.border-thick-red {
    border: 3px solid #f44336 !important;
}
.border-top-thick-red {
    border-top: 3px solid #f44336 !important;
}
.border-right-thick-red {
    border-right: 3px solid #f44336 !important;
}
.border-bottom-thick-red {
    border-bottom: 3px solid #f44336 !important;
}
.border-left-thick-red {
    border-left: 3px solid #f44336 !important;
}

/* ==============================================
 BUTTON
=============================================== */
.btn.red.focus,
.btn.red:focus {
    box-shadow: 0 0 0 0.2rem #f4433640;
}
.btn.red {
    color: #ffffff;
    background-color: #f44336;
    border-color: #f44336;
}
.btn.red.hover,
.btn.red:hover {
    color: #ffffff;
    background-color: #f44336;
    border-color: #d32f2f;
}
.btn.red.focus,
.btn.red:focus {
    color: #ffffff;
    background-color: #f44336;
    border-color: #d32f2f;
    box-shadow: 0 0 0 0.2rem #f4433680;
}
.btn.red.disabled,
.btn.red:disabled {
    color: #ffffff;
    background-color: #f44336;
    border-color: #f44336;
}
.btn.red:not(:disabled):not(.disabled).active,
.btn.red:not(:disabled):not(.disabled):active,
.show > .btn.red.dropdown-toggle {
    color: #ffffff;
    background-color: #d32f2f;
    border-color: #f44336;
}
.btn.red:not(:disabled):not(.disabled).active:focus,
.btn.red:not(:disabled):not(.disabled):active:focus,
.show > .btn.red.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem #f4433680;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.red {
    color: #f44336;
    background-color: #ffffff;
    border-color: #f44336;
}
.btn-outline.red:hover {
    color: #f44336;
    background-color: #ffffff;
    border-color: #f44336;
}
.btn-outline.red.focus,
.btn-outline.red:focus {
    color: #f44336;
    background-color: #ffffff;
    border-color: #f44336;
    box-shadow: 0 0 0 0.2rem #f4433680;
}
.btn-outline.red.disabled, .btn-outline.red:disabled {
    color: #f44336;
    background-color: #ffffff;
    border-color: #ef5350;
}
.btn-outline.red:not(:disabled):not(.disabled).active,
.btn-outline.red:not(:disabled):not(.disabled):active,
.show > .btn-outline.red.dropdown-toggle {
    color: #f44336;
    background-color: #ffffff;
    border-color: #f44336;
}
.btn-outline.red:not(:disabled):not(.disabled).active:focus,
.btn-outline.red:not(:disabled):not(.disabled):active:focus,
.show > .btn-outline.red.dropdown-toggle:focus {
    color: #d32f2f;
    background-color: #ffffff;
    border-color: #d32f2f;
    box-shadow: 0 0 0 0.2rem #f4433680;
}
.btn-outline.red:not(:disabled):not(.disabled).active:hover,
.btn-outline.red:not(:disabled):not(.disabled):active:hover,
.show > .btn-outline.red.dropdown-toggle:hover {
    color: #d32f2f;
    background-color: #ffffff;
    border-color: #d32f2f;
    box-shadow: 0 0 0 0.2rem #f44336BF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.red > .btn-red.active {
    color: #ffffff;
    background-color: #f44336;
    border-color: #d32f2f;
}

.btn-group.red .btn-outline:not(:active):not(.active) {
    color: #f44336;
    border-color: #f44336;
}
.btn-group.red .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.red .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #f44336 !important;
    border-color: #f44336;
}
.btn-group.red .btn-outline:not(:disabled):not(.disabled).active:focus,
.btn-group.red .btn-outline:not(:disabled):not(.disabled):active:focus {
    color: #ffffff;
    background-color: #d32f2f !important;
    border-color: #d32f2f;
    box-shadow: 0 0 0 0.2rem #f4433680;
}
.btn-group.red .btn-outline:not(:disabled):not(.disabled).active:hover,
.btn-group.red .btn-outline:not(:disabled):not(.disabled):active:hover {
    color: #ffffff;
    background-color: #d32f2f !important;
    border-color: #d32f2f;
    box-shadow: 0 0 0 0.2rem #f44336BF;
}

/* ==============================================
 BUTTON LINK
=============================================== */
.btn-link.red {
    color: #f44336;
}
.btn-link.red.hover,
.btn-link.red:hover {
    color: #e53935;
}
.btn-link.red.disabled,
.btn-link.red:disabled {
    color: #e53935;
}

/* ==============================================
BREADCRUMBS
=============================================== */
.breadcrumb.red .breadcrumb-item a {
    color: #f44336;
}
.breadcrumb.red .breadcrumb-item a:hover {
    text-decoration: underline;
}
.navbar.red .breadcrumb .breadcrumb-item a {
    color: #ffffff;
}
.navbar.red .breadcrumb .breadcrumb-item a:hover {
    text-decoration: underline;
}
.navbar.red .breadcrumb .breadcrumb-item.active {
    color: #ffffffB3;
    text-decoration: none;
}
.navbar.red .breadcrumb .breadcrumb-item+.breadcrumb-item::before {
    color: #ffffffB3;
}

/* ==============================================
 CARD
=============================================== */
.card.red {
    color: #ffffff !important;
    background-color: #f44336 !important;
}
.card.red a,
.card.red p,
.card.red i,
.card.red em,
.card.red strong {
    color: #ffffff !important;
}

/* ==============================================
 CHECKBOX
=============================================== */
.custom-checkbox.red .custom-control-input:indeterminate ~ .custom-control-label::before {
    border-color: #f44336;
    background-color: #f44336;
}
.custom-checkbox.red .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #f443364D;
}
.custom-checkbox.red .custom-control-input:disabled:indeterminate ~ .custom-control-label::before {
    background-color: #f443364D;
}

/* ==============================================
 CUSTOM CONTROL
=============================================== */
.custom-control.red .custom-control-input:checked ~ .custom-control-label::before {
    color: #ffffff;
    border-color: #ffffff;
    background-color: #f44336;
}
.custom-control.red .custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: 0 0 0.2rem #f4433640;
}
.custom-control.red .custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
    border-color: #bac8f3;
}
.custom-control.red .custom-control-input:disabled ~ .custom-control-label,
.custom-control-input[disabled] ~ .custom-control-label {
    color: #858796;
}

/* ==============================================
 CUSTOM RADIO
=============================================== */
.custom-radio.red .custom-control-label:before {
    background-color: #ffffff;
}
.custom-radio.red .custom-control-input:checked~.custom-control-label::before {
    border-color: #ffffff;
    background-color: #f44336;
}
.custom-radio.red .custom-control-input:disabled~.custom-control-label::before {
    background-color: #f443364D;
}
.custom-radio.red .custom-control-input:focus~.custom-control-label::before {
    box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem #f4433666;
}
.custom-radio.red .custom-control-input:checked~.custom-control-label::after {
    color: #f44336;
}

/* ==============================================
 CUSTOM RANGE
=============================================== */
.red .custom-range:focus::-webkit-slider-thumb {
    box-shadow: 0 0 0 1px #f44336, 0 0 0.2rem #f4433640;
}
.red .custom-range:focus::-moz-range-thumb {
    box-shadow: 0 0 0 1px #f44336, 0 0 0.2rem #f4433640;
}
.red .custom-range:focus::-ms-thumb {
    box-shadow: 0 0 0 1px #f44336, 0 0 0.2rem #f4433640;
}
.red .custom-range::-webkit-slider-thumb {
    background-color: #f44336;
    appearance: none;
}
.red .custom-range::-moz-range-thumb {
    background-color: #f44336;
}
.red .custom-range::-ms-thumb {
    background-color: #f44336;
}

/* ==============================================
 CUSTOM SWITCH
=============================================== */
.custom-switch.red .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #f4433680;
}

/* ==============================================
 DATEPICKER
=============================================== */
.datepicker.red .datepicker-header {
    color: #ffffff;
    background-color: #f44336;
}
.datepicker.red .datepicker-content .active {
    color: #ffffff;
    background-color: #f44336;
}
.datepicker.red .datepicker-controls .form-control:focus,
.datepicker.red .datepicker-controls .form-control.focus {
    box-shadow: 0 0 0 0.2rem #f443360A !important;
}

/* ==============================================
 DROPDOWN
=============================================== */
.dropdown-item.red.active,
.dropdown-item.red:active {
    color: #ffffff;
    background-color: #f44336;
}
.dropdown-item.red.disabled,
.dropdown-item.red:disabled {
    color: #f443364D;
}
.dropdown.red .dropdown-item.active,
.dropdown.red .dropdown-item:active {
    color: #ffffff !important;
    background-color: #f44336E6 !important;
}
.dropdown.red .dropdown-item:active .text-red {
    color: #ffffff !important;
}
.dropdown.red .dropdown-item.focus,
.dropdown.red .dropdown-item:focus {
    color: #ffffff !important;
    background-color: #f44336E6 !important;
}
.dropdown.red .dropdown-item:focus .text-red {
    color: #ffffff !important;
}
.dropdown.red .dropdown-item.hover,
.dropdown.red .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #f44336CC !important;
}
.dropdown.red .dropdown-item:hover .text-red {
    color: #ffffff !important;
}

/* ==============================================
 ERROR
=============================================== */
.error.red:before {
    text-shadow: 1px 0 #f44336;
    color: #e53935;
    background: #f8f9fc;
}

/* ==============================================
 HR
=============================================== */
hr.red {
    border-top: 1px solid #f443361a;
}

/* ==============================================
 ICONS
=============================================== */
.mdi-red {
    color: #f44336;
}

/* ==============================================
INPUT
=============================================== */
.input-field.red .form-control:focus,
.form-control.red:focus {
    box-shadow: 0 0 0 0.1rem #f4433640 !important;
}

/* ==============================================
 JUMBOTRON
=============================================== */
.jumbotron.red {
    color: #ffffff;
    background-color: #f44336;
}
.jumbotron.red a,
.jumbotron.red p,
.jumbotron.red i,
.jumbotron.red em,
.jumbotron.red strong {
    color: #ffffff;
}

/* ==============================================
 LIST GROUP
=============================================== */
.list-group-item.red,
.list-group.red .list-group-item {
    color: #ffffff;
    background-color: #f44336 !important;
}
.list-group.red .list-group-item:focus,
.list-group.red .list-group-item:hover,
.list-group-item.red.list-group-item:focus,
.list-group-item.red.list-group-item:hover {
    color: #ffffff;
    background-color: #ef5350 !important;
}
.list-group.red .list-group-item.list-group-item-action:focus,
.list-group.red .list-group-item.list-group-item-action:hover,
.list-group-item.red.list-group-item-action:focus,
.list-group-item.red.list-group-item-action:hover {
    color: #ffffff;
    background-color: #ef5350 !important;
}
.list-group.red .list-group-item.active,
.list-group-item.red.active {
    color: #ffffff;
    background-color: #d32f2f !important;
    border-color: #d32f2f;
}
.list-group.red .list-group-item.disabled,
.list-group-item.red.disabled {
    color: #ffffff;
    background-color: #e53935A9 !important;
}

/* ==============================================
 LOADING
=============================================== */
.loading.red .spinner-border {
    color: #f44336 !important;
}

/* ==============================================
 MODAL
=============================================== */
.modal-header.red {
    background-color: #f44336;
    color: #ffffff;
}
.modal-header.red a {
    color: #ffffff;
}
.modal-header.text-red .modal-title,
.modal-header.text-red a {
    color: #f44336;
}
.modal .nav-tabs.bg-red {
    background-color: #f44336 !important;
    color: #ffffff !important;
    border: 1px solid #f44336 !important;
}
.modal .nav-tabs.bg-red .nav-link {
    border: 1px solid #f44336 !important;
}
.modal .nav-tabs.bg-red .nav-link:hover,
.modal .nav-tabs.bg-red .nav-link.hover,
.modal .nav-tabs.bg-red .nav-link:active,
.modal .nav-tabs.bg-red .nav-link.active {
    text-decoration: underline !important;
}

/* ==============================================
 NAV
=============================================== */
.nav.red {
    color: #f44336;
}
.nav.red .nav-link {
    color: #f44336;
}
.nav.red .nav-link.disabled {
    color: #f4433680 !important;
}
.nav.red .nav-link.bordered {
    border: 1px solid #f44336;
}

.nav-link.red a {
    color: #f44336;
}
.nav-link.red.disabled {
    color: #f443364D;
}

.nav.bg-red,
.nav.bg-red .nav-link,
.nav.bg-red .nav-link.active {
    background-color: #f44336;
    color: #ffffff;
    border: 1px solid #d32f2f;
}
.nav.bg-red .nav-link.active {
    text-decoration: underline;
}

/* ==============================================
 NAV VERTICAL
=============================================== */
.nav-vertical.red .nav-item a {
    color: #757575;
}
.nav-vertical.red .nav-item a:hover {
    border-left: 1px solid #f44336 !important;
}
.nav-vertical.red .nav-item a.active {
    border-left: 2px solid #f44336 !important;
}
.nav-vertical.red .nav-link.disabled {
    cursor: not-allowed;
    color: #f44336BF !important;
}

/* ==============================================
 NAV PILLS
=============================================== */
.nav-pills.red a {
    color: #f44336;
}
.nav-pills.red a.disabled {
    color: #f4433680 !important;
}
.nav-pills.red .nav-link.active,
.nav-pills.red .show > .nav-link {
    color: #ffffff;
    background-color: #f44336;
    border: 1px solid #f44336;
}

.nav-pills .nav-item.red a {
    color: #f44336;
}
.nav-pills .nav-item.red a.disabled {
    color: #f4433680 !important;
}
.nav-pills .nav-item.red .nav-link.active,
.nav-pills .nav-item.red .show > .nav-link {
    color: #ffffff;
    background-color: #f44336;
    border: 1px solid #f44336;
}

/* ==============================================
NAV BORDER
=============================================== */
.nav-border-top.red {
    border-top: .15rem solid #f44336 !important;
}
.nav-border-top.white a {
    color: #f44336;
}
.nav-border-right.red {
    border-right: .15rem solid #f44336 !important;
}
.nav-border-right.red a {
    color: #f44336;
}
.nav-border-bottom.red {
    border-bottom: .15rem solid #f44336 !important;
}
.nav-border-bottom.red a {
    color: #f44336;
}
.nav-border-left.red {
    border-left: .15rem solid #f44336 !important;
}
.nav-border-left.red a {
    color: #f44336;
}

/* ==============================================
 NAVBAR
=============================================== */
.navbar.red {
    color: #ffffffE6 !important;
    background-color: #f44336 !important;
}
.navbar.red #sidebarToggleTop,
.navbar.red #sidebarToggleTop i {
    color: #ffffffE6 !important;
    background-color: #f44336 !important;
    border: none;
}
.navbar.red #sidebarToggleTop:active {
    border-color: #f44336E6;
}
.navbar.red .navbar-brand {
    color: #ffffffE6;
}
.navbar.red .navbar-brand:hover,
.navbar.red .navbar-brand:focus {
    color: #ffffffE6;
}
.navbar.red .navbar-nav .nav-link {
    color: #ffffffE6;
}
.navbar.red .navbar-nav .nav-link:hover,
.navbar.red .navbar-nav .nav-link:focus {
    color: #ffffffCC;
}
.navbar.red .navbar-nav .nav-link.disabled {
    color: #ffffff4D;
}
.navbar.red .navbar-nav .show > .nav-link,
.navbar.red .navbar-nav .active > .nav-link,
.navbar.red .navbar-nav .nav-link.show,
.navbar.red .navbar-nav .nav-link.active {
    color: #ffffffE6;
}
.navbar.red .navbar-toggler {
    color: #ffffff80 !important;
    border-color: #f443361A;
}
.navbar.red .navbar-text {
    color: #ffffff80;
}
.navbar.red .navbar-text a {
    color: #ffffffE6;
}
.navbar.red .navbar-text a:hover,
.navbar.red .navbar-text a:focus {
    color: #ffffffE6;
}

/* ==============================================
 PAGINATION
=============================================== */
.pagination.red .page-link {
    color: #f44336;
    border: 1px solid #dddfeb;
}
.pagination.red .page-link.hover,
.pagination.red .page-link:hover {
    color: #ffffff;
    background-color: #f44336BF;
    border-color: #dddfeb;
}
.pagination.red .page-link.focus,
.pagination.red .page-link:focus {
    box-shadow: 0 0 0.2rem #f4433640 !important;
}
.pagination.red .page-item.active .page-link {
    color: #ffffff;
    background-color: #f44336;
    border-color: #f44336;
}
.pagination.red .page-item.disabled .page-link,
.pagination.red .page-item:disabled .page-link {
    color: #858796;
    border-color: #dddfeb;
}

/* ==============================================
 PROGRESS
=============================================== */
.progress.red .progress-bar {
    color: #ffffff;
    background-color: #f44336;
}

/* ==============================================
PULSE
=============================================== */
.pulse.mdi-red,
.pulse.red {
    box-shadow: 0 0 0 #f4433666;
    animation: pulse-red 2s infinite;
}

@-webkit-keyframes pulse-red {
    0% {
        -webkit-box-shadow: 0 0 0 0 #f4433666;
    }
    70% {
        -webkit-box-shadow: 0 0 0 10px #f4433600;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 #f4433600;
    }
}
@keyframes pulse-red {
    0% {
        -moz-box-shadow: 0 0 0 0 #f4433666;
        box-shadow: 0 0 0 0 #f4433666;
    }
    70% {
        -moz-box-shadow: 0 0 0 10px #f4433600;
        box-shadow: 0 0 0 10px #f4433600;
    }
    100% {
        -moz-box-shadow: 0 0 0 0 #f4433600;
        box-shadow: 0 0 0 0 #f4433600;
    }
}

/* ==============================================
 SELECT
=============================================== */
.red select option:checked,
.red select option:hover {
    box-shadow: 0 0 10px 100px #f44336 inset;
}
.red select:focus > option:checked {
    color: #ffffff !important;
    background-color: #f4433640 !important;
}
.red .custom-select {
    color: #6e707e;
}
.red .custom-select:focus {
    border-color: #bac8f3;
    box-shadow: 0 0 0.2rem #f4433640;
}
.red .custom-select:focus::-ms-value {
    color: #6e707e;
}
.red .custom-select:disabled {
    color: #858796;
    background-color: #eaecf4;
}

.red .bootstrap-select .dropdown-item.active,
.red .bootstrap-select .dropdown-item:active {
    color: #ffffff !important;
    background-color: #f44336 !important;
}
.red .bootstrap-select .dropdown-item.hover,
.red .bootstrap-select .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #f44336BF !important;
}
.red .bootstrap-select.show-tick .dropdown-menu .selected span.check-mark {
    color: #f44336;
}

/* ==============================================
 SIDEBAR
=============================================== */
.sidebar.red .nav-item .collapse .collapse-inner .collapse-item.active,
.sidebar.red .nav-item .collapsing .collapse-inner .collapse-item.active {
    color: #f44336;
}
.sidebar.red {
    color: #ffffff;
    background-color: #f44336;
}
.sidebar.red .sidebar-brand {
    color: #ffffff;
}
.sidebar.red hr.sidebar-divider {
    border-top: 1px solid #ffffff26;
}
.sidebar.red .sidebar-heading {
    color: #ffffff66;
}
.sidebar.red .nav-item .nav-link {
    color: #ffffffCC;
}
.sidebar.red .nav-item .nav-link a {
    color: #ffffffCC;
}
.sidebar.red .nav-item .nav-link i {
    color: #ffffff4D;
}
.sidebar.red .nav-item .nav-link:focus,
.sidebar.red .nav-item .nav-link:hover,
.sidebar.red .nav-item .nav-link:focus a,
.sidebar.red .nav-item .nav-link:hover a,
.sidebar.red .nav-item .nav-link:focus i,
.sidebar.red .nav-item .nav-link:hover i {
    color: #ffffff;
}

.sidebar.red .nav-item .nav-link:active,
.sidebar.red .nav-item .nav-link a:active,
.sidebar.red .nav-item .nav-link i:active {
    color: #ffffff;
}
.sidebar.red .nav-item .collapse .collapse-inner .collapse-item,
.sidebar.red .nav-item .collapsing .collapse-inner .collapse-item {
    color: #ffffffCC;
}
.sidebar.red .nav-item .collapse .collapse-inner .collapse-item a,
.sidebar.red .nav-item .collapsing .collapse-inner .collapse-item a {
    color: #ffffffCC;
}
.sidebar.red .nav-item .nav-link[data-toggle=collapse].collapsed::after {
    color: #ffffff80;
}
.sidebar.red .nav-item .nav-link[data-toggle="collapse"]::after {
    color: #ffffff80;
}
.sidebar.red .nav-item .collapse-inner .collapse-header {
    color: #ffffff80 !important;
}
.sidebar.red .nav-item .collapse .collapse-inner,
.sidebar.red .nav-item .collapsing .collapse-inner {
    color: #ffffffCC;
    background-color: #e53935;
}
.sidebar.red .nav-item .collapse .collapse-inner .collapse-item:active,
.sidebar.red .nav-item .collapsing .collapse-inner .collapse-item:active
.sidebar.red .nav-item .collapse .collapse-inner .collapse-item a:active,
.sidebar.red .nav-item .collapsing .collapse-inner .collapse-item a:active {
    color: #ffffffCC;
    opacity: 0.9;
    background-color: #e53935;
}
.sidebar.red .nav-item .collapse .collapse-inner .collapse-item:hover,
.sidebar.red .nav-item .collapsing .collapse-inner .collapse-item:hover,
.sidebar.red .nav-item .collapse .collapse-inner .collapse-item a:hover,
.sidebar.red .nav-item .collapsing .collapse-inner .collapse-item a:hover {
    color: #ffffff80;
    opacity: 0.9;
    background-color: #e53935;
}
.sidebar.red .nav-item.active .nav-link,
.sidebar.red .nav-item.active .nav-link a,
.sidebar.red .nav-item.active .nav-link i {
    color: #ffffff;
}
.sidebar.red #sidebarToggle {
    background-color: #f4433633;
}
.sidebar.red #sidebarToggle::after {
    color: #ffffff80;
}
.sidebar.red #sidebarToggle:hover {
    background-color: #ffffff40;
}
.sidebar.red.toggled #sidebarToggle::after {
    color: #ffffff80;
}
.sidebar.red .sidebar-card {
    color: #ffffff;
}
@media (min-width: 768px) {
    .sidebar.red .nav-item .nav-link[data-toggle=collapse].collapsed::after {
        font-family: "Material Design Icons";
        content: "\F035F";
        color: #ffffff80;
    }
    .sidebar.red .nav-item .nav-link[data-toggle="collapse"]::after {
        font-family: "Material Design Icons";
        content: "\F035D";
        color: #ffffff80;
    }
}

/* ==============================================
  SHADOW
=============================================== */
.red.shadow-sm-right {
    box-shadow: 0.125rem 0 0 #f443361A !important;
}

/* ==============================================
  STAR
=============================================== */
.red input.star:checked ~ label.star:before {
    color: #f44336 !important;
}

/* ==============================================
 STEPS
=============================================== */
.steps.red .step.active:before {
    color: #f44336;
}
.steps.red .step.active:before,
.steps.red .step.active:after {
    background: #f44336;
}

/* ==============================================
TABLE
=============================================== */
table.red td.highlight {
    color: #ffffff;
    background-color: #f4433680;
}
table.red th.highlight {
    color: #ffffff;
    background-color: #f44336A0;
}
th.highlight.red {
    color: #ffffff;
    background-color: #f44336A0;
}
td.highlight.red {
    color: #ffffff;
    background-color: #f4433680;
}

/* ==============================================
TABLE OF CONTENTS
=============================================== */
.table-of-contents.red a.hover,
.table-of-contents.red a:hover {
    border-left: 1px solid #f44336 !important;
}
.table-of-contents.red a.active {
    border-left: 2px solid #f44336 !important;
}

/* ==============================================
 TEXT
=============================================== */
.text-red {
    color: #f44336 !important;
}
.text-red.active,
.text-red:active {
    color: #e53935 !important;
}
.text-red.disabled,
.text-red:disabled {
    color: #f44336D9 !important;
}

/* ==============================================
 TOAST
=============================================== */
.toast.red {
    color: #ffffff !important;
    background-color: #f44336 !important;
}
.toast.red a,
.toast.red i {
    color: #ffffff !important;
}

/* ==============================================
 TOPBAR
=============================================== */
.topbar.red .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #f44336 !important;
    border: 1px solid #f44336 !important;
}
.topbar .dropdown.red .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #f44336 !important;
    border-color: #f44336 !important;
}
/* ==============================================
 A
=============================================== */
a.text-secondary {
    color: #faba1e;
}
a.text-secondary:hover {
    color: #dab663 !important;
}
a.text-secondary.active,
a.text-secondary:active {
    color: #dab663;
}
a.text-secondary.focus,
a.text-secondary:focus {
    color: #cfa94a !important;
}
a.text-secondary.disabled,
a.text-secondary:disabled {
    color: #faba1eD9;
}

/* ==============================================
 ALERT
=============================================== */
.alert.secondary {
    color: #ffffff;
    background-color: #cfa94a;
    border-color: #faba1e;
}
.alert.secondary hr {
    border-top-color: #ffffff;
}
.alert.secondary .alert-link {
    color: #ffffff;
}

/* ==============================================
 AUTOCOMPLETE
=============================================== */
.autocomplete.secondary .dropdown-item.active,
.autocomplete.secondary .dropdown-item:active {
    color: #ffffff;
    text-decoration: none;
    background-color: #faba1e;
}

/* ==============================================
 BADGE
=============================================== */
.badge.secondary {
    color: #ffffff;
    background-color: #faba1e;
}
a.badge.secondary:hover,
a.badge.secondary:hover {
    color: #ffffff;
    background-color: #d09b19;
}
.badge.secondary a {
    color: #ffffff !important;
}
.badge.secondary a.hover,
.badge.secondary a:hover {
    color: #ffffff !important;
}
a.badge.secondary.focus,
a.badge.secondary:focus {
    box-shadow: 0 0 0 0.2rem #faba1e80;
}
.badge-avatar.secondary {
    border-color: #faba1e;
}

/* ==============================================
 BACKGROUND
=============================================== */
.bg-secondary {
    background-color: #faba1e !important;
}
.bg-secondary-lighten {
    background-color: #faba1e88 !important;
}
a.bg-secondary:focus,
a.bg-secondary:hover,
button.bg-secondary:focus,
button.bg-secondary:hover {
    background-color: #d09b19 !important;
}
.bg-gradient-secondary {
    background-color: #faba1e;
    background-image: linear-gradient(180deg, #faba1e 10%, #faba1e 100%);
}
.bg-secondary,
.bg-secondary.text-secondary,
.bg-secondary-lighten,
.bg-secondary-lighten.text-secondary,
.bg-gradient-secondary,
.bg-gradient-secondary.text-secondary {
    color: #ffffff !important;
}

/* ==============================================
 BORDER
=============================================== */
.border-secondary {
    border: 0.25rem solid #faba1e !important;
}
.border-top-secondary {
    border-top: 0.25rem solid #faba1e !important;
}
.border-right-secondary {
    border-right: 0.25rem solid #faba1e !important;
}
.border-bottom-secondary {
    border-bottom: 0.25rem solid #faba1e !important;
}
.border-left-secondary {
    border-left: 0.25rem solid #faba1e !important;
}
.border-thin-secondary {
    border: 1px solid #faba1e !important;
}
.border-top-thin-secondary {
    border-top: 1px solid #faba1e !important;
}
.border-right-thin-secondary {
    border-right: 1px solid #faba1e !important;
}
.border-bottom-thin-secondary {
    border-bottom: 1px solid #faba1e !important;
}
.border-left-thin-secondary {
    border-left: 3px solid #faba1e !important;
}
.border-thick-secondary {
    border: 3px solid #faba1e !important;
}
.border-top-thick-secondary {
    border-top: 3px solid #faba1e !important;
}
.border-right-thick-secondary {
    border-right: 3px solid #faba1e !important;
}
.border-bottom-thick-secondary {
    border-bottom: 3px solid #faba1e !important;
}
.border-left-thick-secondary {
    border-left: 3px solid #faba1e !important;
}

/* ==============================================
 BUTTON
=============================================== */
.btn.secondary.focus,
.btn.secondary:focus {
    box-shadow: 0 0 0 0.2rem #faba1e40;
}
.btn.secondary {
    color: #ffffff;
    background-color: #faba1e;
    border-color: #faba1e;
}
.btn.secondary.hover,
.btn.secondary:hover {
    color: #ffffff;
    background-color: #faba1e;
    border-color: #d09b19;
}
.btn.secondary.focus,
.btn.secondary:focus {
    color: #ffffff;
    background-color: #faba1e;
    border-color: #d09b19;
    box-shadow: 0 0 0 0.2rem #faba1e80;
}
.btn.secondary.disabled,
.btn.secondary:disabled {
    color: #ffffff;
    background-color: #faba1e;
    border-color: #faba1e;
}
.btn.secondary:not(:disabled):not(.disabled).active,
.btn.secondary:not(:disabled):not(.disabled):active,
.show > .btn.secondary.dropdown-toggle {
    color: #ffffff;
    background-color: #d09b19;
    border-color: #faba1e;
}
.btn.secondary:not(:disabled):not(.disabled).active:focus,
.btn.secondary:not(:disabled):not(.disabled):active:focus,
.show > .btn.secondary.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem #faba1e80;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.secondary {
    color: #faba1e;
    background-color: #ffffff;
    border-color: #faba1e;
}
.btn-outline.secondary:hover {
    color: #faba1e;
    background-color: #ffffff;
    border-color: #faba1e;
}
.btn-outline.secondary.focus,
.btn-outline.secondary:focus {
    color: #faba1e;
    background-color: #ffffff;
    border-color: #faba1e;
    box-shadow: 0 0 0 0.2rem #faba1e80;
}
.btn-outline.secondary.disabled, .btn-outline.secondary:disabled {
    color: #faba1e;
    background-color: #ffffff;
    border-color: #cfa94a;
}
.btn-outline.secondary:not(:disabled):not(.disabled).active,
.btn-outline.secondary:not(:disabled):not(.disabled):active,
.show > .btn-outline.secondary.dropdown-toggle {
    color: #faba1e;
    background-color: #ffffff;
    border-color: #faba1e;
}
.btn-outline.secondary:not(:disabled):not(.disabled).active:focus,
.btn-outline.secondary:not(:disabled):not(.disabled):active:focus,
.show > .btn-outline.secondary.dropdown-toggle:focus {
    color: #d09b19;
    background-color: #ffffff;
    border-color: #d09b19;
    box-shadow: 0 0 0 0.2rem #faba1e80;
}
.btn-outline.secondary:not(:disabled):not(.disabled).active:hover,
.btn-outline.secondary:not(:disabled):not(.disabled):active:hover,
.show > .btn-outline.secondary.dropdown-toggle:hover {
    color: #d09b19;
    background-color: #ffffff;
    border-color: #d09b19;
    box-shadow: 0 0 0 0.2rem #faba1eBF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.secondary > .btn-secondary.active {
    color: #ffffff;
    background-color: #faba1e;
    border-color: #d09b19;
}

.btn-group.secondary .btn-outline:not(:active):not(.active) {
    color: #faba1e;
    border-color: #faba1e;
}
.btn-group.secondary .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.secondary .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #faba1e !important;
    border-color: #faba1e;
}
.btn-group.secondary .btn-outline:not(:disabled):not(.disabled).active:focus,
.btn-group.secondary .btn-outline:not(:disabled):not(.disabled):active:focus {
    color: #ffffff;
    background-color: #d09b19 !important;
    border-color: #d09b19;
    box-shadow: 0 0 0 0.2rem #faba1e80;
}
.btn-group.secondary .btn-outline:not(:disabled):not(.disabled).active:hover,
.btn-group.secondary .btn-outline:not(:disabled):not(.disabled):active:hover {
    color: #ffffff;
    background-color: #d09b19 !important;
    border-color: #d09b19;
    box-shadow: 0 0 0 0.2rem #faba1eBF;
}

/* ==============================================
 BUTTON LINK
=============================================== */
.btn-link.secondary {
    color: #faba1e;
}
.btn-link.secondary.hover,
.btn-link.secondary:hover {
    color: #dab663;
}
.btn-link.secondary.disabled,
.btn-link.secondary:disabled {
    color: #dab663;
}

/* ==============================================
BREADCRUMBS
=============================================== */
.breadcrumb.secondary .breadcrumb-item a {
    color: #faba1e;
}
.breadcrumb.secondary .breadcrumb-item a:hover {
    text-decoration: underline;
}
.navbar.secondary .breadcrumb .breadcrumb-item a {
    color: #ffffff;
}
.navbar.secondary .breadcrumb .breadcrumb-item a:hover {
    text-decoration: underline;
}
.navbar.secondary .breadcrumb .breadcrumb-item.active {
    color: #ffffffB3;
    text-decoration: none;
}
.navbar.secondary .breadcrumb .breadcrumb-item+.breadcrumb-item::before {
    color: #ffffffB3;
}

/* ==============================================
 CARD
=============================================== */
.card.secondary {
    color: #ffffff !important;
    background-color: #faba1e !important;
}
.card.secondary a,
.card.secondary p,
.card.secondary i,
.card.secondary em,
.card.secondary strong {
    color: #ffffff !important;
}

/* ==============================================
 CHECKBOX
=============================================== */
.custom-checkbox.secondary .custom-control-input:indeterminate ~ .custom-control-label::before {
    border-color: #faba1e;
    background-color: #faba1e;
}
.custom-checkbox.secondary .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #faba1e4D;
}
.custom-checkbox.secondary .custom-control-input:disabled:indeterminate ~ .custom-control-label::before {
    background-color: #faba1e4D;
}

/* ==============================================
 CUSTOM CONTROL
=============================================== */
.custom-control.secondary .custom-control-input:checked ~ .custom-control-label::before {
    color: #ffffff;
    border-color: #ffffff;
    background-color: #faba1e;
}
.custom-control.secondary .custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: 0 0 0.2rem #faba1e40;
}
.custom-control.secondary .custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
    border-color: #bac8f3;
}
.custom-control.secondary .custom-control-input:disabled ~ .custom-control-label,
.custom-control-input[disabled] ~ .custom-control-label {
    color: #858796;
}

/* ==============================================
 CUSTOM RADIO
=============================================== */
.custom-radio.secondary .custom-control-label:before {
    background-color: #ffffff;
}
.custom-radio.secondary .custom-control-input:checked~.custom-control-label::before {
    border-color: #ffffff;
    background-color: #faba1e;
}
.custom-radio.secondary .custom-control-input:disabled~.custom-control-label::before {
    background-color: #faba1e4D;
}
.custom-radio.secondary .custom-control-input:focus~.custom-control-label::before {
    box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem #faba1e66;
}
.custom-radio.secondary .custom-control-input:checked~.custom-control-label::after {
    color: #faba1e;
}

/* ==============================================
 CUSTOM RANGE
=============================================== */
.secondary .custom-range:focus::-webkit-slider-thumb {
    box-shadow: 0 0 0 1px #faba1e, 0 0 0.2rem #faba1e40;
}
.secondary .custom-range:focus::-moz-range-thumb {
    box-shadow: 0 0 0 1px #faba1e, 0 0 0.2rem #faba1e40;
}
.secondary .custom-range:focus::-ms-thumb {
    box-shadow: 0 0 0 1px #faba1e, 0 0 0.2rem #faba1e40;
}
.secondary .custom-range::-webkit-slider-thumb {
    background-color: #faba1e;
    appearance: none;
}
.secondary .custom-range::-moz-range-thumb {
    background-color: #faba1e;
}
.secondary .custom-range::-ms-thumb {
    background-color: #faba1e;
}

/* ==============================================
 CUSTOM SWITCH
=============================================== */
.custom-switch.secondary .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #faba1e80;
}

/* ==============================================
 DATEPICKER
=============================================== */
.datepicker.secondary .datepicker-header {
    color: #ffffff;
    background-color: #faba1e;
}
.datepicker.secondary .datepicker-content .active {
    color: #ffffff;
    background-color: #faba1e;
}
.datepicker.secondary .datepicker-controls .form-control:focus,
.datepicker.secondary .datepicker-controls .form-control.focus {
    box-shadow: 0 0 0 0.2rem #faba1e0A !important;
}

/* ==============================================
 DROPDOWN
=============================================== */
.dropdown-item.secondary.active,
.dropdown-item.secondary:active {
    color: #ffffff;
    background-color: #faba1e;
}
.dropdown-item.secondary.disabled,
.dropdown-item.secondary:disabled {
    color: #faba1e4D;
}
.dropdown.secondary .dropdown-item.active,
.dropdown.secondary .dropdown-item:active {
    color: #ffffff !important;
    background-color: #faba1eE6 !important;
}
.dropdown.secondary .dropdown-item:active .text-secondary {
    color: #ffffff !important;
}
.dropdown.secondary .dropdown-item.focus,
.dropdown.secondary .dropdown-item:focus {
    color: #ffffff !important;
    background-color: #faba1eE6 !important;
}
.dropdown.secondary .dropdown-item:focus .text-secondary {
    color: #ffffff !important;
}
.dropdown.secondary .dropdown-item.hover,
.dropdown.secondary .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #faba1eCC !important;
}
.dropdown.secondary .dropdown-item:hover .text-secondary {
    color: #ffffff !important;
}

/* ==============================================
 ERROR
=============================================== */
.error.secondary:before {
    text-shadow: 1px 0 #faba1e;
    color: #dab663;
    background: #f8f9fc;
}

/* ==============================================
 HR
=============================================== */
hr.secondary {
    border-top: 1px solid #faba1e1a;
}

/* ==============================================
 ICONS
=============================================== */
.mdi-secondary {
    color: #faba1e;
}

/* ==============================================
INPUT
=============================================== */
.input-field.secondary .form-control:focus,
.form-control.secondary:focus {
    box-shadow: 0 0 0 0.1rem #faba1e40 !important;
}

/* ==============================================
 JUMBOTRON
=============================================== */
.jumbotron.secondary {
    color: #ffffff;
    background-color: #faba1e;
}
.jumbotron.secondary a,
.jumbotron.secondary p,
.jumbotron.secondary i,
.jumbotron.secondary em,
.jumbotron.secondary strong {
    color: #ffffff;
}

/* ==============================================
 LIST GROUP
=============================================== */
.list-group-item.secondary,
.list-group.secondary .list-group-item {
    color: #ffffff;
    background-color: #faba1e !important;
}
.list-group.secondary .list-group-item:focus,
.list-group.secondary .list-group-item:hover,
.list-group-item.secondary.list-group-item:focus,
.list-group-item.secondary.list-group-item:hover {
    color: #ffffff;
    background-color: #cfa94a !important;
}
.list-group.secondary .list-group-item.list-group-item-action:focus,
.list-group.secondary .list-group-item.list-group-item-action:hover,
.list-group-item.secondary.list-group-item-action:focus,
.list-group-item.secondary.list-group-item-action:hover {
    color: #ffffff;
    background-color: #cfa94a !important;
}
.list-group.secondary .list-group-item.active,
.list-group-item.secondary.active {
    color: #ffffff;
    background-color: #d09b19 !important;
    border-color: #d09b19;
}
.list-group.secondary .list-group-item.disabled,
.list-group-item.secondary.disabled {
    color: #ffffff;
    background-color: #dab663A9 !important;
}

/* ==============================================
 LOADING
=============================================== */
.loading.secondary .spinner-border {
    color: #faba1e !important;
}

/* ==============================================
 MODAL
=============================================== */
.modal-header.secondary {
    background-color: #faba1e;
    color: #ffffff;
}
.modal-header.secondary a {
    color: #ffffff;
}
.modal-header.text-secondary .modal-title,
.modal-header.text-secondary a {
    color: #faba1e;
}
.modal .nav-tabs.bg-secondary {
    background-color: #faba1e !important;
    color: #ffffff !important;
    border: 1px solid #faba1e !important;
}
.modal .nav-tabs.bg-secondary .nav-link {
    border: 1px solid #faba1e !important;
}
.modal .nav-tabs.bg-secondary .nav-link:hover,
.modal .nav-tabs.bg-secondary .nav-link.hover,
.modal .nav-tabs.bg-secondary .nav-link:active,
.modal .nav-tabs.bg-secondary .nav-link.active {
    text-decoration: underline !important;
}

/* ==============================================
 NAV
=============================================== */
.nav.secondary {
    color: #faba1e;
}
.nav.secondary .nav-link {
    color: #faba1e;
}
.nav.secondary .nav-link.disabled {
    color: #faba1e80 !important;
}
.nav.secondary .nav-link.bordered {
    border: 1px solid #faba1e;
}

.nav-link.secondary a {
    color: #faba1e;
}
.nav-link.secondary.disabled {
    color: #faba1e4D;
}

.nav.bg-secondary,
.nav.bg-secondary .nav-link,
.nav.bg-secondary .nav-link.active {
    background-color: #faba1e;
    color: #ffffff;
    border: 1px solid #d09b19;
}
.nav.bg-secondary .nav-link.active {
    text-decoration: underline;
}

/* ==============================================
 NAV VERTICAL
=============================================== */
.nav-vertical.secondary .nav-item a {
    color: #757575;
}
.nav-vertical.secondary .nav-item a:hover {
    border-left: 1px solid #faba1e !important;
}
.nav-vertical.secondary .nav-item a.active {
    border-left: 2px solid #faba1e !important;
}
.nav-vertical.secondary .nav-link.disabled {
    cursor: not-allowed;
    color: #faba1eBF !important;
}

/* ==============================================
 NAV PILLS
=============================================== */
.nav-pills.secondary a {
    color: #faba1e;
}
.nav-pills.secondary a.disabled {
    color: #faba1e80 !important;
}
.nav-pills.secondary .nav-link.active,
.nav-pills.secondary .show > .nav-link {
    color: #ffffff;
    background-color: #faba1e;
    border: 1px solid #faba1e;
}

.nav-pills .nav-item.secondary a {
    color: #faba1e;
}
.nav-pills .nav-item.secondary a.disabled {
    color: #faba1e80 !important;
}
.nav-pills .nav-item.secondary .nav-link.active,
.nav-pills .nav-item.secondary .show > .nav-link {
    color: #ffffff;
    background-color: #faba1e;
    border: 1px solid #faba1e;
}

/* ==============================================
NAV BORDER
=============================================== */
.nav-border-top.secondary {
    border-top: .15rem solid #faba1e !important;
}
.nav-border-top.white a {
    color: #faba1e;
}
.nav-border-right.secondary {
    border-right: .15rem solid #faba1e !important;
}
.nav-border-right.secondary a {
    color: #faba1e;
}
.nav-border-bottom.secondary {
    border-bottom: .15rem solid #faba1e !important;
}
.nav-border-bottom.secondary a {
    color: #faba1e;
}
.nav-border-left.secondary {
    border-left: .15rem solid #faba1e !important;
}
.nav-border-left.secondary a {
    color: #faba1e;
}

/* ==============================================
 NAVBAR
=============================================== */
.navbar.secondary {
    color: #ffffffE6 !important;
    background-color: #faba1e !important;
}
.navbar.secondary #sidebarToggleTop,
.navbar.secondary #sidebarToggleTop i {
    color: #ffffffE6 !important;
    background-color: #faba1e !important;
    border: none;
}
.navbar.secondary #sidebarToggleTop:active {
    border-color: #faba1eE6;
}
.navbar.secondary .navbar-brand {
    color: #ffffffE6;
}
.navbar.secondary .navbar-brand:hover,
.navbar.secondary .navbar-brand:focus {
    color: #ffffffE6;
}
.navbar.secondary .navbar-nav .nav-link {
    color: #ffffffE6;
}
.navbar.secondary .navbar-nav .nav-link:hover,
.navbar.secondary .navbar-nav .nav-link:focus {
    color: #ffffffCC;
}
.navbar.secondary .navbar-nav .nav-link.disabled {
    color: #ffffff4D;
}
.navbar.secondary .navbar-nav .show > .nav-link,
.navbar.secondary .navbar-nav .active > .nav-link,
.navbar.secondary .navbar-nav .nav-link.show,
.navbar.secondary .navbar-nav .nav-link.active {
    color: #ffffffE6;
}
.navbar.secondary .navbar-toggler {
    color: #ffffff80 !important;
    border-color: #faba1e1A;
}
.navbar.secondary .navbar-text {
    color: #ffffff80;
}
.navbar.secondary .navbar-text a {
    color: #ffffffE6;
}
.navbar.secondary .navbar-text a:hover,
.navbar.secondary .navbar-text a:focus {
    color: #ffffffE6;
}

/* ==============================================
 PAGINATION
=============================================== */
.pagination.secondary .page-link {
    color: #faba1e;
    border: 1px solid #dddfeb;
}
.pagination.secondary .page-link.hover,
.pagination.secondary .page-link:hover {
    color: #ffffff;
    background-color: #faba1eBF;
    border-color: #dddfeb;
}
.pagination.secondary .page-link.focus,
.pagination.secondary .page-link:focus {
    box-shadow: 0 0 0.2rem #faba1e40 !important;
}
.pagination.secondary .page-item.active .page-link {
    color: #ffffff;
    background-color: #faba1e;
    border-color: #faba1e;
}
.pagination.secondary .page-item.disabled .page-link,
.pagination.secondary .page-item:disabled .page-link {
    color: #858796;
    border-color: #dddfeb;
}

/* ==============================================
 PROGRESS
=============================================== */
.progress.secondary .progress-bar {
    color: #ffffff;
    background-color: #faba1e;
}

/* ==============================================
PULSE
=============================================== */
.pulse.mdi-secondary,
.pulse.secondary {
    box-shadow: 0 0 0 #faba1e66;
    animation: pulse-secondary 2s infinite;
}

@-webkit-keyframes pulse-secondary {
    0% {
        -webkit-box-shadow: 0 0 0 0 #faba1e66;
    }
    70% {
        -webkit-box-shadow: 0 0 0 10px #faba1e00;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 #faba1e00;
    }
}
@keyframes pulse-secondary {
    0% {
        -moz-box-shadow: 0 0 0 0 #faba1e66;
        box-shadow: 0 0 0 0 #faba1e66;
    }
    70% {
        -moz-box-shadow: 0 0 0 10px #faba1e00;
        box-shadow: 0 0 0 10px #faba1e00;
    }
    100% {
        -moz-box-shadow: 0 0 0 0 #faba1e00;
        box-shadow: 0 0 0 0 #faba1e00;
    }
}

/* ==============================================
 SELECT
=============================================== */
.secondary select option:checked,
.secondary select option:hover {
    box-shadow: 0 0 10px 100px #faba1e inset;
}
.secondary select:focus > option:checked {
    color: #ffffff !important;
    background-color: #faba1e40 !important;
}
.secondary .custom-select {
    color: #6e707e;
}
.secondary .custom-select:focus {
    border-color: #bac8f3;
    box-shadow: 0 0 0.2rem #faba1e40;
}
.secondary .custom-select:focus::-ms-value {
    color: #6e707e;
}
.secondary .custom-select:disabled {
    color: #858796;
    background-color: #eaecf4;
}

.secondary .bootstrap-select .dropdown-item.active,
.secondary .bootstrap-select .dropdown-item:active {
    color: #ffffff !important;
    background-color: #faba1e !important;
}
.secondary .bootstrap-select .dropdown-item.hover,
.secondary .bootstrap-select .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #faba1eBF !important;
}
.secondary .bootstrap-select.show-tick .dropdown-menu .selected span.check-mark {
    color: #faba1e;
}

/* ==============================================
 SIDEBAR
=============================================== */
.sidebar.secondary .nav-item .collapse .collapse-inner .collapse-item.active,
.sidebar.secondary .nav-item .collapsing .collapse-inner .collapse-item.active {
    color: #faba1e;
}
.sidebar.secondary {
    color: #ffffff;
    background-color: #faba1e;
}
.sidebar.secondary .sidebar-brand {
    color: #ffffff;
}
.sidebar.secondary hr.sidebar-divider {
    border-top: 1px solid #ffffff26;
}
.sidebar.secondary .sidebar-heading {
    color: #ffffff66;
}
.sidebar.secondary .nav-item .nav-link {
    color: #ffffffCC;
}
.sidebar.secondary .nav-item .nav-link a {
    color: #ffffffCC;
}
.sidebar.secondary .nav-item .nav-link i {
    color: #ffffff4D;
}
.sidebar.secondary .nav-item .nav-link:focus,
.sidebar.secondary .nav-item .nav-link:hover,
.sidebar.secondary .nav-item .nav-link:focus a,
.sidebar.secondary .nav-item .nav-link:hover a,
.sidebar.secondary .nav-item .nav-link:focus i,
.sidebar.secondary .nav-item .nav-link:hover i {
    color: #ffffff;
}

.sidebar.secondary .nav-item .nav-link:active,
.sidebar.secondary .nav-item .nav-link a:active,
.sidebar.secondary .nav-item .nav-link i:active {
    color: #ffffff;
}
.sidebar.secondary .nav-item .collapse .collapse-inner .collapse-item,
.sidebar.secondary .nav-item .collapsing .collapse-inner .collapse-item {
    color: #ffffffCC;
}
.sidebar.secondary .nav-item .collapse .collapse-inner .collapse-item a,
.sidebar.secondary .nav-item .collapsing .collapse-inner .collapse-item a {
    color: #ffffffCC;
}
.sidebar.secondary .nav-item .nav-link[data-toggle=collapse].collapsed::after {
    color: #ffffff80;
}
.sidebar.secondary .nav-item .nav-link[data-toggle="collapse"]::after {
    color: #ffffff80;
}
.sidebar.secondary .nav-item .collapse-inner .collapse-header {
    color: #ffffff80 !important;
}
.sidebar.secondary .nav-item .collapse .collapse-inner,
.sidebar.secondary .nav-item .collapsing .collapse-inner {
    color: #ffffffCC;
    background-color: #dab663;
}
.sidebar.secondary .nav-item .collapse .collapse-inner .collapse-item:active,
.sidebar.secondary .nav-item .collapsing .collapse-inner .collapse-item:active
.sidebar.secondary .nav-item .collapse .collapse-inner .collapse-item a:active,
.sidebar.secondary .nav-item .collapsing .collapse-inner .collapse-item a:active {
    color: #ffffffCC;
    opacity: 0.9;
    background-color: #dab663;
}
.sidebar.secondary .nav-item .collapse .collapse-inner .collapse-item:hover,
.sidebar.secondary .nav-item .collapsing .collapse-inner .collapse-item:hover,
.sidebar.secondary .nav-item .collapse .collapse-inner .collapse-item a:hover,
.sidebar.secondary .nav-item .collapsing .collapse-inner .collapse-item a:hover {
    color: #ffffff80;
    opacity: 0.9;
    background-color: #dab663;
}
.sidebar.secondary .nav-item.active .nav-link,
.sidebar.secondary .nav-item.active .nav-link a,
.sidebar.secondary .nav-item.active .nav-link i {
    color: #ffffff;
}
.sidebar.secondary #sidebarToggle {
    background-color: #faba1e33;
}
.sidebar.secondary #sidebarToggle::after {
    color: #ffffff80;
}
.sidebar.secondary #sidebarToggle:hover {
    background-color: #ffffff40;
}
.sidebar.secondary.toggled #sidebarToggle::after {
    color: #ffffff80;
}
.sidebar.secondary .sidebar-card {
    color: #ffffff;
}
@media (min-width: 768px) {
    .sidebar.secondary .nav-item .nav-link[data-toggle=collapse].collapsed::after {
        font-family: "Material Design Icons";
        content: "\F035F";
        color: #ffffff80;
    }
    .sidebar.secondary .nav-item .nav-link[data-toggle="collapse"]::after {
        font-family: "Material Design Icons";
        content: "\F035D";
        color: #ffffff80;
    }
}

/* ==============================================
  SHADOW
=============================================== */
.secondary.shadow-sm-right {
    box-shadow: 0.125rem 0 0 #faba1e1A !important;
}

/* ==============================================
  STAR
=============================================== */
.secondary input.star:checked ~ label.star:before {
    color: #faba1e !important;
}

/* ==============================================
 STEPS
=============================================== */
.steps.secondary .step.active:before {
    color: #faba1e;
}
.steps.secondary .step.active:before,
.steps.secondary .step.active:after {
    background: #faba1e;
}

/* ==============================================
TABLE
=============================================== */
table.secondary td.highlight {
    color: #ffffff;
    background-color: #faba1e80;
}
table.secondary th.highlight {
    color: #ffffff;
    background-color: #faba1eA0;
}
th.highlight.secondary {
    color: #ffffff;
    background-color: #faba1eA0;
}
td.highlight.secondary {
    color: #ffffff;
    background-color: #faba1e80;
}

/* ==============================================
TABLE OF CONTENTS
=============================================== */
.table-of-contents.secondary a.hover,
.table-of-contents.secondary a:hover {
    border-left: 1px solid #faba1e !important;
}
.table-of-contents.secondary a.active {
    border-left: 2px solid #faba1e !important;
}

/* ==============================================
 TEXT
=============================================== */
.text-secondary {
    color: #faba1e !important;
}
.text-secondary.active,
.text-secondary:active {
    color: #dab663 !important;
}
.text-secondary.disabled,
.text-secondary:disabled {
    color: #faba1eD9 !important;
}

/* ==============================================
 TOAST
=============================================== */
.toast.secondary {
    color: #ffffff !important;
    background-color: #faba1e !important;
}
.toast.secondary a,
.toast.secondary i {
    color: #ffffff !important;
}

/* ==============================================
 TOPBAR
=============================================== */
.topbar.secondary .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #faba1e !important;
    border: 1px solid #faba1e !important;
}
.topbar .dropdown.secondary .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #faba1e !important;
    border-color: #faba1e !important;
}
/* ==============================================
 A
=============================================== */
a.text-yellow {
    color: #faba1e;
}
a.text-yellow:hover {
    color: #dab663 !important;
}
a.text-yellow.active,
a.text-yellow:active {
    color: #dab663;
}
a.text-yellow.focus,
a.text-yellow:focus {
    color: #d09b19 !important;
}
a.text-yellow.disabled,
a.text-yellow:disabled {
    color: #faba1eD9;
}

/* ==============================================
 ALERT
=============================================== */
.alert.yellow {
    color: #ffffff;
    background-color: #d09b19;
    border-color: #faba1e;
}
.alert.yellow hr {
    border-top-color: #ffffff;
}
.alert.yellow .alert-link {
    color: #ffffff;
}

/* ==============================================
 AUTOCOMPLETE
=============================================== */
.autocomplete.yellow .dropdown-item.active,
.autocomplete.yellow .dropdown-item:active {
    color: #ffffff;
    text-decoration: none;
    background-color: #faba1e;
}

/* ==============================================
 BADGE
=============================================== */
.badge.yellow {
    color: #ffffff;
    background-color: #faba1e;
}
a.badge.yellow:hover,
a.badge.yellow:hover {
    color: #ffffff;
    background-color: #d09b19;
}
.badge.yellow a {
    color: #ffffff !important;
}
.badge.yellow a.hover,
.badge.yellow a:hover {
    color: #ffffff !important;
}
a.badge.yellow.focus,
a.badge.yellow:focus {
    box-shadow: 0 0 0 0.2rem #faba1e80;
}
.badge-avatar.yellow {
    border-color: #faba1e;
}

/* ==============================================
 BACKGROUND
=============================================== */
.bg-yellow {
    background-color: #faba1e !important;
}
.bg-yellow-lighten {
    background-color: #faba1e88 !important;
}
a.bg-yellow:focus,
a.bg-yellow:hover,
button.bg-yellow:focus,
button.bg-yellow:hover {
    background-color: #d09b19 !important;
}
.bg-gradient-yellow {
    background-color: #faba1e;
    background-image: linear-gradient(180deg, #faba1e 10%, #faba1e 100%);
}
.bg-yellow,
.bg-yellow.text-yellow,
.bg-yellow-lighten,
.bg-yellow-lighten.text-yellow,
.bg-gradient-yellow,
.bg-gradient-yellow.text-yellow {
    color: #ffffff !important;
}

/* ==============================================
 BORDER
=============================================== */
.border-yellow {
    border: 0.25rem solid #faba1e !important;
}
.border-top-yellow {
    border-top: 0.25rem solid #faba1e !important;
}
.border-right-yellow {
    border-right: 0.25rem solid #faba1e !important;
}
.border-bottom-yellow {
    border-bottom: 0.25rem solid #faba1e !important;
}
.border-left-yellow {
    border-left: 0.25rem solid #faba1e !important;
}
.border-thin-yellow {
    border: 1px solid #faba1e !important;
}
.border-top-thin-yellow {
    border-top: 1px solid #faba1e !important;
}
.border-right-thin-yellow {
    border-right: 1px solid #faba1e !important;
}
.border-bottom-thin-yellow {
    border-bottom: 1px solid #faba1e !important;
}
.border-left-thin-yellow {
    border-left: 3px solid #faba1e !important;
}
.border-thick-yellow {
    border: 3px solid #faba1e !important;
}
.border-top-thick-yellow {
    border-top: 3px solid #faba1e !important;
}
.border-right-thick-yellow {
    border-right: 3px solid #faba1e !important;
}
.border-bottom-thick-yellow {
    border-bottom: 3px solid #faba1e !important;
}
.border-left-thick-yellow {
    border-left: 3px solid #faba1e !important;
}

/* ==============================================
 BUTTON
=============================================== */
.btn.yellow.focus,
.btn.yellow:focus {
    box-shadow: 0 0 0 0.2rem #faba1e40;
}
.btn.yellow {
    color: #ffffff;
    background-color: #faba1e;
    border-color: #faba1e;
}
.btn.yellow.hover,
.btn.yellow:hover {
    color: #ffffff;
    background-color: #faba1e;
    border-color: #d09b19;
}
.btn.yellow.focus,
.btn.yellow:focus {
    color: #ffffff;
    background-color: #faba1e;
    border-color: #d09b19;
    box-shadow: 0 0 0 0.2rem #faba1e80;
}
.btn.yellow.disabled,
.btn.yellow:disabled {
    color: #ffffff;
    background-color: #faba1e;
    border-color: #faba1e;
}
.btn.yellow:not(:disabled):not(.disabled).active,
.btn.yellow:not(:disabled):not(.disabled):active,
.show > .btn.yellow.dropdown-toggle {
    color: #ffffff;
    background-color: #d09b19;
    border-color: #faba1e;
}
.btn.yellow:not(:disabled):not(.disabled).active:focus,
.btn.yellow:not(:disabled):not(.disabled):active:focus,
.show > .btn.yellow.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem #faba1e80;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.yellow {
    color: #faba1e;
    background-color: #ffffff;
    border-color: #faba1e;
}
.btn-outline.yellow:hover {
    color: #faba1e;
    background-color: #ffffff;
    border-color: #faba1e;
}
.btn-outline.yellow.focus,
.btn-outline.yellow:focus {
    color: #faba1e;
    background-color: #ffffff;
    border-color: #faba1e;
    box-shadow: 0 0 0 0.2rem #faba1e80;
}
.btn-outline.yellow.disabled, .btn-outline.yellow:disabled {
    color: #faba1e;
    background-color: #ffffff;
    border-color: #d09b19;
}
.btn-outline.yellow:not(:disabled):not(.disabled).active,
.btn-outline.yellow:not(:disabled):not(.disabled):active,
.show > .btn-outline.yellow.dropdown-toggle {
    color: #faba1e;
    background-color: #ffffff;
    border-color: #faba1e;
}
.btn-outline.yellow:not(:disabled):not(.disabled).active:focus,
.btn-outline.yellow:not(:disabled):not(.disabled):active:focus,
.show > .btn-outline.yellow.dropdown-toggle:focus {
    color: #d09b19;
    background-color: #ffffff;
    border-color: #d09b19;
    box-shadow: 0 0 0 0.2rem #faba1e80;
}
.btn-outline.yellow:not(:disabled):not(.disabled).active:hover,
.btn-outline.yellow:not(:disabled):not(.disabled):active:hover,
.show > .btn-outline.yellow.dropdown-toggle:hover {
    color: #d09b19;
    background-color: #ffffff;
    border-color: #d09b19;
    box-shadow: 0 0 0 0.2rem #faba1eBF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.yellow > .btn-yellow.active {
    color: #ffffff;
    background-color: #faba1e;
    border-color: #d09b19;
}

.btn-group.yellow .btn-outline:not(:active):not(.active) {
    color: #faba1e;
    border-color: #faba1e;
}
.btn-group.yellow .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.yellow .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #faba1e !important;
    border-color: #faba1e;
}
.btn-group.yellow .btn-outline:not(:disabled):not(.disabled).active:focus,
.btn-group.yellow .btn-outline:not(:disabled):not(.disabled):active:focus {
    color: #ffffff;
    background-color: #d09b19 !important;
    border-color: #d09b19;
    box-shadow: 0 0 0 0.2rem #faba1e80;
}
.btn-group.yellow .btn-outline:not(:disabled):not(.disabled).active:hover,
.btn-group.yellow .btn-outline:not(:disabled):not(.disabled):active:hover {
    color: #ffffff;
    background-color: #d09b19 !important;
    border-color: #d09b19;
    box-shadow: 0 0 0 0.2rem #faba1eBF;
}

/* ==============================================
 BUTTON LINK
=============================================== */
.btn-link.yellow {
    color: #faba1e;
}
.btn-link.yellow.hover,
.btn-link.yellow:hover {
    color: #dab663;
}
.btn-link.yellow.disabled,
.btn-link.yellow:disabled {
    color: #dab663;
}

/* ==============================================
BREADCRUMBS
=============================================== */
.breadcrumb.yellow .breadcrumb-item a {
    color: #faba1e;
}
.breadcrumb.yellow .breadcrumb-item a:hover {
    text-decoration: underline;
}
.navbar.yellow .breadcrumb .breadcrumb-item a {
    color: #ffffff;
}
.navbar.yellow .breadcrumb .breadcrumb-item a:hover {
    text-decoration: underline;
}
.navbar.yellow .breadcrumb .breadcrumb-item.active {
    color: #ffffffB3;
    text-decoration: none;
}
.navbar.yellow .breadcrumb .breadcrumb-item+.breadcrumb-item::before {
    color: #ffffffB3;
}

/* ==============================================
 CARD
=============================================== */
.card.yellow {
    color: #ffffff !important;
    background-color: #faba1e !important;
}
.card.yellow a,
.card.yellow p,
.card.yellow i,
.card.yellow em,
.card.yellow strong {
    color: #ffffff !important;
}

/* ==============================================
 CHECKBOX
=============================================== */
.custom-checkbox.yellow .custom-control-input:indeterminate ~ .custom-control-label::before {
    border-color: #faba1e;
    background-color: #faba1e;
}
.custom-checkbox.yellow .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #faba1e4D;
}
.custom-checkbox.yellow .custom-control-input:disabled:indeterminate ~ .custom-control-label::before {
    background-color: #faba1e4D;
}

/* ==============================================
 CUSTOM CONTROL
=============================================== */
.custom-control.yellow .custom-control-input:checked ~ .custom-control-label::before {
    color: #ffffff;
    border-color: #ffffff;
    background-color: #faba1e;
}
.custom-control.yellow .custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: 0 0 0.2rem #faba1e40;
}
.custom-control.yellow .custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
    border-color: #bac8f3;
}
.custom-control.yellow .custom-control-input:disabled ~ .custom-control-label,
.custom-control-input[disabled] ~ .custom-control-label {
    color: #858796;
}

/* ==============================================
 CUSTOM RADIO
=============================================== */
.custom-radio.yellow .custom-control-label:before {
    background-color: #ffffff;
}
.custom-radio.yellow .custom-control-input:checked~.custom-control-label::before {
    border-color: #ffffff;
    background-color: #faba1e;
}
.custom-radio.yellow .custom-control-input:disabled~.custom-control-label::before {
    background-color: #faba1e4D;
}
.custom-radio.yellow .custom-control-input:focus~.custom-control-label::before {
    box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem #faba1e66;
}
.custom-radio.yellow .custom-control-input:checked~.custom-control-label::after {
    color: #faba1e;
}

/* ==============================================
 CUSTOM RANGE
=============================================== */
.yellow .custom-range:focus::-webkit-slider-thumb {
    box-shadow: 0 0 0 1px #faba1e, 0 0 0.2rem #faba1e40;
}
.yellow .custom-range:focus::-moz-range-thumb {
    box-shadow: 0 0 0 1px #faba1e, 0 0 0.2rem #faba1e40;
}
.yellow .custom-range:focus::-ms-thumb {
    box-shadow: 0 0 0 1px #faba1e, 0 0 0.2rem #faba1e40;
}
.yellow .custom-range::-webkit-slider-thumb {
    background-color: #faba1e;
    appearance: none;
}
.yellow .custom-range::-moz-range-thumb {
    background-color: #faba1e;
}
.yellow .custom-range::-ms-thumb {
    background-color: #faba1e;
}

/* ==============================================
 CUSTOM SWITCH
=============================================== */
.custom-switch.yellow .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #faba1e80;
}

/* ==============================================
 DATEPICKER
=============================================== */
.datepicker.yellow .datepicker-header {
    color: #ffffff;
    background-color: #faba1e;
}
.datepicker.yellow .datepicker-content .active {
    color: #ffffff;
    background-color: #faba1e;
}
.datepicker.yellow .datepicker-controls .form-control:focus,
.datepicker.yellow .datepicker-controls .form-control.focus {
    box-shadow: 0 0 0 0.2rem #faba1e0A !important;
}

/* ==============================================
 DROPDOWN
=============================================== */
.dropdown-item.yellow.active,
.dropdown-item.yellow:active {
    color: #ffffff;
    background-color: #faba1e;
}
.dropdown-item.yellow.disabled,
.dropdown-item.yellow:disabled {
    color: #faba1e4D;
}
.dropdown.yellow .dropdown-item.active,
.dropdown.yellow .dropdown-item:active {
    color: #ffffff !important;
    background-color: #faba1eE6 !important;
}
.dropdown.yellow .dropdown-item:active .text-yellow {
    color: #ffffff !important;
}
.dropdown.yellow .dropdown-item.focus,
.dropdown.yellow .dropdown-item:focus {
    color: #ffffff !important;
    background-color: #faba1eE6 !important;
}
.dropdown.yellow .dropdown-item:focus .text-yellow {
    color: #ffffff !important;
}
.dropdown.yellow .dropdown-item.hover,
.dropdown.yellow .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #faba1eCC !important;
}
.dropdown.yellow .dropdown-item:hover .text-yellow {
    color: #ffffff !important;
}

/* ==============================================
 ERROR
=============================================== */
.error.yellow:before {
    text-shadow: 1px 0 #faba1e;
    color: #dab663;
    background: #f8f9fc;
}

/* ==============================================
 HR
=============================================== */
hr.yellow {
    border-top: 1px solid #faba1e1a;
}

/* ==============================================
 ICONS
=============================================== */
.mdi-yellow {
    color: #faba1e;
}

/* ==============================================
INPUT
=============================================== */
.input-field.yellow .form-control:focus,
.form-control.yellow:focus {
    box-shadow: 0 0 0 0.1rem #faba1e40 !important;
}

/* ==============================================
 JUMBOTRON
=============================================== */
.jumbotron.yellow {
    color: #ffffff;
    background-color: #faba1e;
}
.jumbotron.yellow a,
.jumbotron.yellow p,
.jumbotron.yellow i,
.jumbotron.yellow em,
.jumbotron.yellow strong {
    color: #ffffff;
}

/* ==============================================
 LIST GROUP
=============================================== */
.list-group-item.yellow,
.list-group.yellow .list-group-item {
    color: #ffffff;
    background-color: #faba1e !important;
}
.list-group.yellow .list-group-item:focus,
.list-group.yellow .list-group-item:hover,
.list-group-item.yellow.list-group-item:focus,
.list-group-item.yellow.list-group-item:hover {
    color: #ffffff;
    background-color: #d09b19 !important;
}
.list-group.yellow .list-group-item.list-group-item-action:focus,
.list-group.yellow .list-group-item.list-group-item-action:hover,
.list-group-item.yellow.list-group-item-action:focus,
.list-group-item.yellow.list-group-item-action:hover {
    color: #ffffff;
    background-color: #d09b19 !important;
}
.list-group.yellow .list-group-item.active,
.list-group-item.yellow.active {
    color: #ffffff;
    background-color: #d09b19 !important;
    border-color: #d09b19;
}
.list-group.yellow .list-group-item.disabled,
.list-group-item.yellow.disabled {
    color: #ffffff;
    background-color: #dab663A9 !important;
}

/* ==============================================
 LOADING
=============================================== */
.loading.yellow .spinner-border {
    color: #faba1e !important;
}

/* ==============================================
 MODAL
=============================================== */
.modal-header.yellow {
    background-color: #faba1e;
    color: #ffffff;
}
.modal-header.yellow a {
    color: #ffffff;
}
.modal-header.text-yellow .modal-title,
.modal-header.text-yellow a {
    color: #faba1e;
}
.modal .nav-tabs.bg-yellow {
    background-color: #faba1e !important;
    color: #ffffff !important;
    border: 1px solid #faba1e !important;
}
.modal .nav-tabs.bg-yellow .nav-link {
    border: 1px solid #faba1e !important;
}
.modal .nav-tabs.bg-yellow .nav-link:hover,
.modal .nav-tabs.bg-yellow .nav-link.hover,
.modal .nav-tabs.bg-yellow .nav-link:active,
.modal .nav-tabs.bg-yellow .nav-link.active {
    text-decoration: underline !important;
}

/* ==============================================
 NAV
=============================================== */
.nav.yellow {
    color: #faba1e;
}
.nav.yellow .nav-link {
    color: #faba1e;
}
.nav.yellow .nav-link.disabled {
    color: #faba1e80 !important;
}
.nav.yellow .nav-link.bordered {
    border: 1px solid #faba1e;
}

.nav-link.yellow a {
    color: #faba1e;
}
.nav-link.yellow.disabled {
    color: #faba1e4D;
}

.nav.bg-yellow,
.nav.bg-yellow .nav-link,
.nav.bg-yellow .nav-link.active {
    background-color: #faba1e;
    color: #ffffff;
    border: 1px solid #d09b19;
}
.nav.bg-yellow .nav-link.active {
    text-decoration: underline;
}

/* ==============================================
 NAV VERTICAL
=============================================== */
.nav-vertical.yellow .nav-item a {
    color: #757575;
}
.nav-vertical.yellow .nav-item a:hover {
    border-left: 1px solid #faba1e !important;
}
.nav-vertical.yellow .nav-item a.active {
    border-left: 2px solid #faba1e !important;
}
.nav-vertical.yellow .nav-link.disabled {
    cursor: not-allowed;
    color: #faba1eBF !important;
}

/* ==============================================
 NAV PILLS
=============================================== */
.nav-pills.yellow a {
    color: #faba1e;
}
.nav-pills.yellow a.disabled {
    color: #faba1e80 !important;
}
.nav-pills.yellow .nav-link.active,
.nav-pills.yellow .show > .nav-link {
    color: #ffffff;
    background-color: #faba1e;
    border: 1px solid #faba1e;
}

.nav-pills .nav-item.yellow a {
    color: #faba1e;
}
.nav-pills .nav-item.yellow a.disabled {
    color: #faba1e80 !important;
}
.nav-pills .nav-item.yellow .nav-link.active,
.nav-pills .nav-item.yellow .show > .nav-link {
    color: #ffffff;
    background-color: #faba1e;
    border: 1px solid #faba1e;
}

/* ==============================================
NAV BORDER
=============================================== */
.nav-border-top.yellow {
    border-top: .15rem solid #faba1e !important;
}
.nav-border-top.white a {
    color: #faba1e;
}
.nav-border-right.yellow {
    border-right: .15rem solid #faba1e !important;
}
.nav-border-right.yellow a {
    color: #faba1e;
}
.nav-border-bottom.yellow {
    border-bottom: .15rem solid #faba1e !important;
}
.nav-border-bottom.yellow a {
    color: #faba1e;
}
.nav-border-left.yellow {
    border-left: .15rem solid #faba1e !important;
}
.nav-border-left.yellow a {
    color: #faba1e;
}

/* ==============================================
 NAVBAR
=============================================== */
.navbar.yellow {
    color: #ffffffE6 !important;
    background-color: #faba1e !important;
}
.navbar.yellow #sidebarToggleTop,
.navbar.yellow #sidebarToggleTop i {
    color: #ffffffE6 !important;
    background-color: #faba1e !important;
    border: none;
}
.navbar.yellow #sidebarToggleTop:active {
    border-color: #faba1eE6;
}
.navbar.yellow .navbar-brand {
    color: #ffffffE6;
}
.navbar.yellow .navbar-brand:hover,
.navbar.yellow .navbar-brand:focus {
    color: #ffffffE6;
}
.navbar.yellow .navbar-nav .nav-link {
    color: #ffffffE6;
}
.navbar.yellow .navbar-nav .nav-link:hover,
.navbar.yellow .navbar-nav .nav-link:focus {
    color: #ffffffCC;
}
.navbar.yellow .navbar-nav .nav-link.disabled {
    color: #ffffff4D;
}
.navbar.yellow .navbar-nav .show > .nav-link,
.navbar.yellow .navbar-nav .active > .nav-link,
.navbar.yellow .navbar-nav .nav-link.show,
.navbar.yellow .navbar-nav .nav-link.active {
    color: #ffffffE6;
}
.navbar.yellow .navbar-toggler {
    color: #ffffff80 !important;
    border-color: #faba1e1A;
}
.navbar.yellow .navbar-text {
    color: #ffffff80;
}
.navbar.yellow .navbar-text a {
    color: #ffffffE6;
}
.navbar.yellow .navbar-text a:hover,
.navbar.yellow .navbar-text a:focus {
    color: #ffffffE6;
}

/* ==============================================
 PAGINATION
=============================================== */
.pagination.yellow .page-link {
    color: #faba1e;
    border: 1px solid #dddfeb;
}
.pagination.yellow .page-link.hover,
.pagination.yellow .page-link:hover {
    color: #ffffff;
    background-color: #faba1eBF;
    border-color: #dddfeb;
}
.pagination.yellow .page-link.focus,
.pagination.yellow .page-link:focus {
    box-shadow: 0 0 0.2rem #faba1e40 !important;
}
.pagination.yellow .page-item.active .page-link {
    color: #ffffff;
    background-color: #faba1e;
    border-color: #faba1e;
}
.pagination.yellow .page-item.disabled .page-link,
.pagination.yellow .page-item:disabled .page-link {
    color: #858796;
    border-color: #dddfeb;
}

/* ==============================================
 PROGRESS
=============================================== */
.progress.yellow .progress-bar {
    color: #ffffff;
    background-color: #faba1e;
}

/* ==============================================
PULSE
=============================================== */
.pulse.mdi-yellow,
.pulse.yellow {
    box-shadow: 0 0 0 #faba1e66;
    animation: pulse-yellow 2s infinite;
}

@-webkit-keyframes pulse-yellow {
    0% {
        -webkit-box-shadow: 0 0 0 0 #faba1e66;
    }
    70% {
        -webkit-box-shadow: 0 0 0 10px #faba1e00;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 #faba1e00;
    }
}
@keyframes pulse-yellow {
    0% {
        -moz-box-shadow: 0 0 0 0 #faba1e66;
        box-shadow: 0 0 0 0 #faba1e66;
    }
    70% {
        -moz-box-shadow: 0 0 0 10px #faba1e00;
        box-shadow: 0 0 0 10px #faba1e00;
    }
    100% {
        -moz-box-shadow: 0 0 0 0 #faba1e00;
        box-shadow: 0 0 0 0 #faba1e00;
    }
}

/* ==============================================
 SELECT
=============================================== */
.yellow select option:checked,
.yellow select option:hover {
    box-shadow: 0 0 10px 100px #faba1e inset;
}
.yellow select:focus > option:checked {
    color: #ffffff !important;
    background-color: #faba1e40 !important;
}
.yellow .custom-select {
    color: #6e707e;
}
.yellow .custom-select:focus {
    border-color: #bac8f3;
    box-shadow: 0 0 0.2rem #faba1e40;
}
.yellow .custom-select:focus::-ms-value {
    color: #6e707e;
}
.yellow .custom-select:disabled {
    color: #858796;
    background-color: #eaecf4;
}

.yellow .bootstrap-select .dropdown-item.active,
.yellow .bootstrap-select .dropdown-item:active {
    color: #ffffff !important;
    background-color: #faba1e !important;
}
.yellow .bootstrap-select .dropdown-item.hover,
.yellow .bootstrap-select .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #faba1eBF !important;
}
.yellow .bootstrap-select.show-tick .dropdown-menu .selected span.check-mark {
    color: #faba1e;
}

/* ==============================================
 SIDEBAR
=============================================== */
.sidebar.yellow .nav-item .collapse .collapse-inner .collapse-item.active,
.sidebar.yellow .nav-item .collapsing .collapse-inner .collapse-item.active {
    color: #faba1e;
}
.sidebar.yellow {
    color: #ffffff;
    background-color: #faba1e;
}
.sidebar.yellow .sidebar-brand {
    color: #ffffff;
}
.sidebar.yellow hr.sidebar-divider {
    border-top: 1px solid #ffffff26;
}
.sidebar.yellow .sidebar-heading {
    color: #ffffff66;
}
.sidebar.yellow .nav-item .nav-link {
    color: #ffffffCC;
}
.sidebar.yellow .nav-item .nav-link a {
    color: #ffffffCC;
}
.sidebar.yellow .nav-item .nav-link i {
    color: #ffffff4D;
}
.sidebar.yellow .nav-item .nav-link:focus,
.sidebar.yellow .nav-item .nav-link:hover,
.sidebar.yellow .nav-item .nav-link:focus a,
.sidebar.yellow .nav-item .nav-link:hover a,
.sidebar.yellow .nav-item .nav-link:focus i,
.sidebar.yellow .nav-item .nav-link:hover i {
    color: #ffffff;
}

.sidebar.yellow .nav-item .nav-link:active,
.sidebar.yellow .nav-item .nav-link a:active,
.sidebar.yellow .nav-item .nav-link i:active {
    color: #ffffff;
}
.sidebar.yellow .nav-item .collapse .collapse-inner .collapse-item,
.sidebar.yellow .nav-item .collapsing .collapse-inner .collapse-item {
    color: #ffffffCC;
}
.sidebar.yellow .nav-item .collapse .collapse-inner .collapse-item a,
.sidebar.yellow .nav-item .collapsing .collapse-inner .collapse-item a {
    color: #ffffffCC;
}
.sidebar.yellow .nav-item .nav-link[data-toggle=collapse].collapsed::after {
    color: #ffffff80;
}
.sidebar.yellow .nav-item .nav-link[data-toggle="collapse"]::after {
    color: #ffffff80;
}
.sidebar.yellow .nav-item .collapse-inner .collapse-header {
    color: #ffffff80 !important;
}
.sidebar.yellow .nav-item .collapse .collapse-inner,
.sidebar.yellow .nav-item .collapsing .collapse-inner {
    color: #ffffffCC;
    background-color: #dab663;
}
.sidebar.yellow .nav-item .collapse .collapse-inner .collapse-item:active,
.sidebar.yellow .nav-item .collapsing .collapse-inner .collapse-item:active
.sidebar.yellow .nav-item .collapse .collapse-inner .collapse-item a:active,
.sidebar.yellow .nav-item .collapsing .collapse-inner .collapse-item a:active {
    color: #ffffffCC;
    opacity: 0.9;
    background-color: #dab663;
}
.sidebar.yellow .nav-item .collapse .collapse-inner .collapse-item:hover,
.sidebar.yellow .nav-item .collapsing .collapse-inner .collapse-item:hover,
.sidebar.yellow .nav-item .collapse .collapse-inner .collapse-item a:hover,
.sidebar.yellow .nav-item .collapsing .collapse-inner .collapse-item a:hover {
    color: #ffffff80;
    opacity: 0.9;
    background-color: #dab663;
}
.sidebar.yellow .nav-item.active .nav-link,
.sidebar.yellow .nav-item.active .nav-link a,
.sidebar.yellow .nav-item.active .nav-link i {
    color: #ffffff;
}
.sidebar.yellow #sidebarToggle {
    background-color: #faba1e33;
}
.sidebar.yellow #sidebarToggle::after {
    color: #ffffff80;
}
.sidebar.yellow #sidebarToggle:hover {
    background-color: #ffffff40;
}
.sidebar.yellow.toggled #sidebarToggle::after {
    color: #ffffff80;
}
.sidebar.yellow .sidebar-card {
    color: #ffffff;
}
@media (min-width: 768px) {
    .sidebar.yellow .nav-item .nav-link[data-toggle=collapse].collapsed::after {
        font-family: "Material Design Icons";
        content: "\F035F";
        color: #ffffff80;
    }
    .sidebar.yellow .nav-item .nav-link[data-toggle="collapse"]::after {
        font-family: "Material Design Icons";
        content: "\F035D";
        color: #ffffff80;
    }
}

/* ==============================================
  SHADOW
=============================================== */
.yellow.shadow-sm-right {
    box-shadow: 0.125rem 0 0 #faba1e1A !important;
}

/* ==============================================
  STAR
=============================================== */
.yellow input.star:checked ~ label.star:before {
    color: #faba1e !important;
}

/* ==============================================
 STEPS
=============================================== */
.steps.yellow .step.active:before {
    color: #faba1e;
}
.steps.yellow .step.active:before,
.steps.yellow .step.active:after {
    background: #faba1e;
}

/* ==============================================
TABLE
=============================================== */
table.yellow td.highlight {
    color: #ffffff;
    background-color: #faba1e80;
}
table.yellow th.highlight {
    color: #ffffff;
    background-color: #faba1eA0;
}
th.highlight.yellow {
    color: #ffffff;
    background-color: #faba1eA0;
}
td.highlight.yellow {
    color: #ffffff;
    background-color: #faba1e80;
}

/* ==============================================
TABLE OF CONTENTS
=============================================== */
.table-of-contents.yellow a.hover,
.table-of-contents.yellow a:hover {
    border-left: 1px solid #faba1e !important;
}
.table-of-contents.yellow a.active {
    border-left: 2px solid #faba1e !important;
}

/* ==============================================
 TEXT
=============================================== */
.text-yellow {
    color: #faba1e !important;
}
.text-yellow.active,
.text-yellow:active {
    color: #dab663 !important;
}
.text-yellow.disabled,
.text-yellow:disabled {
    color: #faba1eD9 !important;
}

/* ==============================================
 TOAST
=============================================== */
.toast.yellow {
    color: #ffffff !important;
    background-color: #faba1e !important;
}
.toast.yellow a,
.toast.yellow i {
    color: #ffffff !important;
}

/* ==============================================
 TOPBAR
=============================================== */
.topbar.yellow .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #faba1e !important;
    border: 1px solid #faba1e !important;
}
.topbar .dropdown.yellow .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #faba1e !important;
    border-color: #faba1e !important;
}
/* ==============================================
 ALERT
=============================================== */
.alert.white {
    color: #5a5c69;
    background-color: #fefefe;
    border-color: #5a5c69;
}
.alert.white hr {
    border-top-color: #5a5c69;
}
.alert.white .alert-link {
    color: #5a5c69;
}

/* ==============================================
 BADGE
=============================================== */
.badge.white {
    color: #5a5c69;
    background-color: #fefefe;
    border: 1px solid #5a5c69;
}
a.badge.white:hover,
a.badge.white:hover {
    color: #5a5c69;
    background-color: #fefefe;
}
.badge.white a {
    color: #5a5c69 !important;
}
.badge.white a.hover,
.badge.white a:hover {
    color: #5a5c69 !important;
}
a.badge.white.focus,
a.badge.white:focus {
    box-shadow: 0 0 0 0.2rem --color80;
}
.badge-avatar.white {
    border-color: #b6b3ab;
}

/* ==============================================
 BACKGROUND
=============================================== */
.bg-white {
    background-color: #ffffff !important;
}
.bg-white-lighten {
    background-color: #ffffff !important;
}
a.bg-white:focus,
a.bg-white:hover,
button.bg-white:focus,
button.bg-white:hover {
    background-color: #fefefe !important;
}
.bg-gradient-white {
    background-color: #ffffff;
    background-image: linear-gradient(180deg, #ffffff 10%, #fefefe 100%);
}
.bg-white,
.bg-white.text-white,
.bg-white-lighten,
.bg-white-lighten.text-white,
.bg-gradient-white,
.bg-gradient-white.text-white {
    color: #5a5c69 !important;
}

/* ==============================================
 BORDER
=============================================== */
.border-white {
    border: 0.25rem solid #fefefe !important;
}
.border-top-white {
    border-top: 0.25rem solid #fefefe !important;
}
.border-right-white {
    border-right: 0.25rem solid #fefefe !important;
}
.border-bottom-white {
    border-bottom: 0.25rem solid #fefefe !important;
}
.border-left-white {
    border-left: 0.25rem solid #fefefe !important;
}
.border-thin-white {
    border: 1px solid #fefefe !important;
}
.border-top-thin-white {
    border-top: 1px solid #fefefe !important;
}
.border-right-thin-white {
    border-right: 1px solid #fefefe !important;
}
.border-bottom-thin-white {
    border-bottom: 1px solid #fefefe !important;
}
.border-left-thin-white {
    border-left: 1px solid #fefefe !important;
}
.border-thick-white {
    border: 3px solid #fefefe !important;
}
.border-top-thick-white {
    border-top: 3px solid #fefefe !important;
}
.border-right-thick-white {
    border-right: 3px solid #fefefe !important;
}
.border-bottom-thick-white {
    border-bottom: 3px solid #fefefe !important;
}
.border-left-thick-white {
    border-left: 3px solid #fefefe !important;
}

/* ==============================================
 BUTTON
=============================================== */
.btn.white.focus,
.btn.white:focus {
    box-shadow: 0 0 0 0.2rem #5a5c6940;
}
.btn.white {
    color: #5a5c69;
    background-color: #ffffff;
    border-color: #c0c0c0;
}
.btn.white.hover,
.btn.white:hover {
    color: #5a5c69;
    background-color: #ffffff;
    border-color: #c0c0c0;
}
.btn.white.focus,
.btn.white:focus {
    color: #5a5c69;
    background-color: #ffffff;
    border-color: #c0c0c0;
    box-shadow: 0 0 0 0.2rem #5a5c6980;
}
.btn.white.disabled,
.btn.white:disabled {
    color: #5a5c69;
    background-color: #ffffff;
    border-color: #c0c0c0;
}
.btn.white:not(:disabled):not(.disabled).active,
.btn.white:not(:disabled):not(.disabled):active,
.show > .btn.white.dropdown-toggle {
    color: #5a5c69;
    background-color: #fefefe;
    border-color: #c0c0c0;
}
.btn.white:not(:disabled):not(.disabled).active:focus,
.btn.white:not(:disabled):not(.disabled):active:focus,
.show > .btn.white.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem #5a5c6980;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.white {
    color: #5a5c69;
    background-color: #ffffff;
    border-color: #c0c0c0;
}
.btn-outline.white:hover {
    color: #5a5c69;
    background-color: #ffffff;
    border-color: #c0c0c0;
}
.btn-outline.white.focus,
.btn-outline.white:focus {
    color: #5a5c69;
    background-color: #ffffff;
    border-color: #c0c0c0;
    box-shadow: 0 0 0 0.2rem #5a5c6980;
}
.btn-outline.white.disabled, .btn-outline.white:disabled {
    color: #5a5c69;
    background-color: #ffffff;
    border-color: #c0c0c0;
}
.btn-outline.white:not(:disabled):not(.disabled).active,
.btn-outline.white:not(:disabled):not(.disabled):active,
.show > .btn-outline.white.dropdown-toggle {
    color: #5a5c69;
    background-color: #ffffff;
    border-color: #c0c0c0;
}
.btn-outline.white:not(:disabled):not(.disabled).active:focus,
.btn-outline.white:not(:disabled):not(.disabled):active:focus,
.show > .btn-outline.white.dropdown-toggle:focus {
    color: #5a5c69;
    background-color: #ffffff;
    border-color: #c0c0c0;
    box-shadow: 0 0 0 0.2rem #5a5c6980;
}
.btn-outline.white:not(:disabled):not(.disabled).active:hover,
.btn-outline.white:not(:disabled):not(.disabled):active:hover,
.show > .btn-outline.white.dropdown-toggle:hover {
    color: #5a5c69;
    background-color: #ffffff;
    border-color: #c0c0c0;
    box-shadow: 0 0 0 0.2rem #5a5c69BF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.white > .btn-white.active {
    color: #5a5c69;
    background-color: #ffffff;
    border-color: #c0c0c0;
}

.btn-group.white .btn-outline:not(:active):not(.active) {
    color: #5a5c69;
    border-color: #5a5c69;
}
.btn-group.white .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.white .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #5a5c69 !important;
    border-color: #5a5c69;
}
.btn-group.white .btn-outline:not(:disabled):not(.disabled).active:focus,
.btn-group.white .btn-outline:not(:disabled):not(.disabled):active:focus {
    color: #ffffff;
    background-color: #5a5c69 !important;
    border-color: #c0c0c0;
    box-shadow: 0 0 0 0.2rem #5a5c6980;
}
.btn-group.white .btn-outline:not(:disabled):not(.disabled).active:hover,
.btn-group.white .btn-outline:not(:disabled):not(.disabled):active:hover {
    color: #ffffff;
    background-color: #5a5c69 !important;
    border-color: #c0c0c0;
    box-shadow: 0 0 0 0.2rem #5a5c69BF;
}

/* ==============================================
 BUTTON LINK
=============================================== */
.btn-link.white {
    color: #5a5c69;
}
.btn-link.white:hover {
    color: #5a5c6980;
}

/* ==============================================
BREADCRUMBS
=============================================== */
.breadcrumb.white .breadcrumb-item a {
    color: #5a5c69;
}
.navbar.white .breadcrumb .breadcrumb-item a {
    color: #5a5c69;
}
.navbar.white .breadcrumb .breadcrumb-item a:hover {
    text-decoration: underline;
}
.navbar.white .breadcrumb .breadcrumb-item.active {
    color: #5a5c69E6;
    text-decoration: none;
}
.navbar.white .breadcrumb .breadcrumb-item+.breadcrumb-item::before {
    color: #5a5c69E6;
}

/* ==============================================
 CARD
=============================================== */
.card.white {
    color: #5a5c69;
    background-color: #ffffff;
}
.card.white a,
.card.white p,
.card.white i,
.card.white em,
.card.white strong {
    color: #5a5c69;
}

/* ==============================================
 CHECKBOX
=============================================== */
.custom-checkbox.white .custom-control-input:indeterminate ~ .custom-control-label::before {
    border-color: #5a5c69;
    background-color: #5a5c69;
}
.custom-checkbox.white .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #5a5c694D;
}
.custom-checkbox.white .custom-control-input:disabled:indeterminate ~ .custom-control-label::before {
    background-color: #5a5c694D;
}

/* ==============================================
 CUSTOM CONTROL
=============================================== */
.custom-control.white .custom-control-input:checked ~ .custom-control-label::before {
    color: #ffffff;
    border-color: #ffffff;
    background-color: #5a5c69;
}
.custom-control.white .custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: 0 0 0.2rem #5a5c6940;
}
.custom-control.white .custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
    border-color: #e2e9ff;
}
.custom-control.white .custom-control-input:disabled ~ .custom-control-label,
.custom-control-input[disabled] ~ .custom-control-label {
    color: #5a5c69E6;
}

/* ==============================================
 CUSTOM RADIO
=============================================== */
.custom-radio.white .custom-control-label:before {
    background-color: #ffffff;
}
.custom-radio.white .custom-control-input:checked~.custom-control-label::before {
    border-color: #5a5c69;
    background-color: #5a5c69;
}
.custom-radio.white .custom-control-input:disabled~.custom-control-label::before {
    background-color: #5a5c694D;
}
.custom-radio.white .custom-control-input:focus~.custom-control-label::before {
    box-shadow: 0 0 0 1px #ffffff, 0 0 0 0.2rem #5a5c6966;
}
.custom-radio.white .custom-control-input:checked~.custom-control-label::after {
    color: #5a5c69;
}

/* ==============================================
 CUSTOM RANGE
=============================================== */
.white .custom-range:focus::-webkit-slider-thumb {
    box-shadow: 0 0 0 1px #5a5c69, 0 0 0.2rem #5a5c6940;
}
.white .custom-range:focus::-moz-range-thumb {
    box-shadow: 0 0 0 1px #5a5c69, 0 0 0.2rem #5a5c6940;
}
.white .custom-range:focus::-ms-thumb {
    box-shadow: 0 0 0 1px #5a5c69, 0 0 0.2rem #5a5c6940;
}
.white .custom-range::-webkit-slider-thumb {
    background-color: #5a5c69;
    appearance: none;
}
.white .custom-range::-moz-range-thumb {
    background-color: #5a5c69;
}
.white .custom-range::-ms-thumb {
    background-color: #5a5c69;
}

/* ==============================================
 CUSTOM SWITCH
=============================================== */
.custom-switch.white .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #5a5c6980;
}

/* ==============================================
 DATEPICKER
=============================================== */
.datepicker.white .datepicker-header {
    color: #5a5c69;
}
.datepicker.white .datepicker-content .active {
    color: #ffffff;
    background-color: #5a5c69;
}
.datepicker.white .datepicker-controls .form-control:focus,
.datepicker.white .datepicker-controls .form-control.focus {
    box-shadow: 0 0 0 0.2rem #5a5c690A !important;
}

/* ==============================================
 DROPDOWN
=============================================== */
.dropdown-item.white.active,
.dropdown-item.white:active {
    color: #5a5c69;
    background-color: #f0f0f0;
}
.dropdown-item.white.disabled,
.dropdown-item.white:disabled {
    color: #5a5c694D;
}
.dropdown.white .dropdown-item.active,
.dropdown.white .dropdown-item:active {
    color: #5a5c69 !important;
    background-color: #f0f0f0;
}
.dropdown.white .dropdown-item:active .text-white {
    color: #5a5c69 !important;
}
.dropdown.white .dropdown-item.focus,
.dropdown.white .dropdown-item:focus {
    color: #5a5c69 !important;
    background-color: #f0f0f0;
}
.dropdown.white .dropdown-item:focus .text-white {
    color: #5a5c69 !important;
}
.dropdown.white .dropdown-item.hover,
.dropdown.white .dropdown-item:hover {
    color: #5a5c69 !important;
    background-color: #f0f0f0;
}
.dropdown.white .dropdown-item:hover .text-white {
    color: #5a5c69 !important;
}

/* ==============================================
 HR
=============================================== */
hr.white {
    border-top: 1px solid #5a5c691a;
}

/* ==============================================
INPUT
=============================================== */
.input-field.white .form-control:focus,
.form-control.white:focus {
    box-shadow: 0 0 0 0.1rem #5a5c6940 !important;
}

/* ==============================================
 JUMBOTRON
=============================================== */
.jumbotron.white {
    color: #5a5c69;
    background-color: #fefefe;
}
.jumbotron.white a,
.jumbotron.white p,
.jumbotron.white i,
.jumbotron.white em,
.jumbotron.white strong {
    color: #5a5c69;
}

/* ==============================================
 LOADING
=============================================== */
.spinner-grow.text-white,
.spinner-border.text-white {
    color: #dedede !important;
}

/* ==============================================
 LIST GROUP
=============================================== */
.list-group-item.white,
.list-group.white .list-group-item {
    color: #5a5c69;
    background-color: #fefefe !important;
}
.list-group.white .list-group-item:focus,
.list-group.white .list-group-item:hover,
.list-group-item.white.list-group-item:focus,
.list-group-item.white.list-group-item:hover {
    color: #5a5c69;
    background-color: #f0f0f0 !important;
}
.list-group.white .list-group-item.list-group-item-action:focus,
.list-group.white .list-group-item.list-group-item-action:hover,
.list-group-item.white.list-group-item-action:focus,
.list-group-item.white.list-group-item-action:hover {
    color: #5a5c69;
    background-color: #f0f0f0 !important;
}
.list-group.white.list-group-item.active,
.list-group-item.white.active {
    color: #5a5c69;
    background-color: #f0f0f0 !important;
    border-color: #f0f0f0;
}
.list-group.white .list-group-item.disabled,
.list-group-item.white.disabled {
    color: #5a5c69;
    background-color: #f0f0f0A9 !important;
}

/* ==============================================
 LOADING
=============================================== */
.loading.white .spinner-border {
    color: #5a5c69 !important;
}

/* ==============================================
 MODAL
=============================================== */
.modal-header.white {
    background-color: #fefefe;
    color: #5a5c69;
}
.modal-header.white a {
    color: #5a5c69;
}
.modal-header.text-white .modal-title,
.modal-header.text-white a {
    color: #5a5c69;
}
.modal .nav-tabs.bg-white {
    background-color: #fefefe !important;
    color: #5a5c69 !important;
    border: 1px solid #fefefe !important;
}
.modal .nav-tabs.bg-white .nav-link {
    background-color: #fefefe !important;
    color: #5a5c69 !important;
    border: 1px solid #fefefe !important;
}
.modal .nav-tabs.bg-white .nav-link:hover,
.modal .nav-tabs.bg-white .nav-link.hover,
.modal .nav-tabs.bg-white .nav-link:active,
.modal .nav-tabs.bg-white .nav-link.active {
    text-decoration: underline !important;
}

/* ==============================================
 NAV VERTICAL
=============================================== */
.nav-vertical.white .nav-item a {
    color: #5a5c69;
}
.nav-vertical.white .nav-item a:hover {
    border-left: 1px solid #5a5c69 !important;
}
.nav-vertical.white .nav-item a.active {
    border-left: 2px solid #5a5c69 !important;
}
.nav-vertical.white .nav-link.disabled {
    cursor: not-allowed;
    color: #5a5c69BF !important;
}

/* ==============================================
 NAV PILLS
=============================================== */
.nav-pills.white a {
    color: #5a5c69;
}
.nav-pills.white a.disabled {
    color: #5a5c6980 !important;
}
.nav-pills.white .nav-link.active,
.nav-pills.white .show > .nav-link {
    color: #ffffff;
    background-color: #5a5c69;
    border: 1px solid #5a5c69;
}

.nav-pills .nav-item.white a {
    color: #5a5c69;
}
.nav-pills .nav-item.white a.disabled {
    color: #5a5c6980 !important;
}
.nav-pills .nav-item.white .nav-link.active,
.nav-pills .nav-item.white .show > .nav-link {
    color: #5a5c69;
    background-color: #fefefe;
    border: 1px solid #5a5c69;
}

/* ==============================================
 NAVBAR
=============================================== */
.navbar.white {
    color: #5a5c69;
    background-color: #ffffff !important;
}
.navbar.white #sidebarToggleTop {
    color: #5a5c6980 !important;
    background-color: #ffffff !important;
    border: none;
}
.navbar.white #sidebarToggleTop:active {
    border-color: #5a5c69E6;
}
.navbar.white .navbar-brand {
    color: #5a5c69;
}
.navbar.white .navbar-brand:hover,
.navbar.white .navbar-brand:focus {
    color: #5a5c69;
}
.navbar.white .navbar-nav .nav-link {
    color: #5a5c69;
}
.navbar.white .navbar-nav .nav-link:hover,
.navbar.white .navbar-nav .nav-link:focus {
    color: #5a5c69E6;
}
.navbar.white .navbar-nav .nav-link.disabled {
    color: #5a5c697D;
}
.navbar.white .navbar-nav .show > .nav-link,
.navbar.white .navbar-nav .active > .nav-link,
.navbar.white .navbar-nav .nav-link.show,
.navbar.white .navbar-nav .nav-link.active {
    color: #5a5c69;
}
.navbar.white .navbar-toggler {
    color: #5a5c69;
    border-color: #5a5c691A;
}
.navbar.white .navbar-text {
    color: #5a5c69;
}
.navbar.white .navbar-text a {
    color: #5a5c69;
}
.navbar.white .navbar-text a:hover,
.navbar.white .navbar-text a:focus {
    color: #5a5c69;
}

/* ==============================================
NAV BORDER
=============================================== */
.nav-border-top.white {
    border-top: .15rem solid #5a5c69 !important;
}
.nav-border-top.white a {
    color: #5a5c69;
}
.nav-border-right.white {
    border-right: .15rem solid #5a5c69 !important;
}
.nav-border-right.white a {
    color: #5a5c69;
}
.nav-border-bottom.white {
    border-bottom: .15rem solid #5a5c69 !important;
}
.nav-border-bottom.white a {
    color: #5a5c69;
}
.nav-border-left.white {
    border-left: .15rem solid #5a5c69 !important;
}
.nav-border-left.white a {
    color: #5a5c69;
}

/* ==============================================
 PAGINATION
=============================================== */
.pagination.white .page-link {
    color: #5a5c69;
    background-color: #ffffff;
}
.pagination.white .page-link.hover,
.pagination.white .page-link:hover {
    color: #ffffff;
    background-color: #5a5c69F7;
}
.pagination.white .page-link.focus,
.pagination.white .page-link:focus {
    box-shadow: 0 0 0.2rem #5a5c6940 !important;
}
.pagination.white .page-item.active .page-link {
    color: #ffffff;
    background-color: #5a5c69;
    border-color: #5a5c69;
}
.pagination.white .page-item.disabled .page-link,
.pagination.white .page-item:disabled .page-link {
    color: #5a5c69;
    background-color: #fefefe;
}

/* ==============================================
 PROGRESS
=============================================== */
.progress.white {
    border: 1px solid #5a5c69;
    background: #ffffff;
}
.progress.white .progress-bar {
    color: #5a5c69;
    background-color: #ebebeb;
}

/* ==============================================
PULSE
=============================================== */
.pulse.mdi-white,
.pulse.white {
    box-shadow: 0 0 0 #dedede66;
    animation: pulse-white 2s infinite;
}

@-webkit-keyframes pulse-white {
    0% {
        -webkit-box-shadow: 0 0 0 0 #dedede66;
    }
    70% {
        -webkit-box-shadow: 0 0 0 10px #dedede00;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 #dedede00;
    }
}
@keyframes pulse-white {
    0% {
        -moz-box-shadow: 0 0 0 0 #dedede66;
        box-shadow: 0 0 0 0 #dedede66;
    }
    70% {
        -moz-box-shadow: 0 0 0 10px #dedede00;
        box-shadow: 0 0 0 10px #dedede00;
    }
    100% {
        -moz-box-shadow: 0 0 0 0 #dedede00;
        box-shadow: 0 0 0 0 #dedede00;
    }
}

/* ==============================================
 SELECT
=============================================== */
.white .bootstrap-select .dropdown-item.active,
.white .bootstrap-select .dropdown-item:active {
    color: #ffffff !important;
    background-color: #5a5c69 !important;
}
.white .bootstrap-select .dropdown-item.hover,
.white .bootstrap-select .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #5a5c69BF !important;
}
.white .bootstrap-select.show-tick .dropdown-menu .selected span.check-mark {
    color: #5a5c69;
}

/* ==============================================
 SIDEBAR
=============================================== */
.sidebar.white .nav-item .collapse .collapse-inner .collapse-item.active,
.sidebar.white .nav-item .collapsing .collapse-inner .collapse-item.active {
    color: #5a5c69;
}
.sidebar.white {
    color: #5a5c69;
    background-color: #ffffff;
}
.sidebar.white .sidebar-brand {
    color: #5a5c69;
}
.sidebar.white hr.sidebar-divider {
    border-top: 1px solid #5a5c6926;
}
.sidebar.white .sidebar-heading {
    color: #5a5c69;
}
.sidebar.white .nav-item .nav-link {
    color: #5a5c69;
}
.sidebar.white .nav-item .nav-link a {
    color: #5a5c69;
}
.sidebar.white .nav-item .nav-link i {
    color: #5a5c69E6;
}
.sidebar.white .nav-item .nav-link:focus,
.sidebar.white .nav-item .nav-link:hover,
.sidebar.white .nav-item .nav-link:focus a,
.sidebar.white .nav-item .nav-link:hover a,
.sidebar.white .nav-item .nav-link:focus i,
.sidebar.white .nav-item .nav-link:hover i {
    color: #5a5c69;
}

.sidebar.white .nav-item .nav-link:active,
.sidebar.white .nav-item .nav-link a:active,
.sidebar.white .nav-item .nav-link i:active {
    color: #5a5c69;
}
.sidebar.white .nav-item .collapse .collapse-inner .collapse-item,
.sidebar.white .nav-item .collapsing .collapse-inner .collapse-item {
    color: #5a5c69;
}
.sidebar.white .nav-item .collapse .collapse-inner .collapse-item a,
.sidebar.white .nav-item .collapsing .collapse-inner .collapse-item a {
    color: #5a5c69;
}
.sidebar.white .nav-item .nav-link[data-toggle=collapse].collapsed::after {
    color: #5a5c6980;
}
.sidebar.white .nav-item .nav-link[data-toggle="collapse"]::after {
    color: #5a5c6980;
}
.sidebar.white .nav-item .collapse-inner .collapse-header {
    color: #5a5c6980 !important;
}
.sidebar.white .nav-item .collapse .collapse-inner,
.sidebar.white .nav-item .collapsing .collapse-inner {
    color: #5a5c69;
    background-color: #f0f0f0;
}
.sidebar.white .nav-item .collapse .collapse-inner .collapse-item:active,
.sidebar.white .nav-item .collapsing .collapse-inner .collapse-item:active
.sidebar.white .nav-item .collapse .collapse-inner .collapse-item a:active,
.sidebar.white .nav-item .collapsing .collapse-inner .collapse-item a:active {
    color: #5a5c69;
    opacity: 0.9;
    background-color: #e5e5e5;
}
.sidebar.white .nav-item .collapse .collapse-inner .collapse-item:hover,
.sidebar.white .nav-item .collapsing .collapse-inner .collapse-item:hover,
.sidebar.white .nav-item .collapse .collapse-inner .collapse-item a:hover,
.sidebar.white .nav-item .collapsing .collapse-inner .collapse-item a:hover {
    color: #5a5c69;
    opacity: 0.9;
    background-color: #e5e5e5;
}
.sidebar.white .nav-item.active .nav-link,
.sidebar.white .nav-item.active .nav-link a,
.sidebar.white .nav-item.active .nav-link i {
    color: #5a5c69;
}
.sidebar.white #sidebarToggle {
    background-color: #5a5c6933;
}
.sidebar.white #sidebarToggle::after {
    color: #5a5c6980;
}
.sidebar.white #sidebarToggle:hover {
    background-color: #e5e5e5;
}
.sidebar.white.toggled #sidebarToggle::after {
    color: #5a5c6980;
}
.sidebar.white .sidebar-card {
    color: #5a5c69;
}
@media (min-width: 768px) {
    .sidebar.white .nav-item .nav-link[data-toggle=collapse].collapsed::after {
        font-family: "Material Design Icons";
        content: "\F035F";
        color: #5a5c6980;
    }
    .sidebar.white .nav-item .nav-link[data-toggle="collapse"]::after {
        font-family: "Material Design Icons";
        content: "\F035D";
        color: #5a5c6980;
    }
}

/* ==============================================
  STAR
=============================================== */
.white input.star:checked ~ label.star:before {
    color: #5a5c69 !important;
}

/* ==============================================
TABLE
=============================================== */
table.white td.highlight {
    color: #5a5c69;
    background-color: #dedede;
}
table.white th.highlight {
    color: #5a5c69;
    background-color: #dedede;
}
th.highlight.white {
    color: #5a5c69;
    background-color: #dededeA0;
}
td.highlight.white {
    color: #5a5c69;
    background-color: #dedede80;
}

/* ==============================================
TABLE OF CONTENTS
=============================================== */
.table-of-contents.white a.hover,
.table-of-contents.white a:hover {
    border-left: 1px solid #5a5c69 !important;
}
.table-of-contents.white a.active {
    border-left: 2px solid #5a5c69 !important;
}

/* ==============================================
 TOAST
=============================================== */
.toast.white {
    color: #5a5c69 !important;
    background-color: #ffffff !important;
}
.toast.white a,
.toast.white i {
    color: #5a5c69 !important;
}

/* ==============================================
 TOPBAR
=============================================== */
.topbar.white .dropdown-list .dropdown-header {
    color: #5a5c69 !important;
    background-color: #ffffff !important;
    border: 1px solid #ffffff !important;
}
.topbar .dropdown.white .dropdown-list .dropdown-header {
    color: #5a5c69 !important;
    background-color: #ffffff !important;
    border-color: #5a5c69 #ffffff !important;
}
/* ==============================================
 ALERT
=============================================== */
.alert.black {
    color: #eaecf4;
    background-color: #222222;
    border-color: #222222;
}
.alert.black hr {
    border-top-color: #eaecf4;
}
.alert.black .alert-link {
    color: #eaecf4;
}

/* ==============================================
 BADGE
=============================================== */
.badge.black {
    color: #eaecf4;
    background-color: #222222;
}
a.badge.black:hover,
a.badge.black:hover {
    color: #eaecf4;
    background-color: #222222;
}
.badge.black a {
    color: #eaecf4 !important;
}
.badge.black a.hover,
.badge.black a:hover {
    color: #eaecf4 !important;
}
a.badge.black.focus,
a.badge.black:focus {
    box-shadow: 0 0 0 0.2rem #22222280;
}

/* ==============================================
 BACKGROUND
=============================================== */
.bg-black {
    background-color: #222222 !important;
}
.bg-black-lighten {
    background-color: #22222288 !important;
}
a.bg-black:focus,
a.bg-black:hover,
button.bg-black:focus,
button.bg-black:hover {
    background-color: #222222 !important;
}
.bg-gradient-black {
    background-color: #222222;
    background-image: linear-gradient(180deg, #222222 10%, #111111 100%);
}
.bg-black,
.bg-black.text-black,
.bg-black-lighten,
.bg-black-lighten.text-black,
.bg-gradient-black,
.bg-gradient-black.text-black {
    color: #eaecf4 !important;
}

/* ==============================================
 BORDER
=============================================== */
.border-black {
    border: 0.25rem solid #222222 !important;
}
.border-top-black {
    border-top: 0.25rem solid #222222 !important;
}
.border-right-black {
    border-right: 0.25rem solid #222222 !important;
}
.border-bottom-black {
    border-bottom: 0.25rem solid #222222 !important;
}
.border-left-black {
    border-left: 0.25rem solid #222222 !important;
}
.border-thin-black {
    border: 1px solid #222222 !important;
}
.border-top-thin-black {
    border-top: 1px solid #222222 !important;
}
.border-right-thin-black {
    border-right: 1px solid #222222 !important;
}
.border-bottom-thin-black {
    border-bottom: 1px solid #222222 !important;
}
.border-left-thin-black {
    border-left: 1px solid #222222 !important;
}
.border-thick-black {
    border: 3px solid #222222 !important;
}
.border-top-thick-black {
    border-top: 3px solid #222222 !important;
}
.border-right-thick-black {
    border-right: 3px solid #222222 !important;
}
.border-bottom-thick-black {
    border-bottom: 3px solid #222222 !important;
}
.border-left-thick-black {
    border-left: 3px solid #222222 !important;
}

/* ==============================================
 BUTTON
=============================================== */
.btn.black.focus,
.btn.black:focus {
    box-shadow: 0 0 0 0.2rem #eaecf440;
}
.btn.black {
    color: #eaecf4;
    background-color: #222222;
    border-color: #d9d9d9;
}
.btn.black.hover,
.btn.black:hover {
    color: #eaecf4;
    background-color: #222222;
    border-color: #eaecf4;
}
.btn.black.focus,
.btn.black:focus {
    color: #eaecf4;
    background-color: #222222;
    border-color: #eaecf4;
    box-shadow: 0 0 0 0.2rem #eaecf480;
}
.btn.black.disabled,
.btn.black:disabled {
    color: #eaecf4;
    background-color: #222222;
    border-color: #eaecf480;
}
.btn.black:not(:disabled):not(.disabled).active,
.btn.black:not(:disabled):not(.disabled):active,
.show > .btn.black.dropdown-toggle {
    color: #eaecf4;
    background-color: #222222;
    border-color: #eaecf4;
}
.btn.black:not(:disabled):not(.disabled).active:focus,
.btn.black:not(:disabled):not(.disabled):active:focus,
.show > .btn.black.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem #eaecf480;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.black {
    color: #eaecf4;
    background-color: #ffffff;
    border-color: #eaecf4;
}
.btn-outline.black:hover {
    color: #eaecf4;
    background-color: #ffffff;
    border-color: #eaecf4;
}
.btn-outline.black.focus,
.btn-outline.black:focus {
    color: #eaecf4;
    background-color: #ffffff;
    border-color: #eaecf4;
    box-shadow: 0 0 0 0.2rem #eaecf480;
}
.btn-outline.black.disabled, .btn-outline.black:disabled {
    color: #eaecf4;;
    background-color: #ffffff;
    border-color: #eaecf480;
}
.btn-outline.black:not(:disabled):not(.disabled).active,
.btn-outline.black:not(:disabled):not(.disabled):active,
.show > .btn-outline.black.dropdown-toggle {
    color: #eaecf4;
    background-color: #ffffff;
    border-color: #eaecf4;
}
.btn-outline.black:not(:disabled):not(.disabled).active:focus,
.btn-outline.black:not(:disabled):not(.disabled):active:focus,
.show > .btn-outline.black.dropdown-toggle:focus {
    color: #eaecf4;
    background-color: #ffffff;
    border-color: #eaecf4;
    box-shadow: 0 0 0 0.2rem #eaecf480;
}
.btn-outline.black:not(:disabled):not(.disabled).active:hover,
.btn-outline.black:not(:disabled):not(.disabled):active:hover,
.show > .btn-outline.black.dropdown-toggle:hover {
    color: #eaecf4;
    background-color: #ffffff;
    border-color: #eaecf4;
    box-shadow: 0 0 0 0.2rem #eaecf4BF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.black > .btn-black.active {
    color: #eaecf4;
    background-color: #222222;
    border-color: #eaecf4;
}

.btn-group.black .btn-outline:not(:active):not(.active) {
    color: #222222;
    border-color: #222222;
}
.btn-group.black .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.black .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #222222 !important;
    border-color: #222222;
}
.btn-group.black .btn-outline:not(:disabled):not(.disabled).active:focus,
.btn-group.black .btn-outline:not(:disabled):not(.disabled):active:focus {
    color: #ffffff;
    background-color: #222222 !important;
    border-color: #222222;
    box-shadow: 0 0 0 0.2rem #eaecf480;
}
.btn-group.black .btn-outline:not(:disabled):not(.disabled).active:hover,
.btn-group.black .btn-outline:not(:disabled):not(.disabled):active:hover {
    color: #ffffff;
    background-color: #222222 !important;
    border-color: #222222;
    box-shadow: 0 0 0 0.2rem #eaecf4BF;
}

/* ==============================================
 BUTTON LINK
=============================================== */
.btn-link.black {
    color: #222222;
}
.btn-link.black:hover {
    color: #22222280;
}

/* ==============================================
BREADCRUMBS
=============================================== */
.breadcrumb.black .breadcrumb-item a {
    color: #222222 !important;
}
.navbar.black .breadcrumb .breadcrumb-item a {
    color: #eaecf4;
}
.navbar.black .breadcrumb .breadcrumb-item a:hover {
    text-decoration: underline;
}
.navbar.black .breadcrumb .breadcrumb-item.active {
    color: #eaecf4B3;
    text-decoration: none;
}
.navbar.black .breadcrumb .breadcrumb-item+.breadcrumb-item::before {
    color: #eaecf4B3;
}

/* ==============================================
 CARD
=============================================== */
.card.black {
    color: #eaecf4;
    background-color: #222222;
}
.card.black a,
.card.black p,
.card.black i,
.card.black em,
.card.black strong {
    color: #eaecf4;
}

/* ==============================================
 CHECKBOX
=============================================== */
.custom-checkbox.black .custom-control-input:indeterminate ~ .custom-control-label::before {
    border-color: #222222;
    background-color: #222222;
}
.custom-checkbox.black .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #2222224D;
}
.custom-checkbox.black .custom-control-input:disabled:indeterminate ~ .custom-control-label::before {
    background-color: #2222224D;
}

/* ==============================================
 CUSTOM CONTROL
=============================================== */
.custom-control.black .custom-control-input:checked ~ .custom-control-label::before {
    color: #ffffff;
    border-color: #ffffff;
    background-color: #222222;
}
.custom-control.black .custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: 0 0 0.2rem #eaecf440;
}
.custom-control.black .custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
    border-color: #e2e9ff;
}
.custom-control.black .custom-control-input:disabled ~ .custom-control-label,
.custom-control-input[disabled] ~ .custom-control-label {
    color: #858796;
}

/* ==============================================
 CUSTOM RADIO
=============================================== */
.custom-radio.black .custom-control-label:before {
    background-color: #fefefe;
}
.custom-radio.black .custom-control-input:checked~.custom-control-label::before {
    border-color: #eaecf4;
    background-color: #222222;
}
.custom-radio.black .custom-control-input:disabled~.custom-control-label::before {
    background-color: #2222224D;
}
.custom-radio.black .custom-control-input:focus~.custom-control-label::before {
    box-shadow: 0 0 0 1px #222222, 0 0 0 0.2rem #22222266;
}
.custom-radio.black .custom-control-input:checked~.custom-control-label::after {
    color: #222222;
}

/* ==============================================
 CUSTOM RANGE
=============================================== */
.black .custom-range:focus::-webkit-slider-thumb {
    box-shadow: 0 0 0 1px #eaecf4, 0 0 0.2rem #22222240;
}
.black .custom-range:focus::-moz-range-thumb {
    box-shadow: 0 0 0 1px #eaecf4, 0 0 0.2rem #22222240;
}
.black .custom-range:focus::-ms-thumb {
    box-shadow: 0 0 0 1px #eaecf4, 0 0 0.2rem #22222240;
}
.black .custom-range::-webkit-slider-thumb {
    background-color: #222222;
    appearance: none;
}
.black .custom-range::-moz-range-thumb {
    background-color: #222222;
}
.black .custom-range::-ms-thumb {
    background-color: #222222;
}

/* ==============================================
 CUSTOM SWITCH
=============================================== */
.custom-switch.black .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #22222280;
}

/* ==============================================
 DATEPICKER
=============================================== */
.datepicker.black .datepicker-header {
    color: #eaecf4;
    background: #222222;
}
.datepicker.black .datepicker-content .active {
    color: #eaecf4;
    background-color: #222222;
}
.datepicker.black .datepicker-controls .form-control:focus,
.datepicker.black .datepicker-controls .form-control.focus {
    box-shadow: 0 0 0 0.2rem #2222220A !important;
}

/* ==============================================
 DROPDOWN
=============================================== */
.dropdown-item.black.active,
.dropdown-item.black:active {
    color: #eaecf4;
    background-color: #222222;
}
.dropdown-item.black.disabled,
.dropdown-item.black:disabled {
    color: #eaecf44D;
}
.dropdown.black .dropdown-item.active,
.dropdown.black .dropdown-item:active {
    color: #eaecf4 !important;
    background-color: #222222;
}
.dropdown.black .dropdown-item:active .text-black {
    color: #eaecf4 !important;
}
.dropdown.black .dropdown-item.focus,
.dropdown.black .dropdown-item:focus {
    color: #eaecf4 !important;
    background-color: #333333;
}
.dropdown.black .dropdown-item:focus .text-black {
    color: #eaecf4 !important;
}
.dropdown.black .dropdown-item.hover,
.dropdown.black .dropdown-item:hover {
    color: #eaecf4 !important;
    background-color: #333333;
}
.dropdown.black .dropdown-item:hover .text-black {
    color: #eaecf4 !important;
}

/* ==============================================
 HR
=============================================== */
hr.black {
    border-top: 1px solid #2222221a;
}

/* ==============================================
 ICONS
=============================================== */
.mdi-black {
    color: #222222;
}

/* ==============================================
INPUT
=============================================== */
.input-field.black .form-control:focus,
.form-control.black:focus {
    box-shadow: 0 0 0 0.1rem #22222229 !important;
}

/* ==============================================
 JUMBOTRON
=============================================== */
.jumbotron.black {
    color: #eaecf4;
    background-color: #222222;
}
.jumbotron.black a,
.jumbotron.black p,
.jumbotron.black i,
.jumbotron.black em,
.jumbotron.black strong {
    color: #eaecf4;
}

/* ==============================================
 LOADING
=============================================== */
.spinner-grow.text-black,
.spinner-border.text-black {
    color: #333333 !important;
}

/* ==============================================
 LIST GROUP
=============================================== */
.list-group-item.black,
.list-group.black .list-group-item {
    color: #eaecf4;
    background-color: #222222 !important;
}
.list-group.black .list-group-item:focus,
.list-group.black .list-group-item:hover,
.list-group-item.black.list-group-item:focus,
.list-group-item.black.list-group-item:hover {
    color: #eaecf4;
    background-color: #222222 !important;
}
.list-group.black .list-group-item.list-group-item-action:focus,
.list-group.black .list-group-item.list-group-item-action:hover,
.list-group-item.black.list-group-item-action:focus,
.list-group-item.black.list-group-item-action:hover {
    color: #eaecf4;
    background-color: #222222 !important;
}
.list-group.black.list-group-item.active,
.list-group-item.black.active {
    color: #eaecf4;
    background-color: #222222 !important;
    border-color: #222222;
}
.list-group.black .list-group-item.disabled,
.list-group-item.black.disabled {
    color: #eaecf4;
    background-color: #222222A9 !important;
}

/* ==============================================
 LOADING
=============================================== */
.loading.black .spinner-border {
    color: #222222 !important;
}

/* ==============================================
 MODAL
=============================================== */
.modal-header.black {
    background-color: #222222;
    color: #eaecf4;
}
.modal-header.black a {
    color: #eaecf4;
}
.modal-header.text-black .modal-title,
.modal-header.text-black a {
    color: #222222;
}
.modal .nav-tabs.bg-black {
    background-color: #222222 !important;
    color: #eaecf4 !important;
    border: 1px solid #222222 !important;
}
.modal .nav-tabs.bg-black .nav-link {
    background-color: #222222 !important;
    color: #eaecf4 !important;
    border: 1px solid #222222 !important;
}
.modal .nav-tabs.bg-black .nav-link:hover,
.modal .nav-tabs.bg-black .nav-link.hover,
.modal .nav-tabs.bg-black .nav-link:active,
.modal .nav-tabs.bg-black .nav-link.active {
    text-decoration: underline !important;
}

/* ==============================================
 NAV VERTICAL
=============================================== */
.nav-vertical.white .nav-item a {
    color: #222222;
}
.nav-vertical.white .nav-item a:hover {
    border-left: 1px solid #222222 !important;
}
.nav-vertical.white .nav-item a.active {
    border-left: 2px solid #222222 !important;
}
.nav-vertical.white .nav-link.disabled {
    cursor: not-allowed;
    color: #222222BF !important;
}

/* ==============================================
 NAV PILLS
=============================================== */
.nav-pills.black a {
    color: #222222;
}
.nav-pills.black a.disabled {
    color: #22222280 !important;
}
.nav-pills.black .nav-link.active,
.nav-pills.black .show > .nav-link {
    color: #eaecf4;
    background-color: #222222;
    border: 1px solid #222222;
}

.nav-pills .nav-item.black a {
    color: #222222;
}
.nav-pills .nav-item.black a.disabled {
    color: #22222280 !important;
}
.nav-pills .nav-item.black .nav-link.active,
.nav-pills .nav-item.black .show > .nav-link {
    color: #ffffff;
    background-color: #222222;
    border: 1px solid #222222;
}

/* ==============================================
NAV BORDER
=============================================== */
.nav-border-top.white {
    border-top: .15rem solid #222222 !important;
}
.nav-border-top.white a {
    color: #222222;
}
.nav-border-right.white {
    border-right: .15rem solid #222222 !important;
}
.nav-border-right.white a {
    color: #222222;
}
.nav-border-bottom.white {
    border-bottom: .15rem solid #222222 !important;
}
.nav-border-bottom.white a {
    color: #222222;
}
.nav-border-left.white {
    border-left: .15rem solid #222222 !important;
}
.nav-border-left.white a {
    color: #222222;
}

/* ==============================================
 NAVBAR
=============================================== */
.navbar.black {
    color: #eaecf4;
    background-color: #222222 !important;
}
.navbar.black #sidebarToggleTop {
    color: #eaecf480 !important;
    background-color: #222222 !important;
    border: none;
}
.navbar.black #sidebarToggleTop:active {
    border-color: #222222E6;
}
.navbar.black .navbar-brand {
    color: #eaecf4;
}
.navbar.black .navbar-brand:hover,
.navbar.black .navbar-brand:focus {
    color: #eaecf4;
}
.navbar.black .navbar-nav .nav-link {
    color: #eaecf4;
}
.navbar.black .navbar-nav .nav-link:hover,
.navbar.black .navbar-nav .nav-link:focus {
    color: #eaecf4FD;
}
.navbar.black .navbar-nav .nav-link.disabled {
    color: #eaecf47D;
}
.navbar.black .navbar-nav .show > .nav-link,
.navbar.black .navbar-nav .active > .nav-link,
.navbar.black .navbar-nav .nav-link.show,
.navbar.black .navbar-nav .nav-link.active {
    color: #eaecf4;
}
.navbar.black .navbar-toggler {
    color: #eaecf4;
    border-color: #2222221A;
}
.navbar.black .navbar-text {
    color: #eaecf4;
}
.navbar.black .navbar-text a {
    color: #eaecf4;
}
.navbar.black .navbar-text a:hover,
.navbar.black .navbar-text a:focus {
    color: #eaecf4;
}

/* ==============================================
 PAGINATION
=============================================== */
.pagination.black .page-link {
    color: #222222;
    background-color: #ffffff;
}
.pagination.black .page-link.hover,
.pagination.black .page-link:hover {
    color: #ffffff;
    background-color: #222222F7;
}
.pagination.black .page-link.focus,
.pagination.black .page-link:focus {
    box-shadow: 0 0 0.2rem #22222240 !important;
}
.pagination.black .page-item.active .page-link {
    color: #ffffff;
    background-color: #222222;
    border-color: #222222;
}
.pagination.black .page-item.disabled .page-link,
.pagination.black .page-item:disabled .page-link {
    color: #22222280;
    background-color: #fefefe;
}

/* ==============================================
 PROGRESS
=============================================== */
.progress.black {
    border: 1px solid #444444;
    background: #ffffff;
}
.progress.black .progress-bar {
    color: #eaecf4;
    background-color: #222222;
}

/* ==============================================
PULSE
=============================================== */
.pulse.mdi-black,
.pulse.black {
    box-shadow: 0 0 0 #2e2e2e66;
    animation: pulse-black 2s infinite;
}

@-webkit-keyframes pulse-black {
    0% {
        -webkit-box-shadow: 0 0 0 0 #2e2e2e66;
    }
    70% {
        -webkit-box-shadow: 0 0 0 10px #2e2e2e00;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 #2e2e2e00;
    }
}
@keyframes pulse-black {
    0% {
        -moz-box-shadow: 0 0 0 0 #2e2e2e66;
        box-shadow: 0 0 0 0 #2e2e2e66;
    }
    70% {
        -moz-box-shadow: 0 0 0 10px #2e2e2e00;
        box-shadow: 0 0 0 10px #2e2e2e00;
    }
    100% {
        -moz-box-shadow: 0 0 0 0 #2e2e2e00;
        box-shadow: 0 0 0 0 #2e2e2e00;
    }
}

/* ==============================================
 SELECT
=============================================== */
.black .bootstrap-select .dropdown-item.active,
.black .bootstrap-select .dropdown-item:active {
    color: #eaecf4 !important;
    background-color: #222222 !important;
}
.black .bootstrap-select .dropdown-item.hover,
.black .bootstrap-select .dropdown-item:hover {
    color: #eaecf4 !important;
    background-color: #22222226 !important;
}
.black .bootstrap-select.show-tick .dropdown-menu .selected span.check-mark {
    color: #eaecf4;
}

/* ==============================================
  SIDEBAR
=============================================== */
.sidebar.black .nav-item .collapse .collapse-inner .collapse-item.active,
.sidebar.black .nav-item .collapsing .collapse-inner .collapse-item.active {
    color: #eaecf4;
}
.sidebar.black {
    color: #eaecf4;
    background-color: #222222;
}
.sidebar.black .sidebar-brand {
    color: #eaecf4;
}
.sidebar.black hr.sidebar-divider {
    border-top: 1px solid #eaecf426;
}
.sidebar.black .sidebar-heading {
    color: #eaecf4;
}
.sidebar.black .nav-item .nav-link {
    color: #eaecf4;
}
.sidebar.black .nav-item .nav-link a {
    color: #eaecf4;
}
.sidebar.black .nav-item .nav-link i {
    color: #eaecf4CC;
}
.sidebar.black .nav-item .nav-link:focus,
.sidebar.black .nav-item .nav-link:hover,
.sidebar.black .nav-item .nav-link:focus a,
.sidebar.black .nav-item .nav-link:hover a,
.sidebar.black .nav-item .nav-link:focus i,
.sidebar.black .nav-item .nav-link:hover i {
    color: #eaecf4;
}

.sidebar.black .nav-item .nav-link:active,
.sidebar.black .nav-item .nav-link a:active,
.sidebar.black .nav-item .nav-link i:active {
    color: #eaecf4;
}
.sidebar.black .nav-item .collapse .collapse-inner .collapse-item,
.sidebar.black .nav-item .collapsing .collapse-inner .collapse-item {
    color: #eaecf4;
}
.sidebar.black .nav-item .collapse .collapse-inner .collapse-item a,
.sidebar.black .nav-item .collapsing .collapse-inner .collapse-item a {
    color: #eaecf4;
}
.sidebar.black .nav-item .nav-link[data-toggle=collapse].collapsed::after {
    color: #eaecf480;
}
.sidebar.black .nav-item .nav-link[data-toggle="collapse"]::after {
    color: #eaecf480;
}
.sidebar.black .nav-item .collapse-inner .collapse-header {
    color: #eaecf480 !important;
}
.sidebar.black .nav-item .collapse .collapse-inner,
.sidebar.black .nav-item .collapsing .collapse-inner {
    color: #eaecf4;
    background-color: #242424;
}
.sidebar.black .nav-item .collapse .collapse-inner .collapse-item:active,
.sidebar.black .nav-item .collapsing .collapse-inner .collapse-item:active
.sidebar.black .nav-item .collapse .collapse-inner .collapse-item a:active,
.sidebar.black .nav-item .collapsing .collapse-inner .collapse-item a:active {
    color: #eaecf4;
    opacity: 0.9;
    background-color: #343434;
}
.sidebar.black .nav-item .collapse .collapse-inner .collapse-item:hover,
.sidebar.black .nav-item .collapsing .collapse-inner .collapse-item:hover,
.sidebar.black .nav-item .collapse .collapse-inner .collapse-item a:hover,
.sidebar.black .nav-item .collapsing .collapse-inner .collapse-item a:hover {
    color: #eaecf4;
    opacity: 0.9;
    background-color: #242424;
}
.sidebar.black .nav-item.active .nav-link,
.sidebar.black .nav-item.active .nav-link a,
.sidebar.black .nav-item.active .nav-link i {
    color: #eaecf4;
}
.sidebar.black #sidebarToggle {
background-color: #24242433;
}
.sidebar.black #sidebarToggle::after {
    color: #eaecf480;
}
.sidebar.black #sidebarToggle:hover {
    background-color: #242424;
}
.sidebar.black.toggled #sidebarToggle::after {
    color: #eaecf480;
}
.sidebar.black .sidebar-card {
    color: #eaecf4;
}
@media (min-width: 768px) {
.sidebar.black .nav-item .nav-link[data-toggle=collapse].collapsed::after {
     font-family: "Material Design Icons";
     content: "\F035F";
     color: #eaecf480;
}
.sidebar.black .nav-item .nav-link[data-toggle="collapse"]::after {
     font-family: "Material Design Icons";
     content: "\F035D";
     color: #eaecf480;
    }
}

/* ==============================================
  STAR
=============================================== */
.black input.star:checked ~ label.star:before {
    color: #222222 !important;
}

/* ==============================================
TABLE
=============================================== */
table.black td.highlight {
    color: #eaecf4;
    background-color: #333333;
}
table.black th.highlight {
    color: #eaecf4;
    background-color: #333333;
}
th.highlight.black {
    color: #eaecf4;
    background-color: #333333A0;
}
td.highlight.black {
    color: #eaecf4;
    background-color: #33333380;
}

/* ==============================================
TABLE OF CONTENTS
=============================================== */
.table-of-contents.black a.hover,
.table-of-contents.black a:hover {
    border-left: 1px solid #222222 !important;
}
.table-of-contents.black a.active {
    border-left: 2px solid #222222 !important;
}

/* ==============================================
 TOAST
=============================================== */
.toast.black {
    color: #eaecf4 !important;
    background-color: #222222 !important;
}
.toast.black a,
.toast.black i {
    color: #eaecf4 !important;
}

/* ==============================================
 TOPBAR
=============================================== */
.topbar.black .dropdown-list .dropdown-header {
    color: #eaecf4 !important;
    background-color: #222222 !important;
    border: 1px solid #222222 !important;
}
.topbar .dropdown.black .dropdown-list .dropdown-header {
    color: #eaecf4 !important;
    background-color: #222222 !important;
    border-color: #222222 !important;
}