/*****************************
  Base styles
*****************************/

@import url('https://fonts.googleapis.com/css?family=Muli:400,600,700,800');

html { min-height: 100%; height: 100%; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-weight: 400; -ms-overflow-style: -ms-autohiding-scrollbar; }

body { font-family: 'Muli', sans-serif; box-sizing: border-box; margin: 0; padding: 0; border: 0; -webkit-font-smoothing: antialiased; display: flex; flex-direction: column;background-color: var(--dark-background); min-height: 100%; }

.no-text-highlight { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.transition { transition: all 0.5s; }

.page-flex { flex: 1; overflow-x: hidden; }


/*****************************
  Colours
*****************************/

:root {

    /*** Primary ***/

    --primary-01: #0065FF;
    --primary-02: #091E42;
    --primary-03: #ffffff;

    /*** Dark neutrals ***/

    --dark-neutral-01: #091E42;
    --dark-neutral-02: #172B4D;
    --dark-neutral-03: #253858;
    --dark-neutral-04: #344563;
    --dark-neutral-05: #42526E;

    /*** Mid neutrals ***/

    --mid-neutral-01: #505F79;
    --mid-neutral-02: #5E6C84;
    --mid-neutral-03: #6B778C;
    --mid-neutral-04: #7A869A;
    --mid-neutral-05: #8993A4;
    --mid-neutral-06: #97A0AF;
    --mid-neutral-07: #A5ADBA;
    --mid-neutral-08: #B3BAC5;

    /*** Light neutrals ***/

    --light-neutral-01: #C1C7D0;
    --light-neutral-02: #DCE0E8;
    --light-neutral-03: #EBEDF5;
    --light-neutral-04: #F5F7FB;
    --light-neutral-05: #fafbfd;
    --light-neutral-06: #FFFFFF;

    /*** Reds ***/

    --red-01: #BF2600;
    --red-02: #DE350B;
    --red-03: #FF5630;
    --red-04: #FF7452;
    --red-05: #FF8F73;
    --red-06: #FFBDAD;
    --red-07: #FFEBE6;

    /*** Yellows ***/

    --yellow-01: #FF8B00;
    --yellow-02: #FF991F;
    --yellow-03: #FFAB00;
    --yellow-04: #FFC400;
    --yellow-05: #FFE380;
    --yellow-06: #FFF0B3;
    --yellow-07: #FFFAE6;

    /*** Greens ***/

    --green-01: #006644;
    --green-02: #00875A;
    --green-03: #36B37E;
    --green-04: #57D9A3;
    --green-05: #79F2C0;
    --green-06: #ABF5D1;
    --green-07: #E3FCEF;

    /*** Teals ***/

    --teal-01: #008DA6;
    --teal-02: #00A3BF;
    --teal-03: #00B8D9;
    --teal-04: #00C7E6;
    --teal-05: #79E2F2;
    --teal-06: #B3F5FF;
    --teal-07: #E6FCFF;

    /*** Blues ***/

    --blue-01: #0747A6;
    --blue-02: #0052CC;
    --blue-03: #0065FF;
    --blue-04: #2684FF;
    --blue-05: #4C9AFF;
    --blue-06: #B3D4FF;
    --blue-07: #DEEBFF;

    /*** Purples ***/

    --purple-01: #403294;
    --purple-02: #5243AA;
    --purple-03: #6554C0;
    --purple-04: #8777D9;
    --purple-05: #998DD9;
    --purple-06: #C0B6F2;
    --purple-07: #EAE6FF;

    /*** Pink ***/

    --pink-02: #ff7dc7;
    --pink-07: #ffeaf6;

    /*** Orange ***/

    --orange-02: #ff9d65;
    --orange-07: #ffefe6;

    /*** Typography ***/

    --dark-font: #091E42; /* Dark neutral 1 */
    --mid-dark-font: #505F79; /* Mid neutral 1 */
    --mid-light-font: #7A869A; /* Mid neutral 4 */
    --light-font: #A5ADBA; /* Mid neutral 7 */

    /*** Iconography ***/

    --icon-lightest: #C1C7D0; /* Light neutral 1 */
    --icon-light: #97A0AF; /* Mid neutral 6 */
    --icon-mid: #7A869A; /* Mid neutral 4 */
    --icon-dark: #505F79; /* Mid neutral 1 */
    --icon-darkest: #091E42; /* Primary 02 */
    --icon-positive: #36B37E; /* Green 3 */
    --icon-red: #FF5630; /* Red 3 */

    /*** Backgrounds ***/

    --light-background: #fafbfd; /* Light neutral 5 */
    --mid-background: #F5F7FB; /* Light neutral 4 */
    --mid-dark-background: #DCE0E8; /* Light neutral 2 */

    
    --light-hover: #F5F7FB; /* Light neutral 4 */
    --mid-hover: #EBEDF5; /* Light neutral 3 */
    --dark-nav: #0b2556; /* Alternative navigation color */

    /*** Borders ***/



    /*** Avatars ***/

    --avatar-01: #C1C7D0; /* Light neutral 1 */

    /*** Other ***/

    --green-success: #36B37E; /* Green 3 */
    --red-alert: #DE350B; /* Red 1 */
    --notification: #DE350B; /* Red 2 */

    /*** Social colors ***/

    --linkedin: #007bb6;
    --facebook: #3b5998;
    --twitter: #50aee1;
    --google: #4285F4;

    /*** Ratings ***/

    --strong-no: #DE350B; /* Red 1 */
    --no: #FFC400; /* Yellow 4 */
    --neutral: #97A0AF; /* Mid neutral 6 */
    --yes: #0065FF; /* Primary 1 */
    --strong-yes: #36B37E; /* Green 3 */



    /*** Dark mode ***/

    --dark-background: #0a1628;

    --menu-background: #05142b;

    --border: #303c4b;
    --border-hover: #c6d8f3;

  
    --header-text:#ffffff;
    --body-text: #eaffff;
    --default-btn-txt: #acc1e1;

    --icon: #eaffff;
    --icon-hover: #86a1c8;

    --status-bar-green: #00c39a;

}

/*** Social colors ***/

.linkedin { background-color: var(--linkedin); }
.facebook { background-color: var(--facebook); }
.twitter { background-color: var(--twitter); }
.google { background-color: var(--google); }

/*****************************
  Typography
*****************************/

h1,h2,h3,h4,h5,h6, p, li, select { margin: 0; padding: 0; color: var(--header-text); }
h1 { font-size: 2rem; font-weight: 600; }
h2 { font-size: 1.8rem; font-weight: 600; }
h3 { font-size: 1.6rem; font-weight: 800; }
h4 { font-size: 1.4rem; font-weight: 600; }
h5 { font-size: 1.02rem; font-weight: 700; letter-spacing: 0.02rem; }
h6 { font-size: 1.02rem; font-weight: 700; letter-spacing: 0.02rem; }
p, a, li, button, label, input, textarea, select, option, span { font-weight: 600; font-size: 0.82rem; letter-spacing: 0.02rem; color: var(--body-text); }
a { text-decoration: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; cursor: pointer; font-size: 0.82rem; }
.svg-inline--fa { color: var(--icon); }

/*****************************
  Buttons
*****************************/

.btn { height: 40px; padding: 0 15px; display: flex; align-items: center; justify-content: center; white-space: nowrap; border-radius: 4px; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; transition: all 0.5s; }
.btn p { font-weight: 700 !important; font-size: .82rem; line-height: 1; }
.btn .svg-inline--fa { transition: all 0.5s; color: var(--primary-03); font-size: 0.7rem; padding: 0 5px 0 0 !important; }

/*** Primary button ***/

.primary-btn { background-color: var(--primary-01); color: var(--primary-03); }
.primary-btn p { color: var(--primary-03); font-size: .8rem; }
.primary-btn:hover { box-shadow: inset 0 -2px 0 rgba(31,45,61,.15); }

/*** Default button ***/

.default-btn { background-color: var(--dark-background); box-shadow: inset 0px 0px 0px 1px var(--border); }
.default-btn p { color: var(--body-text); font-size: .77rem; }
.default-btn .svg-inline--fa { margin: 1px 0 0 10px; color: var(--body-text) !important; }
.default-btn:hover { box-shadow: inset 0 0 0 1px var(--border-hover); }
.default-btn:hover .svg-inline--fa { color: var(--border-hover) !important; }

/*****************************
  Containers
*****************************/

.page-container { max-width: 1450px; margin: 0 auto; padding: 0 20px; }

/*****************************
  Nav
*****************************/

nav { background-color: var(--dark-background); width: 100%; border-bottom: solid 1px var(--border) !important; z-index: 2000; position: fixed; }
nav.jobBoard {  border-bottom: none!important; }
.nav-container { height: 70px; display: flex; flex-direction: row; align-items: center; justify-content: space-between; width: calc(100% - 40px);border-bottom:none!important; }
.nav-logo img { height: 40px; width: 40px; border-radius: 100%; }
.nav-items { display: flex; flex-direction: row; align-items: center; }
.nav-item { margin: 0 10px; color: var(--primary-03); transition: all 0.4s; }
.nav-item:hover { text-decoration: underline; }
nav.nav-jobBoard {border:solid 1px #EBEDF5!important;}
/*****************************
  Footer
*****************************/

footer { border-top: solid 1px #EBEDF5!important; height: 125px; }
.footer-container { height: 100%; width: 100%; display: flex; justify-content: center; align-items: center; } 
.footer-logo-container { display: flex; flex-direction: column; justify-content: center; align-items: center; }
.footer-logo { margin-bottom: 5px; }
.footer-logo img { height: 35px; width: 35px; border-radius: 100%; }


/*****************************
  Forms
*****************************/

input { color: var(--body-text) !important; width: calc(100% - 50px); font-family: 'Muli', sans-serif; font-size: 0.82rem; display: block; -webkit-appearance: none; -moz-appearance: none; appearance: none; outline: none; border: solid 1px var(--border); border-radius: 7px; transition: all 0.5s; background-color: var(--dark-background); }
input:disabled { color: var(--light-font); }
input:focus{ border: solid 1px var(--border-hover); }
::-webkit-input-placeholder { font-family: 'Muli', sans-serif; color: var(--body-text); font-weight: 600; -webkit-font-smoothing: antialiased; }
:-moz-placeholder { font-family: 'Muli', sans-serif; color: var(--body-text); font-weight: 600; -webkit-font-smoothing: antialiased; }
::-moz-placeholder { font-family: 'Muli', sans-serif; color: var(--body-text); font-weight: 600; -webkit-font-smoothing: antialiased; }
:-ms-input-placeholder { font-family: 'Muli', sans-serif; color: var(--body-text); font-weight: 600; -webkit-font-smoothing: antialiased; }
input#searchJobTitleId,#searchCityCtryId{color:#091e42!important;}
/*****************************
  Box Shadows
*****************************/

.box-shadow-01 { box-shadow: 0 0 0 1px rgb(0 0 0 / 50%), 0 70px 65px rgb(0 0 0 / 18%), 0 30px 30px rgb(0 0 0 / 14%), 0 15px 15px rgb(0 0 0 / 12%), 0 10px 8px rgb(0 0 0 / 10%), 0 4px 4px rgb(0 0 0 / 8%), 0 2px 2px rgb(0 0 0 / 6%) !important;}

/*****************************
  Menus
*****************************/

.menu-show { display: block; }

/*****************************
  Modals
*****************************/

.modal-background { z-index: 2499; background: #1f2438b8; position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; }
.modal-container { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; z-index: 2500; display: flex; align-items: center; justify-content: center; overflow-y: auto; overflow-x: hidden; }
.modal { max-width: 96vw; border-radius: 20px; background-color: var(--dark-background); box-shadow: 0 0 0 1px rgb(136 152 170 / 10%), 0 15px 35px 0 rgb(49 49 93 / 10%), 0 5px 15px 0 rgb(0 0 0 / 13%); }
.modal-inner { max-height: 96vh; min-width: 900px; max-width: 900px; position: relative; }
.modal-wrapper { padding: 0 75px; overflow: auto; max-height: calc(96vh - 55px); }
.modal-header { display: flex; align-items: center; height: 55px; min-height: 55px; padding: 0 20px; }
.modal-close { cursor: pointer; position: absolute; right: 25px; top: 20px; }
.modal-close .svg-inline--fa { transition: 0.5s all; font-size: 1.4rem; }
.modal-close .svg-inline--fa:hover { color: var(--icon-hover); }

/*****************************
  Jobs
*****************************/

.jobs-padding { padding: 125px 0 100px; }
.job-container { max-width: 800px; margin: 0 auto; }
.jobs-menu-container { position: relative; }
.jobs-menu { left: 0; top: 45px; min-width: 150px; position: absolute; z-index: 3; border-radius: 6px; background-color: var(--menu-background); }
.jobs-menu-show { display: block; }
.jobs-menu-hide { display: none; }
.jobs-menu-inner { padding: 10px 0; }
.jobs-menu-item { transition: 0.5s; cursor: pointer; display: flex; align-items: center; height: 33px; padding: 0 20px; }
.jobs-menu-item p { white-space: nowrap; }
.jobs-menu-item:hover p { color: var(--primary-03) }
.jobs-menu-item:hover .svg-inline--fa { color: var(--primary-03) }
.jobs-menu-item-radio .svg-inline--fa  { padding-right: 8px; font-size: .8rem;}
.jobs-menu-inner.jobBoard{ padding: 10px 0;background-color: var(--primary-03) !important;border-radius: 6px;box-shadow: 0 0 0 1px rgba(136, 152, 170, .1), 0 15px 35px 0 rgba(49, 49, 93, .1), 0 5px 15px 0 rgba(0, 0, 0, .08);}
.jobs-menu-inner.jobBoard .jobs-menu-item:hover p { color: #999!important; }
.job-search-location.jobBoard{
   border: solid 1px #EBEDF5!important;
   margin-right: 20px;
   background-image: url(https://gohire-app.s3.amazonaws.com/img/location-icon-board.png) !important;
   background-repeat: no-repeat !important;
   background-size: 15px 15px !important;
   background-position: 15px !important;
   padding: 18px 10px 18px 40px;
  
}
.jobs-menu.jobBoard{
background-color: var(--menu-background);
}

/*****************************
  Job Header
*****************************/

.job-header { text-align: center; }
.job-search { display: flex; flex-direction: row; align-items: center; margin-bottom: 20px; }
.job-search input { margin-right: 20px; background-image: url(https://gohire-app.s3.amazonaws.com/img/search-icon.png); background-repeat: no-repeat; background-size: 15px 15px; background-position: 15px; padding: 18px 10px 18px 40px; }
.job-search-location { background-size: 13px 17px !important; background-image: url(https://gohire-app.s3.amazonaws.com/img/location-icon.png) !important; } 
.job-search .btn { height: 52px; }
.job-search .btn p { font-size: .85rem; }

/*****************************
  Job List
*****************************/

/*** Job header ***/

.job-header { margin: 0 auto 45px; }
.job-filters { display: flex; flex-direction: row; align-items: center; } 
.job-filters .filter-btn { margin-right: 20px; }
.filter-btn { height: 33px !important; padding: 0 10px; }
.job-filters-clear { margin-left: auto; }
.job-filters-clear a { text-decoration: underline; }

/*** Job item ***/

.job-item { transition: 0.5s all; cursor: pointer; border: solid 1px var(--border); padding: 25px; border-radius: 10px; margin-bottom: 20px; }
.job-item:hover { border: solid 1px var(--border-hover); }
.job-item-inner { display: flex; flex-direction: row; align-items: flex-start; position: relative; }
.job-item-logo { margin-top: 3px; } 
.job-item-logo img { height: 30px; width: 30px; border-radius: 4px; }
.job-item-title { padding-bottom: 10px; }
.job-item-title h2 { font-size: 1.2rem; line-height: 1.6; }
.job-company { padding-bottom: 5px; }
.job-location { padding-top: 5px; }
.job-item-details { margin-left: 20px; }
.job-item-details-row { padding: 10px 0 0; display: flex; flex-direction: row; align-items: center; flex-wrap: wrap; }
.job-item-detail { display: flex; flex-direction: row; align-items: center; margin: 0 15px 10px 0;  } 
.job-item-detail .svg-inline--fa { color: var(--body-text); font-size: .7rem; padding-right: 6px; }
.job-item-detail p { white-space: nowrap; }
.job-preview p { line-height: 1.6; }
.job-item-remote { background-color: var(--status-bar-green); border-radius: 20px; position: absolute; right: 0; }
.job-item-remote p { padding: 3px 10px; font-size: .7rem; font-weight: 700; text-transform: uppercase; }

/*** Job Empty ***/

.job-search-empty { padding: 50px 0; display: flex; flex-direction: column; justify-content: center; }
.job-search-empty .svg-inline--fa { font-size: 3rem; padding-bottom: 20px; }
.job-search-empty p { text-align: center; line-height: 1.6;  }
.job-search-empty.jobBoard p{color:#091e42!important;}
/*** Job pagination ***/

.jobs-pagination { margin: 50px 0 0; display: flex; flex-direction: row; align-items: center; justify-content: center; }
.jobs-pagination-item { transition: 0.5s all; cursor: pointer; display: flex; flex-direction: row; align-items: center; justify-content: center; height: 30px; width: 30px; min-height: 30px; min-width: 30px; border-radius: 3px; border: solid 1px var(--border); margin: 0 5px; }
.jobs-pagination-item:hover { border: solid 1px var(--border-hover); }
.jobs-pagination.jobBoard .jobs-pagination-item{border:solid 1px #EBEDF5!important;}
/*****************************
  Job
*****************************/

.job { padding: 50px 0; }
.job-logo { margin-top: 3px; } 
.job-logo img { height: 35px; width: 35px; border-radius: 4px; }
.job-title h2 { padding: 15px 0 5px; font-size: 2rem; font-weight: 700; }
.job-details-row { padding: 7px 0 0; display: flex; flex-direction: row; align-items: center; flex-wrap: wrap; }
.job-detail { display: flex; flex-direction: row; align-items: center; margin: 0 12px 10px 0;  } 
.job-detail .svg-inline--fa { color: var(--body-text); font-size: .75rem; padding-right: 4px; }
.job-top-cta { margin: 10px 0 20px 0; display: flex; flex-direction: row; align-items: center; }
.job-description h2 { padding: 20px 0; font-weight: 500 !important; }
.job-description h3 { padding: 20px 0; font-weight: 500 !important; }
.job-description h4 { padding: 20px 0; font-weight: 500 !important; }
.job p { line-height: 1.8 !important; }
.job-description ul { list-style-type: disc; margin: 10px 0 10px 0; letter-spacing: 0.02rem; }
.job-description ul li { font-size: .9rem; line-height: 1.8 !important; padding-bottom: 6px; }
.job-description ol { list-style-type: decimal; margin: 10px 0 10px 0; letter-spacing: 0.02rem; }
.job-description ol li { font-size: .9rem; line-height: 1.8 !important; padding-bottom: 6px; }
.job-cta { max-width: 130px; height: 47px; margin-right: 15px; }
.job-cta p { font-size: .88rem; }
.job-bottom-cta { margin-top: 30px; display: flex; flex-direction: row; align-items: center; }

/*****************************
  Responsive
*****************************/

@media screen and (max-width: 950px) {

  .modal-inner { min-width: inherit; max-height: 98vh; }
  .modal-wrapper { padding: 0 30px; max-height: calc(98vh - 55px); }

  .job-top-cta { flex-direction: column; }
  .job-bottom-cta { flex-direction: column; }
  .job-cta { max-width: calc(100% - 30px); width: calc(100% - 30px); margin-right: 0; }
  .job-cta-apply { margin-bottom: 20px; } }

@media screen and (max-width: 850px) {

  .jobs-pagination-item { height: 40px; width: 40px; min-height: 40px; min-width: 40px; } }

@media screen and (max-width: 600px) {

  .jobs-padding { padding: 110px 0 100px; }

  .job-search { flex-direction: column; margin-bottom: 30px; } 
  .job-search input { margin:  0 0 20px; }
  .job-search .btn { width: calc(100% - 30px); }  

  .job-item-inner { flex-direction: column; }
  .job-item-details { margin: 20px 0 0; }

  .jobs-pagination-item-number { display: none; }
  .jobs-pagination-item { width: 70px; min-width: 70px; } }

@media screen and (max-width: 350px) {

  .job-filters { flex-direction: column; align-items: flex-start; }
  .job-filters .filter-btn { margin: 0 0 20px; min-width: 80px; }
  .job-filters-clear { margin: 0; } }

.job-preview span {
    color: var(--body-text) !important;
}
.showPopup { display: inherit; }
.hidePopup { display: none; }
.addBodyOverflow {
  overflow: hidden;
}
.removeBodyOverflow {
  overflow: none;
}
p.empty-avatar-text {
  font-size: .62rem!important;
  line-height: 1;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--primary-03)!important;
}
.noLogoClass {
  width: 86px;
  height: 20px;
  background-color: var(--avatar-01);
  border-radius: 3px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primary-03);
  background-image: none;
  padding: 5px;
}
.noLogoClassOnFly {
  height: 30px; width: 30px; max-height: 30px;max-width: 30px; min-height: 30px; min-width: 30px;
  background-color: var(--avatar-01);
  border-radius: 3px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primary-03);
  background-image: none;
  padding: 5px;
}


@media screen and (max-width: 275px) {
  .job-item-remote { display: none; }
}

.divCenterAlign {
  margin-left: auto;
  margin-right: auto;
}