.jobs-filter-item .xsuggest-item.focused { background-color: #ffebcc }

.jobs-filters { background: #edf4ff; padding: 25px 0 20px 30px; position: relative; z-index: 1;

    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

    border-radius: 2px;

}

.jobs-filters-wrap { width: 1000px; margin: 0 auto; }

.jobs-filter-item { display: inline-block; vertical-align: top; margin: 0 23px 0 0; position: relative; }
.jobs-filter-item.fsalary { position: relative }

.jobs-filter-title { font: 300 15px/15px roboto; margin: 0 0 8px 0 }



/* filter button */
.jobs-filter { cursor: pointer; color: #000; text-decoration: none; display: inline-block; font: 300 15px/33px roboto; border: 1px solid #ccc; background: #fff; padding: 0 13px;  }
.jobs-filter.active { border: 1px solid #ccb353; background: #ffeca6; position: relative; }
.jobs-filter:not(.active):not(.na):hover { background: #fcfcfc; border: 1px solid #aaa; position: relative; }
.jobs-filter.na { opacity: 0.35; cursor: default; }

/* filter checkbox */
.jobs-filter-checkbox { font: 300 15px/21px roboto; width: auto; margin: 0 0 19px 0; display: block; white-space: nowrap;}
.jobs-filter-checkbox.na { opacity: 0.35; cursor: default; }

/* group */
.jobs-filter-group { font: 0/0 a; }
.jobs-filter-group .jobs-filter { margin-right: 0; }
.jobs-filter-group .jobs-filter + .jobs-filter { margin-left: -1px; }
.jobs-filter-group .jobs-filter.active:first-child + .jobs-filter { border-left-color: #ccb353 }

/* input */
.jobs-filter-input { cursor: pointer; border: 1px solid #ccc; box-shadow: none; font: 300 15px/35px roboto; padding: 0 12px; width: 90px; height: 35px;  }
.jobs-filter-input.tick { background: #fff url(i/tick.svg) no-repeat right 10px top 15px; }
.jobs-filter-input:not(.active):not(.na):hover { background-color: #fcfcfc; border: 1px solid #aaa; }
.jobs-filter-input.active { border: 1px solid #ccb353; background-color: #ffeca6; background-image: url(i/tick-active.svg); }

.jobs-filter-item.fprofession .jobs-filter-input { width: 180px; }
.jobs-filter-item.fquery .jobs-filter-input { background-image:url(i/search.svg); background-repeat: no-repeat; background-position: 183px 10px; width: 210px; cursor: text; }
.jobs-filter-item.feducation .jobs-filter-input { width: 191px; padding-right: 22px; }
.jobs-filter-item.fsalary .jobs-filter-input { width: 150px; }

.jobs-filter-item.fprofession > .xsuggest { top: auto; left: 0; width: 205px; }
.jobs-filter-item.feducation > .xsuggest { top: auto; left: 0; width: 191px; }
.jobs-filter-item.fprofession > .xsuggest .xsuggest-item,
.jobs-filter-item.feducation > .xsuggest .xsuggest-item,
.jobs-filter-item.fsalary > .xsuggest .xsuggest-item { font-size: 15px; font-family: roboto; padding: 6px 13px 6px; white-space: normal; }
.jobs-filter-item.fsalary > .xsuggest { top: auto; left: 0; width: 151px; }

.jobs-filter-item > .xsuggest .xsuggest-item.list { color: #000; padding-left: 34px; }
.jobs-filter-item > .xsuggest .xsuggest-item.list:before { content: ""; position: absolute; background: url(i/list.svg); width: 10px; height: 10px; margin: 5px 8px 0 -21px }

/* search button */
.jobs-search { border: 0; font: 300 16px/35px "Open Sans"; background: #0099ff; color: #fff; height: 35px; cursor: pointer; width: 110px; }
.jobs-search:hover { background: #1fa4fd }
.jobs-filter-item.fsearch { padding-top: 23px; margin-right: 0; }

/* extended search */
.jobs-filter-more-wrap { padding: 0 0 0 395px; }
.jobs-filter-more { display: inline-block; border-bottom: 1px dashed #0066ff; color: #0066ff; font: 14px/15px "Open Sans"; cursor: pointer; }
.jobs-filter-more:after { width: 7px; height: 7px; background: url(i/triangle-7.svg) no-repeat 0 0; content: ""; position: absolute; margin: 5px 0 0 5px; }
.jobs-filter-more:hover { color: #0066ff; border-bottom: 1px dashed #0066ff; }
.jobs-filter-more:hover:after { opacity: 0.9; }
.jobs.expanded .jobs-filter-more:after { -webkit-transform: rotate(180deg); transform: rotate(180deg)}
.jobs.collapsed .jobs-filter-more:after { -webkit-transform: rotate(0deg); transform: rotate(0deg); }



/* custom  */
.jobs-filter-select-name.ftype { width: 135px;display: inline-block; white-space: nowrap; overflow: hidden; vertical-align: top; text-overflow: ellipsis; }

.jobs-filters-extra { overflow: hidden; opacity: 0; max-height: 0; margin: 0 0 20px; position: relative; }
.jobs-filters-extra-wrap { padding: 5px 0 0 0; }
.jobs.expanded .jobs-filters-extra { overflow: visible; max-height: 150px; margin: 35px 0 20px; opacity: 1; position: static; transition: max-height 200ms ease 0s, margin 200ms ease 0s, opacity 1000ms ease 0s; }
.jobs.collapsed .jobs-filters-extra { max-height: 0; margin: 0 0 20px; opacity: 0; position: relative; transition: max-height 200ms ease 0s, margin 200ms ease 0s, opacity 100ms ease 0s; }

.jobs-filters-extra-left { display: inline-block; vertical-align: top; width: 310px; }
.jobs-filters-extra-left2 { display: inline-block; vertical-align: top; width: 292px; }
.jobs-filters-extra-left3 { display: inline-block; vertical-align: top; width: 152px; }
.jobs-filters-extra-right { margin: -4px 0 0 0; display: inline-block; vertical-align: top; width: 275px; text-align: right; }


/* price */
.jobs-filter-item.fprice { margin-right: 31px; margin-left: 5px; }
.jobs-filter-price-till { margin: -1px 0 0 0; text-align: right; position: relative; }
.jobs-filter-price-from { position: relative; }
.jobs-filter-price { margin: 5px 0 0 0; width: 220px; }
.jobs-filter-price.na { opacity: 0.4 }
.jobs-filter-price.na .l2form-range-area { background: #ccc; }
.jobs-filter-price.na .l2form-range-handle { cursor: default; background: #ccc;  box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.2); }
.jobs-filter-price-hint-from { color: #999; position: absolute; right: 0; }
.jobs-filter-price-hint-till { color: #999; position: absolute; left: 0; }


.jobs-notfound { margin: 50px 0 0 32px }
.jobs-notfound > p:first-child { font: 300 18px/24px roboto; margin: 0 0 15px 0 }
.jobs-notfound > p:last-child { font: 300 15px/24px roboto; }


/* bar */
.jobs-bar { font: 300 18px/24px roboto; padding: 35px 0 20px 0; position: relative;

    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

}
.jobs-bar-count { display: inline-block; padding: 0 50px 0 40px; vertical-align: top; }
.jobs-bar-count > a { margin: 0 0 0 22px }
.jobs-bar-count > a.beta:after { content: 'beta'; color: #ff0000; font: 300 13px/13px roboto; position: absolute; margin: -1px 0 0 5px; }
.jobs-bar-filters { display: inline-block; width: 491px; vertical-align: baseline; padding: 0 0 0 3px }
.jobs-bar-sort-label { display: inline-block; width: 300px; text-align: right; padding: 0 20px 0 0; vertical-align: baseline; position: absolute; right: 35px; }
.jobs-bar-sort { display: inline-block; border-bottom: 1px dashed #0066ff; color: #0066ff; line-height: 18px; cursor: pointer;  }
.jobs-bar-sort:after { background: url(i/triangle-7.svg) no-repeat 0 0; content: ""; height: 11px; margin: 7px 0 0 5px; position: absolute; width: 11px; }
.jobs-bar-sort:hover { color: #0066ff; border-bottom-color: #0066ff; }
.jobs-bar-sort:hover:after { opacity: 0.9 }
.jobs-bar-filter-dash { position: relative; top: 1px; }

.jobs-bar-filter { position: relative; cursor: pointer; border-radius: 3px; display: inline-block; background: #ffeca6; font: 300 15px/25px roboto; padding: 0 25px 0 10px; border: 1px solid #ccb353; margin: 0 0 4px 0; white-space: nowrap; max-width: 250px; overflow: hidden; text-overflow: ellipsis; }
.jobs-bar-filter:after { content: ""; position: absolute; width: 9px; height: 9px; background: url(i/cross.svg); right: 8px; top: 9px; }
.jobs-bar-filter:hover { color: #ff0000; }
.jobs-bar-filter:hover:before { content: ""; position: absolute; height: 1px; right: 23px; left: 9px; top: 13px; background: #ff0000; }
.jobs-bar-filter:hover:after { background-image: url(i/cross-hover.svg); }


.jobs-bar-filter.reset { background: #fff; border-color: #ff0000; color: #ff0000; }
.jobs-bar-filter.reset:after { background-image: url(i/cross-hover.svg); }
.jobs-bar-filter.reset:hover { border-color: #FF3737; color: #FF3737 }

.jobs.empty .jobs-bar-sort-label { visibility: hidden; }


.jobs-sort-options { position: absolute; right: 14px; top: 66px; z-index: 1001; background: #fff; box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.3); }
.jobs-sort-options > li { padding: 5px 18px 5px 12px; font-size: 15px; cursor: pointer; }
.jobs-sort-options > li.active { background: #f7f7f7 }
.jobs-sort-options > li:hover { background: #ffebcc }



@media screen and (max-width:1200px) {
    .jobs-filters { margin-left: 0; margin-right: 0; }
}