:root {

    --black-0: #000815;

    --white-1: #f8f9fa;

    
    --black-3: #343b42;
    --black-2: #343a40;
    --black-1: rgba(33, 37, 41, 1);
}

body {
    background-color: var(--black-0);
}

.nav_menu {
    background-color: var(--black-2);
    border-color: var(--black-0);
}

.nav_title {
    background-color: var(--black-0);
}

body .container.body .right_col {
    background-color: var(--black-1);
    color: var(--white-1);
}

.x_panel {
    background-color: rgba(0, 1, 1, 0.4);
    border-color: var(--black-0);
}

.x_title {
    border-color: var(--black-0);
}

.left_col {
    background-color: var(--black-0);
}

footer {
    background-color: var(--black-2);
}

.progress {
    background-color: var(--black-1);
}

.panel_toolbox>li>a:hover {
    background: none
}

nav ul .user-profile span {
    color: var(--white-1) !important;
}

.tile_count .tile_stats_count span i {
    color: rgb(255, 255, 171) !important;
}

.switch-theme {
    transform: rotate(180deg);
    position: fixed;
    /* background-color: rgba(255, 255, 255, 0.25); */
    color: rgb(255, 249, 83) !important;
    -webkit-box-shadow: inset 3px  -6px 10px 5px rgba(255, 249, 83,0.25);
    -moz-box-shadow:    inset 3px  -6px 10px 5px rgba(255, 249, 83,0.25);
    box-shadow:         inset 3px   6px 10px 5px rgba(255, 249, 83,0.25);
}

.switch-theme:hover:hover {
    transition: all 1.8s ease;
    transform: rotate(0deg);
    color: rgb(246, 243, 168);
}