/******************************
	Base style
******************************/

@import url('https://fonts.googleapis.com/css?family=Muli:400,600,700,800');
html { min-height: 100%; height: 100%; }
body { font-family: 'Muli', sans-serif; }
#page-body { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; min-height: 100%; -webkit-overflow-scrolling: touch; }
.page-flex { -ms-flex: 1; flex: 1; }
.page-no-scroll { overflow: hidden; }
.careers-container { max-width: 1040px; margin: auto; padding: 0 20px; }
img { max-width: 100%; display: block; }

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

h1,h2,h3,h4,h5,h6, p, li, select { color: #273444; letter-spacing: 0.02rem; }
h1 { font-size: 1.9rem; line-height: 1.4; }
h2 { font-size: 1.5rem; line-height: 1.4; }
h3 { font-size: 1.4rem; line-height: 1.4; }
h4 { font-size: 1.3rem; line-height: 1.4; }
h5 { font-size: 1.2rem; line-height: 1.4; }
h6 { font-size: 1rem; line-height: 1.4; }
h1, h2, h3, h4, h5, h6 { font-weight: 600; }
p { line-height: 1.6 !important; font-size: .95rem; font-weight: 400; }
a { font-weight: 600; text-decoration: none; cursor: pointer; font-size: 0.95rem; letter-spacing: 0.02rem; }
ul, li, button, label, input, textarea, select, option { font-size: 0.95rem; font-weight: 400; }
blockquote, q { line-height: 1.6 !important; font-size: .95rem; font-weight: 400; color: #273444; letter-spacing: 0.02rem; }

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

h1 { font-size: 1.6rem; }
h2 { font-size: 1.3rem; }
h3 { font-size: 1.2rem; }
h4 { font-size: 1.1rem; } }

/******************************
	Client branding
******************************/

.client-brand-border { border: solid 1px #005cff; }
.client-brand-text { color: #005cff; }
.client-brand-text p { color: #005cff; }
.client-brand-background { background-color: #005cff; }
.client-hero-img { background:url("../../../assets/img/avatars/test.jpg"); }
input:focus { border: solid 1px #1FB6FF; }
.textarea textarea:focus { border: 1px solid #1FB6FF; }

/******************************
	Careers site
******************************/

.nav { width: 100%; background-color: #fff; z-index: 1; min-height: 72px; }
.nav-container { display: flex; align-items: center; min-height: 72px; }
.client_logo img { max-height: 40px; max-width: 130px; }
.hero-img { background-size: cover !important; background-repeat: no-repeat !important; background-position: 50% !important; }
.hero-overlay { background-color: rgba(0,0,0,.25); }
.hero-text { padding: 120px 0 !important; text-align: center; }
.hero-text h1 { font-size: 2.3rem; color: #fff; line-height: 1.2; padding-bottom: 5px; }
.hero-text p { color: #fff; opacity: 0.9; }
.see-jobs-link { text-decoration: underline; color: #fff; font-size: .95rem; font-weight: 400 !important; }
.hero-no-image .hero-text { padding: 80px 0 !important; }
.custom-section { padding-top: 42px; padding-bottom: 42px; border-bottom: solid 1px #E0E6ED; }
.custom-section h2 { padding-bottom: 14px; }
.custom-section p { padding: 8px 0px; }
.custom-section-container { padding: 30px 0px; }
.job-list-container { padding-top: 50px; padding-bottom: 60px; }
.job-header { padding-bottom: 40px; display: flex; align-items: center; }
.job-header-right { margin-left: auto; }
.job-list-count { background-color: #EFF2F7; border-radius: 30px; }
.job-list-count p { font-size: 0.74rem; padding: 3px 12px; font-weight: 600; }
.job-list { border-radius: 6px; background-color: #fff; }
.gohire-job { display: flex; align-items: center; border: solid 1px #E0E6ED; border-radius: 6px; margin-bottom: 30px; transition: background-color 0.2s; }
.gohire-job:hover { background-color: #F9FAFC; }
.left-career { padding: 25px 20px; width: calc(100% - 150px); }
.job-title { font-size: 1rem; padding-bottom: 2px; line-height: 1.4 !important; max-width: 100%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }
.careers-location { font-size: 0.8rem; line-height: 1.4 !important; }
.see-job { margin-left: auto; padding: 25px 20px 25px 0; display: flex; align-items: center; white-space: nowrap; width: 90px; }
.see-job p { font-weight: 600; font-size: 0.85rem; line-height: 1 !important; }
.see-job i { padding-left: 3px; font-size: .8rem; }
.jobs-empty { padding: 100px 0; text-align: center; }

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

.hero-text { padding: 90px 0 !important; text-align: left; }
.hero-text h1 { font-size: 2.2rem; }
.hero-text p { font-size: 0.9rem; line-height: 1.5 !important; }
.custom-section { padding-top: 30px; padding-bottom: 30px; }
.see-jobs-link { font-size: 0.9rem; }
.get-jobs { display: none; }
.job-list-container { padding-top: 30px; padding-bottom: 40px; }
.job-header { padding-bottom: 30px; }
.gohire-job { margin-bottom: 20px; }
.job-header-right { display: none; }
.left-career { padding: 20px 10px; width: calc(100% - 20px); }
.job-title {  max-width: 100%; text-overflow: inherit; overflow: visible; white-space: normal; padding-bottom: 4px; }
.careers-location { line-height: 1.6 !important; }
.see-job { display: none; } }

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

.hero-text h1 { font-size: 2rem; } }

/******************************
	Job page
******************************/

.jp-padding { padding: 80px 0; }
.client-job-logo img { max-height: 40px; }
.jp-header { margin: 30px 0; display: flex; flex-direction: row; align-items: center; }
.jp-header h2 { font-size: 1.8rem; font-weight: 600; max-width: 780px; line-height: 1.3 !important; }
.jp-header-left { padding-right: 20px; }
.sub-title { padding: 10px 0; }
.sub-title p { font-size: .9rem; padding-bottom: 3px; }
.jp-header-right { margin-left: auto; display: flex; }
.jp-btn { border-radius: 3px; }
.jp-btn p { color: #fff; padding: 14px 35px; font-weight: 700; white-space: nowrap; }
.jp-text { padding-top: 30px; border-top: solid #E0E6ED 1px; }
.jp-text ul { list-style-type: disc; margin-left: 40px; letter-spacing: 0.02rem; }
.jp-text ul li { line-height: 1.6 !important; padding-bottom: 6px; }
.jp-text ol { list-style-type: decimal; margin-left: 40px; letter-spacing: 0.02rem; }
.jp-text ol li { line-height: 1.6 !important; padding-bottom: 6px; }
.jp-btm { display: flex; align-items: center; margin-top: 40px; }
.jp-email-link { margin-left: 15px; }

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

.jp-padding { padding: 21px 0 60px; }
.client-job-logo { min-height: 70px; width: 100%; }
.client-job-logo img { max-height: 30px; }
.jp-header { margin: 20px 0 30px; flex-direction: column; align-items: flex-start; }
.jp-header h2 { font-size: 1.7rem; }
.jp-header-left { padding-right: 0; }
.sub-title { padding: 8px 0; }
.jp-header-right { margin-left: 0; width: 100%; margin-top: 25px; }
.jp-btn { width: 100%; text-align: center; }
.jp-btn p { padding: 14px 60px !important; }
.jp-btm { flex-direction: column; align-items: flex-start; text-align: left; width: 100%; }
.jp-email-link { margin-left: 0; margin-top: 15px; } }

/******************************
	Careers footer
******************************/

.careers-footer { display: flex; align-items: center; flex-direction: column; justify-content: center; min-height: 225px; background-color: #F9FAFC; }
.social-links-wrapper { display: flex; align-items: center; margin-bottom: 40px; }
.social-link { margin: 0 12px; }
.social-link i { color: #C0CCDA; font-size: 1.1rem; }
.gh-powered { display: flex; flex-direction: row; justify-content: center; align-items: center; }
.careers-footer p { font-size: 0.82rem; color: #8492A6; font-weight: 700; white-space: nowrap; padding-right: 8px; }
.gh-powered img { max-height: 22px; }

/******************************
	Closed job page
******************************/

.careers-job-closed-wrapper { max-width: 600px; margin: auto; }
.careers-job-closed { margin: 100px 20px; text-align: center;  border-radius: 4px; background-color: #fff; box-shadow: 0 1px 2px 0 rgba(31,45,61,.15); border-radius: 10px; }
.careers-job-closed-inner { padding: 140px 20px; }
.careers-job-closed-title { font-size: 2.2rem; line-height: 1.2 !important; padding-bottom: 5px; }
.careers-closed-btn { display: block; border-radius: 3px; max-width: 250px; margin: 30px auto 0; }
.careers-closed-btn p { color: #fff; padding: 12px 20px; font-weight: 500; white-space: nowrap; }
