.row {
    margin-right: -5px;
    margin-left: -5px
}

.col,
.col-1,
.col-10,
.col-11,
.col-12,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-auto,
.col-lg,
.col-lg-1,
.col-lg-10,
.col-lg-11,
.col-lg-12,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-lg-auto,
.col-md,
.col-md-1,
.col-md-10,
.col-md-11,
.col-md-12,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-md-auto,
.col-sm,
.col-sm-1,
.col-sm-10,
.col-sm-11,
.col-sm-12,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-sm-auto,
.col-xl,
.col-xl-1,
.col-xl-10,
.col-xl-11,
.col-xl-12,
.col-xl-2,
.col-xl-3,
.col-xl-4,
.col-xl-5,
.col-xl-6,
.col-xl-7,
.col-xl-8,
.col-xl-9,
.col-xl-auto {
    padding-right: 5px;
    padding-left: 5px
}

::selection {
    color: #fff;
    background: #18BADD
}

a,
.btn-link {
    color: #18BADD
}

.text-green,
.text-info,
.text-success,
.text-danger,
.text-primary,
.text-warning,
.mail-star.active {
    color: #18BADD !important
}

.badge-default {
    background: #747879;
    color: #edeff3
}

.dimmer {
    position: relative
}

.dimmer .loader {
    display: none;
    margin: 0 auto;
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    transform: translateY(-50%)
}

.dimmer.active .loader {
    display: block
}

.dimmer.active .dimmer-content {
    opacity: .5;
    pointer-events: none
}

.loader {
    height: 2.5rem;
    width: 2.5rem;
    color: #ff3d00;
    display: block;
    position: relative
}

.loader:before,
.loader:after {
    width: 2.5rem;
    height: 2.5rem;
    margin: -1.25rem 0 0 -1.25rem;
    position: absolute;
    content: '';
    top: 50%;
    left: 50%
}

.loader:before {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    border: 3px solid currentColor;
    opacity: .15
}

.loader:after {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    animation: loader .6s linear;
    animation-iteration-count: infinite;
    border: 3px solid;
    border-color: transparent;
    border-top-color: currentColor;
    box-shadow: 0 0 0 1px transparent
}

.dark-mode .loader {
    color: #272c31
}

.badge-primary {
    background-color: #ff3d00
}

.btn-primary {
    background: #ff3d00;
    color: #fff;
    border-color: #ff3d00
}

.btn-info {
    background-color: #18BADD;
    border-color: #18BADD
}

.nav-tabs .nav-link.active {
    border-color: #ff3d00 !important;
    color: #ff3d00 !important;
    background: transparent !important
}
.form-control:focus {
    box-shadow: 0 0 0 0.2rem rgba(42, 50, 143, 0.25)
}

.card,
.dropify-wrapper,
.btn-primary {
    border: 0
}

.bg-primary,
.bg-info,
.bg-warning,
.btn-success {
    /*background-color: #ff3d00 !important;
    border: transparent*/
}

.bg-success,
.bg-danger,
.badge-success,
.progress-bar,
.btn-danger,
.btn-warning {
    /*background-color: #18BADD;
    border: transparent*/
}

.btn-outline-primary {
    color: #ff3d00;
    border-color: #ff3d00
}

.btn-outline-primary:hover {
    background-color: #ff3d00;
    border-color: #ff3d00
}

.custom-control-input:checked~.custom-control-label::before,
.custom-radio .custom-control-input:disabled:checked~.custom-control-label::before,
.custom-checkbox .custom-control-input:disabled:checked~.custom-control-label::before {
    border-color: #ff3d00!important;
    background-color: #ff3d00!important
}

.custom-switch-input:checked~.custom-switch-indicator {
    background: #ff3d00
}

.selectgroup-input:checked+.selectgroup-button {
    border-color: #ff3d00;
    color: #ff3d00;
    background: rgba(42, 50, 143, 0.2)
}

.imagecheck-figure:before {
    color: #18BADD !important
}

.wizard>.steps .current a,
.wizard>.steps .current a:hover,
.wizard>.steps .current a:active,
.wizard>.actions a,
.wizard>.actions a:hover {
    background: #ff3d00
}

.wizard>.steps .done a,
.wizard>.steps .done a:hover {
    background: rgba(42, 50, 143, 0.2);
    color: #ff3d00
}

.list-group-item,
.modal-content {
    background-color: #fff
}

.table th {
    color: #747879
}

.table.table-custom td,
.table.table-custom th {
    background: #edeff3
}

.table.table_custom tr {
    background: #fff
}

.right_chat li.online .status {
    background: #ff3d00
}

.bg-blue,
.bg-azure,
.bg-indigo,
.bg-purple,
.bg-red,
.bg-orange {
    background-color: #ff3d00 !important
}

.bg-pink,
.bg-yellow,
.bg-lime,
.bg-green,
.bg-teal,
.bg-cyan {
    background-color: #18BADD !important
}

.bg-light-blue,
.bg-light-azure,
.bg-light-indigo,
.bg-light-lime,
.bg-light-green,
.bg-light-teal {
    background-color: rgba(42, 50, 143, 0.1);
    color: #ff3d00
}

.bg-light-pink,
.bg-light-red,
.bg-light-orange,
.bg-light-yellow,
.bg-light-cyan {
    background-color: rgba(24, 186, 221, 0.1);
    color: #18BADD
}

.bg-light-purple {
    background-color: rgba(24, 186, 221, 0.1);
    color: #18BADD
}

.bg-light-gray {
    background-color: rgba(102, 106, 109, 0.1);
    color: #666A6D
}

.avatar.avatar-blue {
    background-color: rgba(42, 50, 143, 0.1);
    color: #ff3d00
}

.avatar.avatar-azure {
    background-color: rgba(42, 50, 143, 0.1);
    color: #ff3d00
}

.avatar.avatar-indigo {
    background-color: rgba(42, 50, 143, 0.1);
    color: #ff3d00
}

.avatar.avatar-purple {
    background-color: rgba(42, 50, 143, 0.1);
    color: #ff3d00
}

.avatar.avatar-pink {
    background-color: rgba(42, 50, 143, 0.1);
    color: #ff3d00
}

.avatar.avatar-red {
    background-color: rgba(42, 50, 143, 0.1);
    color: #ff3d00
}

.avatar.avatar-orange {
    background-color: rgba(42, 50, 143, 0.1);
    color: #ff3d00
}

.avatar.avatar-yellow {
    background-color: rgba(24, 186, 221, 0.1);
    color: #18BADD
}

.avatar.avatar-lime {
    background-color: rgba(24, 186, 221, 0.1);
    color: #18BADD
}

.avatar.avatar-green {
    background-color: rgba(24, 186, 221, 0.1);
    color: #18BADD
}

.avatar.avatar-teal {
    background-color: rgba(24, 186, 221, 0.1);
    color: #18BADD
}

.avatar.avatar-cyan {
    background-color: rgba(24, 186, 221, 0.1);
    color: #18BADD
}

body {
    background-color: #edeff3;
    color: #202121
}

.page-header {
    border-color: #fff
}

.page-header .right .nav-pills .nav-link {
    color: #202121
}

#header_top .brand-logo {
    background: #18BADD;
    width: 35px
}

.header {
    background: #ff3d00
}

.header .nav-tabs .nav-link {
    color: #fff
}

.header .nav-tabs .nav-link.active {
    border-color: #fff
}

.header .dropdown-menu .dropdown-item:hover,
.header .dropdown-menu .dropdown-item.active {
    color: #ff3d00
}

.page .section-white,
.page .section-body {
    background: #edeff3
}

#header_top .nav-link {
    color: #202121
}

.header_top.dark {
    background-color: #64000a !important
}

.header_top.dark .nav-link {
    color: #808488 !important
}

.card {
    background-color: #fff;
    border-radius: 3px;
    margin-bottom: 10px !important
}

.card .card-options a {
    color: #ff3d00
}

.card .card-options a.btn {
    color: #fff
}

.card.card-fullscreen {
    background-color: #fff !important
}

.metismenu .g_heading {
    color: rgba(255, 255, 255, 0.3)
}

.metismenu a {
    color: #202121
}

.metismenu a:hover {
    color: #ff3d00;
    border-color: #ff3d00
}
.metismenu ul a {
    color: #202121;
    font-size: 14px;
    padding: 5px 15px 5px 30px;
    position: relative
}

.metismenu .active>a {
    color: #ff3d00;
    border-color: #ff3d00
}

.metismenu .active ul .active a {
    color: #ff3d00;
    background: transparent
}

.metismenu.grid>li.active>a,
.metismenu.grid>li>a:hover {
    background: rgba(42, 50, 143, 0.1);
    color: #ff3d00
}
.sidebar_dark .metismenu a {
    color: #e3e3e3
}
.sidebar_dark .metismenu a:hover {
    color: #ff3c00;
    border-color: #ff3c00
}

.inbox .detail {
    background: #fff
}

.file_folder a {
    background: #fff;
    border-color: #edeff3
}

.page-access .page-access_left {
    background: #fff
}

.gender_overview {
    background: #edeff3
}

.table-calendar-link {
    background: #ff3d00
}

.table-calendar-link:hover {
    background: #64000a
}

.table-calendar-link::before {
    background: #64000a
}

.theme_div {
    background: #fff
}

.ribbon .ribbon-box.green {
    background: #18BADD
}

.ribbon .ribbon-box.green::before {
    border-color: #18BADD;
    border-right-color: transparent
}

.ribbon .ribbon-box.orange {
    background: #ff3d00
}

.ribbon .ribbon-box.orange::before {
    border-color: #ff3d00;
    border-right-color: transparent
}

.ribbon .ribbon-box.pink {
    background: #18BADD
}

.ribbon .ribbon-box.pink::before {
    border-color: #18BADD;
    border-right-color: transparent
}

.ribbon .ribbon-box.indigo {
    background: #18BADD
}

.ribbon .ribbon-box.indigo::before {
    border-color: #18BADD;
    border-right-color: transparent
}

.text-orange {
    color: #18BADD !important
}

.tag-info {
    background: #ff3d00
}

.tag-success,
.tag-green {
    background: #18BADD
}

.tag-orange {
    background: #18BADD
}

.tag-danger {
    background: #18BADD
}

.bg-success {
    background: #18BADD !important
}

.bg-danger {
    background-color: #18BADD !important
}

.page-access .page-access_left {
    background: #64000a
}

.page-access .page-access_left .card {
    padding: 20px;
    right: -150px;
    z-index: 99999
}

@media only screen and (max-width: 1024px) {
    .page-access .page-access_left .card {
        right: -50px
    }
}

@media only screen and (max-width: 992px) {
    .page-access .page-access_left .card {
        right: auto
    }
}

.page-item .page-link {
    color: #18BADD
}

.page-item.active .page-link {
    background-color: #18BADD;
    border-color: #18BADD
}

#left-sidebar {
    background-color: #fff;
}

.dark-mode .metismenu.grid>li>a {
    border-color: rgba(255, 255, 255, 0.2)
}

.dark-mode.sidebar_dark .sidebar .metismenu .active>a {
    color: #ff3d00
}

.dark-mode.sidebar_dark .sidebar .metismenu .active ul .active a {
    color: #ff3d00
}

.dark-mode.sidebar_dark .sidebar .metismenu a {
    color: #fff
}

.dark-mode .nav-tabs .nav-link.active {
    color: #18BADD
}
.page-title {
    color: #000000 !important
}

.top_dark {
    background-color: #64000a !important;
    color: #fff;
}

.top_dark .form-control,
.top_dark .dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .top_dark .dataTables_filter,
.top_dark .custom-select {
    background-color: rgba(255, 255, 255, 0.1);
    border: 0;
    color: #808488 !important
}

.top_dark .page-header {
    border-color: #301901
}

.top_dark .page-header .right .nav-pills .nav-link {
    color: #BABDBF
}
.sidebar_dark #left-sidebar {
    background-color: #64000a;
    border-right: 1px solid #ff3d00!important
}
.top_dark .page-title{
    color: #ffffff !important;
}

.sidebar_dark #header_top .nav-link {
    color: #ff3d00 !important
}

.sidebar_dark .sidebar .nav-tabs {
    border-color: rgba(255, 255, 255, 0.1)
}

.sidebar_dark .sidebar .nav-tabs .nav-link.active {
    border-color: #fff;
    color: #fff
}

.sidebar_dark .sidebar .metismenu .active>a {
    color: #ff3c00
}

.sidebar_dark .sidebar .metismenu .active ul .active a {
    color: #ff3c00
}

.iconcolor #header_top .nav-link {
    color: #03a9f4 !important
}

body.iconcolor #header_top .nav-link {
    color: #ff3d00
}

.gradient .custom-switch-input:checked~.custom-switch-indicator {
    background: linear-gradient(45deg, #ff3d00, #805104) !important
}

.gradient .metismenu.grid>li.active>a,
.gradient .metismenu.grid>li>a:hover {
    background: linear-gradient(45deg, #ff3d00, #ff3d00) !important;
    color: #fff;
    border: 0
}

.gradient .btn-primary,.gradient .btn-info {
    background: linear-gradient(45deg, #ff3d00, #805104) !important;
    border: 0
}

.gradient .btn-dark {
    background: linear-gradient(45deg, #808488, #333537) !important
}

.gradient .bg-success,
.gradient .bg-danger,
.gradient .badge-success,
.gradient .progress-bar,
.gradient .btn-danger {
    background: linear-gradient(45deg, #64000a, #6c1a00) !important
}

.gradient.sidebar_dark #left-sidebar {
    background: linear-gradient(45deg, #64000a, #6c1a00) !important
}

@media only screen and (min-width: 1200px) {
    .header_top>.container {
        border-right: 1px solid rgba(255, 255, 255, 0.07)
    }
}

@media only screen and (max-width: 1200px) {
    #header_top {
        background: #ff3d00
    }
}

.btn-theme {
    color: #212529;
    background-color: #ff3d00 !important;
    border-color: #ff9800 !important;
    border-top-right-radius: 50px !important;
    border-bottom-right-radius: 50px !important;
    display: flex !important;
    align-items: center !important;
    padding: 3px 3px 3px 7px !important;
    text-transform: capitalize !important;
    font-size: 16px !important;
    transition: all .3s ease !important;
}
.dark-mode #left-sidebar,
.dark-mode .user_div {
    background: #000000;
    border-color: #343a40
}


.dark-mode #header_top {
    background: #000000
}

.dark-mode #header_top .brand-logo {
    background: #343a40
}
.dark-mode #header_top .nav-link {
    color: #7d8490
}
.metismenu.grid>li ul {
    -moz-box-shadow: 0 3px 15px rgba(41, 43, 48, 0.2);
    -webkit-box-shadow: 0 3px 15px rgba(41, 43, 48, 0.2);
    box-shadow: 0 3px 15px rgba(41, 43, 48, 0.2);
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    padding: 10px;
    text-align: left;
    margin: 40px 7px 0 7px;
    position: absolute;
    background: #561860;
    z-index: 999;
    width: 180px;
    left: 0
}
.metismenu.grid>li>a {
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    border: 1px solid #561860;
    padding: 10px;
    margin-bottom: 5px;
    width: 90px;
    height: 70px;
    line-height: 28px
}
.sidebar_dark.offcanvas-active #header_top {
    background-color: #64000a !important
}
.card, .dt-module {
    /*box-shadow: 0 0 0 1px rgb(59 61 85 / 32%);
    box-shadow: 0px 0px 0px 1px rgb(255 152 0);*/
}

.card.box_shadow {
    -moz-box-shadow: 0 3px 10px rgba(41, 43, 48, 0.05);
    -webkit-box-shadow: 0 3px 10px rgba(41, 43, 48, 0.05);
    box-shadow: 0 3px 10px rgb(165 143 137) !important;
}
.dark-mode .card.box_shadow {
    -moz-box-shadow: 0 3px 10px rgba(41, 43, 48, 0.05);
    -webkit-box-shadow: 0 3px 10px rgba(41, 43, 48, 0.05);
    box-shadow: 0 3px 10px rgb(143 143 143) !important;
}
.dark-mode .card {
    background: #272c31;
    border-color: #ff3d00;
    color: #ffffff;
}
a.icon:hover {
    color: #ff3d00 !important
}
.dropdown-menu a i {
    color: #ff3d00 !important
}

.modal-content {
    border: 5px solid #ff3d005e !important;
}
.modal-header {
    border-bottom: 1px solid #ff3d005e!important;
}

.dark-mode .form-label {
    color: #ff3d00!important;
}
.dark-mode .btn {
    color: #417082
}
.dark-mode button.btn, .dark-mode .btn {
    color: #ffffff!important;
}