form {
    min-height: 38px;
}

.search-button {
    vertical-align: top;
    margin-right: 25px;
    background: url("../images/Portal/icon_search.svg") transparent no-repeat !important;
    border: 0px;
    width: 20px;
    height: 20px;
}

.portal .simple-search input[type=text],
.portal .extended-search input[type=text],
select,
.ms-options-wrap > button:focus, .ms-options-wrap > button {
    background: white !important;
    border: 1px solid #dedede !important;
    border-radius: 2px;
    padding: 6px;
    height: 27px;
    box-sizing: border-box;
    font-size: 0.8em !important;
    color: #888888;
    -webkit-appearance: none;
}

select {
    background: url("../Images/Portal/Arrow.svg") no-repeat white right 5px center !important;
}

select::-ms-expand {
    display: none;
}

.ms-options-wrap > button:after {
    border: 0px;
    background: url("../Images/Portal/Arrow.svg") no-repeat;
    height: 5px;
    width: 9px;
}

.extended-search .ms-options-wrap {
    display: inline-block;
}

.ms-options-wrap > .ms-options > ul label {
    min-height: 27px;
}

.simple-search {
    display: inline-block;
}

.extended-search-button {
    text-transform: uppercase;
    color: #f18b03;
    font-size: 0.9em;
}

.extended-search {
    padding-bottom: 10px;
    border-bottom: 1px solid #ededed;
    display: inline-block;
}
.extended-search > span {
    display: inline-block;
}
.extended-search > a,
.extended-search > span.delimiter{
    vertical-align: top;
    margin-top: 4px;
    display: inline-block;
}

.simple-search #search,
.filter-field {
    width: 240px;
}

.filter-value span {
    width: 70px;
    display: inline-block;
    text-align: center;
    font-size: 0.8em;
}

.filter-value input[type=text],
.filter-value select,
.filter-value .ms-options-wrap {
    width: 200px;
    
}
.simple-search #search,
.filter-field,
.filter-value span,
.filter-value input[type=text],
.filter-value select,
.filter-value .ms-options-wrap {
    transition: width .3s;
    -moz-transition: width .3s;
    -webkit-transition: width .3s;
}

.filter-buttons {
    margin: 0px 20px;
    vertical-align: bottom;
    display: inline-block;
    transition: margin .3s;
    -moz-transition: margin .3s;
    -webkit-transition: margin .3s;
}

button {
    border: 0px;
    padding: 0px;
    height: 21px;
    width: 21px;
    background: none;
}
button:enabled {
    cursor: pointer;
}

.ms-options-wrap input[type=checkbox] {
    /*display: none;*/ /* This breaks the focus (tab, enter, etc). opacity:0; is working fine. */
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /*IE8 fix */
    /* Make sure the control is not consuming any space */
    position: absolute;
    /* Make it focusable, so enterAsTab can reach it */
    width: 20px;
    height: 1px;
    z-index: -1;
}

.ms-options-wrap > .ms-options > ul label {
    background: url("../Images/Portal/Checkbox.svg") no-repeat left center;
    padding-top: 8px;
    transition: background-image .3s;
    -moz-transition: background-image .3s;    
    -webkit-transition: background-image .3s;
    cursor: pointer;
    margin: 1px 5px;
    height: 34px;
}

.ms-options-wrap > .ms-options {
    border-color: #dedede;
}

.ms-options-wrap li.selected label {
    background-image: url("../Images/Portal/Checkbox_check.png");
}

.ms-options-wrap > .ms-options > ul li.selected label {
    background-color: initial;
}