.job_filter_wrapper{
    margin: -0.5rem -0.5rem 0;
}
.job_filter_wrapper .job_filter{
    display: block; font-size: 0;
    margin: 0 0 1rem;
}
.job_filter_wrapper .job_filter .job_filter_element{
    display: inline-block; width: 100%; text-align: left;
    padding: .5rem; vertical-align: middle; font-size: 1rem;
    position: relative;
}
.job_filter_wrapper .job_filter .job_filter_label{
    display: block; padding: 1rem; background-color: #004985;
    color: #FFFFFF; cursor: pointer;
    border: 1px solid #004985;
}

.job_filter_wrapper .job_filter .job_filter_input{
    display: block; padding: 1rem; background-color: #FFFFFF;
    color: #004985; border: 1px solid #004985;
    min-width: 0; max-width: none; width: 100%;
    line-height: 1.5;
}

.job_filter_wrapper .job_filter .job_filter_reset_element .job_filter_label{
    background-color: #a8adb3;  border: 1px solid #a8adb3;
}

.job_filter_wrapper .job_filter .job_filter_values{
    display: none; position: absolute; left: .5rem; top: 100%; right: .5rem;
    z-index: 10; margin-top: -0.5rem;
}
.job_filter_wrapper .job_filter .job_filter_element:hover .job_filter_values,
.job_filter_wrapper .job_filter .job_filter_element:focus .job_filter_values{
    display: block; background-color: #004985; padding: .5rem 0;
    border-top: 1px solid #FFFFFF;
}
.job_filter_wrapper .job_filter .job_filter_values [data-value]{
    background-color: #004985; color: #FFFFFF; cursor: pointer;
    padding: .5rem 1rem .5rem 3rem; line-height: 1;
    position: relative;
}
.job_filter_wrapper .job_filter .job_filter_values [data-value]:before{
    position: absolute; top: .5rem; left: 1rem; content: '';
    width: 1rem; height: 1rem; border: 1px solid #FFFFFF;
    border-radius: .25rem;
}
.job_filter_wrapper .job_filter .job_filter_values [data-value]:after{
    position: absolute; top: .5rem; left: 1rem; content: '\f00c';
    width: 1rem; height: 1rem; font-family: FontAwesome;
    text-align: center; line-height: 1;
    display: none;
}
.job_filter_wrapper .job_filter .job_filter_values .active[data-value]:after{
    display: block;
}


.job_filter_wrapper .job_filter_selection{
    display: block; font-size: 0;
    margin: -0.5rem 0 1rem;
}
.job_filter_wrapper .job_filter_selection .job_selection_item{
    display: inline-block; vertical-align: top; font-size: 1rem;
    padding: .5rem; position: relative;
}
.job_filter_wrapper .job_filter_selection .job_selection_label{
     padding: .5rem 1rem .5rem 3rem; position: relative;  line-height: 1rem;
     color: #FFFFFF; background-color: #a8adb3; cursor: pointer;
     border-radius: 1rem;
}
.job_filter_wrapper .job_filter_selection .job_selection_label:before,
.job_filter_wrapper .job_filter_selection .job_selection_label:after{
    position: absolute; left: 1rem; top: 50%; width: 1rem; height: 0;
    border-bottom: 1px solid #FFFFFF; content: '';
    -webkit-transform: translateY(-50%) rotate(45deg);
    -moz-transform: translateY(-50%) rotate(45deg);
    -ms-transform: translateY(-50%) rotate(45deg);
    -o-transform: translateY(-50%) rotate(45deg);
    transform: translateY(-50%) rotate(45deg);
}
.job_filter_wrapper .job_filter_selection .job_selection_label:after{
    -webkit-transform: translateY(-50%) rotate(-45deg);
    -moz-transform: translateY(-50%) rotate(-45deg);
    -ms-transform: translateY(-50%) rotate(-45deg);
    -o-transform: translateY(-50%) rotate(-45deg);
    transform: translateY(-50%) rotate(-45deg);
}

@media screen and (min-width:64em){
    .job_filter_wrapper .job_filter .job_filter_reset_element .job_filter_label{
        text-align: center;
    }

    .job_filter_wrapper .job_filter .job_filter_element{
        width: 25%;
    }
}