::selection {
    color: #fff;
    background: #3b2063
}

a,
.btn-link {
    color: #fff
}

.text-muted,
.card-footer {
    color: rgba(255, 255, 255, 0.3) !important
}

.text-green,
.text-info,
.text-success,
.text-danger,
.text-primary,
.text-warning,
.mail-star.active {
    color: rgba(255, 255, 255, 0.05) !important
}

.loader {
    color: #3b2063
}

.badge-default,
.badge-primary {
    background-color: rgba(59, 32, 99, 0.3)
}

.btn {
    color: rgba(255, 255, 255, 0.7)
}

.btn-info,
.btn-primary {
    background: #3b2063;
    color: #fff;
    border-color: #3b2063
}

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

.custom-select {
    background-color: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.07);
    color: rgba(255, 255, 255, 0.3) !important
}

.form-control {
    background-color: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.07)
}

.form-control:focus {
    box-shadow: 0 0 0 0.2rem rgba(59, 32, 99, 0.25)
}

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

.bg-primary,
.bg-info,
.bg-warning,
.btn-success,
.bg-success,
.bg-danger,
.badge-success,
.progress-bar,
.btn-danger,
.btn-warning {
    background-color: rgba(255, 255, 255, 0.2);
    border: transparent
}

.tag-danger,
.tag-info,
.tag-success {
    background-color: rgba(255, 255, 255, 0.2)
}

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

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

.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: #3b2063;
    background-color: #3b2063
}

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

.selectgroup-input:checked+.selectgroup-button {
    border-color: #3b2063;
    color: #3b2063;
    background: rgba(59, 32, 99, 0.2)
}

.dataTables_wrapper .dataTables_filter {
    border-color: #fff;
    background: transparent
}

.input-group .input-group-append {
    margin-right: -1px;
    margin-left: 0
}

.input-group .input-group-append>.input-group-text {
    border-radius: .25rem 0 0 .25rem;
    border-left: 1px solid #E8E9E9;
    border-right: 0;
    background: #fff
}

.input-group .input-group-prepend {
    margin-left: -1px;
    margin-right: 0
}

.input-group .input-group-prepend>.input-group-text {
    border-radius: 0 .25rem .25rem 0;
    border-right: 1px solid #E8E9E9;
    border-left: 0;
    background: #fff
}

.input-group>.form-control:not(:last-child) {
    border-radius: 0 .25rem .25rem 0
}

.input-group>.form-control:not(:first-child) {
    border-radius: .25rem 0 0 .25rem
}

.imagecheck-figure:before {
    color: #3b2063 !important
}

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

.wizard>.steps .done a,
.wizard>.steps .done a:hover {
    background: rgba(59, 32, 99, 0.2);
    color: #3b2063
}

.table td {
    border-color: rgba(255, 255, 255, 0.04)
}

.table th {
    color: #aaa4b5
}

.table.table-custom td,
.table.table-custom th {
    background: rgba(255, 255, 255, 0.05)
}

.table.table_custom thead tr th {
    color: rgba(255, 255, 255, 0.4)
}

.table.table_custom td {
    border-color: rgba(255, 255, 255, 0.04) !important
}

.table.table_custom tr {
    background: rgba(255, 255, 255, 0.05)
}

.inline-datepicker.fill_bg {
    color: #3b2063
}

.right_chat li.online .status {
    background: #3b2063
}

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

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

.bg-light-blue,
.bg-light-azure,
.bg-light-indigo,
.bg-light-lime,
.bg-light-green,
.bg-light-teal {
    background-color: rgba(59, 32, 99, 0.1);
    color: #3b2063
}

.bg-light-pink,
.bg-light-red,
.bg-light-orange,
.bg-light-yellow,
.bg-light-cyan {
    background-color: rgba(59, 32, 99, 0.1);
    color: #3b2063
}

.avatar.avatar-blue {
    background-color: rgba(59, 32, 99, 0.2);
    color: #3b2063
}

.avatar.avatar-azure {
    background-color: rgba(59, 32, 99, 0.2);
    color: #3b2063
}

.avatar.avatar-indigo {
    background-color: rgba(59, 32, 99, 0.2);
    color: #3b2063
}

.avatar.avatar-purple {
    background-color: rgba(59, 32, 99, 0.2);
    color: #3b2063
}

.avatar.avatar-pink {
    background-color: rgba(59, 32, 99, 0.2);
    color: #3b2063
}

.avatar.avatar-red {
    background-color: rgba(59, 32, 99, 0.2);
    color: #3b2063
}

.avatar.avatar-orange {
    background-color: rgba(59, 32, 99, 0.2);
    color: #3b2063
}

.avatar.avatar-yellow {
    background-color: rgba(59, 32, 99, 0.2);
    color: #3b2063
}

.avatar.avatar-lime {
    background-color: rgba(59, 32, 99, 0.2);
    color: #3b2063
}

.avatar.avatar-green {
    background-color: rgba(59, 32, 99, 0.2);
    color: #3b2063
}

.avatar.avatar-teal {
    background-color: rgba(59, 32, 99, 0.2);
    color: #3b2063
}

.avatar.avatar-cyan {
    background-color: rgba(59, 32, 99, 0.2);
    color: #3b2063
}

body {
    color: #aaa4b5
}

body::after {
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    width: 100%;
    content: '';
    z-index: -1;
    background-color: #6b549d;
    background-image: linear-gradient(-145deg, #3b2063, #6b549d)
}

#header_top .brand-logo {
    background: #3b2063
}

@media only screen and (max-width: 1200px) {
    #header_top {
        background: rgba(255, 255, 255, 0.05)
    }
}

.header {
    background: #3b2063
}

.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: #3b2063
}

.page .section-white,
.page .section-body {
    background: transparent
}

#left-sidebar {
    background: transparent;
    border-color: rgba(255, 255, 255, 0.03)
}

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

.page-header {
    border-color: rgba(255, 255, 255, 0.03)
}

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

.card {
    background-color: rgba(255, 255, 255, 0.02)
}

.card .card-title {
    color: rgba(255, 255, 255, 0.7)
}

.card .card-options a {
    color: #3b2063
}

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

.card.card-fullscreen {
    background-color: rgba(255, 255, 255, 0.05) !important
}

.metismenu ul a {
    color: rgba(255, 255, 255, 0.5)
}

.metismenu a {
    color: rgba(255, 255, 255, 0.7)
}

.metismenu a:hover {
    color: #fff;
    border-color: #fff
}

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

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

.metismenu.grid>li.active>a,
.metismenu.grid>li>a:hover {
    background: #3b2063;
    color: #485563
}

.inbox .detail {
    background: #fff
}

.file_folder a {
    background: rgba(255, 255, 255, 0.02);
    border-color: #aaa4b5
}

.auth .auth_left {
    background: #485563
}

.auth .auth_left .card {
    padding: 20px;
    left: -100px
}

@media only screen and (max-width: 1100px) {
    .auth .auth_left .card {
        left: 0
    }
}

.todo_list li {
    border-color: rgba(255, 255, 255, 0.05)
}

.gender_overview {
    background: #aaa4b5
}

.table-calendar-link {
    background: #3b2063
}

.theme_div {
    background: rgba(255, 255, 255, 0.05)
}

.fill_bg .datepicker table tr td,
.fill_bg .datepicker table tr th {
    color: #fff
}

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

.sidebar_dark .metismenu .active>a {
    color: #3b2063
}

.iconcolor #header_top .nav-link {
    color: #3b2063 !important
}

.gradient .fa {
    background: -webkit-linear-gradient(45deg, #3b2063, #3b2063);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

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

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

.gradient .btn-primary {
    background: linear-gradient(45deg, #3b2063, #3b2063) !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, #3b2063, #3b2063) !important
}