.sect-header {margin: 20px 0;}
.flex-row {display: -webkit-box; display:-webkit-flex; -webkit-flex-flow: row wrap; -webkit-box-pack: justify; -webkit-justify-content: space-between; 
    display:flex; flex-flow:row wrap; justify-content:space-between;}
.filter-wrap {background-color: #232529;box-shadow: 0 1px 5px 0 rgba(0,0,0,0.15);border-radius: 6px;margin-bottom: 20px;padding: 20px;}
.fb-sect-name {margin-bottom:10px; font-weight:600; opacity: .8;}
.fb-sect {margin-bottom:10px;}
.fb-sect input {height:40px;}
.fb-col {width: 29.4%;margin: 0 10px;}
.fb-checks {}
.filter-btn.btn {display: inline-block;border-radius: 4px;height: 36px;line-height: 36px;padding: 0 15px;font-weight: 700;text-transform: uppercase;margin: 10px 0;cursor: pointer;}

.filter-wrap select {
    height: 40px;
    background: #191a1d;
    border-radius: 4px;
}

.fb-sect select option {
    display: none!important;
}

.filters > div .search {
    border: 1px solid #191a1d;
    background: #191a1d!important;
    min-width: 150px;
    width: 100%;
}

.filters>* {
    flex: 1 1 0;
    max-width: 100%;
    min-width: auto;
    white-space: nowrap;
    position: relative;
}

.filters > div, .filters > li {
    padding: 0 2px;
    float: left;
    margin-bottom: 10px;
    margin-right: 5px;
}

.filters > div .btn, .filters > div .search {
    padding: .5rem 1rem;
}

.form-control {
    display: block!important;
    width: 100%!important;
    padding: .5rem 1rem!important;
    color: #ececec!important;
    background-color: #292929!important;
    background-clip: padding-box!important;
    border: 0 solid #cecece!important;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out!important;
}

.form-control::placeholder {
    font-size: 16px;
    color:#ececec;
}

.fb-sect .tail-select {
    width: 100%!important;
    min-width: 120px!important;
    line-height: 30px;
    height: 40px;
    margin: 0 2px;
}

.fb-sect .tail-select .select-label {
    background: #191a1d;
    color: #eeecf9;
    font-size: 16px;
}

.fb-sect .tail-select .select-label .label-count {
    color:#cdcdcd;
    border-color: rgba(255, 255, 255, 0.12);
}

.fb-sect .tail-select .select-label .label-inner {
    font-weight:500;
}

.fb-sect .tail-select:hover .select-label, .fb-sect .tail-select.active .select-label, .tail-select.idle .select-label {
    z-index: 25;
    box-shadow: 0 1px 1px 1px rgba(0,0,0,.1), 0 0 1px 1px var(--be-accent-default);
    -webkit-box-shadow: 0 1px 1px 1px rgba(0,0,0,.1), 0 0 1px 1px var(--be-accent-default);
    color: #fff;
}

.fb-sect .tail-select .select-dropdown ul li.dropdown-option.selected {
    color: #fff;
    background-color: rgb(60 130 230 / 50%);
}

.fb-sect .tail-select .select-dropdown ul li.dropdown-option {
    cursor: pointer;
    color: #cdcdcd;
    font-size: 14px;
}

.fb-sect .tail-select .select-dropdown {
    color: #cdcdcd;
    width: 200px;
    min-height: 35px;
    margin: 5px 0 0 0;
    background-color: #292929;
}

.tail-select .select-dropdown ul li.dropdown-option.hover, .tail-select .select-dropdown ul li.dropdown-option:hover {
    background-color: var(--main-color)!important;
    color: #fff!important;
}

.tail-select .select-dropdown ul li.dropdown-option:before {
    width: 30px;
    height: 28px;
}

/* ********************************************** */

.filter-block {margin-bottom: 30px;}
.filter-block__form {display: grid; grid-template-columns: repeat(auto-fit,minmax(280px,1fr)); grid-gap: 10px 20px;}
.filter-block__cell--full-width {grid-column: 1 / -1;}
.filter-block__cell-caption {margin-bottom: 10px;}
.filter-block__cell-content > * {width: 100%; display: block;}
.filter-block__cell-content--two-columns {display: flex; justify-content: space-between;}
.filter-block__cell-content--two-columns > * {width: calc((100% - 10px)/2) !important;}
.filter-block__cell-content select, .filter-block__cell-content input[type="text"], 
.filter-block__cell-content--check-group {height: 36px; line-height: 34px; background-position: right 8px top 50%;
    background-color: var(--bg-2); color: var(--tt-2); border: 1px solid var(--bg-2); border-radius: 4px; 
    box-shadow: none; font-size: 14px;  padding: 0 7px; 
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.filter-block__cell-content select {padding: 0 8px 0 4px;}
.filter-block__cell-content input[type="text"]::placeholder {opacity: 1; color: var(--tt-2); font-size: 14px;}
.filter-block__cell-content input[type="text"]:focus::placeholder {opacity: 0;}
.filter-block__cell-content label {position: relative; padding-left: 50px; cursor: pointer; 
    height: 36px; display: flex; flex-direction: column; justify-content: center; font-size: 14px;}
.filter-block__cell-content label input {display: inline-block; appearance: none; -webkit-appearance: none;
    height: 20px; width: 40px; border-radius: 10px; background-color: var(--bg-2); cursor: pointer; transition: all .2s linear; 
    box-shadow: inset 0 2px 5px rgba(0,0,0,0.1); position: absolute; left: 0; top: 50%; margin-top: -10px;}
.filter-block__cell-content label input::before {content: ''; width: 18px; height: 18px; border-radius: 10px; 
    position: absolute; left: 1px; top: 1px; background-color: var(--bg); transition: all .2s linear;}
.filter-block__cell-content label input:checked {background-color: #6ab04c;}
.filter-block__cell-content label input:checked::before {left: 21px;}
.filter-block__cell-content input[type="button"], .filter-block__cell-content button {cursor: pointer; 
    height: 36px; display: inline-flex; justify-content: center; padding: 0 10px; box-shadow: none; border-radius: 4px;}
.filter-block__cell-content input[type="button"][data-dlefilter="reset"] {background: var(--bg-2); color: var(--tt-3);}
.filter-block__cell-content--check-group label {padding: 0; text-align: center; white-space: nowrap; 
    flex: 1 1 0; min-width: 30px; max-width: 100%; background: var(--bg);}
.filter-block__cell-content--check-group label input {position: absolute; left: 0; top: 0; 
    width: 100%; height: 100%; opacity: 0; z-index: 5;}
.filter-block__cell-content--check-group {display: flex; justify-content: center; overflow: hidden; padding: 0;}
.filter-block__cell-content--check-group label + label {border-left: 1px solid var(--bg-2);}
.filter-block__cell-content--check-group label div {height: 36px; font-size: 13px;}
.filter-block__cell-content--check-group label input:checked + div {background-color: var(--bg-2); color: var(--tt);}

.fx-row-2 {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right:5px;
}

@media screen and (max-width: 760px) {

    .filter-btn {display: inline-block; margin: 0; padding: 0 10px;}
    .fb-col {width: 100%; top: 0;}
    .fb-checks .fb-sect {flex-wrap: wrap;}
    .filter-wrap {display: none;}
    .fx-row-2 {-ms-flex-pack: justify; -webkit-justify-content: space-between; justify-content: space-between;}
}