/* ==============================================
            TENANT
            =============================================== */
            a, a:hover {
                color: #00bcd4;
            }
            .form-control:focus {
                border-color: transparent !important;
                box-shadow: 0 0 0 0.1rem #00bcd440 !important;
            }/* ==============================================
            FONT
            =============================================== */
            @import url('//fonts.googleapis.com/css?family=Nunito:400,600');
            @font-face {
                font-family: 'Nunito';
            }
            body, html {
                font-family: 'Nunito', sans-serif !important;
            }/* ==============================================
 A
=============================================== */
a.text-red {
    color: #f44336;
}
a.text-red:hover {
    color: #d32f2f !important;
}
a.text-red.active,
a.text-red:active {
    color: #d32f2f;
}
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: #e53935;
}
.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: #e53935 !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: #e53935;
}
.btn.red.focus,
.btn.red:focus {
    color: #ffffff;
    background-color: #f44336;
    border-color: #e53935;
    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: #e53935;
    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: #e53935;
    background-color: #ffffff;
    border-color: #e53935;
    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: #e53935;
    background-color: #ffffff;
    border-color: #e53935;
    box-shadow: 0 0 0 0.2rem #f44336BF;
}

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

.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: #e53935 !important;
    border-color: #e53935;
    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: #e53935 !important;
    border-color: #e53935;
    box-shadow: 0 0 0 0.2rem #f44336BF;
}

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

/* ==============================================
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: #d32f2f;
    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: #e53935 !important;
    border-color: #e53935;
}
.list-group.red .list-group-item.disabled,
.list-group-item.red.disabled {
    color: #ffffff;
    background-color: #d32f2fA9 !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 #e53935;
}
.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 TABS
=============================================== */
.nav-tabs.red .nav-link:not(.active):hover {
    border-color: transparent !important;
}

/* ==============================================
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: #d32f2f;
}
.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: #d32f2f;
}
.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: #d32f2f;
}
.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: #d32f2f !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-pink {
    color: #e91e63;
}
a.text-pink:hover {
    color: #c2185b !important;
}
a.text-pink.active,
a.text-pink:active {
    color: #c2185b;
}
a.text-pink.focus,
a.text-pink:focus {
    color: #ec407a !important;
}
a.text-pink.disabled,
a.text-pink:disabled {
    color: #e91e63D9;
}

/* ==============================================
 ALERT
=============================================== */
.alert.pink {
    color: #ffffff;
    background-color: #ec407a;
    border-color: #e91e63;
}
.alert.pink hr {
    border-top-color: #ffffff;
}
.alert.pink .alert-link {
    color: #ffffff;
}

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

/* ==============================================
 BADGE
=============================================== */
.badge.pink {
    color: #ffffff;
    background-color: #e91e63;
}
a.badge.pink:hover,
a.badge.pink:hover {
    color: #ffffff;
    background-color: #d81b60;
}
.badge.pink a {
    color: #ffffff !important;
}
.badge.pink a.hover,
.badge.pink a:hover {
    color: #ffffff !important;
}
a.badge.pink.focus,
a.badge.pink:focus {
    box-shadow: 0 0 0 0.2rem #e91e6380;
}
.badge-avatar.pink {
    border-color: #e91e63;
}

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

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

/* ==============================================
 BUTTON
=============================================== */
.btn.pink.focus,
.btn.pink:focus {
    box-shadow: 0 0 0 0.2rem #e91e6340;
}
.btn.pink {
    color: #ffffff;
    background-color: #e91e63;
    border-color: #e91e63;
}
.btn.pink.hover,
.btn.pink:hover {
    color: #ffffff;
    background-color: #e91e63;
    border-color: #d81b60;
}
.btn.pink.focus,
.btn.pink:focus {
    color: #ffffff;
    background-color: #e91e63;
    border-color: #d81b60;
    box-shadow: 0 0 0 0.2rem #e91e6380;
}
.btn.pink.disabled,
.btn.pink:disabled {
    color: #ffffff;
    background-color: #e91e63;
    border-color: #e91e63;
}
.btn.pink:not(:disabled):not(.disabled).active,
.btn.pink:not(:disabled):not(.disabled):active,
.show > .btn.pink.dropdown-toggle {
    color: #ffffff;
    background-color: #d81b60;
    border-color: #e91e63;
}
.btn.pink:not(:disabled):not(.disabled).active:focus,
.btn.pink:not(:disabled):not(.disabled):active:focus,
.show > .btn.pink.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem #e91e6380;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.pink {
    color: #e91e63;
    background-color: #ffffff;
    border-color: #e91e63;
}
.btn-outline.pink:hover {
    color: #e91e63;
    background-color: #ffffff;
    border-color: #e91e63;
}
.btn-outline.pink.focus,
.btn-outline.pink:focus {
    color: #e91e63;
    background-color: #ffffff;
    border-color: #e91e63;
    box-shadow: 0 0 0 0.2rem #e91e6380;
}
.btn-outline.pink.disabled, .btn-outline.pink:disabled {
    color: #e91e63;
    background-color: #ffffff;
    border-color: #ec407a;
}
.btn-outline.pink:not(:disabled):not(.disabled).active,
.btn-outline.pink:not(:disabled):not(.disabled):active,
.show > .btn-outline.pink.dropdown-toggle {
    color: #e91e63;
    background-color: #ffffff;
    border-color: #e91e63;
}
.btn-outline.pink:not(:disabled):not(.disabled).active:focus,
.btn-outline.pink:not(:disabled):not(.disabled):active:focus,
.show > .btn-outline.pink.dropdown-toggle:focus {
    color: #d81b60;
    background-color: #ffffff;
    border-color: #d81b60;
    box-shadow: 0 0 0 0.2rem #e91e6380;
}
.btn-outline.pink:not(:disabled):not(.disabled).active:hover,
.btn-outline.pink:not(:disabled):not(.disabled):active:hover,
.show > .btn-outline.pink.dropdown-toggle:hover {
    color: #d81b60;
    background-color: #ffffff;
    border-color: #d81b60;
    box-shadow: 0 0 0 0.2rem #e91e63BF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.pink > .btn-pink.active {
    color: #ffffff;
    background-color: #e91e63;
    border-color: #d81b60;
}

.btn-group.pink .btn-outline:not(:active):not(.active) {
    color: #e91e63;
    border-color: #e91e63;
}
.btn-group.pink .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.pink .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #e91e63 !important;
    border-color: #e91e63;
}
.btn-group.pink .btn-outline:not(:disabled):not(.disabled).active:focus,
.btn-group.pink .btn-outline:not(:disabled):not(.disabled):active:focus {
    color: #ffffff;
    background-color: #d81b60 !important;
    border-color: #d81b60;
    box-shadow: 0 0 0 0.2rem #e91e6380;
}
.btn-group.pink .btn-outline:not(:disabled):not(.disabled).active:hover,
.btn-group.pink .btn-outline:not(:disabled):not(.disabled):active:hover {
    color: #ffffff;
    background-color: #d81b60 !important;
    border-color: #d81b60;
    box-shadow: 0 0 0 0.2rem #e91e63BF;
}

/* ==============================================
 BUTTON LINK
=============================================== */
.btn-link.pink {
    color: #e91e63;
}
.btn-link.pink.hover,
.btn-link.pink:hover {
    color: #c2185b;
}
.btn-link.pink.disabled,
.btn-link.pink:disabled {
    color: #c2185b;
}

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

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

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

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

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

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

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

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

/* ==============================================
 DROPDOWN
=============================================== */
.dropdown-item.pink.active,
.dropdown-item.pink:active {
    color: #ffffff;
    background-color: #e91e63;
}
.dropdown-item.pink.disabled,
.dropdown-item.pink:disabled {
    color: #e91e634D;
}
.dropdown.pink .dropdown-item.active,
.dropdown.pink .dropdown-item:active {
    color: #ffffff !important;
    background-color: #e91e63E6 !important;
}
.dropdown.pink .dropdown-item:active .text-pink {
    color: #ffffff !important;
}
.dropdown.pink .dropdown-item.focus,
.dropdown.pink .dropdown-item:focus {
    color: #ffffff !important;
    background-color: #e91e63E6 !important;
}
.dropdown.pink .dropdown-item:focus .text-pink {
    color: #ffffff !important;
}
.dropdown.pink .dropdown-item.hover,
.dropdown.pink .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #e91e63CC !important;
}
.dropdown.pink .dropdown-item:hover .text-pink {
    color: #ffffff !important;
}

/* ==============================================
 ERROR
=============================================== */
.error.pink:before {
    text-shadow: 1px 0 #e91e63;
    color: #c2185b;
    background: #f8f9fc;
}

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

/* ==============================================
 ICONS
=============================================== */
.mdi-pink {
    color: #e91e63;
}

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

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

/* ==============================================
 LIST GROUP
=============================================== */
.list-group-item.pink,
.list-group.pink .list-group-item {
    color: #ffffff;
    background-color: #e91e63 !important;
}
.list-group.pink .list-group-item:focus,
.list-group.pink .list-group-item:hover,
.list-group-item.pink.list-group-item:focus,
.list-group-item.pink.list-group-item:hover {
    color: #ffffff;
    background-color: #ec407a !important;
}
.list-group.pink .list-group-item.list-group-item-action:focus,
.list-group.pink .list-group-item.list-group-item-action:hover,
.list-group-item.pink.list-group-item-action:focus,
.list-group-item.pink.list-group-item-action:hover {
    color: #ffffff;
    background-color: #ec407a !important;
}
.list-group.pink .list-group-item.active,
.list-group-item.pink.active {
    color: #ffffff;
    background-color: #d81b60 !important;
    border-color: #d81b60;
}
.list-group.pink .list-group-item.disabled,
.list-group-item.pink.disabled {
    color: #ffffff;
    background-color: #c2185bA9 !important;
}

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

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

/* ==============================================
 NAV
=============================================== */
.nav.pink {
    color: #e91e63;
}
.nav.pink .nav-link {
    color: #e91e63;
}
.nav.pink .nav-link.disabled {
    color: #e91e6380 !important;
}
.nav.pink .nav-link.bordered {
    border: 1px solid #e91e63;
}

.nav-link.pink a {
    color: #e91e63;
}
.nav-link.pink.disabled {
    color: #e91e634D;
}

.nav.bg-pink,
.nav.bg-pink .nav-link,
.nav.bg-pink .nav-link.active {
    background-color: #e91e63;
    color: #ffffff;
    border: 1px solid #d81b60;
}
.nav.bg-pink .nav-link.active {
    text-decoration: underline;
}

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

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

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

/* ==============================================
NAV TABS
=============================================== */
.nav-tabs.pink .nav-link:not(.active):hover {
    border-color: transparent !important;
}

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

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

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

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

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

@-webkit-keyframes pulse-pink {
    0% {
        -webkit-box-shadow: 0 0 0 0 #e91e6366;
    }
    70% {
        -webkit-box-shadow: 0 0 0 10px #e91e6300;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 #e91e6300;
    }
}
@keyframes pulse-pink {
    0% {
        -moz-box-shadow: 0 0 0 0 #e91e6366;
        box-shadow: 0 0 0 0 #e91e6366;
    }
    70% {
        -moz-box-shadow: 0 0 0 10px #e91e6300;
        box-shadow: 0 0 0 10px #e91e6300;
    }
    100% {
        -moz-box-shadow: 0 0 0 0 #e91e6300;
        box-shadow: 0 0 0 0 #e91e6300;
    }
}

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

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

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

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

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

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

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

/* ==============================================
TABLE
=============================================== */
table.pink td.highlight {
    color: #ffffff;
    background-color: #e91e6380;
}
table.pink th.highlight {
    color: #ffffff;
    background-color: #e91e63A0;
}
th.highlight.pink {
    color: #ffffff;
    background-color: #e91e63A0;
}
td.highlight.pink {
    color: #ffffff;
    background-color: #e91e6380;
}

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

/* ==============================================
 TEXT
=============================================== */
.text-pink {
    color: #e91e63 !important;
}
.text-pink.active,
.text-pink:active {
    color: #c2185b !important;
}
.text-pink.disabled,
.text-pink:disabled {
    color: #e91e63D9 !important;
}

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

/* ==============================================
 TOPBAR
=============================================== */
.topbar.pink .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #e91e63 !important;
    border: 1px solid #e91e63 !important;
}
.topbar .dropdown.pink .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #e91e63 !important;
    border-color: #e91e63 !important;
}
/* ==============================================
 A
=============================================== */
a.text-purple {
    color: #9c27b0;
}
a.text-purple:hover {
    color: #7b1fa2 !important;
}
a.text-purple.active,
a.text-purple:active {
    color: #7b1fa2;
}
a.text-purple.focus,
a.text-purple:focus {
    color: #ab47bc !important;
}
a.text-purple.disabled,
a.text-purple:disabled {
    color: #9c27b0D9;
}

/* ==============================================
 ALERT
=============================================== */
.alert.purple {
    color: #ffffff;
    background-color: #ab47bc;
    border-color: #9c27b0;
}
.alert.purple hr {
    border-top-color: #ffffff;
}
.alert.purple .alert-link {
    color: #ffffff;
}

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

/* ==============================================
 BADGE
=============================================== */
.badge.purple {
    color: #ffffff;
    background-color: #9c27b0;
}
a.badge.purple:hover,
a.badge.purple:hover {
    color: #ffffff;
    background-color: #8e24aa;
}
.badge.purple a {
    color: #ffffff !important;
}
.badge.purple a.hover,
.badge.purple a:hover {
    color: #ffffff !important;
}
a.badge.purple.focus,
a.badge.purple:focus {
    box-shadow: 0 0 0 0.2rem #9c27b080;
}
.badge-avatar.purple {
    border-color: #9c27b0;
}

/* ==============================================
 BACKGROUND
=============================================== */
.bg-purple {
    background-color: #9c27b0 !important;
}
.bg-purple-lighten {
    background-color: #9c27b088 !important;
}
a.bg-purple:focus,
a.bg-purple:hover,
button.bg-purple:focus,
button.bg-purple:hover {
    background-color: #8e24aa !important;
}
.bg-gradient-purple {
    background-color: #9c27b0;
    background-image: linear-gradient(180deg, #9c27b0 10%, #9c27b0 100%);
}
.bg-purple,
.bg-purple.text-purple,
.bg-purple-lighten,
.bg-purple-lighten.text-purple,
.bg-gradient-purple,
.bg-gradient-purple.text-purple {
    color: #ffffff !important;
}

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

/* ==============================================
 BUTTON
=============================================== */
.btn.purple.focus,
.btn.purple:focus {
    box-shadow: 0 0 0 0.2rem #9c27b040;
}
.btn.purple {
    color: #ffffff;
    background-color: #9c27b0;
    border-color: #9c27b0;
}
.btn.purple.hover,
.btn.purple:hover {
    color: #ffffff;
    background-color: #9c27b0;
    border-color: #8e24aa;
}
.btn.purple.focus,
.btn.purple:focus {
    color: #ffffff;
    background-color: #9c27b0;
    border-color: #8e24aa;
    box-shadow: 0 0 0 0.2rem #9c27b080;
}
.btn.purple.disabled,
.btn.purple:disabled {
    color: #ffffff;
    background-color: #9c27b0;
    border-color: #9c27b0;
}
.btn.purple:not(:disabled):not(.disabled).active,
.btn.purple:not(:disabled):not(.disabled):active,
.show > .btn.purple.dropdown-toggle {
    color: #ffffff;
    background-color: #8e24aa;
    border-color: #9c27b0;
}
.btn.purple:not(:disabled):not(.disabled).active:focus,
.btn.purple:not(:disabled):not(.disabled):active:focus,
.show > .btn.purple.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem #9c27b080;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.purple {
    color: #9c27b0;
    background-color: #ffffff;
    border-color: #9c27b0;
}
.btn-outline.purple:hover {
    color: #9c27b0;
    background-color: #ffffff;
    border-color: #9c27b0;
}
.btn-outline.purple.focus,
.btn-outline.purple:focus {
    color: #9c27b0;
    background-color: #ffffff;
    border-color: #9c27b0;
    box-shadow: 0 0 0 0.2rem #9c27b080;
}
.btn-outline.purple.disabled, .btn-outline.purple:disabled {
    color: #9c27b0;
    background-color: #ffffff;
    border-color: #ab47bc;
}
.btn-outline.purple:not(:disabled):not(.disabled).active,
.btn-outline.purple:not(:disabled):not(.disabled):active,
.show > .btn-outline.purple.dropdown-toggle {
    color: #9c27b0;
    background-color: #ffffff;
    border-color: #9c27b0;
}
.btn-outline.purple:not(:disabled):not(.disabled).active:focus,
.btn-outline.purple:not(:disabled):not(.disabled):active:focus,
.show > .btn-outline.purple.dropdown-toggle:focus {
    color: #8e24aa;
    background-color: #ffffff;
    border-color: #8e24aa;
    box-shadow: 0 0 0 0.2rem #9c27b080;
}
.btn-outline.purple:not(:disabled):not(.disabled).active:hover,
.btn-outline.purple:not(:disabled):not(.disabled):active:hover,
.show > .btn-outline.purple.dropdown-toggle:hover {
    color: #8e24aa;
    background-color: #ffffff;
    border-color: #8e24aa;
    box-shadow: 0 0 0 0.2rem #9c27b0BF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.purple > .btn-purple.active {
    color: #ffffff;
    background-color: #9c27b0;
    border-color: #8e24aa;
}

.btn-group.purple .btn-outline:not(:active):not(.active) {
    color: #9c27b0;
    border-color: #9c27b0;
}
.btn-group.purple .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.purple .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #9c27b0 !important;
    border-color: #9c27b0;
}
.btn-group.purple .btn-outline:not(:disabled):not(.disabled).active:focus,
.btn-group.purple .btn-outline:not(:disabled):not(.disabled):active:focus {
    color: #ffffff;
    background-color: #8e24aa !important;
    border-color: #8e24aa;
    box-shadow: 0 0 0 0.2rem #9c27b080;
}
.btn-group.purple .btn-outline:not(:disabled):not(.disabled).active:hover,
.btn-group.purple .btn-outline:not(:disabled):not(.disabled):active:hover {
    color: #ffffff;
    background-color: #8e24aa !important;
    border-color: #8e24aa;
    box-shadow: 0 0 0 0.2rem #9c27b0BF;
}

/* ==============================================
 BUTTON LINK
=============================================== */
.btn-link.purple {
    color: #9c27b0;
}
.btn-link.purple.hover,
.btn-link.purple:hover {
    color: #7b1fa2;
}
.btn-link.purple.disabled,
.btn-link.purple:disabled {
    color: #7b1fa2;
}

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

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

/* ==============================================
 CHECKBOX
=============================================== */
.custom-checkbox.purple .custom-control-input:indeterminate ~ .custom-control-label::before {
    border-color: #9c27b0;
    background-color: #9c27b0;
}
.custom-checkbox.purple .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #9c27b04D;
}
.custom-checkbox.purple .custom-control-input:disabled:indeterminate ~ .custom-control-label::before {
    background-color: #9c27b04D;
}

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

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

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

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

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

/* ==============================================
 DROPDOWN
=============================================== */
.dropdown-item.purple.active,
.dropdown-item.purple:active {
    color: #ffffff;
    background-color: #9c27b0;
}
.dropdown-item.purple.disabled,
.dropdown-item.purple:disabled {
    color: #9c27b04D;
}
.dropdown.purple .dropdown-item.active,
.dropdown.purple .dropdown-item:active {
    color: #ffffff !important;
    background-color: #9c27b0E6 !important;
}
.dropdown.purple .dropdown-item:active .text-purple {
    color: #ffffff !important;
}
.dropdown.purple .dropdown-item.focus,
.dropdown.purple .dropdown-item:focus {
    color: #ffffff !important;
    background-color: #9c27b0E6 !important;
}
.dropdown.purple .dropdown-item:focus .text-purple {
    color: #ffffff !important;
}
.dropdown.purple .dropdown-item.hover,
.dropdown.purple .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #9c27b0CC !important;
}
.dropdown.purple .dropdown-item:hover .text-purple {
    color: #ffffff !important;
}

/* ==============================================
 ERROR
=============================================== */
.error.purple:before {
    text-shadow: 1px 0 #9c27b0;
    color: #7b1fa2;
    background: #f8f9fc;
}

/* ==============================================
 HR
=============================================== */
hr.purple {
    border-top: 1px solid #9c27b01a;
}

/* ==============================================
 ICONS
=============================================== */
.mdi-purple {
    color: #9c27b0;
}

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

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

/* ==============================================
 LIST GROUP
=============================================== */
.list-group-item.purple,
.list-group.purple .list-group-item {
    color: #ffffff;
    background-color: #9c27b0 !important;
}
.list-group.purple .list-group-item:focus,
.list-group.purple .list-group-item:hover,
.list-group-item.purple.list-group-item:focus,
.list-group-item.purple.list-group-item:hover {
    color: #ffffff;
    background-color: #ab47bc !important;
}
.list-group.purple .list-group-item.list-group-item-action:focus,
.list-group.purple .list-group-item.list-group-item-action:hover,
.list-group-item.purple.list-group-item-action:focus,
.list-group-item.purple.list-group-item-action:hover {
    color: #ffffff;
    background-color: #ab47bc !important;
}
.list-group.purple .list-group-item.active,
.list-group-item.purple.active {
    color: #ffffff;
    background-color: #8e24aa !important;
    border-color: #8e24aa;
}
.list-group.purple .list-group-item.disabled,
.list-group-item.purple.disabled {
    color: #ffffff;
    background-color: #7b1fa2A9 !important;
}

/* ==============================================
 LOADING
=============================================== */
.loading.purple .spinner-border {
    color: #9c27b0 !important;
}

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

/* ==============================================
 NAV
=============================================== */
.nav.purple {
    color: #9c27b0;
}
.nav.purple .nav-link {
    color: #9c27b0;
}
.nav.purple .nav-link.disabled {
    color: #9c27b080 !important;
}
.nav.purple .nav-link.bordered {
    border: 1px solid #9c27b0;
}

.nav-link.purple a {
    color: #9c27b0;
}
.nav-link.purple.disabled {
    color: #9c27b04D;
}

.nav.bg-purple,
.nav.bg-purple .nav-link,
.nav.bg-purple .nav-link.active {
    background-color: #9c27b0;
    color: #ffffff;
    border: 1px solid #8e24aa;
}
.nav.bg-purple .nav-link.active {
    text-decoration: underline;
}

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

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

.nav-pills .nav-item.purple a {
    color: #9c27b0;
}
.nav-pills .nav-item.purple a.disabled {
    color: #9c27b080 !important;
}
.nav-pills .nav-item.purple .nav-link.active,
.nav-pills .nav-item.purple .show > .nav-link {
    color: #ffffff;
    background-color: #9c27b0;
    border: 1px solid #9c27b0;
}

/* ==============================================
NAV TABS
=============================================== */
.nav-tabs.purple .nav-link:not(.active):hover {
    border-color: transparent !important;
}

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

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

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

/* ==============================================
 PROGRESS
=============================================== */
.progress.purple .progress-bar {
    color: #ffffff;
    background-color: #9c27b0;
}

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

@-webkit-keyframes pulse-purple {
    0% {
        -webkit-box-shadow: 0 0 0 0 #9c27b066;
    }
    70% {
        -webkit-box-shadow: 0 0 0 10px #9c27b000;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 #9c27b000;
    }
}
@keyframes pulse-purple {
    0% {
        -moz-box-shadow: 0 0 0 0 #9c27b066;
        box-shadow: 0 0 0 0 #9c27b066;
    }
    70% {
        -moz-box-shadow: 0 0 0 10px #9c27b000;
        box-shadow: 0 0 0 10px #9c27b000;
    }
    100% {
        -moz-box-shadow: 0 0 0 0 #9c27b000;
        box-shadow: 0 0 0 0 #9c27b000;
    }
}

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

.purple .bootstrap-select .dropdown-item.active,
.purple .bootstrap-select .dropdown-item:active {
    color: #ffffff !important;
    background-color: #9c27b0 !important;
}
.purple .bootstrap-select .dropdown-item.hover,
.purple .bootstrap-select .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #9c27b0BF !important;
}
.purple .bootstrap-select.show-tick .dropdown-menu .selected span.check-mark {
    color: #9c27b0;
}

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

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

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

/* ==============================================
  STAR
=============================================== */
.purple input.star:checked ~ label.star:before {
    color: #9c27b0 !important;
}

/* ==============================================
 STEPS
=============================================== */
.steps.purple .step.active:before {
    color: #9c27b0;
}
.steps.purple .step.active:before,
.steps.purple .step.active:after {
    background: #9c27b0;
}

/* ==============================================
TABLE
=============================================== */
table.purple td.highlight {
    color: #ffffff;
    background-color: #9c27b080;
}
table.purple th.highlight {
    color: #ffffff;
    background-color: #9c27b0A0;
}
th.highlight.purple {
    color: #ffffff;
    background-color: #9c27b0A0;
}
td.highlight.purple {
    color: #ffffff;
    background-color: #9c27b080;
}

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

/* ==============================================
 TEXT
=============================================== */
.text-purple {
    color: #9c27b0 !important;
}
.text-purple.active,
.text-purple:active {
    color: #7b1fa2 !important;
}
.text-purple.disabled,
.text-purple:disabled {
    color: #9c27b0D9 !important;
}

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

/* ==============================================
 TOPBAR
=============================================== */
.topbar.purple .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #9c27b0 !important;
    border: 1px solid #9c27b0 !important;
}
.topbar .dropdown.purple .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #9c27b0 !important;
    border-color: #9c27b0 !important;
}
/* ==============================================
 A
=============================================== */
a.text-deep-purple {
    color: #673ab7;
}
a.text-deep-purple:hover {
    color: #512da8 !important;
}
a.text-deep-purple.active,
a.text-deep-purple:active {
    color: #512da8;
}
a.text-deep-purple.focus,
a.text-deep-purple:focus {
    color: #7e57c2 !important;
}
a.text-deep-purple.disabled,
a.text-deep-purple:disabled {
    color: #673ab7D9;
}

/* ==============================================
 ALERT
=============================================== */
.alert.deep-purple {
    color: #ffffff;
    background-color: #7e57c2;
    border-color: #673ab7;
}
.alert.deep-purple hr {
    border-top-color: #ffffff;
}
.alert.deep-purple .alert-link {
    color: #ffffff;
}

/* ==============================================
 AUTOCOMPLETE
=============================================== */
.autocomplete.deep-purple .dropdown-item.active,
.autocomplete.deep-purple .dropdown-item:active {
    color: #ffffff;
    text-decoration: none;
    background-color: #673ab7;
}

/* ==============================================
 BADGE
=============================================== */
.badge.deep-purple {
    color: #ffffff;
    background-color: #673ab7;
}
a.badge.deep-purple:hover,
a.badge.deep-purple:hover {
    color: #ffffff;
    background-color: #5e35b1;
}
.badge.deep-purple a {
    color: #ffffff !important;
}
.badge.deep-purple a.hover,
.badge.deep-purple a:hover {
    color: #ffffff !important;
}
a.badge.deep-purple.focus,
a.badge.deep-purple:focus {
    box-shadow: 0 0 0 0.2rem #673ab780;
}
.badge-avatar.deep-purple {
    border-color: #673ab7;
}

/* ==============================================
 BACKGROUND
=============================================== */
.bg-deep-purple {
    background-color: #673ab7 !important;
}
.bg-deep-purple-lighten {
    background-color: #673ab788 !important;
}
a.bg-deep-purple:focus,
a.bg-deep-purple:hover,
button.bg-deep-purple:focus,
button.bg-deep-purple:hover {
    background-color: #5e35b1 !important;
}
.bg-gradient-deep-purple {
    background-color: #673ab7;
    background-image: linear-gradient(180deg, #673ab7 10%, #673ab7 100%);
}
.bg-deep-purple,
.bg-deep-purple.text-deep-purple,
.bg-deep-purple-lighten,
.bg-deep-purple-lighten.text-deep-purple,
.bg-gradient-deep-purple,
.bg-gradient-deep-purple.text-deep-purple {
    color: #ffffff !important;
}

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

/* ==============================================
 BUTTON
=============================================== */
.btn.deep-purple.focus,
.btn.deep-purple:focus {
    box-shadow: 0 0 0 0.2rem #673ab740;
}
.btn.deep-purple {
    color: #ffffff;
    background-color: #673ab7;
    border-color: #673ab7;
}
.btn.deep-purple.hover,
.btn.deep-purple:hover {
    color: #ffffff;
    background-color: #673ab7;
    border-color: #5e35b1;
}
.btn.deep-purple.focus,
.btn.deep-purple:focus {
    color: #ffffff;
    background-color: #673ab7;
    border-color: #5e35b1;
    box-shadow: 0 0 0 0.2rem #673ab780;
}
.btn.deep-purple.disabled,
.btn.deep-purple:disabled {
    color: #ffffff;
    background-color: #673ab7;
    border-color: #673ab7;
}
.btn.deep-purple:not(:disabled):not(.disabled).active,
.btn.deep-purple:not(:disabled):not(.disabled):active,
.show > .btn.deep-purple.dropdown-toggle {
    color: #ffffff;
    background-color: #5e35b1;
    border-color: #673ab7;
}
.btn.deep-purple:not(:disabled):not(.disabled).active:focus,
.btn.deep-purple:not(:disabled):not(.disabled):active:focus,
.show > .btn.deep-purple.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem #673ab780;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.deep-purple {
    color: #673ab7;
    background-color: #ffffff;
    border-color: #673ab7;
}
.btn-outline.deep-purple:hover {
    color: #673ab7;
    background-color: #ffffff;
    border-color: #673ab7;
}
.btn-outline.deep-purple.focus,
.btn-outline.deep-purple:focus {
    color: #673ab7;
    background-color: #ffffff;
    border-color: #673ab7;
    box-shadow: 0 0 0 0.2rem #673ab780;
}
.btn-outline.deep-purple.disabled, .btn-outline.deep-purple:disabled {
    color: #673ab7;
    background-color: #ffffff;
    border-color: #7e57c2;
}
.btn-outline.deep-purple:not(:disabled):not(.disabled).active,
.btn-outline.deep-purple:not(:disabled):not(.disabled):active,
.show > .btn-outline.deep-purple.dropdown-toggle {
    color: #673ab7;
    background-color: #ffffff;
    border-color: #673ab7;
}
.btn-outline.deep-purple:not(:disabled):not(.disabled).active:focus,
.btn-outline.deep-purple:not(:disabled):not(.disabled):active:focus,
.show > .btn-outline.deep-purple.dropdown-toggle:focus {
    color: #5e35b1;
    background-color: #ffffff;
    border-color: #5e35b1;
    box-shadow: 0 0 0 0.2rem #673ab780;
}
.btn-outline.deep-purple:not(:disabled):not(.disabled).active:hover,
.btn-outline.deep-purple:not(:disabled):not(.disabled):active:hover,
.show > .btn-outline.deep-purple.dropdown-toggle:hover {
    color: #5e35b1;
    background-color: #ffffff;
    border-color: #5e35b1;
    box-shadow: 0 0 0 0.2rem #673ab7BF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.deep-purple > .btn-deep-purple.active {
    color: #ffffff;
    background-color: #673ab7;
    border-color: #5e35b1;
}

.btn-group.deep-purple .btn-outline:not(:active):not(.active) {
    color: #673ab7;
    border-color: #673ab7;
}
.btn-group.deep-purple .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.deep-purple .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #673ab7 !important;
    border-color: #673ab7;
}
.btn-group.deep-purple .btn-outline:not(:disabled):not(.disabled).active:focus,
.btn-group.deep-purple .btn-outline:not(:disabled):not(.disabled):active:focus {
    color: #ffffff;
    background-color: #5e35b1 !important;
    border-color: #5e35b1;
    box-shadow: 0 0 0 0.2rem #673ab780;
}
.btn-group.deep-purple .btn-outline:not(:disabled):not(.disabled).active:hover,
.btn-group.deep-purple .btn-outline:not(:disabled):not(.disabled):active:hover {
    color: #ffffff;
    background-color: #5e35b1 !important;
    border-color: #5e35b1;
    box-shadow: 0 0 0 0.2rem #673ab7BF;
}

/* ==============================================
 BUTTON LINK
=============================================== */
.btn-link.deep-purple {
    color: #673ab7;
}
.btn-link.deep-purple.hover,
.btn-link.deep-purple:hover {
    color: #512da8;
}
.btn-link.deep-purple.disabled,
.btn-link.deep-purple:disabled {
    color: #512da8;
}

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

/* ==============================================
 CARD
=============================================== */
.card.deep-purple {
    color: #ffffff !important;
    background-color: #673ab7 !important;
}
.card.deep-purple a,
.card.deep-purple p,
.card.deep-purple i,
.card.deep-purple em,
.card.deep-purple strong {
    color: #ffffff !important;
}

/* ==============================================
 CHECKBOX
=============================================== */
.custom-checkbox.deep-purple .custom-control-input:indeterminate ~ .custom-control-label::before {
    border-color: #673ab7;
    background-color: #673ab7;
}
.custom-checkbox.deep-purple .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #673ab74D;
}
.custom-checkbox.deep-purple .custom-control-input:disabled:indeterminate ~ .custom-control-label::before {
    background-color: #673ab74D;
}

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

/* ==============================================
 CUSTOM RADIO
=============================================== */
.custom-radio.deep-purple .custom-control-label:before {
    background-color: #ffffff;
}
.custom-radio.deep-purple .custom-control-input:checked~.custom-control-label::before {
    border-color: #ffffff;
    background-color: #673ab7;
}
.custom-radio.deep-purple .custom-control-input:disabled~.custom-control-label::before {
    background-color: #673ab74D;
}
.custom-radio.deep-purple .custom-control-input:focus~.custom-control-label::before {
    box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem #673ab766;
}
.custom-radio.deep-purple .custom-control-input:checked~.custom-control-label::after {
    color: #673ab7;
}

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

/* ==============================================
 CUSTOM SWITCH
=============================================== */
.custom-switch.deep-purple .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #673ab780;
}

/* ==============================================
 DATEPICKER
=============================================== */
.datepicker.deep-purple .datepicker-header {
    color: #ffffff;
    background-color: #673ab7;
}
.datepicker.deep-purple .datepicker-content .active {
    color: #ffffff;
    background-color: #673ab7;
}
.datepicker.deep-purple .datepicker-controls .form-control:focus,
.datepicker.deep-purple .datepicker-controls .form-control.focus {
    box-shadow: 0 0 0 0.2rem #673ab70A !important;
}

/* ==============================================
 DROPDOWN
=============================================== */
.dropdown-item.deep-purple.active,
.dropdown-item.deep-purple:active {
    color: #ffffff;
    background-color: #673ab7;
}
.dropdown-item.deep-purple.disabled,
.dropdown-item.deep-purple:disabled {
    color: #673ab74D;
}
.dropdown.deep-purple .dropdown-item.active,
.dropdown.deep-purple .dropdown-item:active {
    color: #ffffff !important;
    background-color: #673ab7E6 !important;
}
.dropdown.deep-purple .dropdown-item:active .text-deep-purple {
    color: #ffffff !important;
}
.dropdown.deep-purple .dropdown-item.focus,
.dropdown.deep-purple .dropdown-item:focus {
    color: #ffffff !important;
    background-color: #673ab7E6 !important;
}
.dropdown.deep-purple .dropdown-item:focus .text-deep-purple {
    color: #ffffff !important;
}
.dropdown.deep-purple .dropdown-item.hover,
.dropdown.deep-purple .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #673ab7CC !important;
}
.dropdown.deep-purple .dropdown-item:hover .text-deep-purple {
    color: #ffffff !important;
}

/* ==============================================
 ERROR
=============================================== */
.error.deep-purple:before {
    text-shadow: 1px 0 #673ab7;
    color: #512da8;
    background: #f8f9fc;
}

/* ==============================================
 HR
=============================================== */
hr.deep-purple {
    border-top: 1px solid #673ab71a;
}

/* ==============================================
 ICONS
=============================================== */
.mdi-deep-purple {
    color: #673ab7;
}

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

/* ==============================================
 JUMBOTRON
=============================================== */
.jumbotron.deep-purple {
    color: #ffffff;
    background-color: #673ab7;
}
.jumbotron.deep-purple a,
.jumbotron.deep-purple p,
.jumbotron.deep-purple i,
.jumbotron.deep-purple em,
.jumbotron.deep-purple strong {
    color: #ffffff;
}

/* ==============================================
 LIST GROUP
=============================================== */
.list-group-item.deep-purple,
.list-group.deep-purple .list-group-item {
    color: #ffffff;
    background-color: #673ab7 !important;
}
.list-group.deep-purple .list-group-item:focus,
.list-group.deep-purple .list-group-item:hover,
.list-group-item.deep-purple.list-group-item:focus,
.list-group-item.deep-purple.list-group-item:hover {
    color: #ffffff;
    background-color: #7e57c2 !important;
}
.list-group.deep-purple .list-group-item.list-group-item-action:focus,
.list-group.deep-purple .list-group-item.list-group-item-action:hover,
.list-group-item.deep-purple.list-group-item-action:focus,
.list-group-item.deep-purple.list-group-item-action:hover {
    color: #ffffff;
    background-color: #7e57c2 !important;
}
.list-group.deep-purple .list-group-item.active,
.list-group-item.deep-purple.active {
    color: #ffffff;
    background-color: #5e35b1 !important;
    border-color: #5e35b1;
}
.list-group.deep-purple .list-group-item.disabled,
.list-group-item.deep-purple.disabled {
    color: #ffffff;
    background-color: #512da8A9 !important;
}

/* ==============================================
 LOADING
=============================================== */
.loading.deep-purple .spinner-border {
    color: #673ab7 !important;
}

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

/* ==============================================
 NAV
=============================================== */
.nav.deep-purple {
    color: #673ab7;
}
.nav.deep-purple .nav-link {
    color: #673ab7;
}
.nav.deep-purple .nav-link.disabled {
    color: #673ab780 !important;
}
.nav.deep-purple .nav-link.bordered {
    border: 1px solid #673ab7;
}

.nav-link.deep-purple a {
    color: #673ab7;
}
.nav-link.deep-purple.disabled {
    color: #673ab74D;
}

.nav.bg-deep-purple,
.nav.bg-deep-purple .nav-link,
.nav.bg-deep-purple .nav-link.active {
    background-color: #673ab7;
    color: #ffffff;
    border: 1px solid #5e35b1;
}
.nav.bg-deep-purple .nav-link.active {
    text-decoration: underline;
}

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

/* ==============================================
 NAV PILLS
=============================================== */
.nav-pills.deep-purple a {
    color: #673ab7;
}
.nav-pills.deep-purple a.disabled {
    color: #673ab780 !important;
}
.nav-pills.deep-purple .nav-link.active,
.nav-pills.deep-purple .show > .nav-link {
    color: #ffffff;
    background-color: #673ab7;
    border: 1px solid #673ab7;
}

.nav-pills .nav-item.deep-purple a {
    color: #673ab7;
}
.nav-pills .nav-item.deep-purple a.disabled {
    color: #673ab780 !important;
}
.nav-pills .nav-item.deep-purple .nav-link.active,
.nav-pills .nav-item.deep-purple .show > .nav-link {
    color: #ffffff;
    background-color: #673ab7;
    border: 1px solid #673ab7;
}

/* ==============================================
NAV TABS
=============================================== */
.nav-tabs.deep-purple .nav-link:not(.active):hover {
    border-color: transparent !important;
}

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

/* ==============================================
 NAVBAR
=============================================== */
.navbar.deep-purple {
    color: #ffffffE6 !important;
    background-color: #673ab7 !important;
}
.navbar.deep-purple #sidebarToggleTop,
.navbar.deep-purple #sidebarToggleTop i {
    color: #ffffffE6 !important;
    background-color: #673ab7 !important;
    border: none;
}
.navbar.deep-purple #sidebarToggleTop:active {
    border-color: #673ab7E6;
}
.navbar.deep-purple .navbar-brand {
    color: #ffffffE6;
}
.navbar.deep-purple .navbar-brand:hover,
.navbar.deep-purple .navbar-brand:focus {
    color: #ffffffE6;
}
.navbar.deep-purple .navbar-nav .nav-link {
    color: #ffffffE6;
}
.navbar.deep-purple .navbar-nav .nav-link:hover,
.navbar.deep-purple .navbar-nav .nav-link:focus {
    color: #ffffffCC;
}
.navbar.deep-purple .navbar-nav .nav-link.disabled {
    color: #ffffff4D;
}
.navbar.deep-purple .navbar-nav .show > .nav-link,
.navbar.deep-purple .navbar-nav .active > .nav-link,
.navbar.deep-purple .navbar-nav .nav-link.show,
.navbar.deep-purple .navbar-nav .nav-link.active {
    color: #ffffffE6;
}
.navbar.deep-purple .navbar-toggler {
    color: #ffffff80 !important;
    border-color: #673ab71A;
}
.navbar.deep-purple .navbar-text {
    color: #ffffff80;
}
.navbar.deep-purple .navbar-text a {
    color: #ffffffE6;
}
.navbar.deep-purple .navbar-text a:hover,
.navbar.deep-purple .navbar-text a:focus {
    color: #ffffffE6;
}

/* ==============================================
 PAGINATION
=============================================== */
.pagination.deep-purple .page-link {
    color: #673ab7;
    border: 1px solid #dddfeb;
}
.pagination.deep-purple .page-link.hover,
.pagination.deep-purple .page-link:hover {
    color: #ffffff;
    background-color: #673ab7BF;
    border-color: #dddfeb;
}
.pagination.deep-purple .page-link.focus,
.pagination.deep-purple .page-link:focus {
    box-shadow: 0 0 0.2rem #673ab740 !important;
}
.pagination.deep-purple .page-item.active .page-link {
    color: #ffffff;
    background-color: #673ab7;
    border-color: #673ab7;
}
.pagination.deep-purple .page-item.disabled .page-link,
.pagination.deep-purple .page-item:disabled .page-link {
    color: #858796;
    border-color: #dddfeb;
}

/* ==============================================
 PROGRESS
=============================================== */
.progress.deep-purple .progress-bar {
    color: #ffffff;
    background-color: #673ab7;
}

/* ==============================================
PULSE
=============================================== */
.pulse.mdi-deep-purple,
.pulse.deep-purple {
    box-shadow: 0 0 0 #673ab766;
    animation: pulse-deep-purple 2s infinite;
}

@-webkit-keyframes pulse-deep-purple {
    0% {
        -webkit-box-shadow: 0 0 0 0 #673ab766;
    }
    70% {
        -webkit-box-shadow: 0 0 0 10px #673ab700;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 #673ab700;
    }
}
@keyframes pulse-deep-purple {
    0% {
        -moz-box-shadow: 0 0 0 0 #673ab766;
        box-shadow: 0 0 0 0 #673ab766;
    }
    70% {
        -moz-box-shadow: 0 0 0 10px #673ab700;
        box-shadow: 0 0 0 10px #673ab700;
    }
    100% {
        -moz-box-shadow: 0 0 0 0 #673ab700;
        box-shadow: 0 0 0 0 #673ab700;
    }
}

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

.deep-purple .bootstrap-select .dropdown-item.active,
.deep-purple .bootstrap-select .dropdown-item:active {
    color: #ffffff !important;
    background-color: #673ab7 !important;
}
.deep-purple .bootstrap-select .dropdown-item.hover,
.deep-purple .bootstrap-select .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #673ab7BF !important;
}
.deep-purple .bootstrap-select.show-tick .dropdown-menu .selected span.check-mark {
    color: #673ab7;
}

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

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

/* ==============================================
  SHADOW
=============================================== */
.deep-purple.shadow-sm-right {
    box-shadow: 0.125rem 0 0 #673ab71A !important;
}

/* ==============================================
  STAR
=============================================== */
.deep-purple input.star:checked ~ label.star:before {
    color: #673ab7 !important;
}

/* ==============================================
 STEPS
=============================================== */
.steps.deep-purple .step.active:before {
    color: #673ab7;
}
.steps.deep-purple .step.active:before,
.steps.deep-purple .step.active:after {
    background: #673ab7;
}

/* ==============================================
TABLE
=============================================== */
table.deep-purple td.highlight {
    color: #ffffff;
    background-color: #673ab780;
}
table.deep-purple th.highlight {
    color: #ffffff;
    background-color: #673ab7A0;
}
th.highlight.deep-purple {
    color: #ffffff;
    background-color: #673ab7A0;
}
td.highlight.deep-purple {
    color: #ffffff;
    background-color: #673ab780;
}

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

/* ==============================================
 TEXT
=============================================== */
.text-deep-purple {
    color: #673ab7 !important;
}
.text-deep-purple.active,
.text-deep-purple:active {
    color: #512da8 !important;
}
.text-deep-purple.disabled,
.text-deep-purple:disabled {
    color: #673ab7D9 !important;
}

/* ==============================================
 TOAST
=============================================== */
.toast.deep-purple {
    color: #ffffff !important;
    background-color: #673ab7 !important;
}
.toast.deep-purple a,
.toast.deep-purple i {
    color: #ffffff !important;
}

/* ==============================================
 TOPBAR
=============================================== */
.topbar.deep-purple .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #673ab7 !important;
    border: 1px solid #673ab7 !important;
}
.topbar .dropdown.deep-purple .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #673ab7 !important;
    border-color: #673ab7 !important;
}
/* ==============================================
 A
=============================================== */
a.text-indigo {
    color: #3f51b5;
}
a.text-indigo:hover {
    color: #303f9f !important;
}
a.text-indigo.active,
a.text-indigo:active {
    color: #303f9f;
}
a.text-indigo.focus,
a.text-indigo:focus {
    color: #5c6bc0 !important;
}
a.text-indigo.disabled,
a.text-indigo:disabled {
    color: #3f51b5D9;
}

/* ==============================================
 ALERT
=============================================== */
.alert.indigo {
    color: #ffffff;
    background-color: #5c6bc0;
    border-color: #3f51b5;
}
.alert.indigo hr {
    border-top-color: #ffffff;
}
.alert.indigo .alert-link {
    color: #ffffff;
}

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

/* ==============================================
 BADGE
=============================================== */
.badge.indigo {
    color: #ffffff;
    background-color: #3f51b5;
}
a.badge.indigo:hover,
a.badge.indigo:hover {
    color: #ffffff;
    background-color: #3949ab;
}
.badge.indigo a {
    color: #ffffff !important;
}
.badge.indigo a.hover,
.badge.indigo a:hover {
    color: #ffffff !important;
}
a.badge.indigo.focus,
a.badge.indigo:focus {
    box-shadow: 0 0 0 0.2rem #3f51b580;
}
.badge-avatar.indigo {
    border-color: #3f51b5;
}

/* ==============================================
 BACKGROUND
=============================================== */
.bg-indigo {
    background-color: #3f51b5 !important;
}
.bg-indigo-lighten {
    background-color: #3f51b588 !important;
}
a.bg-indigo:focus,
a.bg-indigo:hover,
button.bg-indigo:focus,
button.bg-indigo:hover {
    background-color: #3949ab !important;
}
.bg-gradient-indigo {
    background-color: #3f51b5;
    background-image: linear-gradient(180deg, #3f51b5 10%, #3f51b5 100%);
}
.bg-indigo,
.bg-indigo.text-indigo,
.bg-indigo-lighten,
.bg-indigo-lighten.text-indigo,
.bg-gradient-indigo,
.bg-gradient-indigo.text-indigo {
    color: #ffffff !important;
}

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

/* ==============================================
 BUTTON
=============================================== */
.btn.indigo.focus,
.btn.indigo:focus {
    box-shadow: 0 0 0 0.2rem #3f51b540;
}
.btn.indigo {
    color: #ffffff;
    background-color: #3f51b5;
    border-color: #3f51b5;
}
.btn.indigo.hover,
.btn.indigo:hover {
    color: #ffffff;
    background-color: #3f51b5;
    border-color: #3949ab;
}
.btn.indigo.focus,
.btn.indigo:focus {
    color: #ffffff;
    background-color: #3f51b5;
    border-color: #3949ab;
    box-shadow: 0 0 0 0.2rem #3f51b580;
}
.btn.indigo.disabled,
.btn.indigo:disabled {
    color: #ffffff;
    background-color: #3f51b5;
    border-color: #3f51b5;
}
.btn.indigo:not(:disabled):not(.disabled).active,
.btn.indigo:not(:disabled):not(.disabled):active,
.show > .btn.indigo.dropdown-toggle {
    color: #ffffff;
    background-color: #3949ab;
    border-color: #3f51b5;
}
.btn.indigo:not(:disabled):not(.disabled).active:focus,
.btn.indigo:not(:disabled):not(.disabled):active:focus,
.show > .btn.indigo.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem #3f51b580;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.indigo {
    color: #3f51b5;
    background-color: #ffffff;
    border-color: #3f51b5;
}
.btn-outline.indigo:hover {
    color: #3f51b5;
    background-color: #ffffff;
    border-color: #3f51b5;
}
.btn-outline.indigo.focus,
.btn-outline.indigo:focus {
    color: #3f51b5;
    background-color: #ffffff;
    border-color: #3f51b5;
    box-shadow: 0 0 0 0.2rem #3f51b580;
}
.btn-outline.indigo.disabled, .btn-outline.indigo:disabled {
    color: #3f51b5;
    background-color: #ffffff;
    border-color: #5c6bc0;
}
.btn-outline.indigo:not(:disabled):not(.disabled).active,
.btn-outline.indigo:not(:disabled):not(.disabled):active,
.show > .btn-outline.indigo.dropdown-toggle {
    color: #3f51b5;
    background-color: #ffffff;
    border-color: #3f51b5;
}
.btn-outline.indigo:not(:disabled):not(.disabled).active:focus,
.btn-outline.indigo:not(:disabled):not(.disabled):active:focus,
.show > .btn-outline.indigo.dropdown-toggle:focus {
    color: #3949ab;
    background-color: #ffffff;
    border-color: #3949ab;
    box-shadow: 0 0 0 0.2rem #3f51b580;
}
.btn-outline.indigo:not(:disabled):not(.disabled).active:hover,
.btn-outline.indigo:not(:disabled):not(.disabled):active:hover,
.show > .btn-outline.indigo.dropdown-toggle:hover {
    color: #3949ab;
    background-color: #ffffff;
    border-color: #3949ab;
    box-shadow: 0 0 0 0.2rem #3f51b5BF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.indigo > .btn-indigo.active {
    color: #ffffff;
    background-color: #3f51b5;
    border-color: #3949ab;
}

.btn-group.indigo .btn-outline:not(:active):not(.active) {
    color: #3f51b5;
    border-color: #3f51b5;
}
.btn-group.indigo .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.indigo .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #3f51b5 !important;
    border-color: #3f51b5;
}
.btn-group.indigo .btn-outline:not(:disabled):not(.disabled).active:focus,
.btn-group.indigo .btn-outline:not(:disabled):not(.disabled):active:focus {
    color: #ffffff;
    background-color: #3949ab !important;
    border-color: #3949ab;
    box-shadow: 0 0 0 0.2rem #3f51b580;
}
.btn-group.indigo .btn-outline:not(:disabled):not(.disabled).active:hover,
.btn-group.indigo .btn-outline:not(:disabled):not(.disabled):active:hover {
    color: #ffffff;
    background-color: #3949ab !important;
    border-color: #3949ab;
    box-shadow: 0 0 0 0.2rem #3f51b5BF;
}

/* ==============================================
 BUTTON LINK
=============================================== */
.btn-link.indigo {
    color: #3f51b5;
}
.btn-link.indigo.hover,
.btn-link.indigo:hover {
    color: #303f9f;
}
.btn-link.indigo.disabled,
.btn-link.indigo:disabled {
    color: #303f9f;
}

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

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

/* ==============================================
 CHECKBOX
=============================================== */
.custom-checkbox.indigo .custom-control-input:indeterminate ~ .custom-control-label::before {
    border-color: #3f51b5;
    background-color: #3f51b5;
}
.custom-checkbox.indigo .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #3f51b54D;
}
.custom-checkbox.indigo .custom-control-input:disabled:indeterminate ~ .custom-control-label::before {
    background-color: #3f51b54D;
}

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

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

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

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

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

/* ==============================================
 DROPDOWN
=============================================== */
.dropdown-item.indigo.active,
.dropdown-item.indigo:active {
    color: #ffffff;
    background-color: #3f51b5;
}
.dropdown-item.indigo.disabled,
.dropdown-item.indigo:disabled {
    color: #3f51b54D;
}
.dropdown.indigo .dropdown-item.active,
.dropdown.indigo .dropdown-item:active {
    color: #ffffff !important;
    background-color: #3f51b5E6 !important;
}
.dropdown.indigo .dropdown-item:active .text-indigo {
    color: #ffffff !important;
}
.dropdown.indigo .dropdown-item.focus,
.dropdown.indigo .dropdown-item:focus {
    color: #ffffff !important;
    background-color: #3f51b5E6 !important;
}
.dropdown.indigo .dropdown-item:focus .text-indigo {
    color: #ffffff !important;
}
.dropdown.indigo .dropdown-item.hover,
.dropdown.indigo .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #3f51b5CC !important;
}
.dropdown.indigo .dropdown-item:hover .text-indigo {
    color: #ffffff !important;
}

/* ==============================================
 ERROR
=============================================== */
.error.indigo:before {
    text-shadow: 1px 0 #3f51b5;
    color: #303f9f;
    background: #f8f9fc;
}

/* ==============================================
 HR
=============================================== */
hr.indigo {
    border-top: 1px solid #3f51b51a;
}

/* ==============================================
 ICONS
=============================================== */
.mdi-indigo {
    color: #3f51b5;
}

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

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

/* ==============================================
 LIST GROUP
=============================================== */
.list-group-item.indigo,
.list-group.indigo .list-group-item {
    color: #ffffff;
    background-color: #3f51b5 !important;
}
.list-group.indigo .list-group-item:focus,
.list-group.indigo .list-group-item:hover,
.list-group-item.indigo.list-group-item:focus,
.list-group-item.indigo.list-group-item:hover {
    color: #ffffff;
    background-color: #5c6bc0 !important;
}
.list-group.indigo .list-group-item.list-group-item-action:focus,
.list-group.indigo .list-group-item.list-group-item-action:hover,
.list-group-item.indigo.list-group-item-action:focus,
.list-group-item.indigo.list-group-item-action:hover {
    color: #ffffff;
    background-color: #5c6bc0 !important;
}
.list-group.indigo .list-group-item.active,
.list-group-item.indigo.active {
    color: #ffffff;
    background-color: #3949ab !important;
    border-color: #3949ab;
}
.list-group.indigo .list-group-item.disabled,
.list-group-item.indigo.disabled {
    color: #ffffff;
    background-color: #303f9fA9 !important;
}

/* ==============================================
 LOADING
=============================================== */
.loading.indigo .spinner-border {
    color: #3f51b5 !important;
}

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

/* ==============================================
 NAV
=============================================== */
.nav.indigo {
    color: #3f51b5;
}
.nav.indigo .nav-link {
    color: #3f51b5;
}
.nav.indigo .nav-link.disabled {
    color: #3f51b580 !important;
}
.nav.indigo .nav-link.bordered {
    border: 1px solid #3f51b5;
}

.nav-link.indigo a {
    color: #3f51b5;
}
.nav-link.indigo.disabled {
    color: #3f51b54D;
}

.nav.bg-indigo,
.nav.bg-indigo .nav-link,
.nav.bg-indigo .nav-link.active {
    background-color: #3f51b5;
    color: #ffffff;
    border: 1px solid #3949ab;
}
.nav.bg-indigo .nav-link.active {
    text-decoration: underline;
}

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

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

.nav-pills .nav-item.indigo a {
    color: #3f51b5;
}
.nav-pills .nav-item.indigo a.disabled {
    color: #3f51b580 !important;
}
.nav-pills .nav-item.indigo .nav-link.active,
.nav-pills .nav-item.indigo .show > .nav-link {
    color: #ffffff;
    background-color: #3f51b5;
    border: 1px solid #3f51b5;
}

/* ==============================================
NAV TABS
=============================================== */
.nav-tabs.indigo .nav-link:not(.active):hover {
    border-color: transparent !important;
}

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

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

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

/* ==============================================
 PROGRESS
=============================================== */
.progress.indigo .progress-bar {
    color: #ffffff;
    background-color: #3f51b5;
}

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

@-webkit-keyframes pulse-indigo {
    0% {
        -webkit-box-shadow: 0 0 0 0 #3f51b566;
    }
    70% {
        -webkit-box-shadow: 0 0 0 10px #3f51b500;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 #3f51b500;
    }
}
@keyframes pulse-indigo {
    0% {
        -moz-box-shadow: 0 0 0 0 #3f51b566;
        box-shadow: 0 0 0 0 #3f51b566;
    }
    70% {
        -moz-box-shadow: 0 0 0 10px #3f51b500;
        box-shadow: 0 0 0 10px #3f51b500;
    }
    100% {
        -moz-box-shadow: 0 0 0 0 #3f51b500;
        box-shadow: 0 0 0 0 #3f51b500;
    }
}

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

.indigo .bootstrap-select .dropdown-item.active,
.indigo .bootstrap-select .dropdown-item:active {
    color: #ffffff !important;
    background-color: #3f51b5 !important;
}
.indigo .bootstrap-select .dropdown-item.hover,
.indigo .bootstrap-select .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #3f51b5BF !important;
}
.indigo .bootstrap-select.show-tick .dropdown-menu .selected span.check-mark {
    color: #3f51b5;
}

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

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

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

/* ==============================================
  STAR
=============================================== */
.indigo input.star:checked ~ label.star:before {
    color: #3f51b5 !important;
}

/* ==============================================
 STEPS
=============================================== */
.steps.indigo .step.active:before {
    color: #3f51b5;
}
.steps.indigo .step.active:before,
.steps.indigo .step.active:after {
    background: #3f51b5;
}

/* ==============================================
TABLE
=============================================== */
table.indigo td.highlight {
    color: #ffffff;
    background-color: #3f51b580;
}
table.indigo th.highlight {
    color: #ffffff;
    background-color: #3f51b5A0;
}
th.highlight.indigo {
    color: #ffffff;
    background-color: #3f51b5A0;
}
td.highlight.indigo {
    color: #ffffff;
    background-color: #3f51b580;
}

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

/* ==============================================
 TEXT
=============================================== */
.text-indigo {
    color: #3f51b5 !important;
}
.text-indigo.active,
.text-indigo:active {
    color: #303f9f !important;
}
.text-indigo.disabled,
.text-indigo:disabled {
    color: #3f51b5D9 !important;
}

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

/* ==============================================
 TOPBAR
=============================================== */
.topbar.indigo .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #3f51b5 !important;
    border: 1px solid #3f51b5 !important;
}
.topbar .dropdown.indigo .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #3f51b5 !important;
    border-color: #3f51b5 !important;
}
/* ==============================================
 A
=============================================== */
a.text-blue {
    color: #2196f3;
}
a.text-blue:hover {
    color: #1976d2 !important;
}
a.text-blue.active,
a.text-blue:active {
    color: #1976d2;
}
a.text-blue.focus,
a.text-blue:focus {
    color: #42a5f5 !important;
}
a.text-blue.disabled,
a.text-blue:disabled {
    color: #2196f3D9;
}

/* ==============================================
 ALERT
=============================================== */
.alert.blue {
    color: #ffffff;
    background-color: #42a5f5;
    border-color: #2196f3;
}
.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: #2196f3;
}

/* ==============================================
 BADGE
=============================================== */
.badge.blue {
    color: #ffffff;
    background-color: #2196f3;
}
a.badge.blue:hover,
a.badge.blue:hover {
    color: #ffffff;
    background-color: #1e88e5;
}
.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 #2196f380;
}
.badge-avatar.blue {
    border-color: #2196f3;
}

/* ==============================================
 BACKGROUND
=============================================== */
.bg-blue {
    background-color: #2196f3 !important;
}
.bg-blue-lighten {
    background-color: #2196f388 !important;
}
a.bg-blue:focus,
a.bg-blue:hover,
button.bg-blue:focus,
button.bg-blue:hover {
    background-color: #1e88e5 !important;
}
.bg-gradient-blue {
    background-color: #2196f3;
    background-image: linear-gradient(180deg, #2196f3 10%, #2196f3 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 #2196f3 !important;
}
.border-top-blue {
    border-top: 0.25rem solid #2196f3 !important;
}
.border-right-blue {
    border-right: 0.25rem solid #2196f3 !important;
}
.border-bottom-blue {
    border-bottom: 0.25rem solid #2196f3 !important;
}
.border-left-blue {
    border-left: 0.25rem solid #2196f3 !important;
}
.border-thin-blue {
    border: 1px solid #2196f3 !important;
}
.border-top-thin-blue {
    border-top: 1px solid #2196f3 !important;
}
.border-right-thin-blue {
    border-right: 1px solid #2196f3 !important;
}
.border-bottom-thin-blue {
    border-bottom: 1px solid #2196f3 !important;
}
.border-left-thin-blue {
    border-left: 3px solid #2196f3 !important;
}
.border-thick-blue {
    border: 3px solid #2196f3 !important;
}
.border-top-thick-blue {
    border-top: 3px solid #2196f3 !important;
}
.border-right-thick-blue {
    border-right: 3px solid #2196f3 !important;
}
.border-bottom-thick-blue {
    border-bottom: 3px solid #2196f3 !important;
}
.border-left-thick-blue {
    border-left: 3px solid #2196f3 !important;
}

/* ==============================================
 BUTTON
=============================================== */
.btn.blue.focus,
.btn.blue:focus {
    box-shadow: 0 0 0 0.2rem #2196f340;
}
.btn.blue {
    color: #ffffff;
    background-color: #2196f3;
    border-color: #2196f3;
}
.btn.blue.hover,
.btn.blue:hover {
    color: #ffffff;
    background-color: #2196f3;
    border-color: #1e88e5;
}
.btn.blue.focus,
.btn.blue:focus {
    color: #ffffff;
    background-color: #2196f3;
    border-color: #1e88e5;
    box-shadow: 0 0 0 0.2rem #2196f380;
}
.btn.blue.disabled,
.btn.blue:disabled {
    color: #ffffff;
    background-color: #2196f3;
    border-color: #2196f3;
}
.btn.blue:not(:disabled):not(.disabled).active,
.btn.blue:not(:disabled):not(.disabled):active,
.show > .btn.blue.dropdown-toggle {
    color: #ffffff;
    background-color: #1e88e5;
    border-color: #2196f3;
}
.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 #2196f380;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.blue {
    color: #2196f3;
    background-color: #ffffff;
    border-color: #2196f3;
}
.btn-outline.blue:hover {
    color: #2196f3;
    background-color: #ffffff;
    border-color: #2196f3;
}
.btn-outline.blue.focus,
.btn-outline.blue:focus {
    color: #2196f3;
    background-color: #ffffff;
    border-color: #2196f3;
    box-shadow: 0 0 0 0.2rem #2196f380;
}
.btn-outline.blue.disabled, .btn-outline.blue:disabled {
    color: #2196f3;
    background-color: #ffffff;
    border-color: #42a5f5;
}
.btn-outline.blue:not(:disabled):not(.disabled).active,
.btn-outline.blue:not(:disabled):not(.disabled):active,
.show > .btn-outline.blue.dropdown-toggle {
    color: #2196f3;
    background-color: #ffffff;
    border-color: #2196f3;
}
.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: #1e88e5;
    background-color: #ffffff;
    border-color: #1e88e5;
    box-shadow: 0 0 0 0.2rem #2196f380;
}
.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: #1e88e5;
    background-color: #ffffff;
    border-color: #1e88e5;
    box-shadow: 0 0 0 0.2rem #2196f3BF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.blue > .btn-blue.active {
    color: #ffffff;
    background-color: #2196f3;
    border-color: #1e88e5;
}

.btn-group.blue .btn-outline:not(:active):not(.active) {
    color: #2196f3;
    border-color: #2196f3;
}
.btn-group.blue .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.blue .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #2196f3 !important;
    border-color: #2196f3;
}
.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: #1e88e5 !important;
    border-color: #1e88e5;
    box-shadow: 0 0 0 0.2rem #2196f380;
}
.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: #1e88e5 !important;
    border-color: #1e88e5;
    box-shadow: 0 0 0 0.2rem #2196f3BF;
}

/* ==============================================
 BUTTON LINK
=============================================== */
.btn-link.blue {
    color: #2196f3;
}
.btn-link.blue.hover,
.btn-link.blue:hover {
    color: #1976d2;
}
.btn-link.blue.disabled,
.btn-link.blue:disabled {
    color: #1976d2;
}

/* ==============================================
BREADCRUMBS
=============================================== */
.breadcrumb.blue .breadcrumb-item a {
    color: #2196f3;
}
.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: #2196f3 !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: #2196f3;
    background-color: #2196f3;
}
.custom-checkbox.blue .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #2196f34D;
}
.custom-checkbox.blue .custom-control-input:disabled:indeterminate ~ .custom-control-label::before {
    background-color: #2196f34D;
}

/* ==============================================
 CUSTOM CONTROL
=============================================== */
.custom-control.blue .custom-control-input:checked ~ .custom-control-label::before {
    color: #ffffff;
    border-color: #ffffff;
    background-color: #2196f3;
}
.custom-control.blue .custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: 0 0 0.2rem #2196f340;
}
.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: #2196f3;
}
.custom-radio.blue .custom-control-input:disabled~.custom-control-label::before {
    background-color: #2196f34D;
}
.custom-radio.blue .custom-control-input:focus~.custom-control-label::before {
    box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem #2196f366;
}
.custom-radio.blue .custom-control-input:checked~.custom-control-label::after {
    color: #2196f3;
}

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

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

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

/* ==============================================
 DROPDOWN
=============================================== */
.dropdown-item.blue.active,
.dropdown-item.blue:active {
    color: #ffffff;
    background-color: #2196f3;
}
.dropdown-item.blue.disabled,
.dropdown-item.blue:disabled {
    color: #2196f34D;
}
.dropdown.blue .dropdown-item.active,
.dropdown.blue .dropdown-item:active {
    color: #ffffff !important;
    background-color: #2196f3E6 !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: #2196f3E6 !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: #2196f3CC !important;
}
.dropdown.blue .dropdown-item:hover .text-blue {
    color: #ffffff !important;
}

/* ==============================================
 ERROR
=============================================== */
.error.blue:before {
    text-shadow: 1px 0 #2196f3;
    color: #1976d2;
    background: #f8f9fc;
}

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

/* ==============================================
 ICONS
=============================================== */
.mdi-blue {
    color: #2196f3;
}

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

/* ==============================================
 JUMBOTRON
=============================================== */
.jumbotron.blue {
    color: #ffffff;
    background-color: #2196f3;
}
.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: #2196f3 !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: #42a5f5 !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: #42a5f5 !important;
}
.list-group.blue .list-group-item.active,
.list-group-item.blue.active {
    color: #ffffff;
    background-color: #1e88e5 !important;
    border-color: #1e88e5;
}
.list-group.blue .list-group-item.disabled,
.list-group-item.blue.disabled {
    color: #ffffff;
    background-color: #1976d2A9 !important;
}

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

/* ==============================================
 MODAL
=============================================== */
.modal-header.blue {
    background-color: #2196f3;
    color: #ffffff;
}
.modal-header.blue a {
    color: #ffffff;
}
.modal-header.text-blue .modal-title,
.modal-header.text-blue a {
    color: #2196f3;
}
.modal .nav-tabs.bg-blue {
    background-color: #2196f3 !important;
    color: #ffffff !important;
    border: 1px solid #2196f3 !important;
}
.modal .nav-tabs.bg-blue .nav-link {
    border: 1px solid #2196f3 !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: #2196f3;
}
.nav.blue .nav-link {
    color: #2196f3;
}
.nav.blue .nav-link.disabled {
    color: #2196f380 !important;
}
.nav.blue .nav-link.bordered {
    border: 1px solid #2196f3;
}

.nav-link.blue a {
    color: #2196f3;
}
.nav-link.blue.disabled {
    color: #2196f34D;
}

.nav.bg-blue,
.nav.bg-blue .nav-link,
.nav.bg-blue .nav-link.active {
    background-color: #2196f3;
    color: #ffffff;
    border: 1px solid #1e88e5;
}
.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 #2196f3 !important;
}
.nav-vertical.blue .nav-item a.active {
    border-left: 2px solid #2196f3 !important;
}
.nav-vertical.blue .nav-link.disabled {
    cursor: not-allowed;
    color: #2196f3BF !important;
}

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

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

/* ==============================================
NAV TABS
=============================================== */
.nav-tabs.blue .nav-link:not(.active):hover {
    border-color: transparent !important;
}

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

/* ==============================================
 NAVBAR
=============================================== */
.navbar.blue {
    color: #ffffffE6 !important;
    background-color: #2196f3 !important;
}
.navbar.blue #sidebarToggleTop,
.navbar.blue #sidebarToggleTop i {
    color: #ffffffE6 !important;
    background-color: #2196f3 !important;
    border: none;
}
.navbar.blue #sidebarToggleTop:active {
    border-color: #2196f3E6;
}
.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: #2196f31A;
}
.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: #2196f3;
    border: 1px solid #dddfeb;
}
.pagination.blue .page-link.hover,
.pagination.blue .page-link:hover {
    color: #ffffff;
    background-color: #2196f3BF;
    border-color: #dddfeb;
}
.pagination.blue .page-link.focus,
.pagination.blue .page-link:focus {
    box-shadow: 0 0 0.2rem #2196f340 !important;
}
.pagination.blue .page-item.active .page-link {
    color: #ffffff;
    background-color: #2196f3;
    border-color: #2196f3;
}
.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: #2196f3;
}

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

@-webkit-keyframes pulse-blue {
    0% {
        -webkit-box-shadow: 0 0 0 0 #2196f366;
    }
    70% {
        -webkit-box-shadow: 0 0 0 10px #2196f300;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 #2196f300;
    }
}
@keyframes pulse-blue {
    0% {
        -moz-box-shadow: 0 0 0 0 #2196f366;
        box-shadow: 0 0 0 0 #2196f366;
    }
    70% {
        -moz-box-shadow: 0 0 0 10px #2196f300;
        box-shadow: 0 0 0 10px #2196f300;
    }
    100% {
        -moz-box-shadow: 0 0 0 0 #2196f300;
        box-shadow: 0 0 0 0 #2196f300;
    }
}

/* ==============================================
 SELECT
=============================================== */
.blue select option:checked,
.blue select option:hover {
    box-shadow: 0 0 10px 100px #2196f3 inset;
}
.blue select:focus > option:checked {
    color: #ffffff !important;
    background-color: #2196f340 !important;
}
.blue .custom-select {
    color: #6e707e;
}
.blue .custom-select:focus {
    border-color: #bac8f3;
    box-shadow: 0 0 0.2rem #2196f340;
}
.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: #2196f3 !important;
}
.blue .bootstrap-select .dropdown-item.hover,
.blue .bootstrap-select .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #2196f3BF !important;
}
.blue .bootstrap-select.show-tick .dropdown-menu .selected span.check-mark {
    color: #2196f3;
}

/* ==============================================
 SIDEBAR
=============================================== */
.sidebar.blue .nav-item .collapse .collapse-inner .collapse-item.active,
.sidebar.blue .nav-item .collapsing .collapse-inner .collapse-item.active {
    color: #2196f3;
}
.sidebar.blue {
    color: #ffffff;
    background-color: #2196f3;
}
.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: #1976d2;
}
.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: #1976d2;
}
.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: #1976d2;
}
.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: #2196f333;
}
.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 #2196f31A !important;
}

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

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

/* ==============================================
TABLE
=============================================== */
table.blue td.highlight {
    color: #ffffff;
    background-color: #2196f380;
}
table.blue th.highlight {
    color: #ffffff;
    background-color: #2196f3A0;
}
th.highlight.blue {
    color: #ffffff;
    background-color: #2196f3A0;
}
td.highlight.blue {
    color: #ffffff;
    background-color: #2196f380;
}

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

/* ==============================================
 TEXT
=============================================== */
.text-blue {
    color: #2196f3 !important;
}
.text-blue.active,
.text-blue:active {
    color: #1976d2 !important;
}
.text-blue.disabled,
.text-blue:disabled {
    color: #2196f3D9 !important;
}

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

/* ==============================================
 TOPBAR
=============================================== */
.topbar.blue .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #2196f3 !important;
    border: 1px solid #2196f3 !important;
}
.topbar .dropdown.blue .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #2196f3 !important;
    border-color: #2196f3 !important;
}
/* ==============================================
 A
=============================================== */
a.text-light-blue {
    color: #03a9f4;
}
a.text-light-blue:hover {
    color: #0288d1 !important;
}
a.text-light-blue.active,
a.text-light-blue:active {
    color: #0288d1;
}
a.text-light-blue.focus,
a.text-light-blue:focus {
    color: #29b6f6 !important;
}
a.text-light-blue.disabled,
a.text-light-blue:disabled {
    color: #03a9f4D9;
}

/* ==============================================
 ALERT
=============================================== */
.alert.light-blue {
    color: #ffffff;
    background-color: #29b6f6;
    border-color: #03a9f4;
}
.alert.light-blue hr {
    border-top-color: #ffffff;
}
.alert.light-blue .alert-link {
    color: #ffffff;
}

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

/* ==============================================
 BADGE
=============================================== */
.badge.light-blue {
    color: #ffffff;
    background-color: #03a9f4;
}
a.badge.light-blue:hover,
a.badge.light-blue:hover {
    color: #ffffff;
    background-color: #039be5;
}
.badge.light-blue a {
    color: #ffffff !important;
}
.badge.light-blue a.hover,
.badge.light-blue a:hover {
    color: #ffffff !important;
}
a.badge.light-blue.focus,
a.badge.light-blue:focus {
    box-shadow: 0 0 0 0.2rem #03a9f480;
}
.badge-avatar.light-blue {
    border-color: #03a9f4;
}

/* ==============================================
 BACKGROUND
=============================================== */
.bg-light-blue {
    background-color: #03a9f4 !important;
}
.bg-light-blue-lighten {
    background-color: #03a9f488 !important;
}
a.bg-light-blue:focus,
a.bg-light-blue:hover,
button.bg-light-blue:focus,
button.bg-light-blue:hover {
    background-color: #039be5 !important;
}
.bg-gradient-light-blue {
    background-color: #03a9f4;
    background-image: linear-gradient(180deg, #03a9f4 10%, #03a9f4 100%);
}
.bg-light-blue,
.bg-light-blue.text-light-blue,
.bg-light-blue-lighten,
.bg-light-blue-lighten.text-light-blue,
.bg-gradient-light-blue,
.bg-gradient-light-blue.text-light-blue {
    color: #ffffff !important;
}

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

/* ==============================================
 BUTTON
=============================================== */
.btn.light-blue.focus,
.btn.light-blue:focus {
    box-shadow: 0 0 0 0.2rem #03a9f440;
}
.btn.light-blue {
    color: #ffffff;
    background-color: #03a9f4;
    border-color: #03a9f4;
}
.btn.light-blue.hover,
.btn.light-blue:hover {
    color: #ffffff;
    background-color: #03a9f4;
    border-color: #039be5;
}
.btn.light-blue.focus,
.btn.light-blue:focus {
    color: #ffffff;
    background-color: #03a9f4;
    border-color: #039be5;
    box-shadow: 0 0 0 0.2rem #03a9f480;
}
.btn.light-blue.disabled,
.btn.light-blue:disabled {
    color: #ffffff;
    background-color: #03a9f4;
    border-color: #03a9f4;
}
.btn.light-blue:not(:disabled):not(.disabled).active,
.btn.light-blue:not(:disabled):not(.disabled):active,
.show > .btn.light-blue.dropdown-toggle {
    color: #ffffff;
    background-color: #039be5;
    border-color: #03a9f4;
}
.btn.light-blue:not(:disabled):not(.disabled).active:focus,
.btn.light-blue:not(:disabled):not(.disabled):active:focus,
.show > .btn.light-blue.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem #03a9f480;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.light-blue {
    color: #03a9f4;
    background-color: #ffffff;
    border-color: #03a9f4;
}
.btn-outline.light-blue:hover {
    color: #03a9f4;
    background-color: #ffffff;
    border-color: #03a9f4;
}
.btn-outline.light-blue.focus,
.btn-outline.light-blue:focus {
    color: #03a9f4;
    background-color: #ffffff;
    border-color: #03a9f4;
    box-shadow: 0 0 0 0.2rem #03a9f480;
}
.btn-outline.light-blue.disabled, .btn-outline.light-blue:disabled {
    color: #03a9f4;
    background-color: #ffffff;
    border-color: #29b6f6;
}
.btn-outline.light-blue:not(:disabled):not(.disabled).active,
.btn-outline.light-blue:not(:disabled):not(.disabled):active,
.show > .btn-outline.light-blue.dropdown-toggle {
    color: #03a9f4;
    background-color: #ffffff;
    border-color: #03a9f4;
}
.btn-outline.light-blue:not(:disabled):not(.disabled).active:focus,
.btn-outline.light-blue:not(:disabled):not(.disabled):active:focus,
.show > .btn-outline.light-blue.dropdown-toggle:focus {
    color: #039be5;
    background-color: #ffffff;
    border-color: #039be5;
    box-shadow: 0 0 0 0.2rem #03a9f480;
}
.btn-outline.light-blue:not(:disabled):not(.disabled).active:hover,
.btn-outline.light-blue:not(:disabled):not(.disabled):active:hover,
.show > .btn-outline.light-blue.dropdown-toggle:hover {
    color: #039be5;
    background-color: #ffffff;
    border-color: #039be5;
    box-shadow: 0 0 0 0.2rem #03a9f4BF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.light-blue > .btn-light-blue.active {
    color: #ffffff;
    background-color: #03a9f4;
    border-color: #039be5;
}

.btn-group.light-blue .btn-outline:not(:active):not(.active) {
    color: #03a9f4;
    border-color: #03a9f4;
}
.btn-group.light-blue .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.light-blue .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #03a9f4 !important;
    border-color: #03a9f4;
}
.btn-group.light-blue .btn-outline:not(:disabled):not(.disabled).active:focus,
.btn-group.light-blue .btn-outline:not(:disabled):not(.disabled):active:focus {
    color: #ffffff;
    background-color: #039be5 !important;
    border-color: #039be5;
    box-shadow: 0 0 0 0.2rem #03a9f480;
}
.btn-group.light-blue .btn-outline:not(:disabled):not(.disabled).active:hover,
.btn-group.light-blue .btn-outline:not(:disabled):not(.disabled):active:hover {
    color: #ffffff;
    background-color: #039be5 !important;
    border-color: #039be5;
    box-shadow: 0 0 0 0.2rem #03a9f4BF;
}

/* ==============================================
 BUTTON LINK
=============================================== */
.btn-link.light-blue {
    color: #03a9f4;
}
.btn-link.light-blue.hover,
.btn-link.light-blue:hover {
    color: #0288d1;
}
.btn-link.light-blue.disabled,
.btn-link.light-blue:disabled {
    color: #0288d1;
}

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

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

/* ==============================================
 CHECKBOX
=============================================== */
.custom-checkbox.light-blue .custom-control-input:indeterminate ~ .custom-control-label::before {
    border-color: #03a9f4;
    background-color: #03a9f4;
}
.custom-checkbox.light-blue .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #03a9f44D;
}
.custom-checkbox.light-blue .custom-control-input:disabled:indeterminate ~ .custom-control-label::before {
    background-color: #03a9f44D;
}

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

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

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

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

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

/* ==============================================
 DROPDOWN
=============================================== */
.dropdown-item.light-blue.active,
.dropdown-item.light-blue:active {
    color: #ffffff;
    background-color: #03a9f4;
}
.dropdown-item.light-blue.disabled,
.dropdown-item.light-blue:disabled {
    color: #03a9f44D;
}
.dropdown.light-blue .dropdown-item.active,
.dropdown.light-blue .dropdown-item:active {
    color: #ffffff !important;
    background-color: #03a9f4E6 !important;
}
.dropdown.light-blue .dropdown-item:active .text-light-blue {
    color: #ffffff !important;
}
.dropdown.light-blue .dropdown-item.focus,
.dropdown.light-blue .dropdown-item:focus {
    color: #ffffff !important;
    background-color: #03a9f4E6 !important;
}
.dropdown.light-blue .dropdown-item:focus .text-light-blue {
    color: #ffffff !important;
}
.dropdown.light-blue .dropdown-item.hover,
.dropdown.light-blue .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #03a9f4CC !important;
}
.dropdown.light-blue .dropdown-item:hover .text-light-blue {
    color: #ffffff !important;
}

/* ==============================================
 ERROR
=============================================== */
.error.light-blue:before {
    text-shadow: 1px 0 #03a9f4;
    color: #0288d1;
    background: #f8f9fc;
}

/* ==============================================
 HR
=============================================== */
hr.light-blue {
    border-top: 1px solid #03a9f41a;
}

/* ==============================================
 ICONS
=============================================== */
.mdi-light-blue {
    color: #03a9f4;
}

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

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

/* ==============================================
 LIST GROUP
=============================================== */
.list-group-item.light-blue,
.list-group.light-blue .list-group-item {
    color: #ffffff;
    background-color: #03a9f4 !important;
}
.list-group.light-blue .list-group-item:focus,
.list-group.light-blue .list-group-item:hover,
.list-group-item.light-blue.list-group-item:focus,
.list-group-item.light-blue.list-group-item:hover {
    color: #ffffff;
    background-color: #29b6f6 !important;
}
.list-group.light-blue .list-group-item.list-group-item-action:focus,
.list-group.light-blue .list-group-item.list-group-item-action:hover,
.list-group-item.light-blue.list-group-item-action:focus,
.list-group-item.light-blue.list-group-item-action:hover {
    color: #ffffff;
    background-color: #29b6f6 !important;
}
.list-group.light-blue .list-group-item.active,
.list-group-item.light-blue.active {
    color: #ffffff;
    background-color: #039be5 !important;
    border-color: #039be5;
}
.list-group.light-blue .list-group-item.disabled,
.list-group-item.light-blue.disabled {
    color: #ffffff;
    background-color: #0288d1A9 !important;
}

/* ==============================================
 LOADING
=============================================== */
.loading.light-blue .spinner-border {
    color: #03a9f4 !important;
}

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

/* ==============================================
 NAV
=============================================== */
.nav.light-blue {
    color: #03a9f4;
}
.nav.light-blue .nav-link {
    color: #03a9f4;
}
.nav.light-blue .nav-link.disabled {
    color: #03a9f480 !important;
}
.nav.light-blue .nav-link.bordered {
    border: 1px solid #03a9f4;
}

.nav-link.light-blue a {
    color: #03a9f4;
}
.nav-link.light-blue.disabled {
    color: #03a9f44D;
}

.nav.bg-light-blue,
.nav.bg-light-blue .nav-link,
.nav.bg-light-blue .nav-link.active {
    background-color: #03a9f4;
    color: #ffffff;
    border: 1px solid #039be5;
}
.nav.bg-light-blue .nav-link.active {
    text-decoration: underline;
}

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

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

.nav-pills .nav-item.light-blue a {
    color: #03a9f4;
}
.nav-pills .nav-item.light-blue a.disabled {
    color: #03a9f480 !important;
}
.nav-pills .nav-item.light-blue .nav-link.active,
.nav-pills .nav-item.light-blue .show > .nav-link {
    color: #ffffff;
    background-color: #03a9f4;
    border: 1px solid #03a9f4;
}

/* ==============================================
NAV TABS
=============================================== */
.nav-tabs.light-blue .nav-link:not(.active):hover {
    border-color: transparent !important;
}

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

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

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

/* ==============================================
 PROGRESS
=============================================== */
.progress.light-blue .progress-bar {
    color: #ffffff;
    background-color: #03a9f4;
}

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

@-webkit-keyframes pulse-light-blue {
    0% {
        -webkit-box-shadow: 0 0 0 0 #03a9f466;
    }
    70% {
        -webkit-box-shadow: 0 0 0 10px #03a9f400;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 #03a9f400;
    }
}
@keyframes pulse-light-blue {
    0% {
        -moz-box-shadow: 0 0 0 0 #03a9f466;
        box-shadow: 0 0 0 0 #03a9f466;
    }
    70% {
        -moz-box-shadow: 0 0 0 10px #03a9f400;
        box-shadow: 0 0 0 10px #03a9f400;
    }
    100% {
        -moz-box-shadow: 0 0 0 0 #03a9f400;
        box-shadow: 0 0 0 0 #03a9f400;
    }
}

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

.light-blue .bootstrap-select .dropdown-item.active,
.light-blue .bootstrap-select .dropdown-item:active {
    color: #ffffff !important;
    background-color: #03a9f4 !important;
}
.light-blue .bootstrap-select .dropdown-item.hover,
.light-blue .bootstrap-select .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #03a9f4BF !important;
}
.light-blue .bootstrap-select.show-tick .dropdown-menu .selected span.check-mark {
    color: #03a9f4;
}

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

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

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

/* ==============================================
  STAR
=============================================== */
.light-blue input.star:checked ~ label.star:before {
    color: #03a9f4 !important;
}

/* ==============================================
 STEPS
=============================================== */
.steps.light-blue .step.active:before {
    color: #03a9f4;
}
.steps.light-blue .step.active:before,
.steps.light-blue .step.active:after {
    background: #03a9f4;
}

/* ==============================================
TABLE
=============================================== */
table.light-blue td.highlight {
    color: #ffffff;
    background-color: #03a9f480;
}
table.light-blue th.highlight {
    color: #ffffff;
    background-color: #03a9f4A0;
}
th.highlight.light-blue {
    color: #ffffff;
    background-color: #03a9f4A0;
}
td.highlight.light-blue {
    color: #ffffff;
    background-color: #03a9f480;
}

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

/* ==============================================
 TEXT
=============================================== */
.text-light-blue {
    color: #03a9f4 !important;
}
.text-light-blue.active,
.text-light-blue:active {
    color: #0288d1 !important;
}
.text-light-blue.disabled,
.text-light-blue:disabled {
    color: #03a9f4D9 !important;
}

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

/* ==============================================
 TOPBAR
=============================================== */
.topbar.light-blue .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #03a9f4 !important;
    border: 1px solid #03a9f4 !important;
}
.topbar .dropdown.light-blue .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #03a9f4 !important;
    border-color: #03a9f4 !important;
}
/* ==============================================
 A
=============================================== */
a.text-cyan {
    color: #00bcd4;
}
a.text-cyan:hover {
    color: #0097a7 !important;
}
a.text-cyan.active,
a.text-cyan:active {
    color: #0097a7;
}
a.text-cyan.focus,
a.text-cyan:focus {
    color: #26c6da !important;
}
a.text-cyan.disabled,
a.text-cyan:disabled {
    color: #00bcd4D9;
}

/* ==============================================
 ALERT
=============================================== */
.alert.cyan {
    color: #ffffff;
    background-color: #26c6da;
    border-color: #00bcd4;
}
.alert.cyan hr {
    border-top-color: #ffffff;
}
.alert.cyan .alert-link {
    color: #ffffff;
}

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

/* ==============================================
 BADGE
=============================================== */
.badge.cyan {
    color: #ffffff;
    background-color: #00bcd4;
}
a.badge.cyan:hover,
a.badge.cyan:hover {
    color: #ffffff;
    background-color: #00acc1;
}
.badge.cyan a {
    color: #ffffff !important;
}
.badge.cyan a.hover,
.badge.cyan a:hover {
    color: #ffffff !important;
}
a.badge.cyan.focus,
a.badge.cyan:focus {
    box-shadow: 0 0 0 0.2rem #00bcd480;
}
.badge-avatar.cyan {
    border-color: #00bcd4;
}

/* ==============================================
 BACKGROUND
=============================================== */
.bg-cyan {
    background-color: #00bcd4 !important;
}
.bg-cyan-lighten {
    background-color: #00bcd488 !important;
}
a.bg-cyan:focus,
a.bg-cyan:hover,
button.bg-cyan:focus,
button.bg-cyan:hover {
    background-color: #00acc1 !important;
}
.bg-gradient-cyan {
    background-color: #00bcd4;
    background-image: linear-gradient(180deg, #00bcd4 10%, #00bcd4 100%);
}
.bg-cyan,
.bg-cyan.text-cyan,
.bg-cyan-lighten,
.bg-cyan-lighten.text-cyan,
.bg-gradient-cyan,
.bg-gradient-cyan.text-cyan {
    color: #ffffff !important;
}

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

/* ==============================================
 BUTTON
=============================================== */
.btn.cyan.focus,
.btn.cyan:focus {
    box-shadow: 0 0 0 0.2rem #00bcd440;
}
.btn.cyan {
    color: #ffffff;
    background-color: #00bcd4;
    border-color: #00bcd4;
}
.btn.cyan.hover,
.btn.cyan:hover {
    color: #ffffff;
    background-color: #00bcd4;
    border-color: #00acc1;
}
.btn.cyan.focus,
.btn.cyan:focus {
    color: #ffffff;
    background-color: #00bcd4;
    border-color: #00acc1;
    box-shadow: 0 0 0 0.2rem #00bcd480;
}
.btn.cyan.disabled,
.btn.cyan:disabled {
    color: #ffffff;
    background-color: #00bcd4;
    border-color: #00bcd4;
}
.btn.cyan:not(:disabled):not(.disabled).active,
.btn.cyan:not(:disabled):not(.disabled):active,
.show > .btn.cyan.dropdown-toggle {
    color: #ffffff;
    background-color: #00acc1;
    border-color: #00bcd4;
}
.btn.cyan:not(:disabled):not(.disabled).active:focus,
.btn.cyan:not(:disabled):not(.disabled):active:focus,
.show > .btn.cyan.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem #00bcd480;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.cyan {
    color: #00bcd4;
    background-color: #ffffff;
    border-color: #00bcd4;
}
.btn-outline.cyan:hover {
    color: #00bcd4;
    background-color: #ffffff;
    border-color: #00bcd4;
}
.btn-outline.cyan.focus,
.btn-outline.cyan:focus {
    color: #00bcd4;
    background-color: #ffffff;
    border-color: #00bcd4;
    box-shadow: 0 0 0 0.2rem #00bcd480;
}
.btn-outline.cyan.disabled, .btn-outline.cyan:disabled {
    color: #00bcd4;
    background-color: #ffffff;
    border-color: #26c6da;
}
.btn-outline.cyan:not(:disabled):not(.disabled).active,
.btn-outline.cyan:not(:disabled):not(.disabled):active,
.show > .btn-outline.cyan.dropdown-toggle {
    color: #00bcd4;
    background-color: #ffffff;
    border-color: #00bcd4;
}
.btn-outline.cyan:not(:disabled):not(.disabled).active:focus,
.btn-outline.cyan:not(:disabled):not(.disabled):active:focus,
.show > .btn-outline.cyan.dropdown-toggle:focus {
    color: #00acc1;
    background-color: #ffffff;
    border-color: #00acc1;
    box-shadow: 0 0 0 0.2rem #00bcd480;
}
.btn-outline.cyan:not(:disabled):not(.disabled).active:hover,
.btn-outline.cyan:not(:disabled):not(.disabled):active:hover,
.show > .btn-outline.cyan.dropdown-toggle:hover {
    color: #00acc1;
    background-color: #ffffff;
    border-color: #00acc1;
    box-shadow: 0 0 0 0.2rem #00bcd4BF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.cyan > .btn-cyan.active {
    color: #ffffff;
    background-color: #00bcd4;
    border-color: #00acc1;
}

.btn-group.cyan .btn-outline:not(:active):not(.active) {
    color: #00bcd4;
    border-color: #00bcd4;
}
.btn-group.cyan .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.cyan .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #00bcd4 !important;
    border-color: #00bcd4;
}
.btn-group.cyan .btn-outline:not(:disabled):not(.disabled).active:focus,
.btn-group.cyan .btn-outline:not(:disabled):not(.disabled):active:focus {
    color: #ffffff;
    background-color: #00acc1 !important;
    border-color: #00acc1;
    box-shadow: 0 0 0 0.2rem #00bcd480;
}
.btn-group.cyan .btn-outline:not(:disabled):not(.disabled).active:hover,
.btn-group.cyan .btn-outline:not(:disabled):not(.disabled):active:hover {
    color: #ffffff;
    background-color: #00acc1 !important;
    border-color: #00acc1;
    box-shadow: 0 0 0 0.2rem #00bcd4BF;
}

/* ==============================================
 BUTTON LINK
=============================================== */
.btn-link.cyan {
    color: #00bcd4;
}
.btn-link.cyan.hover,
.btn-link.cyan:hover {
    color: #0097a7;
}
.btn-link.cyan.disabled,
.btn-link.cyan:disabled {
    color: #0097a7;
}

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

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

/* ==============================================
 CHECKBOX
=============================================== */
.custom-checkbox.cyan .custom-control-input:indeterminate ~ .custom-control-label::before {
    border-color: #00bcd4;
    background-color: #00bcd4;
}
.custom-checkbox.cyan .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #00bcd44D;
}
.custom-checkbox.cyan .custom-control-input:disabled:indeterminate ~ .custom-control-label::before {
    background-color: #00bcd44D;
}

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

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

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

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

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

/* ==============================================
 DROPDOWN
=============================================== */
.dropdown-item.cyan.active,
.dropdown-item.cyan:active {
    color: #ffffff;
    background-color: #00bcd4;
}
.dropdown-item.cyan.disabled,
.dropdown-item.cyan:disabled {
    color: #00bcd44D;
}
.dropdown.cyan .dropdown-item.active,
.dropdown.cyan .dropdown-item:active {
    color: #ffffff !important;
    background-color: #00bcd4E6 !important;
}
.dropdown.cyan .dropdown-item:active .text-cyan {
    color: #ffffff !important;
}
.dropdown.cyan .dropdown-item.focus,
.dropdown.cyan .dropdown-item:focus {
    color: #ffffff !important;
    background-color: #00bcd4E6 !important;
}
.dropdown.cyan .dropdown-item:focus .text-cyan {
    color: #ffffff !important;
}
.dropdown.cyan .dropdown-item.hover,
.dropdown.cyan .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #00bcd4CC !important;
}
.dropdown.cyan .dropdown-item:hover .text-cyan {
    color: #ffffff !important;
}

/* ==============================================
 ERROR
=============================================== */
.error.cyan:before {
    text-shadow: 1px 0 #00bcd4;
    color: #0097a7;
    background: #f8f9fc;
}

/* ==============================================
 HR
=============================================== */
hr.cyan {
    border-top: 1px solid #00bcd41a;
}

/* ==============================================
 ICONS
=============================================== */
.mdi-cyan {
    color: #00bcd4;
}

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

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

/* ==============================================
 LIST GROUP
=============================================== */
.list-group-item.cyan,
.list-group.cyan .list-group-item {
    color: #ffffff;
    background-color: #00bcd4 !important;
}
.list-group.cyan .list-group-item:focus,
.list-group.cyan .list-group-item:hover,
.list-group-item.cyan.list-group-item:focus,
.list-group-item.cyan.list-group-item:hover {
    color: #ffffff;
    background-color: #26c6da !important;
}
.list-group.cyan .list-group-item.list-group-item-action:focus,
.list-group.cyan .list-group-item.list-group-item-action:hover,
.list-group-item.cyan.list-group-item-action:focus,
.list-group-item.cyan.list-group-item-action:hover {
    color: #ffffff;
    background-color: #26c6da !important;
}
.list-group.cyan .list-group-item.active,
.list-group-item.cyan.active {
    color: #ffffff;
    background-color: #00acc1 !important;
    border-color: #00acc1;
}
.list-group.cyan .list-group-item.disabled,
.list-group-item.cyan.disabled {
    color: #ffffff;
    background-color: #0097a7A9 !important;
}

/* ==============================================
 LOADING
=============================================== */
.loading.cyan .spinner-border {
    color: #00bcd4 !important;
}

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

/* ==============================================
 NAV
=============================================== */
.nav.cyan {
    color: #00bcd4;
}
.nav.cyan .nav-link {
    color: #00bcd4;
}
.nav.cyan .nav-link.disabled {
    color: #00bcd480 !important;
}
.nav.cyan .nav-link.bordered {
    border: 1px solid #00bcd4;
}

.nav-link.cyan a {
    color: #00bcd4;
}
.nav-link.cyan.disabled {
    color: #00bcd44D;
}

.nav.bg-cyan,
.nav.bg-cyan .nav-link,
.nav.bg-cyan .nav-link.active {
    background-color: #00bcd4;
    color: #ffffff;
    border: 1px solid #00acc1;
}
.nav.bg-cyan .nav-link.active {
    text-decoration: underline;
}

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

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

.nav-pills .nav-item.cyan a {
    color: #00bcd4;
}
.nav-pills .nav-item.cyan a.disabled {
    color: #00bcd480 !important;
}
.nav-pills .nav-item.cyan .nav-link.active,
.nav-pills .nav-item.cyan .show > .nav-link {
    color: #ffffff;
    background-color: #00bcd4;
    border: 1px solid #00bcd4;
}

/* ==============================================
NAV TABS
=============================================== */
.nav-tabs.cyan .nav-link:not(.active):hover {
    border-color: transparent !important;
}

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

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

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

/* ==============================================
 PROGRESS
=============================================== */
.progress.cyan .progress-bar {
    color: #ffffff;
    background-color: #00bcd4;
}

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

@-webkit-keyframes pulse-cyan {
    0% {
        -webkit-box-shadow: 0 0 0 0 #00bcd466;
    }
    70% {
        -webkit-box-shadow: 0 0 0 10px #00bcd400;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 #00bcd400;
    }
}
@keyframes pulse-cyan {
    0% {
        -moz-box-shadow: 0 0 0 0 #00bcd466;
        box-shadow: 0 0 0 0 #00bcd466;
    }
    70% {
        -moz-box-shadow: 0 0 0 10px #00bcd400;
        box-shadow: 0 0 0 10px #00bcd400;
    }
    100% {
        -moz-box-shadow: 0 0 0 0 #00bcd400;
        box-shadow: 0 0 0 0 #00bcd400;
    }
}

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

.cyan .bootstrap-select .dropdown-item.active,
.cyan .bootstrap-select .dropdown-item:active {
    color: #ffffff !important;
    background-color: #00bcd4 !important;
}
.cyan .bootstrap-select .dropdown-item.hover,
.cyan .bootstrap-select .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #00bcd4BF !important;
}
.cyan .bootstrap-select.show-tick .dropdown-menu .selected span.check-mark {
    color: #00bcd4;
}

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

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

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

/* ==============================================
  STAR
=============================================== */
.cyan input.star:checked ~ label.star:before {
    color: #00bcd4 !important;
}

/* ==============================================
 STEPS
=============================================== */
.steps.cyan .step.active:before {
    color: #00bcd4;
}
.steps.cyan .step.active:before,
.steps.cyan .step.active:after {
    background: #00bcd4;
}

/* ==============================================
TABLE
=============================================== */
table.cyan td.highlight {
    color: #ffffff;
    background-color: #00bcd480;
}
table.cyan th.highlight {
    color: #ffffff;
    background-color: #00bcd4A0;
}
th.highlight.cyan {
    color: #ffffff;
    background-color: #00bcd4A0;
}
td.highlight.cyan {
    color: #ffffff;
    background-color: #00bcd480;
}

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

/* ==============================================
 TEXT
=============================================== */
.text-cyan {
    color: #00bcd4 !important;
}
.text-cyan.active,
.text-cyan:active {
    color: #0097a7 !important;
}
.text-cyan.disabled,
.text-cyan:disabled {
    color: #00bcd4D9 !important;
}

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

/* ==============================================
 TOPBAR
=============================================== */
.topbar.cyan .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #00bcd4 !important;
    border: 1px solid #00bcd4 !important;
}
.topbar .dropdown.cyan .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #00bcd4 !important;
    border-color: #00bcd4 !important;
}
/* ==============================================
 A
=============================================== */
a.text-teal {
    color: #009688;
}
a.text-teal:hover {
    color: #00796b !important;
}
a.text-teal.active,
a.text-teal:active {
    color: #00796b;
}
a.text-teal.focus,
a.text-teal:focus {
    color: #26a69a !important;
}
a.text-teal.disabled,
a.text-teal:disabled {
    color: #009688D9;
}

/* ==============================================
 ALERT
=============================================== */
.alert.teal {
    color: #ffffff;
    background-color: #26a69a;
    border-color: #009688;
}
.alert.teal hr {
    border-top-color: #ffffff;
}
.alert.teal .alert-link {
    color: #ffffff;
}

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

/* ==============================================
 BADGE
=============================================== */
.badge.teal {
    color: #ffffff;
    background-color: #009688;
}
a.badge.teal:hover,
a.badge.teal:hover {
    color: #ffffff;
    background-color: #00897b;
}
.badge.teal a {
    color: #ffffff !important;
}
.badge.teal a.hover,
.badge.teal a:hover {
    color: #ffffff !important;
}
a.badge.teal.focus,
a.badge.teal:focus {
    box-shadow: 0 0 0 0.2rem #00968880;
}
.badge-avatar.teal {
    border-color: #009688;
}

/* ==============================================
 BACKGROUND
=============================================== */
.bg-teal {
    background-color: #009688 !important;
}
.bg-teal-lighten {
    background-color: #00968888 !important;
}
a.bg-teal:focus,
a.bg-teal:hover,
button.bg-teal:focus,
button.bg-teal:hover {
    background-color: #00897b !important;
}
.bg-gradient-teal {
    background-color: #009688;
    background-image: linear-gradient(180deg, #009688 10%, #009688 100%);
}
.bg-teal,
.bg-teal.text-teal,
.bg-teal-lighten,
.bg-teal-lighten.text-teal,
.bg-gradient-teal,
.bg-gradient-teal.text-teal {
    color: #ffffff !important;
}

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

/* ==============================================
 BUTTON
=============================================== */
.btn.teal.focus,
.btn.teal:focus {
    box-shadow: 0 0 0 0.2rem #00968840;
}
.btn.teal {
    color: #ffffff;
    background-color: #009688;
    border-color: #009688;
}
.btn.teal.hover,
.btn.teal:hover {
    color: #ffffff;
    background-color: #009688;
    border-color: #00897b;
}
.btn.teal.focus,
.btn.teal:focus {
    color: #ffffff;
    background-color: #009688;
    border-color: #00897b;
    box-shadow: 0 0 0 0.2rem #00968880;
}
.btn.teal.disabled,
.btn.teal:disabled {
    color: #ffffff;
    background-color: #009688;
    border-color: #009688;
}
.btn.teal:not(:disabled):not(.disabled).active,
.btn.teal:not(:disabled):not(.disabled):active,
.show > .btn.teal.dropdown-toggle {
    color: #ffffff;
    background-color: #00897b;
    border-color: #009688;
}
.btn.teal:not(:disabled):not(.disabled).active:focus,
.btn.teal:not(:disabled):not(.disabled):active:focus,
.show > .btn.teal.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem #00968880;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.teal {
    color: #009688;
    background-color: #ffffff;
    border-color: #009688;
}
.btn-outline.teal:hover {
    color: #009688;
    background-color: #ffffff;
    border-color: #009688;
}
.btn-outline.teal.focus,
.btn-outline.teal:focus {
    color: #009688;
    background-color: #ffffff;
    border-color: #009688;
    box-shadow: 0 0 0 0.2rem #00968880;
}
.btn-outline.teal.disabled, .btn-outline.teal:disabled {
    color: #009688;
    background-color: #ffffff;
    border-color: #26a69a;
}
.btn-outline.teal:not(:disabled):not(.disabled).active,
.btn-outline.teal:not(:disabled):not(.disabled):active,
.show > .btn-outline.teal.dropdown-toggle {
    color: #009688;
    background-color: #ffffff;
    border-color: #009688;
}
.btn-outline.teal:not(:disabled):not(.disabled).active:focus,
.btn-outline.teal:not(:disabled):not(.disabled):active:focus,
.show > .btn-outline.teal.dropdown-toggle:focus {
    color: #00897b;
    background-color: #ffffff;
    border-color: #00897b;
    box-shadow: 0 0 0 0.2rem #00968880;
}
.btn-outline.teal:not(:disabled):not(.disabled).active:hover,
.btn-outline.teal:not(:disabled):not(.disabled):active:hover,
.show > .btn-outline.teal.dropdown-toggle:hover {
    color: #00897b;
    background-color: #ffffff;
    border-color: #00897b;
    box-shadow: 0 0 0 0.2rem #009688BF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.teal > .btn-teal.active {
    color: #ffffff;
    background-color: #009688;
    border-color: #00897b;
}

.btn-group.teal .btn-outline:not(:active):not(.active) {
    color: #009688;
    border-color: #009688;
}
.btn-group.teal .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.teal .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #009688 !important;
    border-color: #009688;
}
.btn-group.teal .btn-outline:not(:disabled):not(.disabled).active:focus,
.btn-group.teal .btn-outline:not(:disabled):not(.disabled):active:focus {
    color: #ffffff;
    background-color: #00897b !important;
    border-color: #00897b;
    box-shadow: 0 0 0 0.2rem #00968880;
}
.btn-group.teal .btn-outline:not(:disabled):not(.disabled).active:hover,
.btn-group.teal .btn-outline:not(:disabled):not(.disabled):active:hover {
    color: #ffffff;
    background-color: #00897b !important;
    border-color: #00897b;
    box-shadow: 0 0 0 0.2rem #009688BF;
}

/* ==============================================
 BUTTON LINK
=============================================== */
.btn-link.teal {
    color: #009688;
}
.btn-link.teal.hover,
.btn-link.teal:hover {
    color: #00796b;
}
.btn-link.teal.disabled,
.btn-link.teal:disabled {
    color: #00796b;
}

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

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

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

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

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

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

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

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

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

/* ==============================================
 ERROR
=============================================== */
.error.teal:before {
    text-shadow: 1px 0 #009688;
    color: #00796b;
    background: #f8f9fc;
}

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

/* ==============================================
 ICONS
=============================================== */
.mdi-teal {
    color: #009688;
}

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

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

/* ==============================================
 LIST GROUP
=============================================== */
.list-group-item.teal,
.list-group.teal .list-group-item {
    color: #ffffff;
    background-color: #009688 !important;
}
.list-group.teal .list-group-item:focus,
.list-group.teal .list-group-item:hover,
.list-group-item.teal.list-group-item:focus,
.list-group-item.teal.list-group-item:hover {
    color: #ffffff;
    background-color: #26a69a !important;
}
.list-group.teal .list-group-item.list-group-item-action:focus,
.list-group.teal .list-group-item.list-group-item-action:hover,
.list-group-item.teal.list-group-item-action:focus,
.list-group-item.teal.list-group-item-action:hover {
    color: #ffffff;
    background-color: #26a69a !important;
}
.list-group.teal .list-group-item.active,
.list-group-item.teal.active {
    color: #ffffff;
    background-color: #00897b !important;
    border-color: #00897b;
}
.list-group.teal .list-group-item.disabled,
.list-group-item.teal.disabled {
    color: #ffffff;
    background-color: #00796bA9 !important;
}

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

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

/* ==============================================
 NAV
=============================================== */
.nav.teal {
    color: #009688;
}
.nav.teal .nav-link {
    color: #009688;
}
.nav.teal .nav-link.disabled {
    color: #00968880 !important;
}
.nav.teal .nav-link.bordered {
    border: 1px solid #009688;
}

.nav-link.teal a {
    color: #009688;
}
.nav-link.teal.disabled {
    color: #0096884D;
}

.nav.bg-teal,
.nav.bg-teal .nav-link,
.nav.bg-teal .nav-link.active {
    background-color: #009688;
    color: #ffffff;
    border: 1px solid #00897b;
}
.nav.bg-teal .nav-link.active {
    text-decoration: underline;
}

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

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

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

/* ==============================================
NAV TABS
=============================================== */
.nav-tabs.teal .nav-link:not(.active):hover {
    border-color: transparent !important;
}

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

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

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

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

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

@-webkit-keyframes pulse-teal {
    0% {
        -webkit-box-shadow: 0 0 0 0 #00968866;
    }
    70% {
        -webkit-box-shadow: 0 0 0 10px #00968800;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 #00968800;
    }
}
@keyframes pulse-teal {
    0% {
        -moz-box-shadow: 0 0 0 0 #00968866;
        box-shadow: 0 0 0 0 #00968866;
    }
    70% {
        -moz-box-shadow: 0 0 0 10px #00968800;
        box-shadow: 0 0 0 10px #00968800;
    }
    100% {
        -moz-box-shadow: 0 0 0 0 #00968800;
        box-shadow: 0 0 0 0 #00968800;
    }
}

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

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

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

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

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

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

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

/* ==============================================
TABLE
=============================================== */
table.teal td.highlight {
    color: #ffffff;
    background-color: #00968880;
}
table.teal th.highlight {
    color: #ffffff;
    background-color: #009688A0;
}
th.highlight.teal {
    color: #ffffff;
    background-color: #009688A0;
}
td.highlight.teal {
    color: #ffffff;
    background-color: #00968880;
}

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

/* ==============================================
 TEXT
=============================================== */
.text-teal {
    color: #009688 !important;
}
.text-teal.active,
.text-teal:active {
    color: #00796b !important;
}
.text-teal.disabled,
.text-teal:disabled {
    color: #009688D9 !important;
}

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

/* ==============================================
 TOPBAR
=============================================== */
.topbar.teal .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #009688 !important;
    border: 1px solid #009688 !important;
}
.topbar .dropdown.teal .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #009688 !important;
    border-color: #009688 !important;
}
/* ==============================================
 A
=============================================== */
a.text-green {
    color: #4caf50;
}
a.text-green:hover {
    color: #388e3c !important;
}
a.text-green.active,
a.text-green:active {
    color: #388e3c;
}
a.text-green.focus,
a.text-green:focus {
    color: #66bb6a !important;
}
a.text-green.disabled,
a.text-green:disabled {
    color: #4caf50D9;
}

/* ==============================================
 ALERT
=============================================== */
.alert.green {
    color: #ffffff;
    background-color: #66bb6a;
    border-color: #4caf50;
}
.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: #4caf50;
}

/* ==============================================
 BADGE
=============================================== */
.badge.green {
    color: #ffffff;
    background-color: #4caf50;
}
a.badge.green:hover,
a.badge.green:hover {
    color: #ffffff;
    background-color: #43a047;
}
.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 #4caf5080;
}
.badge-avatar.green {
    border-color: #4caf50;
}

/* ==============================================
 BACKGROUND
=============================================== */
.bg-green {
    background-color: #4caf50 !important;
}
.bg-green-lighten {
    background-color: #4caf5088 !important;
}
a.bg-green:focus,
a.bg-green:hover,
button.bg-green:focus,
button.bg-green:hover {
    background-color: #43a047 !important;
}
.bg-gradient-green {
    background-color: #4caf50;
    background-image: linear-gradient(180deg, #4caf50 10%, #4caf50 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 #4caf50 !important;
}
.border-top-green {
    border-top: 0.25rem solid #4caf50 !important;
}
.border-right-green {
    border-right: 0.25rem solid #4caf50 !important;
}
.border-bottom-green {
    border-bottom: 0.25rem solid #4caf50 !important;
}
.border-left-green {
    border-left: 0.25rem solid #4caf50 !important;
}
.border-thin-green {
    border: 1px solid #4caf50 !important;
}
.border-top-thin-green {
    border-top: 1px solid #4caf50 !important;
}
.border-right-thin-green {
    border-right: 1px solid #4caf50 !important;
}
.border-bottom-thin-green {
    border-bottom: 1px solid #4caf50 !important;
}
.border-left-thin-green {
    border-left: 3px solid #4caf50 !important;
}
.border-thick-green {
    border: 3px solid #4caf50 !important;
}
.border-top-thick-green {
    border-top: 3px solid #4caf50 !important;
}
.border-right-thick-green {
    border-right: 3px solid #4caf50 !important;
}
.border-bottom-thick-green {
    border-bottom: 3px solid #4caf50 !important;
}
.border-left-thick-green {
    border-left: 3px solid #4caf50 !important;
}

/* ==============================================
 BUTTON
=============================================== */
.btn.green.focus,
.btn.green:focus {
    box-shadow: 0 0 0 0.2rem #4caf5040;
}
.btn.green {
    color: #ffffff;
    background-color: #4caf50;
    border-color: #4caf50;
}
.btn.green.hover,
.btn.green:hover {
    color: #ffffff;
    background-color: #4caf50;
    border-color: #43a047;
}
.btn.green.focus,
.btn.green:focus {
    color: #ffffff;
    background-color: #4caf50;
    border-color: #43a047;
    box-shadow: 0 0 0 0.2rem #4caf5080;
}
.btn.green.disabled,
.btn.green:disabled {
    color: #ffffff;
    background-color: #4caf50;
    border-color: #4caf50;
}
.btn.green:not(:disabled):not(.disabled).active,
.btn.green:not(:disabled):not(.disabled):active,
.show > .btn.green.dropdown-toggle {
    color: #ffffff;
    background-color: #43a047;
    border-color: #4caf50;
}
.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 #4caf5080;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.green {
    color: #4caf50;
    background-color: #ffffff;
    border-color: #4caf50;
}
.btn-outline.green:hover {
    color: #4caf50;
    background-color: #ffffff;
    border-color: #4caf50;
}
.btn-outline.green.focus,
.btn-outline.green:focus {
    color: #4caf50;
    background-color: #ffffff;
    border-color: #4caf50;
    box-shadow: 0 0 0 0.2rem #4caf5080;
}
.btn-outline.green.disabled, .btn-outline.green:disabled {
    color: #4caf50;
    background-color: #ffffff;
    border-color: #66bb6a;
}
.btn-outline.green:not(:disabled):not(.disabled).active,
.btn-outline.green:not(:disabled):not(.disabled):active,
.show > .btn-outline.green.dropdown-toggle {
    color: #4caf50;
    background-color: #ffffff;
    border-color: #4caf50;
}
.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: #43a047;
    background-color: #ffffff;
    border-color: #43a047;
    box-shadow: 0 0 0 0.2rem #4caf5080;
}
.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: #43a047;
    background-color: #ffffff;
    border-color: #43a047;
    box-shadow: 0 0 0 0.2rem #4caf50BF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.green > .btn-green.active {
    color: #ffffff;
    background-color: #4caf50;
    border-color: #43a047;
}

.btn-group.green .btn-outline:not(:active):not(.active) {
    color: #4caf50;
    border-color: #4caf50;
}
.btn-group.green .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.green .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #4caf50 !important;
    border-color: #4caf50;
}
.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: #43a047 !important;
    border-color: #43a047;
    box-shadow: 0 0 0 0.2rem #4caf5080;
}
.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: #43a047 !important;
    border-color: #43a047;
    box-shadow: 0 0 0 0.2rem #4caf50BF;
}

/* ==============================================
 BUTTON LINK
=============================================== */
.btn-link.green {
    color: #4caf50;
}
.btn-link.green.hover,
.btn-link.green:hover {
    color: #388e3c;
}
.btn-link.green.disabled,
.btn-link.green:disabled {
    color: #388e3c;
}

/* ==============================================
BREADCRUMBS
=============================================== */
.breadcrumb.green .breadcrumb-item a {
    color: #4caf50;
}
.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: #4caf50 !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: #4caf50;
    background-color: #4caf50;
}
.custom-checkbox.green .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #4caf504D;
}
.custom-checkbox.green .custom-control-input:disabled:indeterminate ~ .custom-control-label::before {
    background-color: #4caf504D;
}

/* ==============================================
 CUSTOM CONTROL
=============================================== */
.custom-control.green .custom-control-input:checked ~ .custom-control-label::before {
    color: #ffffff;
    border-color: #ffffff;
    background-color: #4caf50;
}
.custom-control.green .custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: 0 0 0.2rem #4caf5040;
}
.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: #4caf50;
}
.custom-radio.green .custom-control-input:disabled~.custom-control-label::before {
    background-color: #4caf504D;
}
.custom-radio.green .custom-control-input:focus~.custom-control-label::before {
    box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem #4caf5066;
}
.custom-radio.green .custom-control-input:checked~.custom-control-label::after {
    color: #4caf50;
}

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

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

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

/* ==============================================
 DROPDOWN
=============================================== */
.dropdown-item.green.active,
.dropdown-item.green:active {
    color: #ffffff;
    background-color: #4caf50;
}
.dropdown-item.green.disabled,
.dropdown-item.green:disabled {
    color: #4caf504D;
}
.dropdown.green .dropdown-item.active,
.dropdown.green .dropdown-item:active {
    color: #ffffff !important;
    background-color: #4caf50E6 !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: #4caf50E6 !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: #4caf50CC !important;
}
.dropdown.green .dropdown-item:hover .text-green {
    color: #ffffff !important;
}

/* ==============================================
 ERROR
=============================================== */
.error.green:before {
    text-shadow: 1px 0 #4caf50;
    color: #388e3c;
    background: #f8f9fc;
}

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

/* ==============================================
 ICONS
=============================================== */
.mdi-green {
    color: #4caf50;
}

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

/* ==============================================
 JUMBOTRON
=============================================== */
.jumbotron.green {
    color: #ffffff;
    background-color: #4caf50;
}
.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: #4caf50 !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: #66bb6a !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: #66bb6a !important;
}
.list-group.green .list-group-item.active,
.list-group-item.green.active {
    color: #ffffff;
    background-color: #43a047 !important;
    border-color: #43a047;
}
.list-group.green .list-group-item.disabled,
.list-group-item.green.disabled {
    color: #ffffff;
    background-color: #388e3cA9 !important;
}

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

/* ==============================================
 MODAL
=============================================== */
.modal-header.green {
    background-color: #4caf50;
    color: #ffffff;
}
.modal-header.green a {
    color: #ffffff;
}
.modal-header.text-green .modal-title,
.modal-header.text-green a {
    color: #4caf50;
}
.modal .nav-tabs.bg-green {
    background-color: #4caf50 !important;
    color: #ffffff !important;
    border: 1px solid #4caf50 !important;
}
.modal .nav-tabs.bg-green .nav-link {
    border: 1px solid #4caf50 !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: #4caf50;
}
.nav.green .nav-link {
    color: #4caf50;
}
.nav.green .nav-link.disabled {
    color: #4caf5080 !important;
}
.nav.green .nav-link.bordered {
    border: 1px solid #4caf50;
}

.nav-link.green a {
    color: #4caf50;
}
.nav-link.green.disabled {
    color: #4caf504D;
}

.nav.bg-green,
.nav.bg-green .nav-link,
.nav.bg-green .nav-link.active {
    background-color: #4caf50;
    color: #ffffff;
    border: 1px solid #43a047;
}
.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 #4caf50 !important;
}
.nav-vertical.green .nav-item a.active {
    border-left: 2px solid #4caf50 !important;
}
.nav-vertical.green .nav-link.disabled {
    cursor: not-allowed;
    color: #4caf50BF !important;
}

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

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

/* ==============================================
NAV TABS
=============================================== */
.nav-tabs.green .nav-link:not(.active):hover {
    border-color: transparent !important;
}

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

/* ==============================================
 NAVBAR
=============================================== */
.navbar.green {
    color: #ffffffE6 !important;
    background-color: #4caf50 !important;
}
.navbar.green #sidebarToggleTop,
.navbar.green #sidebarToggleTop i {
    color: #ffffffE6 !important;
    background-color: #4caf50 !important;
    border: none;
}
.navbar.green #sidebarToggleTop:active {
    border-color: #4caf50E6;
}
.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: #4caf501A;
}
.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: #4caf50;
    border: 1px solid #dddfeb;
}
.pagination.green .page-link.hover,
.pagination.green .page-link:hover {
    color: #ffffff;
    background-color: #4caf50BF;
    border-color: #dddfeb;
}
.pagination.green .page-link.focus,
.pagination.green .page-link:focus {
    box-shadow: 0 0 0.2rem #4caf5040 !important;
}
.pagination.green .page-item.active .page-link {
    color: #ffffff;
    background-color: #4caf50;
    border-color: #4caf50;
}
.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: #4caf50;
}

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

@-webkit-keyframes pulse-green {
    0% {
        -webkit-box-shadow: 0 0 0 0 #4caf5066;
    }
    70% {
        -webkit-box-shadow: 0 0 0 10px #4caf5000;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 #4caf5000;
    }
}
@keyframes pulse-green {
    0% {
        -moz-box-shadow: 0 0 0 0 #4caf5066;
        box-shadow: 0 0 0 0 #4caf5066;
    }
    70% {
        -moz-box-shadow: 0 0 0 10px #4caf5000;
        box-shadow: 0 0 0 10px #4caf5000;
    }
    100% {
        -moz-box-shadow: 0 0 0 0 #4caf5000;
        box-shadow: 0 0 0 0 #4caf5000;
    }
}

/* ==============================================
 SELECT
=============================================== */
.green select option:checked,
.green select option:hover {
    box-shadow: 0 0 10px 100px #4caf50 inset;
}
.green select:focus > option:checked {
    color: #ffffff !important;
    background-color: #4caf5040 !important;
}
.green .custom-select {
    color: #6e707e;
}
.green .custom-select:focus {
    border-color: #bac8f3;
    box-shadow: 0 0 0.2rem #4caf5040;
}
.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: #4caf50 !important;
}
.green .bootstrap-select .dropdown-item.hover,
.green .bootstrap-select .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #4caf50BF !important;
}
.green .bootstrap-select.show-tick .dropdown-menu .selected span.check-mark {
    color: #4caf50;
}

/* ==============================================
 SIDEBAR
=============================================== */
.sidebar.green .nav-item .collapse .collapse-inner .collapse-item.active,
.sidebar.green .nav-item .collapsing .collapse-inner .collapse-item.active {
    color: #4caf50;
}
.sidebar.green {
    color: #ffffff;
    background-color: #4caf50;
}
.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: #388e3c;
}
.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: #388e3c;
}
.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: #388e3c;
}
.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: #4caf5033;
}
.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 #4caf501A !important;
}

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

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

/* ==============================================
TABLE
=============================================== */
table.green td.highlight {
    color: #ffffff;
    background-color: #4caf5080;
}
table.green th.highlight {
    color: #ffffff;
    background-color: #4caf50A0;
}
th.highlight.green {
    color: #ffffff;
    background-color: #4caf50A0;
}
td.highlight.green {
    color: #ffffff;
    background-color: #4caf5080;
}

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

/* ==============================================
 TEXT
=============================================== */
.text-green {
    color: #4caf50 !important;
}
.text-green.active,
.text-green:active {
    color: #388e3c !important;
}
.text-green.disabled,
.text-green:disabled {
    color: #4caf50D9 !important;
}

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

/* ==============================================
 TOPBAR
=============================================== */
.topbar.green .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #4caf50 !important;
    border: 1px solid #4caf50 !important;
}
.topbar .dropdown.green .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #4caf50 !important;
    border-color: #4caf50 !important;
}
/* ==============================================
 A
=============================================== */
a.text-light-green {
    color: #8bc34a;
}
a.text-light-green:hover {
    color: #689f38 !important;
}
a.text-light-green.active,
a.text-light-green:active {
    color: #689f38;
}
a.text-light-green.focus,
a.text-light-green:focus {
    color: #9ccc65 !important;
}
a.text-light-green.disabled,
a.text-light-green:disabled {
    color: #8bc34aD9;
}

/* ==============================================
 ALERT
=============================================== */
.alert.light-green {
    color: #ffffff;
    background-color: #9ccc65;
    border-color: #8bc34a;
}
.alert.light-green hr {
    border-top-color: #ffffff;
}
.alert.light-green .alert-link {
    color: #ffffff;
}

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

/* ==============================================
 BADGE
=============================================== */
.badge.light-green {
    color: #ffffff;
    background-color: #8bc34a;
}
a.badge.light-green:hover,
a.badge.light-green:hover {
    color: #ffffff;
    background-color: #7cb342;
}
.badge.light-green a {
    color: #ffffff !important;
}
.badge.light-green a.hover,
.badge.light-green a:hover {
    color: #ffffff !important;
}
a.badge.light-green.focus,
a.badge.light-green:focus {
    box-shadow: 0 0 0 0.2rem #8bc34a80;
}
.badge-avatar.light-green {
    border-color: #8bc34a;
}

/* ==============================================
 BACKGROUND
=============================================== */
.bg-light-green {
    background-color: #8bc34a !important;
}
.bg-light-green-lighten {
    background-color: #8bc34a88 !important;
}
a.bg-light-green:focus,
a.bg-light-green:hover,
button.bg-light-green:focus,
button.bg-light-green:hover {
    background-color: #7cb342 !important;
}
.bg-gradient-light-green {
    background-color: #8bc34a;
    background-image: linear-gradient(180deg, #8bc34a 10%, #8bc34a 100%);
}
.bg-light-green,
.bg-light-green.text-light-green,
.bg-light-green-lighten,
.bg-light-green-lighten.text-light-green,
.bg-gradient-light-green,
.bg-gradient-light-green.text-light-green {
    color: #ffffff !important;
}

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

/* ==============================================
 BUTTON
=============================================== */
.btn.light-green.focus,
.btn.light-green:focus {
    box-shadow: 0 0 0 0.2rem #8bc34a40;
}
.btn.light-green {
    color: #ffffff;
    background-color: #8bc34a;
    border-color: #8bc34a;
}
.btn.light-green.hover,
.btn.light-green:hover {
    color: #ffffff;
    background-color: #8bc34a;
    border-color: #7cb342;
}
.btn.light-green.focus,
.btn.light-green:focus {
    color: #ffffff;
    background-color: #8bc34a;
    border-color: #7cb342;
    box-shadow: 0 0 0 0.2rem #8bc34a80;
}
.btn.light-green.disabled,
.btn.light-green:disabled {
    color: #ffffff;
    background-color: #8bc34a;
    border-color: #8bc34a;
}
.btn.light-green:not(:disabled):not(.disabled).active,
.btn.light-green:not(:disabled):not(.disabled):active,
.show > .btn.light-green.dropdown-toggle {
    color: #ffffff;
    background-color: #7cb342;
    border-color: #8bc34a;
}
.btn.light-green:not(:disabled):not(.disabled).active:focus,
.btn.light-green:not(:disabled):not(.disabled):active:focus,
.show > .btn.light-green.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem #8bc34a80;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.light-green {
    color: #8bc34a;
    background-color: #ffffff;
    border-color: #8bc34a;
}
.btn-outline.light-green:hover {
    color: #8bc34a;
    background-color: #ffffff;
    border-color: #8bc34a;
}
.btn-outline.light-green.focus,
.btn-outline.light-green:focus {
    color: #8bc34a;
    background-color: #ffffff;
    border-color: #8bc34a;
    box-shadow: 0 0 0 0.2rem #8bc34a80;
}
.btn-outline.light-green.disabled, .btn-outline.light-green:disabled {
    color: #8bc34a;
    background-color: #ffffff;
    border-color: #9ccc65;
}
.btn-outline.light-green:not(:disabled):not(.disabled).active,
.btn-outline.light-green:not(:disabled):not(.disabled):active,
.show > .btn-outline.light-green.dropdown-toggle {
    color: #8bc34a;
    background-color: #ffffff;
    border-color: #8bc34a;
}
.btn-outline.light-green:not(:disabled):not(.disabled).active:focus,
.btn-outline.light-green:not(:disabled):not(.disabled):active:focus,
.show > .btn-outline.light-green.dropdown-toggle:focus {
    color: #7cb342;
    background-color: #ffffff;
    border-color: #7cb342;
    box-shadow: 0 0 0 0.2rem #8bc34a80;
}
.btn-outline.light-green:not(:disabled):not(.disabled).active:hover,
.btn-outline.light-green:not(:disabled):not(.disabled):active:hover,
.show > .btn-outline.light-green.dropdown-toggle:hover {
    color: #7cb342;
    background-color: #ffffff;
    border-color: #7cb342;
    box-shadow: 0 0 0 0.2rem #8bc34aBF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.light-green > .btn-light-green.active {
    color: #ffffff;
    background-color: #8bc34a;
    border-color: #7cb342;
}

.btn-group.light-green .btn-outline:not(:active):not(.active) {
    color: #8bc34a;
    border-color: #8bc34a;
}
.btn-group.light-green .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.light-green .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #8bc34a !important;
    border-color: #8bc34a;
}
.btn-group.light-green .btn-outline:not(:disabled):not(.disabled).active:focus,
.btn-group.light-green .btn-outline:not(:disabled):not(.disabled):active:focus {
    color: #ffffff;
    background-color: #7cb342 !important;
    border-color: #7cb342;
    box-shadow: 0 0 0 0.2rem #8bc34a80;
}
.btn-group.light-green .btn-outline:not(:disabled):not(.disabled).active:hover,
.btn-group.light-green .btn-outline:not(:disabled):not(.disabled):active:hover {
    color: #ffffff;
    background-color: #7cb342 !important;
    border-color: #7cb342;
    box-shadow: 0 0 0 0.2rem #8bc34aBF;
}

/* ==============================================
 BUTTON LINK
=============================================== */
.btn-link.light-green {
    color: #8bc34a;
}
.btn-link.light-green.hover,
.btn-link.light-green:hover {
    color: #689f38;
}
.btn-link.light-green.disabled,
.btn-link.light-green:disabled {
    color: #689f38;
}

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

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

/* ==============================================
 CHECKBOX
=============================================== */
.custom-checkbox.light-green .custom-control-input:indeterminate ~ .custom-control-label::before {
    border-color: #8bc34a;
    background-color: #8bc34a;
}
.custom-checkbox.light-green .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #8bc34a4D;
}
.custom-checkbox.light-green .custom-control-input:disabled:indeterminate ~ .custom-control-label::before {
    background-color: #8bc34a4D;
}

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

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

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

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

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

/* ==============================================
 DROPDOWN
=============================================== */
.dropdown-item.light-green.active,
.dropdown-item.light-green:active {
    color: #ffffff;
    background-color: #8bc34a;
}
.dropdown-item.light-green.disabled,
.dropdown-item.light-green:disabled {
    color: #8bc34a4D;
}
.dropdown.light-green .dropdown-item.active,
.dropdown.light-green .dropdown-item:active {
    color: #ffffff !important;
    background-color: #8bc34aE6 !important;
}
.dropdown.light-green .dropdown-item:active .text-light-green {
    color: #ffffff !important;
}
.dropdown.light-green .dropdown-item.focus,
.dropdown.light-green .dropdown-item:focus {
    color: #ffffff !important;
    background-color: #8bc34aE6 !important;
}
.dropdown.light-green .dropdown-item:focus .text-light-green {
    color: #ffffff !important;
}
.dropdown.light-green .dropdown-item.hover,
.dropdown.light-green .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #8bc34aCC !important;
}
.dropdown.light-green .dropdown-item:hover .text-light-green {
    color: #ffffff !important;
}

/* ==============================================
 ERROR
=============================================== */
.error.light-green:before {
    text-shadow: 1px 0 #8bc34a;
    color: #689f38;
    background: #f8f9fc;
}

/* ==============================================
 HR
=============================================== */
hr.light-green {
    border-top: 1px solid #8bc34a1a;
}

/* ==============================================
 ICONS
=============================================== */
.mdi-light-green {
    color: #8bc34a;
}

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

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

/* ==============================================
 LIST GROUP
=============================================== */
.list-group-item.light-green,
.list-group.light-green .list-group-item {
    color: #ffffff;
    background-color: #8bc34a !important;
}
.list-group.light-green .list-group-item:focus,
.list-group.light-green .list-group-item:hover,
.list-group-item.light-green.list-group-item:focus,
.list-group-item.light-green.list-group-item:hover {
    color: #ffffff;
    background-color: #9ccc65 !important;
}
.list-group.light-green .list-group-item.list-group-item-action:focus,
.list-group.light-green .list-group-item.list-group-item-action:hover,
.list-group-item.light-green.list-group-item-action:focus,
.list-group-item.light-green.list-group-item-action:hover {
    color: #ffffff;
    background-color: #9ccc65 !important;
}
.list-group.light-green .list-group-item.active,
.list-group-item.light-green.active {
    color: #ffffff;
    background-color: #7cb342 !important;
    border-color: #7cb342;
}
.list-group.light-green .list-group-item.disabled,
.list-group-item.light-green.disabled {
    color: #ffffff;
    background-color: #689f38A9 !important;
}

/* ==============================================
 LOADING
=============================================== */
.loading.light-green .spinner-border {
    color: #8bc34a !important;
}

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

/* ==============================================
 NAV
=============================================== */
.nav.light-green {
    color: #8bc34a;
}
.nav.light-green .nav-link {
    color: #8bc34a;
}
.nav.light-green .nav-link.disabled {
    color: #8bc34a80 !important;
}
.nav.light-green .nav-link.bordered {
    border: 1px solid #8bc34a;
}

.nav-link.light-green a {
    color: #8bc34a;
}
.nav-link.light-green.disabled {
    color: #8bc34a4D;
}

.nav.bg-light-green,
.nav.bg-light-green .nav-link,
.nav.bg-light-green .nav-link.active {
    background-color: #8bc34a;
    color: #ffffff;
    border: 1px solid #7cb342;
}
.nav.bg-light-green .nav-link.active {
    text-decoration: underline;
}

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

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

.nav-pills .nav-item.light-green a {
    color: #8bc34a;
}
.nav-pills .nav-item.light-green a.disabled {
    color: #8bc34a80 !important;
}
.nav-pills .nav-item.light-green .nav-link.active,
.nav-pills .nav-item.light-green .show > .nav-link {
    color: #ffffff;
    background-color: #8bc34a;
    border: 1px solid #8bc34a;
}

/* ==============================================
NAV TABS
=============================================== */
.nav-tabs.light-green .nav-link:not(.active):hover {
    border-color: transparent !important;
}

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

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

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

/* ==============================================
 PROGRESS
=============================================== */
.progress.light-green .progress-bar {
    color: #ffffff;
    background-color: #8bc34a;
}

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

@-webkit-keyframes pulse-light-green {
    0% {
        -webkit-box-shadow: 0 0 0 0 #8bc34a66;
    }
    70% {
        -webkit-box-shadow: 0 0 0 10px #8bc34a00;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 #8bc34a00;
    }
}
@keyframes pulse-light-green {
    0% {
        -moz-box-shadow: 0 0 0 0 #8bc34a66;
        box-shadow: 0 0 0 0 #8bc34a66;
    }
    70% {
        -moz-box-shadow: 0 0 0 10px #8bc34a00;
        box-shadow: 0 0 0 10px #8bc34a00;
    }
    100% {
        -moz-box-shadow: 0 0 0 0 #8bc34a00;
        box-shadow: 0 0 0 0 #8bc34a00;
    }
}

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

.light-green .bootstrap-select .dropdown-item.active,
.light-green .bootstrap-select .dropdown-item:active {
    color: #ffffff !important;
    background-color: #8bc34a !important;
}
.light-green .bootstrap-select .dropdown-item.hover,
.light-green .bootstrap-select .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #8bc34aBF !important;
}
.light-green .bootstrap-select.show-tick .dropdown-menu .selected span.check-mark {
    color: #8bc34a;
}

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

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

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

/* ==============================================
  STAR
=============================================== */
.light-green input.star:checked ~ label.star:before {
    color: #8bc34a !important;
}

/* ==============================================
 STEPS
=============================================== */
.steps.light-green .step.active:before {
    color: #8bc34a;
}
.steps.light-green .step.active:before,
.steps.light-green .step.active:after {
    background: #8bc34a;
}

/* ==============================================
TABLE
=============================================== */
table.light-green td.highlight {
    color: #ffffff;
    background-color: #8bc34a80;
}
table.light-green th.highlight {
    color: #ffffff;
    background-color: #8bc34aA0;
}
th.highlight.light-green {
    color: #ffffff;
    background-color: #8bc34aA0;
}
td.highlight.light-green {
    color: #ffffff;
    background-color: #8bc34a80;
}

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

/* ==============================================
 TEXT
=============================================== */
.text-light-green {
    color: #8bc34a !important;
}
.text-light-green.active,
.text-light-green:active {
    color: #689f38 !important;
}
.text-light-green.disabled,
.text-light-green:disabled {
    color: #8bc34aD9 !important;
}

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

/* ==============================================
 TOPBAR
=============================================== */
.topbar.light-green .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #8bc34a !important;
    border: 1px solid #8bc34a !important;
}
.topbar .dropdown.light-green .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #8bc34a !important;
    border-color: #8bc34a !important;
}
/* ==============================================
 A
=============================================== */
a.text-lime {
    color: #cddc39;
}
a.text-lime:hover {
    color: #afb42b !important;
}
a.text-lime.active,
a.text-lime:active {
    color: #afb42b;
}
a.text-lime.focus,
a.text-lime:focus {
    color: #d4e157 !important;
}
a.text-lime.disabled,
a.text-lime:disabled {
    color: #cddc39D9;
}

/* ==============================================
 ALERT
=============================================== */
.alert.lime {
    color: #ffffff;
    background-color: #d4e157;
    border-color: #cddc39;
}
.alert.lime hr {
    border-top-color: #ffffff;
}
.alert.lime .alert-link {
    color: #ffffff;
}

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

/* ==============================================
 BADGE
=============================================== */
.badge.lime {
    color: #ffffff;
    background-color: #cddc39;
}
a.badge.lime:hover,
a.badge.lime:hover {
    color: #ffffff;
    background-color: #c0ca33;
}
.badge.lime a {
    color: #ffffff !important;
}
.badge.lime a.hover,
.badge.lime a:hover {
    color: #ffffff !important;
}
a.badge.lime.focus,
a.badge.lime:focus {
    box-shadow: 0 0 0 0.2rem #cddc3980;
}
.badge-avatar.lime {
    border-color: #cddc39;
}

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

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

/* ==============================================
 BUTTON
=============================================== */
.btn.lime.focus,
.btn.lime:focus {
    box-shadow: 0 0 0 0.2rem #cddc3940;
}
.btn.lime {
    color: #ffffff;
    background-color: #cddc39;
    border-color: #cddc39;
}
.btn.lime.hover,
.btn.lime:hover {
    color: #ffffff;
    background-color: #cddc39;
    border-color: #c0ca33;
}
.btn.lime.focus,
.btn.lime:focus {
    color: #ffffff;
    background-color: #cddc39;
    border-color: #c0ca33;
    box-shadow: 0 0 0 0.2rem #cddc3980;
}
.btn.lime.disabled,
.btn.lime:disabled {
    color: #ffffff;
    background-color: #cddc39;
    border-color: #cddc39;
}
.btn.lime:not(:disabled):not(.disabled).active,
.btn.lime:not(:disabled):not(.disabled):active,
.show > .btn.lime.dropdown-toggle {
    color: #ffffff;
    background-color: #c0ca33;
    border-color: #cddc39;
}
.btn.lime:not(:disabled):not(.disabled).active:focus,
.btn.lime:not(:disabled):not(.disabled):active:focus,
.show > .btn.lime.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem #cddc3980;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.lime {
    color: #cddc39;
    background-color: #ffffff;
    border-color: #cddc39;
}
.btn-outline.lime:hover {
    color: #cddc39;
    background-color: #ffffff;
    border-color: #cddc39;
}
.btn-outline.lime.focus,
.btn-outline.lime:focus {
    color: #cddc39;
    background-color: #ffffff;
    border-color: #cddc39;
    box-shadow: 0 0 0 0.2rem #cddc3980;
}
.btn-outline.lime.disabled, .btn-outline.lime:disabled {
    color: #cddc39;
    background-color: #ffffff;
    border-color: #d4e157;
}
.btn-outline.lime:not(:disabled):not(.disabled).active,
.btn-outline.lime:not(:disabled):not(.disabled):active,
.show > .btn-outline.lime.dropdown-toggle {
    color: #cddc39;
    background-color: #ffffff;
    border-color: #cddc39;
}
.btn-outline.lime:not(:disabled):not(.disabled).active:focus,
.btn-outline.lime:not(:disabled):not(.disabled):active:focus,
.show > .btn-outline.lime.dropdown-toggle:focus {
    color: #c0ca33;
    background-color: #ffffff;
    border-color: #c0ca33;
    box-shadow: 0 0 0 0.2rem #cddc3980;
}
.btn-outline.lime:not(:disabled):not(.disabled).active:hover,
.btn-outline.lime:not(:disabled):not(.disabled):active:hover,
.show > .btn-outline.lime.dropdown-toggle:hover {
    color: #c0ca33;
    background-color: #ffffff;
    border-color: #c0ca33;
    box-shadow: 0 0 0 0.2rem #cddc39BF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.lime > .btn-lime.active {
    color: #ffffff;
    background-color: #cddc39;
    border-color: #c0ca33;
}

.btn-group.lime .btn-outline:not(:active):not(.active) {
    color: #cddc39;
    border-color: #cddc39;
}
.btn-group.lime .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.lime .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #cddc39 !important;
    border-color: #cddc39;
}
.btn-group.lime .btn-outline:not(:disabled):not(.disabled).active:focus,
.btn-group.lime .btn-outline:not(:disabled):not(.disabled):active:focus {
    color: #ffffff;
    background-color: #c0ca33 !important;
    border-color: #c0ca33;
    box-shadow: 0 0 0 0.2rem #cddc3980;
}
.btn-group.lime .btn-outline:not(:disabled):not(.disabled).active:hover,
.btn-group.lime .btn-outline:not(:disabled):not(.disabled):active:hover {
    color: #ffffff;
    background-color: #c0ca33 !important;
    border-color: #c0ca33;
    box-shadow: 0 0 0 0.2rem #cddc39BF;
}

/* ==============================================
 BUTTON LINK
=============================================== */
.btn-link.lime {
    color: #cddc39;
}
.btn-link.lime.hover,
.btn-link.lime:hover {
    color: #afb42b;
}
.btn-link.lime.disabled,
.btn-link.lime:disabled {
    color: #afb42b;
}

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

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

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

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

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

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

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

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

/* ==============================================
 DROPDOWN
=============================================== */
.dropdown-item.lime.active,
.dropdown-item.lime:active {
    color: #ffffff;
    background-color: #cddc39;
}
.dropdown-item.lime.disabled,
.dropdown-item.lime:disabled {
    color: #cddc394D;
}
.dropdown.lime .dropdown-item.active,
.dropdown.lime .dropdown-item:active {
    color: #ffffff !important;
    background-color: #cddc39E6 !important;
}
.dropdown.lime .dropdown-item:active .text-lime {
    color: #ffffff !important;
}
.dropdown.lime .dropdown-item.focus,
.dropdown.lime .dropdown-item:focus {
    color: #ffffff !important;
    background-color: #cddc39E6 !important;
}
.dropdown.lime .dropdown-item:focus .text-lime {
    color: #ffffff !important;
}
.dropdown.lime .dropdown-item.hover,
.dropdown.lime .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #cddc39CC !important;
}
.dropdown.lime .dropdown-item:hover .text-lime {
    color: #ffffff !important;
}

/* ==============================================
 ERROR
=============================================== */
.error.lime:before {
    text-shadow: 1px 0 #cddc39;
    color: #afb42b;
    background: #f8f9fc;
}

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

/* ==============================================
 ICONS
=============================================== */
.mdi-lime {
    color: #cddc39;
}

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

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

/* ==============================================
 LIST GROUP
=============================================== */
.list-group-item.lime,
.list-group.lime .list-group-item {
    color: #ffffff;
    background-color: #cddc39 !important;
}
.list-group.lime .list-group-item:focus,
.list-group.lime .list-group-item:hover,
.list-group-item.lime.list-group-item:focus,
.list-group-item.lime.list-group-item:hover {
    color: #ffffff;
    background-color: #d4e157 !important;
}
.list-group.lime .list-group-item.list-group-item-action:focus,
.list-group.lime .list-group-item.list-group-item-action:hover,
.list-group-item.lime.list-group-item-action:focus,
.list-group-item.lime.list-group-item-action:hover {
    color: #ffffff;
    background-color: #d4e157 !important;
}
.list-group.lime .list-group-item.active,
.list-group-item.lime.active {
    color: #ffffff;
    background-color: #c0ca33 !important;
    border-color: #c0ca33;
}
.list-group.lime .list-group-item.disabled,
.list-group-item.lime.disabled {
    color: #ffffff;
    background-color: #afb42bA9 !important;
}

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

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

/* ==============================================
 NAV
=============================================== */
.nav.lime {
    color: #cddc39;
}
.nav.lime .nav-link {
    color: #cddc39;
}
.nav.lime .nav-link.disabled {
    color: #cddc3980 !important;
}
.nav.lime .nav-link.bordered {
    border: 1px solid #cddc39;
}

.nav-link.lime a {
    color: #cddc39;
}
.nav-link.lime.disabled {
    color: #cddc394D;
}

.nav.bg-lime,
.nav.bg-lime .nav-link,
.nav.bg-lime .nav-link.active {
    background-color: #cddc39;
    color: #ffffff;
    border: 1px solid #c0ca33;
}
.nav.bg-lime .nav-link.active {
    text-decoration: underline;
}

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

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

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

/* ==============================================
NAV TABS
=============================================== */
.nav-tabs.lime .nav-link:not(.active):hover {
    border-color: transparent !important;
}

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

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

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

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

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

@-webkit-keyframes pulse-lime {
    0% {
        -webkit-box-shadow: 0 0 0 0 #cddc3966;
    }
    70% {
        -webkit-box-shadow: 0 0 0 10px #cddc3900;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 #cddc3900;
    }
}
@keyframes pulse-lime {
    0% {
        -moz-box-shadow: 0 0 0 0 #cddc3966;
        box-shadow: 0 0 0 0 #cddc3966;
    }
    70% {
        -moz-box-shadow: 0 0 0 10px #cddc3900;
        box-shadow: 0 0 0 10px #cddc3900;
    }
    100% {
        -moz-box-shadow: 0 0 0 0 #cddc3900;
        box-shadow: 0 0 0 0 #cddc3900;
    }
}

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

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

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

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

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

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

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

/* ==============================================
TABLE
=============================================== */
table.lime td.highlight {
    color: #ffffff;
    background-color: #cddc3980;
}
table.lime th.highlight {
    color: #ffffff;
    background-color: #cddc39A0;
}
th.highlight.lime {
    color: #ffffff;
    background-color: #cddc39A0;
}
td.highlight.lime {
    color: #ffffff;
    background-color: #cddc3980;
}

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

/* ==============================================
 TEXT
=============================================== */
.text-lime {
    color: #cddc39 !important;
}
.text-lime.active,
.text-lime:active {
    color: #afb42b !important;
}
.text-lime.disabled,
.text-lime:disabled {
    color: #cddc39D9 !important;
}

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

/* ==============================================
 TOPBAR
=============================================== */
.topbar.lime .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #cddc39 !important;
    border: 1px solid #cddc39 !important;
}
.topbar .dropdown.lime .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #cddc39 !important;
    border-color: #cddc39 !important;
}
/* ==============================================
 A
=============================================== */
a.text-yellow {
    color: #ffc107;
}
a.text-yellow:hover {
    color: #ffa000 !important;
}
a.text-yellow.active,
a.text-yellow:active {
    color: #ffa000;
}
a.text-yellow.focus,
a.text-yellow:focus {
    color: #ffca28 !important;
}
a.text-yellow.disabled,
a.text-yellow:disabled {
    color: #ffc107D9;
}

/* ==============================================
 ALERT
=============================================== */
.alert.yellow {
    color: #000000;
    background-color: #ffca28;
    border-color: #ffc107;
}
.alert.yellow hr {
    border-top-color: #000000;
}
.alert.yellow .alert-link {
    color: #000000;
}

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

/* ==============================================
 BADGE
=============================================== */
.badge.yellow {
    color: #000000;
    background-color: #ffc107;
}
a.badge.yellow:hover,
a.badge.yellow:hover {
    color: #000000;
    background-color: #ffb300;
}
.badge.yellow a {
    color: #000000 !important;
}
.badge.yellow a.hover,
.badge.yellow a:hover {
    color: #000000 !important;
}
a.badge.yellow.focus,
a.badge.yellow:focus {
    box-shadow: 0 0 0 0.2rem #ffc10780;
}
.badge-avatar.yellow {
    border-color: #ffc107;
}

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

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

/* ==============================================
 BUTTON
=============================================== */
.btn.yellow.focus,
.btn.yellow:focus {
    box-shadow: 0 0 0 0.2rem #ffc10740;
}
.btn.yellow {
    color: #000000;
    background-color: #ffc107;
    border-color: #ffc107;
}
.btn.yellow.hover,
.btn.yellow:hover {
    color: #000000;
    background-color: #ffc107;
    border-color: #ffb300;
}
.btn.yellow.focus,
.btn.yellow:focus {
    color: #000000;
    background-color: #ffc107;
    border-color: #ffb300;
    box-shadow: 0 0 0 0.2rem #ffc10780;
}
.btn.yellow.disabled,
.btn.yellow:disabled {
    color: #000000;
    background-color: #ffc107;
    border-color: #ffc107;
}
.btn.yellow:not(:disabled):not(.disabled).active,
.btn.yellow:not(:disabled):not(.disabled):active,
.show > .btn.yellow.dropdown-toggle {
    color: #000000;
    background-color: #ffb300;
    border-color: #ffc107;
}
.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 #ffc10780;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.yellow {
    color: #ffc107;
    background-color: #ffffff;
    border-color: #ffc107;
}
.btn-outline.yellow:hover {
    color: #ffc107;
    background-color: #ffffff;
    border-color: #ffc107;
}
.btn-outline.yellow.focus,
.btn-outline.yellow:focus {
    color: #ffc107;
    background-color: #ffffff;
    border-color: #ffc107;
    box-shadow: 0 0 0 0.2rem #ffc10780;
}
.btn-outline.yellow.disabled, .btn-outline.yellow:disabled {
    color: #ffc107;
    background-color: #ffffff;
    border-color: #ffca28;
}
.btn-outline.yellow:not(:disabled):not(.disabled).active,
.btn-outline.yellow:not(:disabled):not(.disabled):active,
.show > .btn-outline.yellow.dropdown-toggle {
    color: #ffc107;
    background-color: #ffffff;
    border-color: #ffc107;
}
.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: #ffb300;
    background-color: #ffffff;
    border-color: #ffb300;
    box-shadow: 0 0 0 0.2rem #ffc10780;
}
.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: #ffb300;
    background-color: #ffffff;
    border-color: #ffb300;
    box-shadow: 0 0 0 0.2rem #ffc107BF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.yellow > .btn-yellow.active {
    color: #000000;
    background-color: #ffc107;
    border-color: #ffb300;
}

.btn-group.yellow .btn-outline:not(:active):not(.active) {
    color: #ffc107;
    border-color: #ffc107;
}
.btn-group.yellow .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.yellow .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #ffc107 !important;
    border-color: #ffc107;
}
.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: #ffb300 !important;
    border-color: #ffb300;
    box-shadow: 0 0 0 0.2rem #ffc10780;
}
.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: #ffb300 !important;
    border-color: #ffb300;
    box-shadow: 0 0 0 0.2rem #ffc107BF;
}

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

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

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

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

/* ==============================================
 CUSTOM CONTROL
=============================================== */
.custom-control.yellow .custom-control-input:checked ~ .custom-control-label::before {
    color: #000000;
    border-color: #000000;
    background-color: #ffc107;
}
.custom-control.yellow .custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: 0 0 0.2rem #ffc10740;
}
.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: #000000;
    background-color: #ffc107;
}
.custom-radio.yellow .custom-control-input:disabled~.custom-control-label::before {
    background-color: #ffc1074D;
}
.custom-radio.yellow .custom-control-input:focus~.custom-control-label::before {
    box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem #ffc10766;
}
.custom-radio.yellow .custom-control-input:checked~.custom-control-label::after {
    color: #ffc107;
}

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

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

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

/* ==============================================
 DROPDOWN
=============================================== */
.dropdown-item.yellow.active,
.dropdown-item.yellow:active {
    color: #000000;
    background-color: #ffc107;
}
.dropdown-item.yellow.disabled,
.dropdown-item.yellow:disabled {
    color: #ffc1074D;
}
.dropdown.yellow .dropdown-item.active,
.dropdown.yellow .dropdown-item:active {
    color: #000000 !important;
    background-color: #ffc107E6 !important;
}
.dropdown.yellow .dropdown-item:active .text-yellow {
    color: #000000 !important;
}
.dropdown.yellow .dropdown-item.focus,
.dropdown.yellow .dropdown-item:focus {
    color: #000000 !important;
    background-color: #ffc107E6 !important;
}
.dropdown.yellow .dropdown-item:focus .text-yellow {
    color: #000000 !important;
}
.dropdown.yellow .dropdown-item.hover,
.dropdown.yellow .dropdown-item:hover {
    color: #000000 !important;
    background-color: #ffc107CC !important;
}
.dropdown.yellow .dropdown-item:hover .text-yellow {
    color: #000000 !important;
}

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

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

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

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

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

/* ==============================================
 LIST GROUP
=============================================== */
.list-group-item.yellow,
.list-group.yellow .list-group-item {
    color: #000000;
    background-color: #ffc107 !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: #000000;
    background-color: #ffca28 !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: #000000;
    background-color: #ffca28 !important;
}
.list-group.yellow .list-group-item.active,
.list-group-item.yellow.active {
    color: #000000;
    background-color: #ffb300 !important;
    border-color: #ffb300;
}
.list-group.yellow .list-group-item.disabled,
.list-group-item.yellow.disabled {
    color: #000000;
    background-color: #ffa000A9 !important;
}

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

/* ==============================================
 MODAL
=============================================== */
.modal-header.yellow {
    background-color: #ffc107;
    color: #000000;
}
.modal-header.yellow a {
    color: #000000;
}
.modal-header.text-yellow .modal-title,
.modal-header.text-yellow a {
    color: #ffc107;
}
.modal .nav-tabs.bg-yellow {
    background-color: #ffc107 !important;
    color: #000000 !important;
    border: 1px solid #ffc107 !important;
}
.modal .nav-tabs.bg-yellow .nav-link {
    border: 1px solid #ffc107 !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: #ffc107;
}
.nav.yellow .nav-link {
    color: #ffc107;
}
.nav.yellow .nav-link.disabled {
    color: #ffc10780 !important;
}
.nav.yellow .nav-link.bordered {
    border: 1px solid #ffc107;
}

.nav-link.yellow a {
    color: #ffc107;
}
.nav-link.yellow.disabled {
    color: #ffc1074D;
}

.nav.bg-yellow,
.nav.bg-yellow .nav-link,
.nav.bg-yellow .nav-link.active {
    background-color: #ffc107;
    color: #000000;
    border: 1px solid #ffb300;
}
.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 #ffc107 !important;
}
.nav-vertical.yellow .nav-item a.active {
    border-left: 2px solid #ffc107 !important;
}
.nav-vertical.yellow .nav-link.disabled {
    cursor: not-allowed;
    color: #ffc107BF !important;
}

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

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

/* ==============================================
NAV TABS
=============================================== */
.nav-tabs.yellow .nav-link:not(.active):hover {
    border-color: transparent !important;
}

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

/* ==============================================
 NAVBAR
=============================================== */
.navbar.yellow {
    color: #000000E6 !important;
    background-color: #ffc107 !important;
}
.navbar.yellow #sidebarToggleTop,
.navbar.yellow #sidebarToggleTop i {
    color: #000000E6 !important;
    background-color: #ffc107 !important;
    border: none;
}
.navbar.yellow #sidebarToggleTop:active {
    border-color: #ffc107E6;
}
.navbar.yellow .navbar-brand {
    color: #000000E6;
}
.navbar.yellow .navbar-brand:hover,
.navbar.yellow .navbar-brand:focus {
    color: #000000E6;
}
.navbar.yellow .navbar-nav .nav-link {
    color: #000000E6;
}
.navbar.yellow .navbar-nav .nav-link:hover,
.navbar.yellow .navbar-nav .nav-link:focus {
    color: #000000CC;
}
.navbar.yellow .navbar-nav .nav-link.disabled {
    color: #0000004D;
}
.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: #000000E6;
}
.navbar.yellow .navbar-toggler {
    color: #00000080 !important;
    border-color: #ffc1071A;
}
.navbar.yellow .navbar-text {
    color: #00000080;
}
.navbar.yellow .navbar-text a {
    color: #000000E6;
}
.navbar.yellow .navbar-text a:hover,
.navbar.yellow .navbar-text a:focus {
    color: #000000E6;
}

/* ==============================================
 PAGINATION
=============================================== */
.pagination.yellow .page-link {
    color: #ffc107;
    border: 1px solid #dddfeb;
}
.pagination.yellow .page-link.hover,
.pagination.yellow .page-link:hover {
    color: #000000;
    background-color: #ffc107BF;
    border-color: #dddfeb;
}
.pagination.yellow .page-link.focus,
.pagination.yellow .page-link:focus {
    box-shadow: 0 0 0.2rem #ffc10740 !important;
}
.pagination.yellow .page-item.active .page-link {
    color: #000000;
    background-color: #ffc107;
    border-color: #ffc107;
}
.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: #000000;
    background-color: #ffc107;
}

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

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

/* ==============================================
 SELECT
=============================================== */
.yellow select option:checked,
.yellow select option:hover {
    box-shadow: 0 0 10px 100px #ffc107 inset;
}
.yellow select:focus > option:checked {
    color: #000000 !important;
    background-color: #ffc10740 !important;
}
.yellow .custom-select {
    color: #6e707e;
}
.yellow .custom-select:focus {
    border-color: #bac8f3;
    box-shadow: 0 0 0.2rem #ffc10740;
}
.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: #000000 !important;
    background-color: #ffc107 !important;
}
.yellow .bootstrap-select .dropdown-item.hover,
.yellow .bootstrap-select .dropdown-item:hover {
    color: #000000 !important;
    background-color: #ffc107BF !important;
}
.yellow .bootstrap-select.show-tick .dropdown-menu .selected span.check-mark {
    color: #ffc107;
}

/* ==============================================
 SIDEBAR
=============================================== */
.sidebar.yellow .nav-item .collapse .collapse-inner .collapse-item.active,
.sidebar.yellow .nav-item .collapsing .collapse-inner .collapse-item.active {
    color: #ffc107;
}
.sidebar.yellow {
    color: #000000;
    background-color: #ffc107;
}
.sidebar.yellow .sidebar-brand {
    color: #000000;
}
.sidebar.yellow hr.sidebar-divider {
    border-top: 1px solid #00000026;
}
.sidebar.yellow .sidebar-heading {
    color: #00000066;
}
.sidebar.yellow .nav-item .nav-link {
    color: #000000CC;
}
.sidebar.yellow .nav-item .nav-link a {
    color: #000000CC;
}
.sidebar.yellow .nav-item .nav-link i {
    color: #0000004D;
}
.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: #000000;
}

.sidebar.yellow .nav-item .nav-link:active,
.sidebar.yellow .nav-item .nav-link a:active,
.sidebar.yellow .nav-item .nav-link i:active {
    color: #000000;
}
.sidebar.yellow .nav-item .collapse .collapse-inner .collapse-item,
.sidebar.yellow .nav-item .collapsing .collapse-inner .collapse-item {
    color: #000000CC;
}
.sidebar.yellow .nav-item .collapse .collapse-inner .collapse-item a,
.sidebar.yellow .nav-item .collapsing .collapse-inner .collapse-item a {
    color: #000000CC;
}
.sidebar.yellow .nav-item .nav-link[data-toggle=collapse].collapsed::after {
    color: #00000080;
}
.sidebar.yellow .nav-item .nav-link[data-toggle="collapse"]::after {
    color: #00000080;
}
.sidebar.yellow .nav-item .collapse-inner .collapse-header {
    color: #00000080 !important;
}
.sidebar.yellow .nav-item .collapse .collapse-inner,
.sidebar.yellow .nav-item .collapsing .collapse-inner {
    color: #000000CC;
    background-color: #ffa000;
}
.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: #000000CC;
    opacity: 0.9;
    background-color: #ffa000;
}
.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: #00000080;
    opacity: 0.9;
    background-color: #ffa000;
}
.sidebar.yellow .nav-item.active .nav-link,
.sidebar.yellow .nav-item.active .nav-link a,
.sidebar.yellow .nav-item.active .nav-link i {
    color: #000000;
}
.sidebar.yellow #sidebarToggle {
    background-color: #ffc10733;
}
.sidebar.yellow #sidebarToggle::after {
    color: #00000080;
}
.sidebar.yellow #sidebarToggle:hover {
    background-color: #00000040;
}
.sidebar.yellow.toggled #sidebarToggle::after {
    color: #00000080;
}
.sidebar.yellow .sidebar-card {
    color: #000000;
}
@media (min-width: 768px) {
    .sidebar.yellow .nav-item .nav-link[data-toggle=collapse].collapsed::after {
        font-family: "Material Design Icons";
        content: "\F035F";
        color: #00000080;
    }
    .sidebar.yellow .nav-item .nav-link[data-toggle="collapse"]::after {
        font-family: "Material Design Icons";
        content: "\F035D";
        color: #00000080;
    }
}

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

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

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

/* ==============================================
TABLE
=============================================== */
table.yellow td.highlight {
    color: #000000;
    background-color: #ffc10780;
}
table.yellow th.highlight {
    color: #000000;
    background-color: #ffc107A0;
}
th.highlight.yellow {
    color: #000000;
    background-color: #ffc107A0;
}
td.highlight.yellow {
    color: #000000;
    background-color: #ffc10780;
}

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

/* ==============================================
 TEXT
=============================================== */
.text-yellow {
    color: #ffc107 !important;
}
.text-yellow.active,
.text-yellow:active {
    color: #ffa000 !important;
}
.text-yellow.disabled,
.text-yellow:disabled {
    color: #ffc107D9 !important;
}

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

/* ==============================================
 TOPBAR
=============================================== */
.topbar.yellow .dropdown-list .dropdown-header {
    color: #000000 !important;
    background-color: #ffc107 !important;
    border: 1px solid #ffc107 !important;
}
.topbar .dropdown.yellow .dropdown-list .dropdown-header {
    color: #000000 !important;
    background-color: #ffc107 !important;
    border-color: #ffc107 !important;
}
/* ==============================================
 A
=============================================== */
a.text-amber {
    color: #ff9800;
}
a.text-amber:hover {
    color: #f57c00 !important;
}
a.text-amber.active,
a.text-amber:active {
    color: #f57c00;
}
a.text-amber.focus,
a.text-amber:focus {
    color: #ffa726 !important;
}
a.text-amber.disabled,
a.text-amber:disabled {
    color: #ff9800D9;
}

/* ==============================================
 ALERT
=============================================== */
.alert.amber {
    color: #ffffff;
    background-color: #ffa726;
    border-color: #ff9800;
}
.alert.amber hr {
    border-top-color: #ffffff;
}
.alert.amber .alert-link {
    color: #ffffff;
}

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

/* ==============================================
 BADGE
=============================================== */
.badge.amber {
    color: #ffffff;
    background-color: #ff9800;
}
a.badge.amber:hover,
a.badge.amber:hover {
    color: #ffffff;
    background-color: #fb8c00;
}
.badge.amber a {
    color: #ffffff !important;
}
.badge.amber a.hover,
.badge.amber a:hover {
    color: #ffffff !important;
}
a.badge.amber.focus,
a.badge.amber:focus {
    box-shadow: 0 0 0 0.2rem #ff980080;
}
.badge-avatar.amber {
    border-color: #ff9800;
}

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

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

/* ==============================================
 BUTTON
=============================================== */
.btn.amber.focus,
.btn.amber:focus {
    box-shadow: 0 0 0 0.2rem #ff980040;
}
.btn.amber {
    color: #ffffff;
    background-color: #ff9800;
    border-color: #ff9800;
}
.btn.amber.hover,
.btn.amber:hover {
    color: #ffffff;
    background-color: #ff9800;
    border-color: #fb8c00;
}
.btn.amber.focus,
.btn.amber:focus {
    color: #ffffff;
    background-color: #ff9800;
    border-color: #fb8c00;
    box-shadow: 0 0 0 0.2rem #ff980080;
}
.btn.amber.disabled,
.btn.amber:disabled {
    color: #ffffff;
    background-color: #ff9800;
    border-color: #ff9800;
}
.btn.amber:not(:disabled):not(.disabled).active,
.btn.amber:not(:disabled):not(.disabled):active,
.show > .btn.amber.dropdown-toggle {
    color: #ffffff;
    background-color: #fb8c00;
    border-color: #ff9800;
}
.btn.amber:not(:disabled):not(.disabled).active:focus,
.btn.amber:not(:disabled):not(.disabled):active:focus,
.show > .btn.amber.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem #ff980080;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.amber {
    color: #ff9800;
    background-color: #ffffff;
    border-color: #ff9800;
}
.btn-outline.amber:hover {
    color: #ff9800;
    background-color: #ffffff;
    border-color: #ff9800;
}
.btn-outline.amber.focus,
.btn-outline.amber:focus {
    color: #ff9800;
    background-color: #ffffff;
    border-color: #ff9800;
    box-shadow: 0 0 0 0.2rem #ff980080;
}
.btn-outline.amber.disabled, .btn-outline.amber:disabled {
    color: #ff9800;
    background-color: #ffffff;
    border-color: #ffa726;
}
.btn-outline.amber:not(:disabled):not(.disabled).active,
.btn-outline.amber:not(:disabled):not(.disabled):active,
.show > .btn-outline.amber.dropdown-toggle {
    color: #ff9800;
    background-color: #ffffff;
    border-color: #ff9800;
}
.btn-outline.amber:not(:disabled):not(.disabled).active:focus,
.btn-outline.amber:not(:disabled):not(.disabled):active:focus,
.show > .btn-outline.amber.dropdown-toggle:focus {
    color: #fb8c00;
    background-color: #ffffff;
    border-color: #fb8c00;
    box-shadow: 0 0 0 0.2rem #ff980080;
}
.btn-outline.amber:not(:disabled):not(.disabled).active:hover,
.btn-outline.amber:not(:disabled):not(.disabled):active:hover,
.show > .btn-outline.amber.dropdown-toggle:hover {
    color: #fb8c00;
    background-color: #ffffff;
    border-color: #fb8c00;
    box-shadow: 0 0 0 0.2rem #ff9800BF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.amber > .btn-amber.active {
    color: #ffffff;
    background-color: #ff9800;
    border-color: #fb8c00;
}

.btn-group.amber .btn-outline:not(:active):not(.active) {
    color: #ff9800;
    border-color: #ff9800;
}
.btn-group.amber .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.amber .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #ff9800 !important;
    border-color: #ff9800;
}
.btn-group.amber .btn-outline:not(:disabled):not(.disabled).active:focus,
.btn-group.amber .btn-outline:not(:disabled):not(.disabled):active:focus {
    color: #ffffff;
    background-color: #fb8c00 !important;
    border-color: #fb8c00;
    box-shadow: 0 0 0 0.2rem #ff980080;
}
.btn-group.amber .btn-outline:not(:disabled):not(.disabled).active:hover,
.btn-group.amber .btn-outline:not(:disabled):not(.disabled):active:hover {
    color: #ffffff;
    background-color: #fb8c00 !important;
    border-color: #fb8c00;
    box-shadow: 0 0 0 0.2rem #ff9800BF;
}

/* ==============================================
 BUTTON LINK
=============================================== */
.btn-link.amber {
    color: #ff9800;
}
.btn-link.amber.hover,
.btn-link.amber:hover {
    color: #f57c00;
}
.btn-link.amber.disabled,
.btn-link.amber:disabled {
    color: #f57c00;
}

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

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

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

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

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

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

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

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

/* ==============================================
 DROPDOWN
=============================================== */
.dropdown-item.amber.active,
.dropdown-item.amber:active {
    color: #ffffff;
    background-color: #ff9800;
}
.dropdown-item.amber.disabled,
.dropdown-item.amber:disabled {
    color: #ff98004D;
}
.dropdown.amber .dropdown-item.active,
.dropdown.amber .dropdown-item:active {
    color: #ffffff !important;
    background-color: #ff9800E6 !important;
}
.dropdown.amber .dropdown-item:active .text-amber {
    color: #ffffff !important;
}
.dropdown.amber .dropdown-item.focus,
.dropdown.amber .dropdown-item:focus {
    color: #ffffff !important;
    background-color: #ff9800E6 !important;
}
.dropdown.amber .dropdown-item:focus .text-amber {
    color: #ffffff !important;
}
.dropdown.amber .dropdown-item.hover,
.dropdown.amber .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #ff9800CC !important;
}
.dropdown.amber .dropdown-item:hover .text-amber {
    color: #ffffff !important;
}

/* ==============================================
 ERROR
=============================================== */
.error.amber:before {
    text-shadow: 1px 0 #ff9800;
    color: #f57c00;
    background: #f8f9fc;
}

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

/* ==============================================
 ICONS
=============================================== */
.mdi-amber {
    color: #ff9800;
}

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

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

/* ==============================================
 LIST GROUP
=============================================== */
.list-group-item.amber,
.list-group.amber .list-group-item {
    color: #ffffff;
    background-color: #ff9800 !important;
}
.list-group.amber .list-group-item:focus,
.list-group.amber .list-group-item:hover,
.list-group-item.amber.list-group-item:focus,
.list-group-item.amber.list-group-item:hover {
    color: #ffffff;
    background-color: #ffa726 !important;
}
.list-group.amber .list-group-item.list-group-item-action:focus,
.list-group.amber .list-group-item.list-group-item-action:hover,
.list-group-item.amber.list-group-item-action:focus,
.list-group-item.amber.list-group-item-action:hover {
    color: #ffffff;
    background-color: #ffa726 !important;
}
.list-group.amber .list-group-item.active,
.list-group-item.amber.active {
    color: #ffffff;
    background-color: #fb8c00 !important;
    border-color: #fb8c00;
}
.list-group.amber .list-group-item.disabled,
.list-group-item.amber.disabled {
    color: #ffffff;
    background-color: #f57c00A9 !important;
}

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

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

/* ==============================================
 NAV
=============================================== */
.nav.amber {
    color: #ff9800;
}
.nav.amber .nav-link {
    color: #ff9800;
}
.nav.amber .nav-link.disabled {
    color: #ff980080 !important;
}
.nav.amber .nav-link.bordered {
    border: 1px solid #ff9800;
}

.nav-link.amber a {
    color: #ff9800;
}
.nav-link.amber.disabled {
    color: #ff98004D;
}

.nav.bg-amber,
.nav.bg-amber .nav-link,
.nav.bg-amber .nav-link.active {
    background-color: #ff9800;
    color: #ffffff;
    border: 1px solid #fb8c00;
}
.nav.bg-amber .nav-link.active {
    text-decoration: underline;
}

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

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

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

/* ==============================================
NAV TABS
=============================================== */
.nav-tabs.amber .nav-link:not(.active):hover {
    border-color: transparent !important;
}

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

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

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

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

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

@-webkit-keyframes pulse-amber {
    0% {
        -webkit-box-shadow: 0 0 0 0 #ff980066;
    }
    70% {
        -webkit-box-shadow: 0 0 0 10px #ff980000;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 #ff980000;
    }
}
@keyframes pulse-amber {
    0% {
        -moz-box-shadow: 0 0 0 0 #ff980066;
        box-shadow: 0 0 0 0 #ff980066;
    }
    70% {
        -moz-box-shadow: 0 0 0 10px #ff980000;
        box-shadow: 0 0 0 10px #ff980000;
    }
    100% {
        -moz-box-shadow: 0 0 0 0 #ff980000;
        box-shadow: 0 0 0 0 #ff980000;
    }
}

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

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

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

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

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

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

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

/* ==============================================
TABLE
=============================================== */
table.amber td.highlight {
    color: #ffffff;
    background-color: #ff980080;
}
table.amber th.highlight {
    color: #ffffff;
    background-color: #ff9800A0;
}
th.highlight.amber {
    color: #ffffff;
    background-color: #ff9800A0;
}
td.highlight.amber {
    color: #ffffff;
    background-color: #ff980080;
}

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

/* ==============================================
 TEXT
=============================================== */
.text-amber {
    color: #ff9800 !important;
}
.text-amber.active,
.text-amber:active {
    color: #f57c00 !important;
}
.text-amber.disabled,
.text-amber:disabled {
    color: #ff9800D9 !important;
}

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

/* ==============================================
 TOPBAR
=============================================== */
.topbar.amber .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #ff9800 !important;
    border: 1px solid #ff9800 !important;
}
.topbar .dropdown.amber .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #ff9800 !important;
    border-color: #ff9800 !important;
}
/* ==============================================
 A
=============================================== */
a.text-orange {
    color: #ff5722;
}
a.text-orange:hover {
    color: #e64a19 !important;
}
a.text-orange.active,
a.text-orange:active {
    color: #e64a19;
}
a.text-orange.focus,
a.text-orange:focus {
    color: #ff7043 !important;
}
a.text-orange.disabled,
a.text-orange:disabled {
    color: #ff5722D9;
}

/* ==============================================
 ALERT
=============================================== */
.alert.orange {
    color: #ffffff;
    background-color: #ff7043;
    border-color: #ff5722;
}
.alert.orange hr {
    border-top-color: #ffffff;
}
.alert.orange .alert-link {
    color: #ffffff;
}

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

/* ==============================================
 BADGE
=============================================== */
.badge.orange {
    color: #ffffff;
    background-color: #ff5722;
}
a.badge.orange:hover,
a.badge.orange:hover {
    color: #ffffff;
    background-color: #f4511e;
}
.badge.orange a {
    color: #ffffff !important;
}
.badge.orange a.hover,
.badge.orange a:hover {
    color: #ffffff !important;
}
a.badge.orange.focus,
a.badge.orange:focus {
    box-shadow: 0 0 0 0.2rem #ff572280;
}
.badge-avatar.orange {
    border-color: #ff5722;
}

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

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

/* ==============================================
 BUTTON
=============================================== */
.btn.orange.focus,
.btn.orange:focus {
    box-shadow: 0 0 0 0.2rem #ff572240;
}
.btn.orange {
    color: #ffffff;
    background-color: #ff5722;
    border-color: #ff5722;
}
.btn.orange.hover,
.btn.orange:hover {
    color: #ffffff;
    background-color: #ff5722;
    border-color: #f4511e;
}
.btn.orange.focus,
.btn.orange:focus {
    color: #ffffff;
    background-color: #ff5722;
    border-color: #f4511e;
    box-shadow: 0 0 0 0.2rem #ff572280;
}
.btn.orange.disabled,
.btn.orange:disabled {
    color: #ffffff;
    background-color: #ff5722;
    border-color: #ff5722;
}
.btn.orange:not(:disabled):not(.disabled).active,
.btn.orange:not(:disabled):not(.disabled):active,
.show > .btn.orange.dropdown-toggle {
    color: #ffffff;
    background-color: #f4511e;
    border-color: #ff5722;
}
.btn.orange:not(:disabled):not(.disabled).active:focus,
.btn.orange:not(:disabled):not(.disabled):active:focus,
.show > .btn.orange.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem #ff572280;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.orange {
    color: #ff5722;
    background-color: #ffffff;
    border-color: #ff5722;
}
.btn-outline.orange:hover {
    color: #ff5722;
    background-color: #ffffff;
    border-color: #ff5722;
}
.btn-outline.orange.focus,
.btn-outline.orange:focus {
    color: #ff5722;
    background-color: #ffffff;
    border-color: #ff5722;
    box-shadow: 0 0 0 0.2rem #ff572280;
}
.btn-outline.orange.disabled, .btn-outline.orange:disabled {
    color: #ff5722;
    background-color: #ffffff;
    border-color: #ff7043;
}
.btn-outline.orange:not(:disabled):not(.disabled).active,
.btn-outline.orange:not(:disabled):not(.disabled):active,
.show > .btn-outline.orange.dropdown-toggle {
    color: #ff5722;
    background-color: #ffffff;
    border-color: #ff5722;
}
.btn-outline.orange:not(:disabled):not(.disabled).active:focus,
.btn-outline.orange:not(:disabled):not(.disabled):active:focus,
.show > .btn-outline.orange.dropdown-toggle:focus {
    color: #f4511e;
    background-color: #ffffff;
    border-color: #f4511e;
    box-shadow: 0 0 0 0.2rem #ff572280;
}
.btn-outline.orange:not(:disabled):not(.disabled).active:hover,
.btn-outline.orange:not(:disabled):not(.disabled):active:hover,
.show > .btn-outline.orange.dropdown-toggle:hover {
    color: #f4511e;
    background-color: #ffffff;
    border-color: #f4511e;
    box-shadow: 0 0 0 0.2rem #ff5722BF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.orange > .btn-orange.active {
    color: #ffffff;
    background-color: #ff5722;
    border-color: #f4511e;
}

.btn-group.orange .btn-outline:not(:active):not(.active) {
    color: #ff5722;
    border-color: #ff5722;
}
.btn-group.orange .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.orange .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #ff5722 !important;
    border-color: #ff5722;
}
.btn-group.orange .btn-outline:not(:disabled):not(.disabled).active:focus,
.btn-group.orange .btn-outline:not(:disabled):not(.disabled):active:focus {
    color: #ffffff;
    background-color: #f4511e !important;
    border-color: #f4511e;
    box-shadow: 0 0 0 0.2rem #ff572280;
}
.btn-group.orange .btn-outline:not(:disabled):not(.disabled).active:hover,
.btn-group.orange .btn-outline:not(:disabled):not(.disabled):active:hover {
    color: #ffffff;
    background-color: #f4511e !important;
    border-color: #f4511e;
    box-shadow: 0 0 0 0.2rem #ff5722BF;
}

/* ==============================================
 BUTTON LINK
=============================================== */
.btn-link.orange {
    color: #ff5722;
}
.btn-link.orange.hover,
.btn-link.orange:hover {
    color: #e64a19;
}
.btn-link.orange.disabled,
.btn-link.orange:disabled {
    color: #e64a19;
}

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

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

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

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

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

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

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

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

/* ==============================================
 DROPDOWN
=============================================== */
.dropdown-item.orange.active,
.dropdown-item.orange:active {
    color: #ffffff;
    background-color: #ff5722;
}
.dropdown-item.orange.disabled,
.dropdown-item.orange:disabled {
    color: #ff57224D;
}
.dropdown.orange .dropdown-item.active,
.dropdown.orange .dropdown-item:active {
    color: #ffffff !important;
    background-color: #ff5722E6 !important;
}
.dropdown.orange .dropdown-item:active .text-orange {
    color: #ffffff !important;
}
.dropdown.orange .dropdown-item.focus,
.dropdown.orange .dropdown-item:focus {
    color: #ffffff !important;
    background-color: #ff5722E6 !important;
}
.dropdown.orange .dropdown-item:focus .text-orange {
    color: #ffffff !important;
}
.dropdown.orange .dropdown-item.hover,
.dropdown.orange .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #ff5722CC !important;
}
.dropdown.orange .dropdown-item:hover .text-orange {
    color: #ffffff !important;
}

/* ==============================================
 ERROR
=============================================== */
.error.orange:before {
    text-shadow: 1px 0 #ff5722;
    color: #e64a19;
    background: #f8f9fc;
}

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

/* ==============================================
 ICONS
=============================================== */
.mdi-orange {
    color: #ff5722;
}

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

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

/* ==============================================
 LIST GROUP
=============================================== */
.list-group-item.orange,
.list-group.orange .list-group-item {
    color: #ffffff;
    background-color: #ff5722 !important;
}
.list-group.orange .list-group-item:focus,
.list-group.orange .list-group-item:hover,
.list-group-item.orange.list-group-item:focus,
.list-group-item.orange.list-group-item:hover {
    color: #ffffff;
    background-color: #ff7043 !important;
}
.list-group.orange .list-group-item.list-group-item-action:focus,
.list-group.orange .list-group-item.list-group-item-action:hover,
.list-group-item.orange.list-group-item-action:focus,
.list-group-item.orange.list-group-item-action:hover {
    color: #ffffff;
    background-color: #ff7043 !important;
}
.list-group.orange .list-group-item.active,
.list-group-item.orange.active {
    color: #ffffff;
    background-color: #f4511e !important;
    border-color: #f4511e;
}
.list-group.orange .list-group-item.disabled,
.list-group-item.orange.disabled {
    color: #ffffff;
    background-color: #e64a19A9 !important;
}

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

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

/* ==============================================
 NAV
=============================================== */
.nav.orange {
    color: #ff5722;
}
.nav.orange .nav-link {
    color: #ff5722;
}
.nav.orange .nav-link.disabled {
    color: #ff572280 !important;
}
.nav.orange .nav-link.bordered {
    border: 1px solid #ff5722;
}

.nav-link.orange a {
    color: #ff5722;
}
.nav-link.orange.disabled {
    color: #ff57224D;
}

.nav.bg-orange,
.nav.bg-orange .nav-link,
.nav.bg-orange .nav-link.active {
    background-color: #ff5722;
    color: #ffffff;
    border: 1px solid #f4511e;
}
.nav.bg-orange .nav-link.active {
    text-decoration: underline;
}

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

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

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

/* ==============================================
NAV TABS
=============================================== */
.nav-tabs.orange .nav-link:not(.active):hover {
    border-color: transparent !important;
}

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

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

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

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

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

@-webkit-keyframes pulse-orange {
    0% {
        -webkit-box-shadow: 0 0 0 0 #ff572266;
    }
    70% {
        -webkit-box-shadow: 0 0 0 10px #ff572200;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 #ff572200;
    }
}
@keyframes pulse-orange {
    0% {
        -moz-box-shadow: 0 0 0 0 #ff572266;
        box-shadow: 0 0 0 0 #ff572266;
    }
    70% {
        -moz-box-shadow: 0 0 0 10px #ff572200;
        box-shadow: 0 0 0 10px #ff572200;
    }
    100% {
        -moz-box-shadow: 0 0 0 0 #ff572200;
        box-shadow: 0 0 0 0 #ff572200;
    }
}

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

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

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

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

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

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

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

/* ==============================================
TABLE
=============================================== */
table.orange td.highlight {
    color: #ffffff;
    background-color: #ff572280;
}
table.orange th.highlight {
    color: #ffffff;
    background-color: #ff5722A0;
}
th.highlight.orange {
    color: #ffffff;
    background-color: #ff5722A0;
}
td.highlight.orange {
    color: #ffffff;
    background-color: #ff572280;
}

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

/* ==============================================
 TEXT
=============================================== */
.text-orange {
    color: #ff5722 !important;
}
.text-orange.active,
.text-orange:active {
    color: #e64a19 !important;
}
.text-orange.disabled,
.text-orange:disabled {
    color: #ff5722D9 !important;
}

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

/* ==============================================
 TOPBAR
=============================================== */
.topbar.orange .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #ff5722 !important;
    border: 1px solid #ff5722 !important;
}
.topbar .dropdown.orange .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #ff5722 !important;
    border-color: #ff5722 !important;
}
/* ==============================================
 A
=============================================== */
a.text-deep-orange {
    color: #cc461b;
}
a.text-deep-orange:hover {
    color: #FF5722 !important;
}
a.text-deep-orange.active,
a.text-deep-orange:active {
    color: #FF5722;
}
a.text-deep-orange.focus,
a.text-deep-orange:focus {
    color: #A33816 !important;
}
a.text-deep-orange.disabled,
a.text-deep-orange:disabled {
    color: #cc461bD9;
}

/* ==============================================
 ALERT
=============================================== */
.alert.deep-orange {
    color: #ffffff;
    background-color: #A33816;
    border-color: #cc461b;
}
.alert.deep-orange hr {
    border-top-color: #ffffff;
}
.alert.deep-orange .alert-link {
    color: #ffffff;
}

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

/* ==============================================
 BADGE
=============================================== */
.badge.deep-orange {
    color: #ffffff;
    background-color: #cc461b;
}
a.badge.deep-orange:hover,
a.badge.deep-orange:hover {
    color: #ffffff;
    background-color: #822D12;
}
.badge.deep-orange a {
    color: #ffffff !important;
}
.badge.deep-orange a.hover,
.badge.deep-orange a:hover {
    color: #ffffff !important;
}
a.badge.deep-orange.focus,
a.badge.deep-orange:focus {
    box-shadow: 0 0 0 0.2rem #cc461b80;
}
.badge-avatar.deep-orange {
    border-color: #cc461b;
}

/* ==============================================
 BACKGROUND
=============================================== */
.bg-deep-orange {
    background-color: #cc461b !important;
}
.bg-deep-orange-lighten {
    background-color: #cc461b88 !important;
}
a.bg-deep-orange:focus,
a.bg-deep-orange:hover,
button.bg-deep-orange:focus,
button.bg-deep-orange:hover {
    background-color: #822D12 !important;
}
.bg-gradient-deep-orange {
    background-color: #cc461b;
    background-image: linear-gradient(180deg, #cc461b 10%, #cc461b 100%);
}
.bg-deep-orange,
.bg-deep-orange.text-deep-orange,
.bg-deep-orange-lighten,
.bg-deep-orange-lighten.text-deep-orange,
.bg-gradient-deep-orange,
.bg-gradient-deep-orange.text-deep-orange {
    color: #ffffff !important;
}

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

/* ==============================================
 BUTTON
=============================================== */
.btn.deep-orange.focus,
.btn.deep-orange:focus {
    box-shadow: 0 0 0 0.2rem #cc461b40;
}
.btn.deep-orange {
    color: #ffffff;
    background-color: #cc461b;
    border-color: #cc461b;
}
.btn.deep-orange.hover,
.btn.deep-orange:hover {
    color: #ffffff;
    background-color: #cc461b;
    border-color: #822D12;
}
.btn.deep-orange.focus,
.btn.deep-orange:focus {
    color: #ffffff;
    background-color: #cc461b;
    border-color: #822D12;
    box-shadow: 0 0 0 0.2rem #cc461b80;
}
.btn.deep-orange.disabled,
.btn.deep-orange:disabled {
    color: #ffffff;
    background-color: #cc461b;
    border-color: #cc461b;
}
.btn.deep-orange:not(:disabled):not(.disabled).active,
.btn.deep-orange:not(:disabled):not(.disabled):active,
.show > .btn.deep-orange.dropdown-toggle {
    color: #ffffff;
    background-color: #822D12;
    border-color: #cc461b;
}
.btn.deep-orange:not(:disabled):not(.disabled).active:focus,
.btn.deep-orange:not(:disabled):not(.disabled):active:focus,
.show > .btn.deep-orange.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem #cc461b80;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.deep-orange {
    color: #cc461b;
    background-color: #ffffff;
    border-color: #cc461b;
}
.btn-outline.deep-orange:hover {
    color: #cc461b;
    background-color: #ffffff;
    border-color: #cc461b;
}
.btn-outline.deep-orange.focus,
.btn-outline.deep-orange:focus {
    color: #cc461b;
    background-color: #ffffff;
    border-color: #cc461b;
    box-shadow: 0 0 0 0.2rem #cc461b80;
}
.btn-outline.deep-orange.disabled, .btn-outline.deep-orange:disabled {
    color: #cc461b;
    background-color: #ffffff;
    border-color: #A33816;
}
.btn-outline.deep-orange:not(:disabled):not(.disabled).active,
.btn-outline.deep-orange:not(:disabled):not(.disabled):active,
.show > .btn-outline.deep-orange.dropdown-toggle {
    color: #cc461b;
    background-color: #ffffff;
    border-color: #cc461b;
}
.btn-outline.deep-orange:not(:disabled):not(.disabled).active:focus,
.btn-outline.deep-orange:not(:disabled):not(.disabled):active:focus,
.show > .btn-outline.deep-orange.dropdown-toggle:focus {
    color: #822D12;
    background-color: #ffffff;
    border-color: #822D12;
    box-shadow: 0 0 0 0.2rem #cc461b80;
}
.btn-outline.deep-orange:not(:disabled):not(.disabled).active:hover,
.btn-outline.deep-orange:not(:disabled):not(.disabled):active:hover,
.show > .btn-outline.deep-orange.dropdown-toggle:hover {
    color: #822D12;
    background-color: #ffffff;
    border-color: #822D12;
    box-shadow: 0 0 0 0.2rem #cc461bBF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.deep-orange > .btn-deep-orange.active {
    color: #ffffff;
    background-color: #cc461b;
    border-color: #822D12;
}

.btn-group.deep-orange .btn-outline:not(:active):not(.active) {
    color: #cc461b;
    border-color: #cc461b;
}
.btn-group.deep-orange .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.deep-orange .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #cc461b !important;
    border-color: #cc461b;
}
.btn-group.deep-orange .btn-outline:not(:disabled):not(.disabled).active:focus,
.btn-group.deep-orange .btn-outline:not(:disabled):not(.disabled):active:focus {
    color: #ffffff;
    background-color: #822D12 !important;
    border-color: #822D12;
    box-shadow: 0 0 0 0.2rem #cc461b80;
}
.btn-group.deep-orange .btn-outline:not(:disabled):not(.disabled).active:hover,
.btn-group.deep-orange .btn-outline:not(:disabled):not(.disabled):active:hover {
    color: #ffffff;
    background-color: #822D12 !important;
    border-color: #822D12;
    box-shadow: 0 0 0 0.2rem #cc461bBF;
}

/* ==============================================
 BUTTON LINK
=============================================== */
.btn-link.deep-orange {
    color: #cc461b;
}
.btn-link.deep-orange.hover,
.btn-link.deep-orange:hover {
    color: #FF5722;
}
.btn-link.deep-orange.disabled,
.btn-link.deep-orange:disabled {
    color: #FF5722;
}

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

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

/* ==============================================
 CHECKBOX
=============================================== */
.custom-checkbox.deep-orange .custom-control-input:indeterminate ~ .custom-control-label::before {
    border-color: #cc461b;
    background-color: #cc461b;
}
.custom-checkbox.deep-orange .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #cc461b4D;
}
.custom-checkbox.deep-orange .custom-control-input:disabled:indeterminate ~ .custom-control-label::before {
    background-color: #cc461b4D;
}

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

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

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

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

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

/* ==============================================
 DROPDOWN
=============================================== */
.dropdown-item.deep-orange.active,
.dropdown-item.deep-orange:active {
    color: #ffffff;
    background-color: #cc461b;
}
.dropdown-item.deep-orange.disabled,
.dropdown-item.deep-orange:disabled {
    color: #cc461b4D;
}
.dropdown.deep-orange .dropdown-item.active,
.dropdown.deep-orange .dropdown-item:active {
    color: #ffffff !important;
    background-color: #cc461bE6 !important;
}
.dropdown.deep-orange .dropdown-item:active .text-deep-orange {
    color: #ffffff !important;
}
.dropdown.deep-orange .dropdown-item.focus,
.dropdown.deep-orange .dropdown-item:focus {
    color: #ffffff !important;
    background-color: #cc461bE6 !important;
}
.dropdown.deep-orange .dropdown-item:focus .text-deep-orange {
    color: #ffffff !important;
}
.dropdown.deep-orange .dropdown-item.hover,
.dropdown.deep-orange .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #cc461bCC !important;
}
.dropdown.deep-orange .dropdown-item:hover .text-deep-orange {
    color: #ffffff !important;
}

/* ==============================================
 ERROR
=============================================== */
.error.deep-orange:before {
    text-shadow: 1px 0 #cc461b;
    color: #FF5722;
    background: #f8f9fc;
}

/* ==============================================
 HR
=============================================== */
hr.deep-orange {
    border-top: 1px solid #cc461b1a;
}

/* ==============================================
 ICONS
=============================================== */
.mdi-deep-orange {
    color: #cc461b;
}

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

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

/* ==============================================
 LIST GROUP
=============================================== */
.list-group-item.deep-orange,
.list-group.deep-orange .list-group-item {
    color: #ffffff;
    background-color: #cc461b !important;
}
.list-group.deep-orange .list-group-item:focus,
.list-group.deep-orange .list-group-item:hover,
.list-group-item.deep-orange.list-group-item:focus,
.list-group-item.deep-orange.list-group-item:hover {
    color: #ffffff;
    background-color: #A33816 !important;
}
.list-group.deep-orange .list-group-item.list-group-item-action:focus,
.list-group.deep-orange .list-group-item.list-group-item-action:hover,
.list-group-item.deep-orange.list-group-item-action:focus,
.list-group-item.deep-orange.list-group-item-action:hover {
    color: #ffffff;
    background-color: #A33816 !important;
}
.list-group.deep-orange .list-group-item.active,
.list-group-item.deep-orange.active {
    color: #ffffff;
    background-color: #822D12 !important;
    border-color: #822D12;
}
.list-group.deep-orange .list-group-item.disabled,
.list-group-item.deep-orange.disabled {
    color: #ffffff;
    background-color: #FF5722A9 !important;
}

/* ==============================================
 LOADING
=============================================== */
.loading.deep-orange .spinner-border {
    color: #cc461b !important;
}

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

/* ==============================================
 NAV
=============================================== */
.nav.deep-orange {
    color: #cc461b;
}
.nav.deep-orange .nav-link {
    color: #cc461b;
}
.nav.deep-orange .nav-link.disabled {
    color: #cc461b80 !important;
}
.nav.deep-orange .nav-link.bordered {
    border: 1px solid #cc461b;
}

.nav-link.deep-orange a {
    color: #cc461b;
}
.nav-link.deep-orange.disabled {
    color: #cc461b4D;
}

.nav.bg-deep-orange,
.nav.bg-deep-orange .nav-link,
.nav.bg-deep-orange .nav-link.active {
    background-color: #cc461b;
    color: #ffffff;
    border: 1px solid #822D12;
}
.nav.bg-deep-orange .nav-link.active {
    text-decoration: underline;
}

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

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

.nav-pills .nav-item.deep-orange a {
    color: #cc461b;
}
.nav-pills .nav-item.deep-orange a.disabled {
    color: #cc461b80 !important;
}
.nav-pills .nav-item.deep-orange .nav-link.active,
.nav-pills .nav-item.deep-orange .show > .nav-link {
    color: #ffffff;
    background-color: #cc461b;
    border: 1px solid #cc461b;
}

/* ==============================================
NAV TABS
=============================================== */
.nav-tabs.deep-orange .nav-link:not(.active):hover {
    border-color: transparent !important;
}

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

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

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

/* ==============================================
 PROGRESS
=============================================== */
.progress.deep-orange .progress-bar {
    color: #ffffff;
    background-color: #cc461b;
}

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

@-webkit-keyframes pulse-deep-orange {
    0% {
        -webkit-box-shadow: 0 0 0 0 #cc461b66;
    }
    70% {
        -webkit-box-shadow: 0 0 0 10px #cc461b00;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 #cc461b00;
    }
}
@keyframes pulse-deep-orange {
    0% {
        -moz-box-shadow: 0 0 0 0 #cc461b66;
        box-shadow: 0 0 0 0 #cc461b66;
    }
    70% {
        -moz-box-shadow: 0 0 0 10px #cc461b00;
        box-shadow: 0 0 0 10px #cc461b00;
    }
    100% {
        -moz-box-shadow: 0 0 0 0 #cc461b00;
        box-shadow: 0 0 0 0 #cc461b00;
    }
}

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

.deep-orange .bootstrap-select .dropdown-item.active,
.deep-orange .bootstrap-select .dropdown-item:active {
    color: #ffffff !important;
    background-color: #cc461b !important;
}
.deep-orange .bootstrap-select .dropdown-item.hover,
.deep-orange .bootstrap-select .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #cc461bBF !important;
}
.deep-orange .bootstrap-select.show-tick .dropdown-menu .selected span.check-mark {
    color: #cc461b;
}

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

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

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

/* ==============================================
  STAR
=============================================== */
.deep-orange input.star:checked ~ label.star:before {
    color: #cc461b !important;
}

/* ==============================================
 STEPS
=============================================== */
.steps.deep-orange .step.active:before {
    color: #cc461b;
}
.steps.deep-orange .step.active:before,
.steps.deep-orange .step.active:after {
    background: #cc461b;
}

/* ==============================================
TABLE
=============================================== */
table.deep-orange td.highlight {
    color: #ffffff;
    background-color: #cc461b80;
}
table.deep-orange th.highlight {
    color: #ffffff;
    background-color: #cc461bA0;
}
th.highlight.deep-orange {
    color: #ffffff;
    background-color: #cc461bA0;
}
td.highlight.deep-orange {
    color: #ffffff;
    background-color: #cc461b80;
}

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

/* ==============================================
 TEXT
=============================================== */
.text-deep-orange {
    color: #cc461b !important;
}
.text-deep-orange.active,
.text-deep-orange:active {
    color: #FF5722 !important;
}
.text-deep-orange.disabled,
.text-deep-orange:disabled {
    color: #cc461bD9 !important;
}

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

/* ==============================================
 TOPBAR
=============================================== */
.topbar.deep-orange .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #cc461b !important;
    border: 1px solid #cc461b !important;
}
.topbar .dropdown.deep-orange .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #cc461b !important;
    border-color: #cc461b !important;
}
/* ==============================================
 A
=============================================== */
a.text-brown {
    color: #795548;
}
a.text-brown:hover {
    color: #5d4037 !important;
}
a.text-brown.active,
a.text-brown:active {
    color: #5d4037;
}
a.text-brown.focus,
a.text-brown:focus {
    color: #8d6e63 !important;
}
a.text-brown.disabled,
a.text-brown:disabled {
    color: #795548D9;
}

/* ==============================================
 ALERT
=============================================== */
.alert.brown {
    color: #000000;
    background-color: #8d6e63;
    border-color: #795548;
}
.alert.brown hr {
    border-top-color: #000000;
}
.alert.brown .alert-link {
    color: #000000;
}

/* ==============================================
 AUTOCOMPLETE
=============================================== */
.autocomplete.brown .dropdown-item.active,
.autocomplete.brown .dropdown-item:active {
    color: #000000;
    text-decoration: none;
    background-color: #795548;
}

/* ==============================================
 BADGE
=============================================== */
.badge.brown {
    color: #000000;
    background-color: #795548;
}
a.badge.brown:hover,
a.badge.brown:hover {
    color: #000000;
    background-color: #6d4c41;
}
.badge.brown a {
    color: #000000 !important;
}
.badge.brown a.hover,
.badge.brown a:hover {
    color: #000000 !important;
}
a.badge.brown.focus,
a.badge.brown:focus {
    box-shadow: 0 0 0 0.2rem #79554880;
}
.badge-avatar.brown {
    border-color: #795548;
}

/* ==============================================
 BACKGROUND
=============================================== */
.bg-brown {
    background-color: #795548 !important;
}
.bg-brown-lighten {
    background-color: #79554888 !important;
}
a.bg-brown:focus,
a.bg-brown:hover,
button.bg-brown:focus,
button.bg-brown:hover {
    background-color: #6d4c41 !important;
}
.bg-gradient-brown {
    background-color: #795548;
    background-image: linear-gradient(180deg, #795548 10%, #795548 100%);
}
.bg-brown,
.bg-brown.text-brown,
.bg-brown-lighten,
.bg-brown-lighten.text-brown,
.bg-gradient-brown,
.bg-gradient-brown.text-brown {
    color: #000000 !important;
}

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

/* ==============================================
 BUTTON
=============================================== */
.btn.brown.focus,
.btn.brown:focus {
    box-shadow: 0 0 0 0.2rem #79554840;
}
.btn.brown {
    color: #000000;
    background-color: #795548;
    border-color: #795548;
}
.btn.brown.hover,
.btn.brown:hover {
    color: #000000;
    background-color: #795548;
    border-color: #6d4c41;
}
.btn.brown.focus,
.btn.brown:focus {
    color: #000000;
    background-color: #795548;
    border-color: #6d4c41;
    box-shadow: 0 0 0 0.2rem #79554880;
}
.btn.brown.disabled,
.btn.brown:disabled {
    color: #000000;
    background-color: #795548;
    border-color: #795548;
}
.btn.brown:not(:disabled):not(.disabled).active,
.btn.brown:not(:disabled):not(.disabled):active,
.show > .btn.brown.dropdown-toggle {
    color: #000000;
    background-color: #6d4c41;
    border-color: #795548;
}
.btn.brown:not(:disabled):not(.disabled).active:focus,
.btn.brown:not(:disabled):not(.disabled):active:focus,
.show > .btn.brown.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem #79554880;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.brown {
    color: #795548;
    background-color: #ffffff;
    border-color: #795548;
}
.btn-outline.brown:hover {
    color: #795548;
    background-color: #ffffff;
    border-color: #795548;
}
.btn-outline.brown.focus,
.btn-outline.brown:focus {
    color: #795548;
    background-color: #ffffff;
    border-color: #795548;
    box-shadow: 0 0 0 0.2rem #79554880;
}
.btn-outline.brown.disabled, .btn-outline.brown:disabled {
    color: #795548;
    background-color: #ffffff;
    border-color: #8d6e63;
}
.btn-outline.brown:not(:disabled):not(.disabled).active,
.btn-outline.brown:not(:disabled):not(.disabled):active,
.show > .btn-outline.brown.dropdown-toggle {
    color: #795548;
    background-color: #ffffff;
    border-color: #795548;
}
.btn-outline.brown:not(:disabled):not(.disabled).active:focus,
.btn-outline.brown:not(:disabled):not(.disabled):active:focus,
.show > .btn-outline.brown.dropdown-toggle:focus {
    color: #6d4c41;
    background-color: #ffffff;
    border-color: #6d4c41;
    box-shadow: 0 0 0 0.2rem #79554880;
}
.btn-outline.brown:not(:disabled):not(.disabled).active:hover,
.btn-outline.brown:not(:disabled):not(.disabled):active:hover,
.show > .btn-outline.brown.dropdown-toggle:hover {
    color: #6d4c41;
    background-color: #ffffff;
    border-color: #6d4c41;
    box-shadow: 0 0 0 0.2rem #795548BF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.brown > .btn-brown.active {
    color: #000000;
    background-color: #795548;
    border-color: #6d4c41;
}

.btn-group.brown .btn-outline:not(:active):not(.active) {
    color: #795548;
    border-color: #795548;
}
.btn-group.brown .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.brown .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #795548 !important;
    border-color: #795548;
}
.btn-group.brown .btn-outline:not(:disabled):not(.disabled).active:focus,
.btn-group.brown .btn-outline:not(:disabled):not(.disabled):active:focus {
    color: #ffffff;
    background-color: #6d4c41 !important;
    border-color: #6d4c41;
    box-shadow: 0 0 0 0.2rem #79554880;
}
.btn-group.brown .btn-outline:not(:disabled):not(.disabled).active:hover,
.btn-group.brown .btn-outline:not(:disabled):not(.disabled):active:hover {
    color: #ffffff;
    background-color: #6d4c41 !important;
    border-color: #6d4c41;
    box-shadow: 0 0 0 0.2rem #795548BF;
}

/* ==============================================
 BUTTON LINK
=============================================== */
.btn-link.brown {
    color: #795548;
}
.btn-link.brown.hover,
.btn-link.brown:hover {
    color: #5d4037;
}
.btn-link.brown.disabled,
.btn-link.brown:disabled {
    color: #5d4037;
}

/* ==============================================
BREADCRUMBS
=============================================== */
.breadcrumb.brown .breadcrumb-item a {
    color: #795548;
}
.breadcrumb.brown .breadcrumb-item a:hover {
    text-decoration: underline;
}
.navbar.brown .breadcrumb .breadcrumb-item a {
    color: #000000;
}
.navbar.brown .breadcrumb .breadcrumb-item a:hover {
    text-decoration: underline;
}
.navbar.brown .breadcrumb .breadcrumb-item.active {
    color: #000000B3;
    text-decoration: none;
}
.navbar.brown .breadcrumb .breadcrumb-item+.breadcrumb-item::before {
    color: #000000B3;
}

/* ==============================================
 CARD
=============================================== */
.card.brown {
    color: #000000 !important;
    background-color: #795548 !important;
}
.card.brown a,
.card.brown p,
.card.brown i,
.card.brown em,
.card.brown strong {
    color: #000000 !important;
}

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

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

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

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

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

/* ==============================================
 DATEPICKER
=============================================== */
.datepicker.brown .datepicker-header {
    color: #000000;
    background-color: #795548;
}
.datepicker.brown .datepicker-content .active {
    color: #000000;
    background-color: #795548;
}
.datepicker.brown .datepicker-controls .form-control:focus,
.datepicker.brown .datepicker-controls .form-control.focus {
    box-shadow: 0 0 0 0.2rem #7955480A !important;
}

/* ==============================================
 DROPDOWN
=============================================== */
.dropdown-item.brown.active,
.dropdown-item.brown:active {
    color: #000000;
    background-color: #795548;
}
.dropdown-item.brown.disabled,
.dropdown-item.brown:disabled {
    color: #7955484D;
}
.dropdown.brown .dropdown-item.active,
.dropdown.brown .dropdown-item:active {
    color: #000000 !important;
    background-color: #795548E6 !important;
}
.dropdown.brown .dropdown-item:active .text-brown {
    color: #000000 !important;
}
.dropdown.brown .dropdown-item.focus,
.dropdown.brown .dropdown-item:focus {
    color: #000000 !important;
    background-color: #795548E6 !important;
}
.dropdown.brown .dropdown-item:focus .text-brown {
    color: #000000 !important;
}
.dropdown.brown .dropdown-item.hover,
.dropdown.brown .dropdown-item:hover {
    color: #000000 !important;
    background-color: #795548CC !important;
}
.dropdown.brown .dropdown-item:hover .text-brown {
    color: #000000 !important;
}

/* ==============================================
 ERROR
=============================================== */
.error.brown:before {
    text-shadow: 1px 0 #795548;
    color: #5d4037;
    background: #f8f9fc;
}

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

/* ==============================================
 ICONS
=============================================== */
.mdi-brown {
    color: #795548;
}

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

/* ==============================================
 JUMBOTRON
=============================================== */
.jumbotron.brown {
    color: #000000;
    background-color: #795548;
}
.jumbotron.brown a,
.jumbotron.brown p,
.jumbotron.brown i,
.jumbotron.brown em,
.jumbotron.brown strong {
    color: #000000;
}

/* ==============================================
 LIST GROUP
=============================================== */
.list-group-item.brown,
.list-group.brown .list-group-item {
    color: #000000;
    background-color: #795548 !important;
}
.list-group.brown .list-group-item:focus,
.list-group.brown .list-group-item:hover,
.list-group-item.brown.list-group-item:focus,
.list-group-item.brown.list-group-item:hover {
    color: #000000;
    background-color: #8d6e63 !important;
}
.list-group.brown .list-group-item.list-group-item-action:focus,
.list-group.brown .list-group-item.list-group-item-action:hover,
.list-group-item.brown.list-group-item-action:focus,
.list-group-item.brown.list-group-item-action:hover {
    color: #000000;
    background-color: #8d6e63 !important;
}
.list-group.brown .list-group-item.active,
.list-group-item.brown.active {
    color: #000000;
    background-color: #6d4c41 !important;
    border-color: #6d4c41;
}
.list-group.brown .list-group-item.disabled,
.list-group-item.brown.disabled {
    color: #000000;
    background-color: #5d4037A9 !important;
}

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

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

/* ==============================================
 NAV
=============================================== */
.nav.brown {
    color: #795548;
}
.nav.brown .nav-link {
    color: #795548;
}
.nav.brown .nav-link.disabled {
    color: #79554880 !important;
}
.nav.brown .nav-link.bordered {
    border: 1px solid #795548;
}

.nav-link.brown a {
    color: #795548;
}
.nav-link.brown.disabled {
    color: #7955484D;
}

.nav.bg-brown,
.nav.bg-brown .nav-link,
.nav.bg-brown .nav-link.active {
    background-color: #795548;
    color: #000000;
    border: 1px solid #6d4c41;
}
.nav.bg-brown .nav-link.active {
    text-decoration: underline;
}

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

/* ==============================================
 NAV PILLS
=============================================== */
.nav-pills.brown a {
    color: #795548;
}
.nav-pills.brown a.disabled {
    color: #79554880 !important;
}
.nav-pills.brown .nav-link.active,
.nav-pills.brown .show > .nav-link {
    color: #000000;
    background-color: #795548;
    border: 1px solid #795548;
}

.nav-pills .nav-item.brown a {
    color: #795548;
}
.nav-pills .nav-item.brown a.disabled {
    color: #79554880 !important;
}
.nav-pills .nav-item.brown .nav-link.active,
.nav-pills .nav-item.brown .show > .nav-link {
    color: #000000;
    background-color: #795548;
    border: 1px solid #795548;
}

/* ==============================================
NAV TABS
=============================================== */
.nav-tabs.brown .nav-link:not(.active):hover {
    border-color: transparent !important;
}

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

/* ==============================================
 NAVBAR
=============================================== */
.navbar.brown {
    color: #000000E6 !important;
    background-color: #795548 !important;
}
.navbar.brown #sidebarToggleTop,
.navbar.brown #sidebarToggleTop i {
    color: #000000E6 !important;
    background-color: #795548 !important;
    border: none;
}
.navbar.brown #sidebarToggleTop:active {
    border-color: #795548E6;
}
.navbar.brown .navbar-brand {
    color: #000000E6;
}
.navbar.brown .navbar-brand:hover,
.navbar.brown .navbar-brand:focus {
    color: #000000E6;
}
.navbar.brown .navbar-nav .nav-link {
    color: #000000E6;
}
.navbar.brown .navbar-nav .nav-link:hover,
.navbar.brown .navbar-nav .nav-link:focus {
    color: #000000CC;
}
.navbar.brown .navbar-nav .nav-link.disabled {
    color: #0000004D;
}
.navbar.brown .navbar-nav .show > .nav-link,
.navbar.brown .navbar-nav .active > .nav-link,
.navbar.brown .navbar-nav .nav-link.show,
.navbar.brown .navbar-nav .nav-link.active {
    color: #000000E6;
}
.navbar.brown .navbar-toggler {
    color: #00000080 !important;
    border-color: #7955481A;
}
.navbar.brown .navbar-text {
    color: #00000080;
}
.navbar.brown .navbar-text a {
    color: #000000E6;
}
.navbar.brown .navbar-text a:hover,
.navbar.brown .navbar-text a:focus {
    color: #000000E6;
}

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

/* ==============================================
 PROGRESS
=============================================== */
.progress.brown .progress-bar {
    color: #000000;
    background-color: #795548;
}

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

@-webkit-keyframes pulse-brown {
    0% {
        -webkit-box-shadow: 0 0 0 0 #79554866;
    }
    70% {
        -webkit-box-shadow: 0 0 0 10px #79554800;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 #79554800;
    }
}
@keyframes pulse-brown {
    0% {
        -moz-box-shadow: 0 0 0 0 #79554866;
        box-shadow: 0 0 0 0 #79554866;
    }
    70% {
        -moz-box-shadow: 0 0 0 10px #79554800;
        box-shadow: 0 0 0 10px #79554800;
    }
    100% {
        -moz-box-shadow: 0 0 0 0 #79554800;
        box-shadow: 0 0 0 0 #79554800;
    }
}

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

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

/* ==============================================
 SIDEBAR
=============================================== */
.sidebar.brown .nav-item .collapse .collapse-inner .collapse-item.active,
.sidebar.brown .nav-item .collapsing .collapse-inner .collapse-item.active {
    color: #795548;
}
.sidebar.brown {
    color: #000000;
    background-color: #795548;
}
.sidebar.brown .sidebar-brand {
    color: #000000;
}
.sidebar.brown hr.sidebar-divider {
    border-top: 1px solid #00000026;
}
.sidebar.brown .sidebar-heading {
    color: #00000066;
}
.sidebar.brown .nav-item .nav-link {
    color: #000000CC;
}
.sidebar.brown .nav-item .nav-link a {
    color: #000000CC;
}
.sidebar.brown .nav-item .nav-link i {
    color: #0000004D;
}
.sidebar.brown .nav-item .nav-link:focus,
.sidebar.brown .nav-item .nav-link:hover,
.sidebar.brown .nav-item .nav-link:focus a,
.sidebar.brown .nav-item .nav-link:hover a,
.sidebar.brown .nav-item .nav-link:focus i,
.sidebar.brown .nav-item .nav-link:hover i {
    color: #000000;
}

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

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

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

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

/* ==============================================
TABLE
=============================================== */
table.brown td.highlight {
    color: #000000;
    background-color: #79554880;
}
table.brown th.highlight {
    color: #000000;
    background-color: #795548A0;
}
th.highlight.brown {
    color: #000000;
    background-color: #795548A0;
}
td.highlight.brown {
    color: #000000;
    background-color: #79554880;
}

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

/* ==============================================
 TEXT
=============================================== */
.text-brown {
    color: #795548 !important;
}
.text-brown.active,
.text-brown:active {
    color: #5d4037 !important;
}
.text-brown.disabled,
.text-brown:disabled {
    color: #795548D9 !important;
}

/* ==============================================
 TOAST
=============================================== */
.toast.brown {
    color: #000000 !important;
    background-color: #795548 !important;
}
.toast.brown a,
.toast.brown i {
    color: #000000 !important;
}

/* ==============================================
 TOPBAR
=============================================== */
.topbar.brown .dropdown-list .dropdown-header {
    color: #000000 !important;
    background-color: #795548 !important;
    border: 1px solid #795548 !important;
}
.topbar .dropdown.brown .dropdown-list .dropdown-header {
    color: #000000 !important;
    background-color: #795548 !important;
    border-color: #795548 !important;
}
/* ==============================================
 A
=============================================== */
a.text-grey {
    color: #9e9e9e;
}
a.text-grey:hover {
    color: #616161 !important;
}
a.text-grey.active,
a.text-grey:active {
    color: #616161;
}
a.text-grey.focus,
a.text-grey:focus {
    color: #bdbdbd !important;
}
a.text-grey.disabled,
a.text-grey:disabled {
    color: #9e9e9eD9;
}

/* ==============================================
 ALERT
=============================================== */
.alert.grey {
    color: #000000;
    background-color: #bdbdbd;
    border-color: #9e9e9e;
}
.alert.grey hr {
    border-top-color: #000000;
}
.alert.grey .alert-link {
    color: #000000;
}

/* ==============================================
 AUTOCOMPLETE
=============================================== */
.autocomplete.grey .dropdown-item.active,
.autocomplete.grey .dropdown-item:active {
    color: #000000;
    text-decoration: none;
    background-color: #9e9e9e;
}

/* ==============================================
 BADGE
=============================================== */
.badge.grey {
    color: #000000;
    background-color: #9e9e9e;
}
a.badge.grey:hover,
a.badge.grey:hover {
    color: #000000;
    background-color: #757575;
}
.badge.grey a {
    color: #000000 !important;
}
.badge.grey a.hover,
.badge.grey a:hover {
    color: #000000 !important;
}
a.badge.grey.focus,
a.badge.grey:focus {
    box-shadow: 0 0 0 0.2rem #9e9e9e80;
}
.badge-avatar.grey {
    border-color: #9e9e9e;
}

/* ==============================================
 BACKGROUND
=============================================== */
.bg-grey {
    background-color: #9e9e9e !important;
}
.bg-grey-lighten {
    background-color: #9e9e9e88 !important;
}
a.bg-grey:focus,
a.bg-grey:hover,
button.bg-grey:focus,
button.bg-grey:hover {
    background-color: #757575 !important;
}
.bg-gradient-grey {
    background-color: #9e9e9e;
    background-image: linear-gradient(180deg, #9e9e9e 10%, #9e9e9e 100%);
}
.bg-grey,
.bg-grey.text-grey,
.bg-grey-lighten,
.bg-grey-lighten.text-grey,
.bg-gradient-grey,
.bg-gradient-grey.text-grey {
    color: #000000 !important;
}

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

/* ==============================================
 BUTTON
=============================================== */
.btn.grey.focus,
.btn.grey:focus {
    box-shadow: 0 0 0 0.2rem #9e9e9e40;
}
.btn.grey {
    color: #000000;
    background-color: #9e9e9e;
    border-color: #9e9e9e;
}
.btn.grey.hover,
.btn.grey:hover {
    color: #000000;
    background-color: #9e9e9e;
    border-color: #757575;
}
.btn.grey.focus,
.btn.grey:focus {
    color: #000000;
    background-color: #9e9e9e;
    border-color: #757575;
    box-shadow: 0 0 0 0.2rem #9e9e9e80;
}
.btn.grey.disabled,
.btn.grey:disabled {
    color: #000000;
    background-color: #9e9e9e;
    border-color: #9e9e9e;
}
.btn.grey:not(:disabled):not(.disabled).active,
.btn.grey:not(:disabled):not(.disabled):active,
.show > .btn.grey.dropdown-toggle {
    color: #000000;
    background-color: #757575;
    border-color: #9e9e9e;
}
.btn.grey:not(:disabled):not(.disabled).active:focus,
.btn.grey:not(:disabled):not(.disabled):active:focus,
.show > .btn.grey.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem #9e9e9e80;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.grey {
    color: #9e9e9e;
    background-color: #ffffff;
    border-color: #9e9e9e;
}
.btn-outline.grey:hover {
    color: #9e9e9e;
    background-color: #ffffff;
    border-color: #9e9e9e;
}
.btn-outline.grey.focus,
.btn-outline.grey:focus {
    color: #9e9e9e;
    background-color: #ffffff;
    border-color: #9e9e9e;
    box-shadow: 0 0 0 0.2rem #9e9e9e80;
}
.btn-outline.grey.disabled, .btn-outline.grey:disabled {
    color: #9e9e9e;
    background-color: #ffffff;
    border-color: #bdbdbd;
}
.btn-outline.grey:not(:disabled):not(.disabled).active,
.btn-outline.grey:not(:disabled):not(.disabled):active,
.show > .btn-outline.grey.dropdown-toggle {
    color: #9e9e9e;
    background-color: #ffffff;
    border-color: #9e9e9e;
}
.btn-outline.grey:not(:disabled):not(.disabled).active:focus,
.btn-outline.grey:not(:disabled):not(.disabled):active:focus,
.show > .btn-outline.grey.dropdown-toggle:focus {
    color: #757575;
    background-color: #ffffff;
    border-color: #757575;
    box-shadow: 0 0 0 0.2rem #9e9e9e80;
}
.btn-outline.grey:not(:disabled):not(.disabled).active:hover,
.btn-outline.grey:not(:disabled):not(.disabled):active:hover,
.show > .btn-outline.grey.dropdown-toggle:hover {
    color: #757575;
    background-color: #ffffff;
    border-color: #757575;
    box-shadow: 0 0 0 0.2rem #9e9e9eBF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.grey > .btn-grey.active {
    color: #000000;
    background-color: #9e9e9e;
    border-color: #757575;
}

.btn-group.grey .btn-outline:not(:active):not(.active) {
    color: #9e9e9e;
    border-color: #9e9e9e;
}
.btn-group.grey .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.grey .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #9e9e9e !important;
    border-color: #9e9e9e;
}
.btn-group.grey .btn-outline:not(:disabled):not(.disabled).active:focus,
.btn-group.grey .btn-outline:not(:disabled):not(.disabled):active:focus {
    color: #ffffff;
    background-color: #757575 !important;
    border-color: #757575;
    box-shadow: 0 0 0 0.2rem #9e9e9e80;
}
.btn-group.grey .btn-outline:not(:disabled):not(.disabled).active:hover,
.btn-group.grey .btn-outline:not(:disabled):not(.disabled):active:hover {
    color: #ffffff;
    background-color: #757575 !important;
    border-color: #757575;
    box-shadow: 0 0 0 0.2rem #9e9e9eBF;
}

/* ==============================================
 BUTTON LINK
=============================================== */
.btn-link.grey {
    color: #9e9e9e;
}
.btn-link.grey.hover,
.btn-link.grey:hover {
    color: #616161;
}
.btn-link.grey.disabled,
.btn-link.grey:disabled {
    color: #616161;
}

/* ==============================================
BREADCRUMBS
=============================================== */
.breadcrumb.grey .breadcrumb-item a {
    color: #9e9e9e;
}
.breadcrumb.grey .breadcrumb-item a:hover {
    text-decoration: underline;
}
.navbar.grey .breadcrumb .breadcrumb-item a {
    color: #000000;
}
.navbar.grey .breadcrumb .breadcrumb-item a:hover {
    text-decoration: underline;
}
.navbar.grey .breadcrumb .breadcrumb-item.active {
    color: #000000B3;
    text-decoration: none;
}
.navbar.grey .breadcrumb .breadcrumb-item+.breadcrumb-item::before {
    color: #000000B3;
}

/* ==============================================
 CARD
=============================================== */
.card.grey {
    color: #000000 !important;
    background-color: #9e9e9e !important;
}
.card.grey a,
.card.grey p,
.card.grey i,
.card.grey em,
.card.grey strong {
    color: #000000 !important;
}

/* ==============================================
 CHECKBOX
=============================================== */
.custom-checkbox.grey .custom-control-input:indeterminate ~ .custom-control-label::before {
    border-color: #9e9e9e;
    background-color: #9e9e9e;
}
.custom-checkbox.grey .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #9e9e9e4D;
}
.custom-checkbox.grey .custom-control-input:disabled:indeterminate ~ .custom-control-label::before {
    background-color: #9e9e9e4D;
}

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

/* ==============================================
 CUSTOM RADIO
=============================================== */
.custom-radio.grey .custom-control-label:before {
    background-color: #ffffff;
}
.custom-radio.grey .custom-control-input:checked~.custom-control-label::before {
    border-color: #000000;
    background-color: #9e9e9e;
}
.custom-radio.grey .custom-control-input:disabled~.custom-control-label::before {
    background-color: #9e9e9e4D;
}
.custom-radio.grey .custom-control-input:focus~.custom-control-label::before {
    box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem #9e9e9e66;
}
.custom-radio.grey .custom-control-input:checked~.custom-control-label::after {
    color: #9e9e9e;
}

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

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

/* ==============================================
 DATEPICKER
=============================================== */
.datepicker.grey .datepicker-header {
    color: #000000;
    background-color: #9e9e9e;
}
.datepicker.grey .datepicker-content .active {
    color: #000000;
    background-color: #9e9e9e;
}
.datepicker.grey .datepicker-controls .form-control:focus,
.datepicker.grey .datepicker-controls .form-control.focus {
    box-shadow: 0 0 0 0.2rem #9e9e9e0A !important;
}

/* ==============================================
 DROPDOWN
=============================================== */
.dropdown-item.grey.active,
.dropdown-item.grey:active {
    color: #000000;
    background-color: #9e9e9e;
}
.dropdown-item.grey.disabled,
.dropdown-item.grey:disabled {
    color: #9e9e9e4D;
}
.dropdown.grey .dropdown-item.active,
.dropdown.grey .dropdown-item:active {
    color: #000000 !important;
    background-color: #9e9e9eE6 !important;
}
.dropdown.grey .dropdown-item:active .text-grey {
    color: #000000 !important;
}
.dropdown.grey .dropdown-item.focus,
.dropdown.grey .dropdown-item:focus {
    color: #000000 !important;
    background-color: #9e9e9eE6 !important;
}
.dropdown.grey .dropdown-item:focus .text-grey {
    color: #000000 !important;
}
.dropdown.grey .dropdown-item.hover,
.dropdown.grey .dropdown-item:hover {
    color: #000000 !important;
    background-color: #9e9e9eCC !important;
}
.dropdown.grey .dropdown-item:hover .text-grey {
    color: #000000 !important;
}

/* ==============================================
 ERROR
=============================================== */
.error.grey:before {
    text-shadow: 1px 0 #9e9e9e;
    color: #616161;
    background: #f8f9fc;
}

/* ==============================================
 HR
=============================================== */
hr.grey {
    border-top: 1px solid #9e9e9e1a;
}

/* ==============================================
 ICONS
=============================================== */
.mdi-grey {
    color: #9e9e9e;
}

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

/* ==============================================
 JUMBOTRON
=============================================== */
.jumbotron.grey {
    color: #000000;
    background-color: #9e9e9e;
}
.jumbotron.grey a,
.jumbotron.grey p,
.jumbotron.grey i,
.jumbotron.grey em,
.jumbotron.grey strong {
    color: #000000;
}

/* ==============================================
 LIST GROUP
=============================================== */
.list-group-item.grey,
.list-group.grey .list-group-item {
    color: #000000;
    background-color: #9e9e9e !important;
}
.list-group.grey .list-group-item:focus,
.list-group.grey .list-group-item:hover,
.list-group-item.grey.list-group-item:focus,
.list-group-item.grey.list-group-item:hover {
    color: #000000;
    background-color: #bdbdbd !important;
}
.list-group.grey .list-group-item.list-group-item-action:focus,
.list-group.grey .list-group-item.list-group-item-action:hover,
.list-group-item.grey.list-group-item-action:focus,
.list-group-item.grey.list-group-item-action:hover {
    color: #000000;
    background-color: #bdbdbd !important;
}
.list-group.grey .list-group-item.active,
.list-group-item.grey.active {
    color: #000000;
    background-color: #757575 !important;
    border-color: #757575;
}
.list-group.grey .list-group-item.disabled,
.list-group-item.grey.disabled {
    color: #000000;
    background-color: #616161A9 !important;
}

/* ==============================================
 LOADING
=============================================== */
.loading.grey .spinner-border {
    color: #9e9e9e !important;
}

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

/* ==============================================
 NAV
=============================================== */
.nav.grey {
    color: #9e9e9e;
}
.nav.grey .nav-link {
    color: #9e9e9e;
}
.nav.grey .nav-link.disabled {
    color: #9e9e9e80 !important;
}
.nav.grey .nav-link.bordered {
    border: 1px solid #9e9e9e;
}

.nav-link.grey a {
    color: #9e9e9e;
}
.nav-link.grey.disabled {
    color: #9e9e9e4D;
}

.nav.bg-grey,
.nav.bg-grey .nav-link,
.nav.bg-grey .nav-link.active {
    background-color: #9e9e9e;
    color: #000000;
    border: 1px solid #757575;
}
.nav.bg-grey .nav-link.active {
    text-decoration: underline;
}

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

/* ==============================================
 NAV PILLS
=============================================== */
.nav-pills.grey a {
    color: #9e9e9e;
}
.nav-pills.grey a.disabled {
    color: #9e9e9e80 !important;
}
.nav-pills.grey .nav-link.active,
.nav-pills.grey .show > .nav-link {
    color: #000000;
    background-color: #9e9e9e;
    border: 1px solid #9e9e9e;
}

.nav-pills .nav-item.grey a {
    color: #9e9e9e;
}
.nav-pills .nav-item.grey a.disabled {
    color: #9e9e9e80 !important;
}
.nav-pills .nav-item.grey .nav-link.active,
.nav-pills .nav-item.grey .show > .nav-link {
    color: #000000;
    background-color: #9e9e9e;
    border: 1px solid #9e9e9e;
}

/* ==============================================
NAV TABS
=============================================== */
.nav-tabs.grey .nav-link:not(.active):hover {
    border-color: transparent !important;
}

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

/* ==============================================
 NAVBAR
=============================================== */
.navbar.grey {
    color: #000000E6 !important;
    background-color: #9e9e9e !important;
}
.navbar.grey #sidebarToggleTop,
.navbar.grey #sidebarToggleTop i {
    color: #000000E6 !important;
    background-color: #9e9e9e !important;
    border: none;
}
.navbar.grey #sidebarToggleTop:active {
    border-color: #9e9e9eE6;
}
.navbar.grey .navbar-brand {
    color: #000000E6;
}
.navbar.grey .navbar-brand:hover,
.navbar.grey .navbar-brand:focus {
    color: #000000E6;
}
.navbar.grey .navbar-nav .nav-link {
    color: #000000E6;
}
.navbar.grey .navbar-nav .nav-link:hover,
.navbar.grey .navbar-nav .nav-link:focus {
    color: #000000CC;
}
.navbar.grey .navbar-nav .nav-link.disabled {
    color: #0000004D;
}
.navbar.grey .navbar-nav .show > .nav-link,
.navbar.grey .navbar-nav .active > .nav-link,
.navbar.grey .navbar-nav .nav-link.show,
.navbar.grey .navbar-nav .nav-link.active {
    color: #000000E6;
}
.navbar.grey .navbar-toggler {
    color: #00000080 !important;
    border-color: #9e9e9e1A;
}
.navbar.grey .navbar-text {
    color: #00000080;
}
.navbar.grey .navbar-text a {
    color: #000000E6;
}
.navbar.grey .navbar-text a:hover,
.navbar.grey .navbar-text a:focus {
    color: #000000E6;
}

/* ==============================================
 PAGINATION
=============================================== */
.pagination.grey .page-link {
    color: #9e9e9e;
    border: 1px solid #dddfeb;
}
.pagination.grey .page-link.hover,
.pagination.grey .page-link:hover {
    color: #000000;
    background-color: #9e9e9eBF;
    border-color: #dddfeb;
}
.pagination.grey .page-link.focus,
.pagination.grey .page-link:focus {
    box-shadow: 0 0 0.2rem #9e9e9e40 !important;
}
.pagination.grey .page-item.active .page-link {
    color: #000000;
    background-color: #9e9e9e;
    border-color: #9e9e9e;
}
.pagination.grey .page-item.disabled .page-link,
.pagination.grey .page-item:disabled .page-link {
    color: #858796;
    border-color: #dddfeb;
}

/* ==============================================
 PROGRESS
=============================================== */
.progress.grey .progress-bar {
    color: #000000;
    background-color: #9e9e9e;
}

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

@-webkit-keyframes pulse-grey {
    0% {
        -webkit-box-shadow: 0 0 0 0 #9e9e9e66;
    }
    70% {
        -webkit-box-shadow: 0 0 0 10px #9e9e9e00;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 #9e9e9e00;
    }
}
@keyframes pulse-grey {
    0% {
        -moz-box-shadow: 0 0 0 0 #9e9e9e66;
        box-shadow: 0 0 0 0 #9e9e9e66;
    }
    70% {
        -moz-box-shadow: 0 0 0 10px #9e9e9e00;
        box-shadow: 0 0 0 10px #9e9e9e00;
    }
    100% {
        -moz-box-shadow: 0 0 0 0 #9e9e9e00;
        box-shadow: 0 0 0 0 #9e9e9e00;
    }
}

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

.grey .bootstrap-select .dropdown-item.active,
.grey .bootstrap-select .dropdown-item:active {
    color: #000000 !important;
    background-color: #9e9e9e !important;
}
.grey .bootstrap-select .dropdown-item.hover,
.grey .bootstrap-select .dropdown-item:hover {
    color: #000000 !important;
    background-color: #9e9e9eBF !important;
}
.grey .bootstrap-select.show-tick .dropdown-menu .selected span.check-mark {
    color: #9e9e9e;
}

/* ==============================================
 SIDEBAR
=============================================== */
.sidebar.grey .nav-item .collapse .collapse-inner .collapse-item.active,
.sidebar.grey .nav-item .collapsing .collapse-inner .collapse-item.active {
    color: #9e9e9e;
}
.sidebar.grey {
    color: #000000;
    background-color: #9e9e9e;
}
.sidebar.grey .sidebar-brand {
    color: #000000;
}
.sidebar.grey hr.sidebar-divider {
    border-top: 1px solid #00000026;
}
.sidebar.grey .sidebar-heading {
    color: #00000066;
}
.sidebar.grey .nav-item .nav-link {
    color: #000000CC;
}
.sidebar.grey .nav-item .nav-link a {
    color: #000000CC;
}
.sidebar.grey .nav-item .nav-link i {
    color: #0000004D;
}
.sidebar.grey .nav-item .nav-link:focus,
.sidebar.grey .nav-item .nav-link:hover,
.sidebar.grey .nav-item .nav-link:focus a,
.sidebar.grey .nav-item .nav-link:hover a,
.sidebar.grey .nav-item .nav-link:focus i,
.sidebar.grey .nav-item .nav-link:hover i {
    color: #000000;
}

.sidebar.grey .nav-item .nav-link:active,
.sidebar.grey .nav-item .nav-link a:active,
.sidebar.grey .nav-item .nav-link i:active {
    color: #000000;
}
.sidebar.grey .nav-item .collapse .collapse-inner .collapse-item,
.sidebar.grey .nav-item .collapsing .collapse-inner .collapse-item {
    color: #000000CC;
}
.sidebar.grey .nav-item .collapse .collapse-inner .collapse-item a,
.sidebar.grey .nav-item .collapsing .collapse-inner .collapse-item a {
    color: #000000CC;
}
.sidebar.grey .nav-item .nav-link[data-toggle=collapse].collapsed::after {
    color: #00000080;
}
.sidebar.grey .nav-item .nav-link[data-toggle="collapse"]::after {
    color: #00000080;
}
.sidebar.grey .nav-item .collapse-inner .collapse-header {
    color: #00000080 !important;
}
.sidebar.grey .nav-item .collapse .collapse-inner,
.sidebar.grey .nav-item .collapsing .collapse-inner {
    color: #000000CC;
    background-color: #616161;
}
.sidebar.grey .nav-item .collapse .collapse-inner .collapse-item:active,
.sidebar.grey .nav-item .collapsing .collapse-inner .collapse-item:active
.sidebar.grey .nav-item .collapse .collapse-inner .collapse-item a:active,
.sidebar.grey .nav-item .collapsing .collapse-inner .collapse-item a:active {
    color: #000000CC;
    opacity: 0.9;
    background-color: #616161;
}
.sidebar.grey .nav-item .collapse .collapse-inner .collapse-item:hover,
.sidebar.grey .nav-item .collapsing .collapse-inner .collapse-item:hover,
.sidebar.grey .nav-item .collapse .collapse-inner .collapse-item a:hover,
.sidebar.grey .nav-item .collapsing .collapse-inner .collapse-item a:hover {
    color: #00000080;
    opacity: 0.9;
    background-color: #616161;
}
.sidebar.grey .nav-item.active .nav-link,
.sidebar.grey .nav-item.active .nav-link a,
.sidebar.grey .nav-item.active .nav-link i {
    color: #000000;
}
.sidebar.grey #sidebarToggle {
    background-color: #9e9e9e33;
}
.sidebar.grey #sidebarToggle::after {
    color: #00000080;
}
.sidebar.grey #sidebarToggle:hover {
    background-color: #00000040;
}
.sidebar.grey.toggled #sidebarToggle::after {
    color: #00000080;
}
.sidebar.grey .sidebar-card {
    color: #000000;
}
@media (min-width: 768px) {
    .sidebar.grey .nav-item .nav-link[data-toggle=collapse].collapsed::after {
        font-family: "Material Design Icons";
        content: "\F035F";
        color: #00000080;
    }
    .sidebar.grey .nav-item .nav-link[data-toggle="collapse"]::after {
        font-family: "Material Design Icons";
        content: "\F035D";
        color: #00000080;
    }
}

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

/* ==============================================
  STAR
=============================================== */
.grey input.star:checked ~ label.star:before {
    color: #9e9e9e !important;
}

/* ==============================================
 STEPS
=============================================== */
.steps.grey .step.active:before {
    color: #9e9e9e;
}
.steps.grey .step.active:before,
.steps.grey .step.active:after {
    background: #9e9e9e;
}

/* ==============================================
TABLE
=============================================== */
table.grey td.highlight {
    color: #000000;
    background-color: #9e9e9e80;
}
table.grey th.highlight {
    color: #000000;
    background-color: #9e9e9eA0;
}
th.highlight.grey {
    color: #000000;
    background-color: #9e9e9eA0;
}
td.highlight.grey {
    color: #000000;
    background-color: #9e9e9e80;
}

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

/* ==============================================
 TEXT
=============================================== */
.text-grey {
    color: #9e9e9e !important;
}
.text-grey.active,
.text-grey:active {
    color: #616161 !important;
}
.text-grey.disabled,
.text-grey:disabled {
    color: #9e9e9eD9 !important;
}

/* ==============================================
 TOAST
=============================================== */
.toast.grey {
    color: #000000 !important;
    background-color: #9e9e9e !important;
}
.toast.grey a,
.toast.grey i {
    color: #000000 !important;
}

/* ==============================================
 TOPBAR
=============================================== */
.topbar.grey .dropdown-list .dropdown-header {
    color: #000000 !important;
    background-color: #9e9e9e !important;
    border: 1px solid #9e9e9e !important;
}
.topbar .dropdown.grey .dropdown-list .dropdown-header {
    color: #000000 !important;
    background-color: #9e9e9e !important;
    border-color: #9e9e9e !important;
}
/* ==============================================
 A
=============================================== */
a.text-primary {
    color: #00bcd4;
}
a.text-primary:hover {
    color: #0095a8 !important;
}
a.text-primary.active,
a.text-primary:active {
    color: #0095a8;
}
a.text-primary.focus,
a.text-primary:focus {
    color: #3abecf !important;
}
a.text-primary.disabled,
a.text-primary:disabled {
    color: #00bcd4D9;
}

/* ==============================================
 ALERT
=============================================== */
.alert.primary {
    color: #ffffff;
    background-color: #3abecf;
    border-color: #00bcd4;
}
.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: #00bcd4;
}

/* ==============================================
 BADGE
=============================================== */
.badge.primary {
    color: #ffffff;
    background-color: #00bcd4;
}
a.badge.primary:hover,
a.badge.primary:hover {
    color: #ffffff;
    background-color: #03adc4;
}
.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 #00bcd480;
}
.badge-avatar.primary {
    border-color: #00bcd4;
}

/* ==============================================
 BACKGROUND
=============================================== */
.bg-primary {
    background-color: #00bcd4 !important;
}
.bg-primary-lighten {
    background-color: #00bcd488 !important;
}
a.bg-primary:focus,
a.bg-primary:hover,
button.bg-primary:focus,
button.bg-primary:hover {
    background-color: #03adc4 !important;
}
.bg-gradient-primary {
    background-color: #00bcd4;
    background-image: linear-gradient(180deg, #00bcd4 10%, #00bcd4 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 #00bcd4 !important;
}
.border-top-primary {
    border-top: 0.25rem solid #00bcd4 !important;
}
.border-right-primary {
    border-right: 0.25rem solid #00bcd4 !important;
}
.border-bottom-primary {
    border-bottom: 0.25rem solid #00bcd4 !important;
}
.border-left-primary {
    border-left: 0.25rem solid #00bcd4 !important;
}
.border-thin-primary {
    border: 1px solid #00bcd4 !important;
}
.border-top-thin-primary {
    border-top: 1px solid #00bcd4 !important;
}
.border-right-thin-primary {
    border-right: 1px solid #00bcd4 !important;
}
.border-bottom-thin-primary {
    border-bottom: 1px solid #00bcd4 !important;
}
.border-left-thin-primary {
    border-left: 3px solid #00bcd4 !important;
}
.border-thick-primary {
    border: 3px solid #00bcd4 !important;
}
.border-top-thick-primary {
    border-top: 3px solid #00bcd4 !important;
}
.border-right-thick-primary {
    border-right: 3px solid #00bcd4 !important;
}
.border-bottom-thick-primary {
    border-bottom: 3px solid #00bcd4 !important;
}
.border-left-thick-primary {
    border-left: 3px solid #00bcd4 !important;
}

/* ==============================================
 BUTTON
=============================================== */
.btn.primary.focus,
.btn.primary:focus {
    box-shadow: 0 0 0 0.2rem #00bcd440;
}
.btn.primary {
    color: #ffffff;
    background-color: #00bcd4;
    border-color: #00bcd4;
}
.btn.primary.hover,
.btn.primary:hover {
    color: #ffffff;
    background-color: #00bcd4;
    border-color: #03adc4;
}
.btn.primary.focus,
.btn.primary:focus {
    color: #ffffff;
    background-color: #00bcd4;
    border-color: #03adc4;
    box-shadow: 0 0 0 0.2rem #00bcd480;
}
.btn.primary.disabled,
.btn.primary:disabled {
    color: #ffffff;
    background-color: #00bcd4;
    border-color: #00bcd4;
}
.btn.primary:not(:disabled):not(.disabled).active,
.btn.primary:not(:disabled):not(.disabled):active,
.show > .btn.primary.dropdown-toggle {
    color: #ffffff;
    background-color: #03adc4;
    border-color: #00bcd4;
}
.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 #00bcd480;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.primary {
    color: #00bcd4;
    background-color: #ffffff;
    border-color: #00bcd4;
}
.btn-outline.primary:hover {
    color: #00bcd4;
    background-color: #ffffff;
    border-color: #00bcd4;
}
.btn-outline.primary.focus,
.btn-outline.primary:focus {
    color: #00bcd4;
    background-color: #ffffff;
    border-color: #00bcd4;
    box-shadow: 0 0 0 0.2rem #00bcd480;
}
.btn-outline.primary.disabled, .btn-outline.primary:disabled {
    color: #00bcd4;
    background-color: #ffffff;
    border-color: #3abecf;
}
.btn-outline.primary:not(:disabled):not(.disabled).active,
.btn-outline.primary:not(:disabled):not(.disabled):active,
.show > .btn-outline.primary.dropdown-toggle {
    color: #00bcd4;
    background-color: #ffffff;
    border-color: #00bcd4;
}
.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: #03adc4;
    background-color: #ffffff;
    border-color: #03adc4;
    box-shadow: 0 0 0 0.2rem #00bcd480;
}
.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: #03adc4;
    background-color: #ffffff;
    border-color: #03adc4;
    box-shadow: 0 0 0 0.2rem #00bcd4BF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.primary > .btn-primary.active {
    color: #ffffff;
    background-color: #00bcd4;
    border-color: #03adc4;
}

.btn-group.primary .btn-outline:not(:active):not(.active) {
    color: #00bcd4;
    border-color: #00bcd4;
}
.btn-group.primary .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.primary .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #00bcd4 !important;
    border-color: #00bcd4;
}
.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: #03adc4 !important;
    border-color: #03adc4;
    box-shadow: 0 0 0 0.2rem #00bcd480;
}
.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: #03adc4 !important;
    border-color: #03adc4;
    box-shadow: 0 0 0 0.2rem #00bcd4BF;
}

/* ==============================================
 BUTTON LINK
=============================================== */
.btn-link.primary {
    color: #00bcd4;
}
.btn-link.primary.hover,
.btn-link.primary:hover {
    color: #0095a8;
}
.btn-link.primary.disabled,
.btn-link.primary:disabled {
    color: #0095a8;
}

/* ==============================================
BREADCRUMBS
=============================================== */
.breadcrumb.primary .breadcrumb-item a {
    color: #00bcd4;
}
.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: #00bcd4 !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: #00bcd4;
    background-color: #00bcd4;
}
.custom-checkbox.primary .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #00bcd44D;
}
.custom-checkbox.primary .custom-control-input:disabled:indeterminate ~ .custom-control-label::before {
    background-color: #00bcd44D;
}

/* ==============================================
 CUSTOM CONTROL
=============================================== */
.custom-control.primary .custom-control-input:checked ~ .custom-control-label::before {
    color: #ffffff;
    border-color: #ffffff;
    background-color: #00bcd4;
}
.custom-control.primary .custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: 0 0 0.2rem #00bcd440;
}
.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: #00bcd4;
}
.custom-radio.primary .custom-control-input:disabled~.custom-control-label::before {
    background-color: #00bcd44D;
}
.custom-radio.primary .custom-control-input:focus~.custom-control-label::before {
    box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem #00bcd466;
}
.custom-radio.primary .custom-control-input:checked~.custom-control-label::after {
    color: #00bcd4;
}

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

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

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

/* ==============================================
 DROPDOWN
=============================================== */
.dropdown-item.primary.active,
.dropdown-item.primary:active {
    color: #ffffff;
    background-color: #00bcd4;
}
.dropdown-item.primary.disabled,
.dropdown-item.primary:disabled {
    color: #00bcd44D;
}
.dropdown.primary .dropdown-item.active,
.dropdown.primary .dropdown-item:active {
    color: #ffffff !important;
    background-color: #00bcd4E6 !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: #00bcd4E6 !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: #00bcd4CC !important;
}
.dropdown.primary .dropdown-item:hover .text-primary {
    color: #ffffff !important;
}

/* ==============================================
 ERROR
=============================================== */
.error.primary:before {
    text-shadow: 1px 0 #00bcd4;
    color: #0095a8;
    background: #f8f9fc;
}

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

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

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

/* ==============================================
 JUMBOTRON
=============================================== */
.jumbotron.primary {
    color: #ffffff;
    background-color: #00bcd4;
}
.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: #00bcd4 !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: #3abecf !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: #3abecf !important;
}
.list-group.primary .list-group-item.active,
.list-group-item.primary.active {
    color: #ffffff;
    background-color: #03adc4 !important;
    border-color: #03adc4;
}
.list-group.primary .list-group-item.disabled,
.list-group-item.primary.disabled {
    color: #ffffff;
    background-color: #0095a8A9 !important;
}

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

/* ==============================================
 MODAL
=============================================== */
.modal-header.primary {
    background-color: #00bcd4;
    color: #ffffff;
}
.modal-header.primary a {
    color: #ffffff;
}
.modal-header.text-primary .modal-title,
.modal-header.text-primary a {
    color: #00bcd4;
}
.modal .nav-tabs.bg-primary {
    background-color: #00bcd4 !important;
    color: #ffffff !important;
    border: 1px solid #00bcd4 !important;
}
.modal .nav-tabs.bg-primary .nav-link {
    border: 1px solid #00bcd4 !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: #00bcd4;
}
.nav.primary .nav-link {
    color: #00bcd4;
}
.nav.primary .nav-link.disabled {
    color: #00bcd480 !important;
}
.nav.primary .nav-link.bordered {
    border: 1px solid #00bcd4;
}

.nav-link.primary a {
    color: #00bcd4;
}
.nav-link.primary.disabled {
    color: #00bcd44D;
}

.nav.bg-primary,
.nav.bg-primary .nav-link,
.nav.bg-primary .nav-link.active {
    background-color: #00bcd4;
    color: #ffffff;
    border: 1px solid #03adc4;
}
.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 #00bcd4 !important;
}
.nav-vertical.primary .nav-item a.active {
    border-left: 2px solid #00bcd4 !important;
}
.nav-vertical.primary .nav-link.disabled {
    cursor: not-allowed;
    color: #00bcd4BF !important;
}

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

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

/* ==============================================
NAV TABS
=============================================== */
.nav-tabs.primary .nav-link:not(.active):hover {
    border-color: transparent !important;
}

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

/* ==============================================
 NAVBAR
=============================================== */
.navbar.primary {
    color: #ffffffE6 !important;
    background-color: #00bcd4 !important;
}
.navbar.primary #sidebarToggleTop,
.navbar.primary #sidebarToggleTop i {
    color: #ffffffE6 !important;
    background-color: #00bcd4 !important;
    border: none;
}
.navbar.primary #sidebarToggleTop:active {
    border-color: #00bcd4E6;
}
.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: #00bcd41A;
}
.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: #00bcd4;
    border: 1px solid #dddfeb;
}
.pagination.primary .page-link.hover,
.pagination.primary .page-link:hover {
    color: #ffffff;
    background-color: #00bcd4BF;
    border-color: #dddfeb;
}
.pagination.primary .page-link.focus,
.pagination.primary .page-link:focus {
    box-shadow: 0 0 0.2rem #00bcd440 !important;
}
.pagination.primary .page-item.active .page-link {
    color: #ffffff;
    background-color: #00bcd4;
    border-color: #00bcd4;
}
.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: #00bcd4;
}

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

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

/* ==============================================
 SELECT
=============================================== */
.primary select option:checked,
.primary select option:hover {
    box-shadow: 0 0 10px 100px #00bcd4 inset;
}
.primary select:focus > option:checked {
    color: #ffffff !important;
    background-color: #00bcd440 !important;
}
.primary .custom-select {
    color: #6e707e;
}
.primary .custom-select:focus {
    border-color: #bac8f3;
    box-shadow: 0 0 0.2rem #00bcd440;
}
.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: #00bcd4 !important;
}
.primary .bootstrap-select .dropdown-item.hover,
.primary .bootstrap-select .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #00bcd4BF !important;
}
.primary .bootstrap-select.show-tick .dropdown-menu .selected span.check-mark {
    color: #00bcd4;
}

/* ==============================================
 SIDEBAR
=============================================== */
.sidebar.primary .nav-item .collapse .collapse-inner .collapse-item.active,
.sidebar.primary .nav-item .collapsing .collapse-inner .collapse-item.active {
    color: #00bcd4;
}
.sidebar.primary {
    color: #ffffff;
    background-color: #00bcd4;
}
.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: #0095a8;
}
.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: #0095a8;
}
.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: #0095a8;
}
.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: #00bcd433;
}
.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 #00bcd41A !important;
}

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

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

/* ==============================================
TABLE
=============================================== */
table.primary td.highlight {
    color: #ffffff;
    background-color: #00bcd480;
}
table.primary th.highlight {
    color: #ffffff;
    background-color: #00bcd4A0;
}
th.highlight.primary {
    color: #ffffff;
    background-color: #00bcd4A0;
}
td.highlight.primary {
    color: #ffffff;
    background-color: #00bcd480;
}

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

/* ==============================================
 TEXT
=============================================== */
.text-primary {
    color: #00bcd4 !important;
}
.text-primary.active,
.text-primary:active {
    color: #0095a8 !important;
}
.text-primary.disabled,
.text-primary:disabled {
    color: #00bcd4D9 !important;
}

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

/* ==============================================
 TOPBAR
=============================================== */
.topbar.primary .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #00bcd4 !important;
    border: 1px solid #00bcd4 !important;
}
.topbar .dropdown.primary .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #00bcd4 !important;
    border-color: #00bcd4 !important;
}
/* ==============================================
 A
=============================================== */
a.text-secondary {
    color: #607d8b;
}
a.text-secondary:hover {
    color: #546e7a !important;
}
a.text-secondary.active,
a.text-secondary:active {
    color: #546e7a;
}
a.text-secondary.focus,
a.text-secondary:focus {
    color: #78909c !important;
}
a.text-secondary.disabled,
a.text-secondary:disabled {
    color: #607d8bD9;
}

/* ==============================================
 ALERT
=============================================== */
.alert.secondary {
    color: #ffffff;
    background-color: #78909c;
    border-color: #607d8b;
}
.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: #607d8b;
}

/* ==============================================
 BADGE
=============================================== */
.badge.secondary {
    color: #ffffff;
    background-color: #607d8b;
}
a.badge.secondary:hover,
a.badge.secondary:hover {
    color: #ffffff;
    background-color: #455a64;
}
.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 #607d8b80;
}
.badge-avatar.secondary {
    border-color: #607d8b;
}

/* ==============================================
 BACKGROUND
=============================================== */
.bg-secondary {
    background-color: #607d8b !important;
}
.bg-secondary-lighten {
    background-color: #607d8b88 !important;
}
a.bg-secondary:focus,
a.bg-secondary:hover,
button.bg-secondary:focus,
button.bg-secondary:hover {
    background-color: #455a64 !important;
}
.bg-gradient-secondary {
    background-color: #607d8b;
    background-image: linear-gradient(180deg, #607d8b 10%, #607d8b 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 #607d8b !important;
}
.border-top-secondary {
    border-top: 0.25rem solid #607d8b !important;
}
.border-right-secondary {
    border-right: 0.25rem solid #607d8b !important;
}
.border-bottom-secondary {
    border-bottom: 0.25rem solid #607d8b !important;
}
.border-left-secondary {
    border-left: 0.25rem solid #607d8b !important;
}
.border-thin-secondary {
    border: 1px solid #607d8b !important;
}
.border-top-thin-secondary {
    border-top: 1px solid #607d8b !important;
}
.border-right-thin-secondary {
    border-right: 1px solid #607d8b !important;
}
.border-bottom-thin-secondary {
    border-bottom: 1px solid #607d8b !important;
}
.border-left-thin-secondary {
    border-left: 3px solid #607d8b !important;
}
.border-thick-secondary {
    border: 3px solid #607d8b !important;
}
.border-top-thick-secondary {
    border-top: 3px solid #607d8b !important;
}
.border-right-thick-secondary {
    border-right: 3px solid #607d8b !important;
}
.border-bottom-thick-secondary {
    border-bottom: 3px solid #607d8b !important;
}
.border-left-thick-secondary {
    border-left: 3px solid #607d8b !important;
}

/* ==============================================
 BUTTON
=============================================== */
.btn.secondary.focus,
.btn.secondary:focus {
    box-shadow: 0 0 0 0.2rem #607d8b40;
}
.btn.secondary {
    color: #ffffff;
    background-color: #607d8b;
    border-color: #607d8b;
}
.btn.secondary.hover,
.btn.secondary:hover {
    color: #ffffff;
    background-color: #607d8b;
    border-color: #455a64;
}
.btn.secondary.focus,
.btn.secondary:focus {
    color: #ffffff;
    background-color: #607d8b;
    border-color: #455a64;
    box-shadow: 0 0 0 0.2rem #607d8b80;
}
.btn.secondary.disabled,
.btn.secondary:disabled {
    color: #ffffff;
    background-color: #607d8b;
    border-color: #607d8b;
}
.btn.secondary:not(:disabled):not(.disabled).active,
.btn.secondary:not(:disabled):not(.disabled):active,
.show > .btn.secondary.dropdown-toggle {
    color: #ffffff;
    background-color: #455a64;
    border-color: #607d8b;
}
.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 #607d8b80;
}

/* ==============================================
 BUTTON OUTLINE
=============================================== */
.btn-outline.secondary {
    color: #607d8b;
    background-color: #ffffff;
    border-color: #607d8b;
}
.btn-outline.secondary:hover {
    color: #607d8b;
    background-color: #ffffff;
    border-color: #607d8b;
}
.btn-outline.secondary.focus,
.btn-outline.secondary:focus {
    color: #607d8b;
    background-color: #ffffff;
    border-color: #607d8b;
    box-shadow: 0 0 0 0.2rem #607d8b80;
}
.btn-outline.secondary.disabled, .btn-outline.secondary:disabled {
    color: #607d8b;
    background-color: #ffffff;
    border-color: #78909c;
}
.btn-outline.secondary:not(:disabled):not(.disabled).active,
.btn-outline.secondary:not(:disabled):not(.disabled):active,
.show > .btn-outline.secondary.dropdown-toggle {
    color: #607d8b;
    background-color: #ffffff;
    border-color: #607d8b;
}
.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: #455a64;
    background-color: #ffffff;
    border-color: #455a64;
    box-shadow: 0 0 0 0.2rem #607d8b80;
}
.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: #455a64;
    background-color: #ffffff;
    border-color: #455a64;
    box-shadow: 0 0 0 0.2rem #607d8bBF;
}

/* ==============================================
 BUTTON GROUP
=============================================== */
.btn-group.secondary > .btn-secondary.active {
    color: #ffffff;
    background-color: #607d8b;
    border-color: #455a64;
}

.btn-group.secondary .btn-outline:not(:active):not(.active) {
    color: #607d8b;
    border-color: #607d8b;
}
.btn-group.secondary .btn-outline:not(:disabled):not(.disabled).active,
.btn-group.secondary .btn-outline:not(:disabled):not(.disabled):active {
    color: #ffffff;
    background-color: #607d8b !important;
    border-color: #607d8b;
}
.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: #455a64 !important;
    border-color: #455a64;
    box-shadow: 0 0 0 0.2rem #607d8b80;
}
.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: #455a64 !important;
    border-color: #455a64;
    box-shadow: 0 0 0 0.2rem #607d8bBF;
}

/* ==============================================
 BUTTON LINK
=============================================== */
.btn-link.secondary {
    color: #607d8b;
}
.btn-link.secondary.hover,
.btn-link.secondary:hover {
    color: #546e7a;
}
.btn-link.secondary.disabled,
.btn-link.secondary:disabled {
    color: #546e7a;
}

/* ==============================================
BREADCRUMBS
=============================================== */
.breadcrumb.secondary .breadcrumb-item a {
    color: #607d8b;
}
.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: #607d8b !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: #607d8b;
    background-color: #607d8b;
}
.custom-checkbox.secondary .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: #607d8b4D;
}
.custom-checkbox.secondary .custom-control-input:disabled:indeterminate ~ .custom-control-label::before {
    background-color: #607d8b4D;
}

/* ==============================================
 CUSTOM CONTROL
=============================================== */
.custom-control.secondary .custom-control-input:checked ~ .custom-control-label::before {
    color: #ffffff;
    border-color: #ffffff;
    background-color: #607d8b;
}
.custom-control.secondary .custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: 0 0 0.2rem #607d8b40;
}
.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: #607d8b;
}
.custom-radio.secondary .custom-control-input:disabled~.custom-control-label::before {
    background-color: #607d8b4D;
}
.custom-radio.secondary .custom-control-input:focus~.custom-control-label::before {
    box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem #607d8b66;
}
.custom-radio.secondary .custom-control-input:checked~.custom-control-label::after {
    color: #607d8b;
}

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

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

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

/* ==============================================
 DROPDOWN
=============================================== */
.dropdown-item.secondary.active,
.dropdown-item.secondary:active {
    color: #ffffff;
    background-color: #607d8b;
}
.dropdown-item.secondary.disabled,
.dropdown-item.secondary:disabled {
    color: #607d8b4D;
}
.dropdown.secondary .dropdown-item.active,
.dropdown.secondary .dropdown-item:active {
    color: #ffffff !important;
    background-color: #607d8bE6 !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: #607d8bE6 !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: #607d8bCC !important;
}
.dropdown.secondary .dropdown-item:hover .text-secondary {
    color: #ffffff !important;
}

/* ==============================================
 ERROR
=============================================== */
.error.secondary:before {
    text-shadow: 1px 0 #607d8b;
    color: #546e7a;
    background: #f8f9fc;
}

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

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

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

/* ==============================================
 JUMBOTRON
=============================================== */
.jumbotron.secondary {
    color: #ffffff;
    background-color: #607d8b;
}
.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: #607d8b !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: #78909c !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: #78909c !important;
}
.list-group.secondary .list-group-item.active,
.list-group-item.secondary.active {
    color: #ffffff;
    background-color: #455a64 !important;
    border-color: #455a64;
}
.list-group.secondary .list-group-item.disabled,
.list-group-item.secondary.disabled {
    color: #ffffff;
    background-color: #546e7aA9 !important;
}

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

/* ==============================================
 MODAL
=============================================== */
.modal-header.secondary {
    background-color: #607d8b;
    color: #ffffff;
}
.modal-header.secondary a {
    color: #ffffff;
}
.modal-header.text-secondary .modal-title,
.modal-header.text-secondary a {
    color: #607d8b;
}
.modal .nav-tabs.bg-secondary {
    background-color: #607d8b !important;
    color: #ffffff !important;
    border: 1px solid #607d8b !important;
}
.modal .nav-tabs.bg-secondary .nav-link {
    border: 1px solid #607d8b !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: #607d8b;
}
.nav.secondary .nav-link {
    color: #607d8b;
}
.nav.secondary .nav-link.disabled {
    color: #607d8b80 !important;
}
.nav.secondary .nav-link.bordered {
    border: 1px solid #607d8b;
}

.nav-link.secondary a {
    color: #607d8b;
}
.nav-link.secondary.disabled {
    color: #607d8b4D;
}

.nav.bg-secondary,
.nav.bg-secondary .nav-link,
.nav.bg-secondary .nav-link.active {
    background-color: #607d8b;
    color: #ffffff;
    border: 1px solid #455a64;
}
.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 #607d8b !important;
}
.nav-vertical.secondary .nav-item a.active {
    border-left: 2px solid #607d8b !important;
}
.nav-vertical.secondary .nav-link.disabled {
    cursor: not-allowed;
    color: #607d8bBF !important;
}

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

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

/* ==============================================
NAV TABS
=============================================== */
.nav-tabs.secondary .nav-link:not(.active):hover {
    border-color: transparent !important;
}

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

/* ==============================================
 NAVBAR
=============================================== */
.navbar.secondary {
    color: #ffffffE6 !important;
    background-color: #607d8b !important;
}
.navbar.secondary #sidebarToggleTop,
.navbar.secondary #sidebarToggleTop i {
    color: #ffffffE6 !important;
    background-color: #607d8b !important;
    border: none;
}
.navbar.secondary #sidebarToggleTop:active {
    border-color: #607d8bE6;
}
.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: #607d8b1A;
}
.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: #607d8b;
    border: 1px solid #dddfeb;
}
.pagination.secondary .page-link.hover,
.pagination.secondary .page-link:hover {
    color: #ffffff;
    background-color: #607d8bBF;
    border-color: #dddfeb;
}
.pagination.secondary .page-link.focus,
.pagination.secondary .page-link:focus {
    box-shadow: 0 0 0.2rem #607d8b40 !important;
}
.pagination.secondary .page-item.active .page-link {
    color: #ffffff;
    background-color: #607d8b;
    border-color: #607d8b;
}
.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: #607d8b;
}

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

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

/* ==============================================
 SELECT
=============================================== */
.secondary select option:checked,
.secondary select option:hover {
    box-shadow: 0 0 10px 100px #607d8b inset;
}
.secondary select:focus > option:checked {
    color: #ffffff !important;
    background-color: #607d8b40 !important;
}
.secondary .custom-select {
    color: #6e707e;
}
.secondary .custom-select:focus {
    border-color: #bac8f3;
    box-shadow: 0 0 0.2rem #607d8b40;
}
.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: #607d8b !important;
}
.secondary .bootstrap-select .dropdown-item.hover,
.secondary .bootstrap-select .dropdown-item:hover {
    color: #ffffff !important;
    background-color: #607d8bBF !important;
}
.secondary .bootstrap-select.show-tick .dropdown-menu .selected span.check-mark {
    color: #607d8b;
}

/* ==============================================
 SIDEBAR
=============================================== */
.sidebar.secondary .nav-item .collapse .collapse-inner .collapse-item.active,
.sidebar.secondary .nav-item .collapsing .collapse-inner .collapse-item.active {
    color: #607d8b;
}
.sidebar.secondary {
    color: #ffffff;
    background-color: #607d8b;
}
.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: #546e7a;
}
.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: #546e7a;
}
.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: #546e7a;
}
.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: #607d8b33;
}
.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 #607d8b1A !important;
}

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

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

/* ==============================================
TABLE
=============================================== */
table.secondary td.highlight {
    color: #ffffff;
    background-color: #607d8b80;
}
table.secondary th.highlight {
    color: #ffffff;
    background-color: #607d8bA0;
}
th.highlight.secondary {
    color: #ffffff;
    background-color: #607d8bA0;
}
td.highlight.secondary {
    color: #ffffff;
    background-color: #607d8b80;
}

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

/* ==============================================
 TEXT
=============================================== */
.text-secondary {
    color: #607d8b !important;
}
.text-secondary.active,
.text-secondary:active {
    color: #546e7a !important;
}
.text-secondary.disabled,
.text-secondary:disabled {
    color: #607d8bD9 !important;
}

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

/* ==============================================
 TOPBAR
=============================================== */
.topbar.secondary .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #607d8b !important;
    border: 1px solid #607d8b !important;
}
.topbar .dropdown.secondary .dropdown-list .dropdown-header {
    color: #ffffff !important;
    background-color: #607d8b !important;
    border-color: #607d8b !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 TABS
=============================================== */
.nav-tabs.white .nav-link:not(.active):hover {
    border-color: transparent !important;
}

/* ==============================================
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.black .nav-item a {
    color: #222222;
}
.nav-vertical.black .nav-item a:hover {
    border-left: 1px solid #222222 !important;
}
.nav-vertical.black .nav-item a.active {
    border-left: 2px solid #222222 !important;
}
.nav-vertical.black .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 TABS
=============================================== */
.nav-tabs.black .nav-link:not(.active):hover {
    border-color: transparent !important;
}

/* ==============================================
NAV BORDER
=============================================== */
.nav-border-top.black {
    border-top: .15rem solid #222222 !important;
}
.nav-border-top.black a {
    color: #222222;
}
.nav-border-right.black {
    border-right: .15rem solid #222222 !important;
}
.nav-border-right.black a {
    color: #222222;
}
.nav-border-bottom.black {
    border-bottom: .15rem solid #222222 !important;
}
.nav-border-bottom.black a {
    color: #222222;
}
.nav-border-left.black {
    border-left: .15rem solid #222222 !important;
}
.nav-border-left.black 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;
}