/**************************************************************** Begin Facet Styles ******************************************************/
.facet_field {
    display: inline-block;
}

.facet_field span {
    font-weight: bold;
}

.jobcount {
    color: #F27180;
    font-size: 17px;
}

li.facet_field ul li {
    list-style-type: none;
    line-height: 26px;
    font-size: 12px;
}

li.facet_field ul {
    padding-left: 0;
}

ul.filter_menu,
ul.filter_menu li {
    padding-left: 0;
    margin-bottom: 0;
}

.more_options {
    margin: 8px 0;
}

.filter_checkbox {
    padding: 0 8px;
}

.jobcount_row {
    padding-bottom: 5px;
    text-align: left;
}

.row.filter_row {
    width: 100%;
    border-bottom: 1px solid #ebebeb;
    padding: 0 0 0 15px;
}

ul.filter_menu {
    height: auto;
}

.clear {
    list-style-type: none;
}

div.selected_filters span.filter_inline span.glyphicon-remove {
    font-size: 10px;
    padding-left: 2px;
    color: #484848;
}

span.filter_inline {
    float: left;
    margin: 0 5px 4px 0;
    font-size: 12px;
    padding: 2px 7px 2px 7px;
    border: 1px solid #ccc;
    max-width: 100%;
    border-radius: 3px;
    background-color: #f4f4f4;
    background-size: 100% 19px;
    background-repeat: repeat-x;
    background-clip: padding-box;
    box-shadow: 0 0 2px white inset, 0 1px 0 rgba(0, 0, 0, 0.05);
    color: #333;
    line-height: 16px;
    cursor: pointer;
}

span.filter_inline#clear_filters {
    border: 1px solid #333;
}

span.filter_inline:hover,
span.filter_inline#clear_filters:hover {
    background: #ff6900;
    color: #fff;
    border: 1px solid #ff6900;
    box-shadow: none;
}

div.selected_filters span.filter_inline:hover span.glyphicon-remove {
    color: #fff;
}

div#jobtype_filter_row {
    border-bottom-width: 0;
    padding: 0;
}

/* absolute position border-bottom is needed, so the lines will overlap when the filter is collapsed */
div#jobtype_filter_underline {
    position: absolute;
    border-bottom: 1px solid #ebebeb;
    right: 0;
    left: 0;
    z-index: -1;
}

div#jobtype_filter {
    margin-left: 10px;
    padding-right: 3px;
}

div.facets {
    float: left;
    margin-top: 10px;
    margin-left: -16px;
    padding-bottom: 9px;
    white-space: nowrap;
}

div.facets span {
    font-weight: bold;
    padding: 0 10px;
}

div.facets a {
    text-decoration: none;
    padding-left: 20px;
    position: relative;
    margin-right: 40px;
}

div.facets a#filter_l_jobtype_gigs {
    margin-right: 0;
}

div.facets a span {
    font-weight: bold;
    font-size: 16px;
    color: #333;
    width: auto;
    padding-bottom: 5px;
}

div.facets a span div.jobtype_icon {
    display: inline-block;
    background-image: url(//assets.j2c.com/images/sitewide_sprites.png);
    position: absolute;
    width: 20px;
    height: 26px;
    left: 5px;
    top: -4px;
}

div.facets a#clear_filters_link span div.jobtype_icon {
    background-position: 0 -69px;
}

div.facets a#filter_l_jobtype_professional span div.jobtype_icon {
    background-position: -20px -69px;
    left: 7px;
}

div.facets a#filter_l_jobtype_part_time span div.jobtype_icon {
    background-position: -42px -69px;
}

div.facets a#filter_l_jobtype_gigs span div.jobtype_icon {
    background-position: -65px -69px;
    width: 32px;
    left: -4px;
    top: -5px;
}

div.facets a#clear_filters_link:hover span div.jobtype_icon,
div.facets a#clear_filters_link.active span div.jobtype_icon {
    background-position: -100px -69px;
}

div.facets a#filter_l_jobtype_professional:hover span div.jobtype_icon,
div.facets a#filter_l_jobtype_professional.active span div.jobtype_icon {
    background-position: -120px -69px;
    left: 7px;
}

div.facets a#filter_l_jobtype_part_time:hover span div.jobtype_icon,
div.facets a#filter_l_jobtype_part_time.active span div.jobtype_icon {
    background-position: -142px -69px;
}

div.facets a#filter_l_jobtype_gigs:hover span div.jobtype_icon,
div.facets a#filter_l_jobtype_gigs.active span div.jobtype_icon {
    background-position: -165px -69px;
}

div.facets a span:hover,
div.facets a.active span {
    color: #286AA6;
    text-decoration: none !important;
    padding-bottom: 8px;
    border-bottom: 4px solid #286AA6;
}

div.show_filters_btn {
    float: right;
    width: auto;
}

button#filter_show_hide {
    margin-top: 9px;
    width: inherit !important;
}

/* mobile show filter button */
button#filter_show_modal {
    background-color: rgba(79, 93, 156, 0.23);
    width: 100%;
    margin-top: 9px;
    border: 0;
}

div.selected_filters {
    float: left;
    padding: 7px 0 2px 0;
}

ul.modal-tabs#filter_modal_tabs li a {
    color: #777;
    background: none;
    font-size: 14px;
    padding: 0 10px;
}

ul.modal-tabs#filter_modal_tabs li:hover a {
    color: #000;
    background: none;
}

ul.modal-tabs > li.active {
    top: 0;
    margin-bottom: 0;
}

#filter_modal .modal-body {
    border-top: 1px solid #e5e5e5;
}

#filter_modal .tab-content {
    padding-left: 20px;
}

#filter_modal .modal-footer {
    clear: both;
}

li.active a span.filter_title {
    border-bottom: 5px solid #286AA6;
    color: #286AA6;
}

ul.modal-tabs {
    margin: 10px 0;
    padding-left: 4px;
    left: auto !important;
}

.nav-tabs.modal-tabs#filter_modal_tabs li a span.add:after,
.nav-tabs.modal-tabs li:hover a span:after,
.nav-tabs.modal-tabs li.active a span:after,
.nav-tabs.modal-tabs li a span:after {
    content: normal;
    z-index: 1;
    position: static;
    margin-left: -10px;
    margin-top: -10px;
    left: 0;
    top: 0;
    height: auto;
    width: auto;
    border: none;
}

.nav-tabs.modal-tabs li a span.add,
.nav-tabs.modal-tabs li a span {
    content: normal;
    position: static;
    height: auto;
    width: auto;
    overflow: initial;
    right: 0;
    top: 0;
    padding-right: 5px;
    padding-left: 5px;
    padding-bottom: 11px;
}

#filter_modal ul li {
    list-style-type: none;
    white-space: nowrap;
}

#filter_modal ul.modal-tabs li {
    display: inline;
}

#collapseFilters {
    padding-top: 10px;
    padding-bottom: 5px;
}

#collapseFilters ul li,
#filter_modal .modal-body ul li {
    white-space: nowrap;
}

#collapseFilters ul li label,
#filter_modal .modal-body ul li label {
    margin-bottom: 0;
    font-weight: normal;
    margin-left: 6px;
}

#collapseFilters ul li a,
#filter_modal .modal-body ul li a {
    color: #286AA6;
    text-decoration: none;
}

#collapseFilters ul li a:hover,
#filter_modal .modal-body ul li a:hover {
    color: #258DDC;
    text-decoration: underline;
}

#collapseFilters ul li input[type="checkbox"],
#filter_modal .modal-body ul li input[type="checkbox"] {
    display: inline !important; /* Masking what it seems like a bug in j2cqq.js where it sets all checkboxes' display to none */
}

#filter_modal .jobcount_row {
    float: left;
    padding-left: 3px;
}

#filter_modal .jobcount_row span {
    font-size: 20px;
}

/**************************************************************** End Facet Styles ******************************************************/

/* Job Alert */
.job-alert {
    width: 100%;
    height: 158px;
    margin: 10px 0;
    background: #fbfbfb;
    border-top: 1px solid #E1E1E1;
    border-bottom: 1px solid #E1E1E1;
    padding: 20px 15px 35px 15px;
}

.mail-icon {
    display: inline-block;
}

.job-alert-headline {
    display: inline-block;
    text-align: left;
    padding-left: 10px;
    position: relative;
    top: 3px;
    margin: 0;
    font-weight: normal;
}

.alert-headline {
    display: inline-block;
    padding-left: 15px;
    color: #606060;
}

.receive-similar {
    float: right;
    padding-right: 15px;
}

.btn-activate {
    color: #fff;
    background: #F36A6A;
    height: 50px;
    margin-top: 10px;
    margin-left: 0 !important;
    transition: all .2s ease .2s;
}

.btn-activate:hover {
    background: #00a9cc;
}

.alert-signup {
    height: 50px;
    margin-top: 10px;
}

.checkbox-msg {
    font-size: 12px;
    color: #606060;
}

.msg-container {
    width: 100%;
    height: 158px;
    margin: 10px 0;
    background: #fbfbfb;
    border-top: 1px solid #E1E1E1;
    border-bottom: 1px solid #E1E1E1;
    padding: 60px 0;
    font-size: 16px;
    color: #606060;
    font-weight: bold;
    vertical-align: middle;
    text-align: center;
}

.msg-thanks {
    position: relative;
    top: 2px;
    padding-left: 5px;
    font-weight: bold;
    color: #606060;
}

.alert-hidden {
    display: none;
}

.alert-show {
    display: block;
}

/* Job Alert */

/* Job Adblock */
#job_adpanel {
    display: none;
    width: 263px;
    line-height: normal;
}

#thanksMsg {
    margin: 0 auto;
    width: 210px;
    position: relative;
    top: 45px;
}

#job_adpanel .panel-heading {
    position: relative;
    color: #ff6900;
    font-weight: bold;
    text-align: left;
    border-color: transparent;
    padding-left: 0;
}

#job_adpanel .panel-heading:before {
    position: absolute;
    width: 12px;
    height: 16px;
    content: "";
}

#job_adpanel .panel-heading > span {
    margin-left: 18px;
}

.job_alert_btn_holder {
    width: 263px;
    position: relative;
    color: white;
    font-weight: bold;
    background-color: #286AA6;
    text-align: center;
    cursor: pointer;
    border-radius: 5px;
}

.job_alert_btn_holder:hover {
    background: #258DDC;
    opacity: 0.9;
}

.job_alert_btn_holder:before {
    position: absolute;
    background-image: url(//assets.j2c.com/images/mail_white.png);
    width: 16px;
    height: 12px;
    top: 11px;
    content: "";
}

.job_alert_btn {
    padding: 7px 7px 7px 20px;
    background-color: transparent;
}

.job_alert_btn:active,
.job_alert_btn:focus {
    color: #fff;
    background-color: transparent;
    border-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
}

#job_adpanel .panel-footer > span {
    margin-left: 22px;
}

#job_adpanel .panel-body {
    padding: 0;
}

#job_adblock div.adjob {
    cursor: pointer;
}

#job_adblock div.inner_adjob {
    padding: 8px 0;
}

#job_adblock div.title {
    color: #286AA6;
    text-decoration: underline;
    font-size: 18px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    margin-top: 8px;
}

#job_adblock div.adjob:hover div.title {
    color: #ff6900;
}

#job_adblock div.desc {
    padding-top: 5px;
    font-size: 14px;
}

#job_adblock div.company {
    margin: 8px 0;
    font-size: 14px;
    font-weight: bold;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    display: block;
}

#job_adpanel div.job_adlogo {
    text-align: right;
    padding: 4px 8px;
    background-color: #f4f4f4;
    font-size: 10px;
    color: #797979;
}

#job_adpanel div.job_adlogo span {
    font-weight: bold;
}

/* End of Job Adblock */

/* Mobile Adsense */
div#adcontainer_top {
    margin-bottom: 16px;
    padding: 8px 0;
}

div#adblock_mobile {
    padding-top: 8px;
    padding-bottom: 25px;
}

div#adblock_mobile div#adcontainer_top {
    margin-bottom: 0;
    padding-top: 1px;
    padding-bottom: 0;
}

div#adblock_mobile div#adcontainer_bottom {
    background-color: inherit;
    padding: 0;
}

/* End of Mobile Adsense */

/* New desktop bottom ad style */
div#adblock2.desktopAdblock {
    padding: 0 0 24px 0;
    margin: 12px 0;
}

div#adblock2.desktopAdblock div.sponsoredLinks {
    width: 80px;
    padding: 4px 0;
    text-align: center;
    background-color: #f4f4f4;
    color: #797979;
    font-size: 8px;
    font-weight: bold;
    border-radius: 8px 0;
    margin-bottom: 11px;
}

/* End of New desktop bottom ad style */

/************************************ Generic Page Level Styles ****************************/
/* Align the job count label since the old facet breadcrumb is removed */
h1.result2 {
    margin-top: 0;
}

/*
  Allow angular.js to be loaded in body, hiding cloaked elements until
  templates compile.  The !important is important given that there may be
  other selectors that are more specific or come later and might alter display.
 */
[ng\:cloak],
[ng-cloak],
.ng-cloak {
    display: none !important;
}

/* Ajax loading spinner related styles */
.loading_block {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
    background-color: rgba(255, 255, 255, 0.6);
}

.loading_block .ajax-loader {
    position: absolute;
    background-image: url('//assets.j2c.com/images/loading_spinner.gif');
    height: 58px;
    width: 58px;
    left: 50%;
    top: 100px;
    margin-left: -29px; /* -1 * image width / 2 */
    margin-top: -29px; /* -1 * image height / 2 */
    background-size: 58px;
}

.loading_block .alert {
    position: absolute;
    left: 50%;
    top: 100px;
    margin-left: -66px; /* -1 * alert width / 2 */
    margin-top: -26px; /* -1 * alert height / 2 */
}

.loading_spin_container {
    position: relative;
}

.loading_block_modal {
    z-index: 10000;
}

.loading_block_modal .ajax-loader,
.loading_block_modal .alert {
    top: 50%;
}

.loading_block .close {
    font-size: 21px !important;
}

.outerjob {
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 0;
    padding-right: 0;
}

#feature_job {
    padding-bottom: 10px;
}

#feature_job.read .title.title1 {
    color: #797979;
}

/*** J2C Exit Popup Starts ***/
a.btn-get-started:hover {
    text-decoration: none;
    background: #258DDC !important;
}

#bio_ep_close:hover {
    background: #258DDC !important;
}

/*** J2C Exit Popup Ends ***/