#filters_box .filters_button {
    background            : #796E66;
    border                : 1px solid #796E66;
    border-radius         : 5px;
    -webkit-border-radius : 5px;
    -moz-border-radius    : 5px;
    box-shadow            : 0 0 10px #999999;
    color                 : #E8E3DF;
    cursor                : pointer;
    padding               : 5px;
}

#filters_box.open .filters_button {
    box-shadow                         : none;
    border-bottom-left-radius          : 0;
    border-bottom-right-radius         : 0;
    -webkit-border-bottom-left-radius  : 0;
    -webkit-border-bottom-right-radius : 0;
    -moz-border-radius-bottomleft      : 0;
    -moz-border-radius-bottomright     : 0;
}

#filters_box .filtered_column_num {
    background            : #B8860B;
    border-radius         : 50%;
    -webkit-border-radius : 50%;
    -moz-border-radius    : 50%;
    display               : none;
    height                : 20px;
    line-height           : 18px;
    position              : absolute;
    right                 : -10px;
    text-align            : center;
    top                   : -10px;
    width                 : 20px;
}

.filters {
    border                : 1px solid transparent;
    border-radius         : 0 5px 5px 5px;
    -webkit-border-radius : 0 5px 5px 5px;
    -moz-border-radius    : 0 5px 5px 5px;
    display               : flex;
    flex-direction        : row;
    flex-wrap             : wrap;
    height                : 0;
    margin-bottom         : 20px;
    overflow              : hidden;
    padding               : 0;
    gap                   : 5px;
}

.filters_quick_search {
    margin-bottom : 15px;
    max-width     : 540px;
}

#filters_box.open .filters {
    border  : 1px solid #796E66;
    height  : auto;
    padding : 5px;
}

.filters_quick_search > div,
.filters > div:not(:last-child):not(.quick_filters) {
    background            : #C6B9AE;
    border                : 1px solid #796E66;
    border-radius         : 5px;
    -webkit-border-radius : 5px;
    -moz-border-radius    : 5px;
    box-shadow            : 0 0 10px #999999;
    -webkit-box-shadow    : 0 0 10px #999999;
    -moz-box-shadow       : 0 0 10px #999999;
    overflow              : hidden;
}

.filters > div {
    width : calc(100% / 5 - 4px);
}

.quick_filters {
    align-items    : center;
    border-bottom  : 1px solid #796E66;
    display        : flex;
    flex-basis     : 100%;
    flex-direction : row;
    flex-wrap      : nowrap;
    gap            : 5px;
    min-height     : 42px;
}

#quick_filter_buttons {
    flex : 1;
}

.quick_filters button {
    margin : 3px;
}

.filters_quick_search .filter_box.filtered,
.filters .filter_box.filtered {
    border-color : #B8860B;
}

.filters_quick_search .title,
.filters .title {
    background    : #9A8E84;
    border-bottom : #EBEBEB;
}

.filters_quick_search .filter_box.filtered .title,
.filters .filter_box.filtered .title {
    background : #B8860B;
}

.filters_quick_search .title,
.filters_quick_search .input,
.filters .title,
.filters .input {
    padding : 5px 7px;
}

.filters_quick_search .input,
.filters .input {
    display         : flex;
    flex-direction  : row;
    flex-wrap       : nowrap;
    justify-content : space-between;
}

.filters_quick_search .input button,
.filters .input button {
    border                             : 1px solid #796E66;
    border-bottom-right-radius         : 5px;
    -webkit-border-bottom-right-radius : 5px;
    -moz-border-radius-bottomright     : 5px;
    border-top-right-radius            : 5px;
    -webkit-border-top-right-radius    : 5px;
    -moz-border-radius-topright        : 5px;
    cursor                             : pointer;
    font-weight                        : bold;
    height                             : 22px;
    width                              : 30px;
}

.filters_quick_search .input button:focus,
.filters .input button:focus {
    border-color : #FD7401;
}

.filters_quick_search .input button:hover,
.filters .input button:hover {
    box-shadow : 0 0 10px #999999;
}

.filters_quick_search .input button:active,
.filters .input button:active {
    box-shadow : inset 0 0 10px #999999;
}

.filters_quick_search select,
.filters_quick_search input,
.filters select,
.filters input {
    border                            : 1px solid #9A8E84;
    border-right                      : none;
    border-bottom-left-radius         : 5px;
    -webkit-border-bottom-left-radius : 5px;
    -moz-border-radius-bottomleft     : 5px;
    border-top-left-radius            : 5px;
    -webkit-border-top-left-radius    : 5px;
    -moz-border-radius-topleft        : 5px;
    padding                           : 0 3px;
}

.filters_quick_search input,
.filters .select2,
.filters select,
.filters input:not([type="checkbox"]) {
    width : calc(100% - 30px) !important;
}

.filters .multi_input .select2,
.filters .multi_input select,
.filters .multi_input input {
    width : calc(50% - 15px) !important;
}

.filters .second_input .select2-selection--single,
.filters select.second_input,
.filters input.second_input {
    border-radius         : 0;
    -webkit-border-radius : 0;
    -moz-border-radius    : 0;
}

#filters_box .buttons {
    align-items     : end;
    display         : flex;
    flex-direction  : row;
    flex-wrap       : nowrap;
    gap             : 20px;
    justify-content : right;
    padding-top     : 10px;
    width           : 100%;
}

#filters_box .buttons button {
    box-shadow         : 0 0 10px #A56734;
    -webkit-box-shadow : 0 0 10px #A56734;
    -moz-box-shadow    : 0 0 10px #A56734;
    padding            : 5px;
}

#filters_box .buttons button.searching .fa-magnifying-glass {
    display : none;
}

#filters_box .buttons button .fa-gear {
    display : none;
}

#filters_box .buttons button.searching .fa-gear {
    display : inline-block;
}

@media screen and (max-width : 900px) {
    .filters > div {
        width : calc(100% / 4 - 4px);
    }
}

@media screen and (max-width : 700px) {
    .filters > div {
        width : calc(100% / 3 - 4px);
    }
}

@media screen and (max-width : 540px) {
    .filters > div {
        width : calc(100% / 2 - 4px);
    }
}