.filter-select {
position: relative;
max-height: 3.1em;
}
.filter-select select {
display: none; }
.select-selected { min-height: 3.5em;
} .select-selected:after {
position: absolute;
content: "";
top: calc(50% - 3px);
right: 10px;
width: 10px;
height: 6px;
background: url(//oreon-properties.be/wp-content/plugins/whise-integration/assets/img/arrow-dark.svg)no-repeat center;
transition: all 0.1s ease-out;
} .select-selected.select-arrow-active:after { transform: rotate(180deg);
} .select-items div, .select-selected{
color: #333;
padding: 5px 16px;
cursor: pointer;
user-select: none;
font-size: 15px;
}
.select-selected {
padding: 0.75rem 0rem 0.75rem 0rem;
color: #333;
background-repeat: no-repeat;
background-position: center right 1rem;
border-bottom: 0.0625rem solid #1c3661;
border-radius: 0;
text-overflow: ellipsis;
text-transform: uppercase;
font-weight: 600;
background: transparent;
color: #1C3661;
font-size: 14px;
line-height: 1.5;
} .select-items {
position: absolute;
background-color: #fff;
top: 100%;
left: 0;
right: 0;
z-index: 99;
max-height: 200px;
overflow-y: auto;
} .select-hide {
display: none;
}
.select-items div:hover, .select-items .same-as-selected {
background-color: #1c3661;
color: #fff;
}
.padding-section-large{
width: 100%;
}
.filter-home{
background-color: #ffffff;
padding: 2rem;
}
.filter{
font-family: Azosans, sans-serif;
position: relative;
z-index: 1;
}
.filter .inputs{
display: flex;
flex-wrap: wrap;
grid-gap: 5px;
}
.filter-select.rent{
width: 20%;
}
.filter-select.type{
width: 20%;
}
.filter-city{
width: 40%;
position: relative;
}
.filter-city-select{
padding: 0;
color: #333;
background-repeat: no-repeat;
background-position: center right 1rem;
border-bottom: 0.0625rem solid #1c3661;   
border-radius: 0;
text-overflow: ellipsis;
text-transform: uppercase;
font-weight: 600;
background: transparent;
color: #1c3661;
font-size: 14px;
line-height: 1.5;
cursor: pointer;
position: relative;
overflow-y: auto;
display: flex;
flex-wrap: wrap;
gap: 7px;
align-items: center;
min-height: 3.5em;
}
.filter-city-items{
position: absolute;
background-color: #fff;
top: 100%;
left: 0;
right: 0;
text-transform: uppercase;
z-index: 99;
max-height: 215px;
overflow-y: auto; 
display: none;
}
.filter-city-items.active{
display: block;
}
.filter-city-items div{
color: #333;
padding: 5px 16px;
cursor: pointer;
user-select: none;
font-size: 15px;
}
.filter-city-items span{
margin-right: 10px;
color: rgba(51,51,51,.5);;
}
.filter-city-items div.active{
opacity: 0.5;
pointer-events: none;
}
.filter-city-items span{
margin-right: 10px;
color: rgba(51,51,51,.5);;
}
.filter-city-items div:hover, .filter-city-items div:hover span{
background-color: #1c3661;
color: #fff;
}
.superselect-selection{
-webkit-user-select: none;
-o-user-select: none;
-moz-user-select: none;
user-select: none;
color: #fff;
background: #1c3661;
margin: 0;
text-transform: uppercase;
padding: 0.1875rem 0.4375rem; 
width: max-content;
display: flex;
}
.superselect-remover {
width: 1rem;
height: 1rem;
display: inline-block;
position: relative;
vertical-align: middle;
margin-left: 0.1875rem;
cursor: pointer;
top: 2px;
}   
.superselect-remover::before, .superselect-remover::after {
content: "";
display: block;
position: absolute;
width: 0.75rem;
height: 2px;
background: #fff;
left: 0.125rem;
top: 0.5rem;
margin-top: -1px;
transform: rotate(45deg);
}
.superselect-remover::after {
transform: rotate(-45deg);
} 
.filter-submit{
padding: 0.8rem 2rem;
background-color: #daa621;
color: white;
text-transform: uppercase;
}
.filter-result{
padding: 2rem 3rem 2rem 3rem;
background-color: #fff;
}
.filter-result .select-selected{
}
.filter-result .inputs{
flex-wrap: inherit;
grid-gap: 15px
}
.filter-result .filter-city .filter-city-select{
}
.filter-result .select-selected:after {
background: url(//oreon-properties.be/wp-content/plugins/whise-integration/assets/img/arrow-grey.svg)no-repeat center;
}
.filter-result .filter-select.rent{
width: 19%;
}
.filter-input{
width:20%;
}
.filter-input input{
padding: 0.75rem 2rem 0.75rem 0rem;
color: #1c3661;
width: 100%;
background-repeat: no-repeat;
background-position: center right 1rem;
border:none;
border-bottom: 0.0625rem solid #1c3661;
border-radius: 0;
text-overflow: ellipsis;
text-transform: uppercase;
font-weight: 600;
background: transparent;
font-size: 14px;
line-height: 1.7;
outline: none;
}
.filter-input input::placeholder{
font-size: 14px;
line-height: 1.5;
color: #1c3661;
}
.filter-city .filter-city-items{
border: 0.0625rem solid rgb(139 139 139 / 32%);
}
[name="search_f_text"]{
border: 0;
background: transparent;
outline: unset;
font-weight: 600;
color: #1c3661;
width: auto;
text-transform: uppercase;
font-size: 14px;
}
[name="search_f_text"]::placeholder{
font-weight: 600;
color: #1c3661;
font-size: 14px;
text-transform: uppercase;
}
.filter-result [name="search_f_text"]::placeholder{
color: #333;
}
@media screen and (max-width: 1100px) {
.inputs .element:nth-child(1),.inputs .element:nth-child(2){
width: 49%;
}
.inputs .element:nth-child(3){
width: 70%;
}
.inputs .element:nth-child(3){
width: 68%;
}
.filter-result .inputs .element:nth-child(4){
width: 30%;
}
.filter-result .inputs{
grid-gap: 10px;
flex-wrap: wrap;
}
}
@media screen and (max-width: 580px) {
.filter-result .inputs{
grid-gap: 5px;
}
}
@media screen and (max-width: 480px) {
.inputs .element:nth-child(1),.inputs .element:nth-child(2){
width: 100%;
}
.inputs .element:nth-child(3){
width: 100%;
}
.filter-city-submit{
width: 100%;
}
.filter-city-submit button{
width: 100%;
}
.filter-result .inputs .element:nth-child(4){
width: 100%;
}
.filter .inputs{
grid-gap: 10px;
}
}