html, body,
.pagination a {
    background: #404040 !important;
}

.filter:not(.type):not(.orb):not(.custom),
.filter.custom > div:first-child,
.filter .submatchers .submatcher .submatcher-option {
    color: #f6f3e8;
    background: #404040 !important;
    border-color: #333;
}

@media (hover) {
    .filter:hover:not(.type):not(.stars):not(.orb):not(.custom),
    .filter.custom > div:first-child:hover,
    .filter .submatchers .submatcher .submatcher-option:hover {
        color: #f6f3e8 !important;
        background: #bb4040 !important;
    }
}

#leftContainer .custom.filter .submatchers {
    padding: 6px 8px 3px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    background-color: #943838;
    color: white;
    font-weight: normal;
}

#leftContainer .custom.filter .submatchers input {
    color: black;
}

#leftContainer .submatcher label {
    font-weight: normal;
}

.filter.type.active {
    color: black !important;
}

.filter.active:not(.type):not(.stars):not(.orb),
.filter.custom.active > div:first-child,
.filter .submatchers .submatcher .submatcher-option.active {
    background: #dd6060 !important;
    color: #222 !important;
}

.filter.stars.active {
    box-shadow: inset 0 0 0 1px #aaaaff;
}

@media (hover) {
    .class.filter.active:not(.type):not(.stars):not(.orb):hover,
    .custom.filter.active:not(.type):not(.stars):not(.orb) > div:first-child:hover,
    .drop.filter.active:hover:not(.type):not(.stars):not(.orb),
    .exc.filter.active:hover:not(.type):not(.stars):not(.orb),
    .filter .submatchers .submatcher .submatcher-option.active:hover {
        background: #ff9090 !important;
        color: #222 !important;
    }
}

.filter-header:not(#clear-button, #toggle-button, #filter-subheader, .filter-group-header) {
    background: #202020 !important;
    border-color: #333;
}

.conditional > .filter-header {
    background: #333366 !important;
}

a { color: #8acccf; }
@media (hover) {
    a:hover { color: #53dccd; }
}
.help-link { color: #cc9393; }
#pick-link { color: #a893cc; }

.fuzzy-toggle, .night-toggle, #mainTable, #queryContainer > button, #burgerMenu, .dataTables_length > label {
    color: #f6f3e8;
}

.dataTables_length select {
    color: #222;
}

.cell-STR { color: #bf616a !important; }
.cell-QCK { color: #96b5b4 !important; }
.cell-DEX { color: #a3be8c !important; }
.cell-PSY { color: #ebcb8b !important; }
.cell-INT { color: #b48ead !important; }

.dataTables_info, .dataTables_wrapper .dataTables_paginate .paginate_button {
    color: #f6f3e8 !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
    color: #999 !important;
}

#mainTable.table-striped-column > * > tr > :nth-of-type(odd) {
    background-color: #494949;
}

#mainTable.table-striped-column > * > tr > :nth-of-type(even) {
    background-color: #404040;
}

#mainTable, #mainTable tr, #mainTable td {
    border-color: #333;
}

.modal-header,
.modal-footer {
    background-color: #65737e;
}

.modal-body {
    background-color: #e9e9e9;
}

.modal-body h3 {
    border-color: #888;
}

.modal-body a {
    color: #3f3f6a;
}

#picker {
    background: #555;
    color: #f6f3e8;
}

.separator {
    background: #505050 !important;
    color: white;
}

.filter.orb {
    outline: 1px solid white;
}

.filter-container:last-child > .filter:last-child {
    border-color: #333;
}

.paginate_button.active > a {
    border-color: white !important;
    background-color: #808080 !important;
}

.pagination > li > a {
    color: white;
}

@media (hover) {
    .pagination a:hover {
        background: #606060 !important;
    }

    .pagination > li:hover > a {
        color: white;
    }
}

@media (max-width: 1024px) {
    #rightContainer, #leftContainer {
      background:   #404040;
    }
    
}