/*
    This file is the stylesheet for the "Credera Experienced Hiring Job Board" job application form that resides in Greenhouse Recruiting. 
    To make changes to the styling of the embedded job application form, a new version of this file should be uploaded to Greenhouse. At least 
    developer permissions are required to upload the stylesheets. Note: making changes to this file will not make styling changes to the site until uploaded to Greenhouse.
    
    To upload follow these steps:
    1. Go to Greenhouse Recruiting dashboard
    2. Click on gear icon in upper right side of screen (configure)
    3. Navigate into "Dev Center" then into "Configure Your Job Board"
    4. Upload updated custom css file to intended job board
*/


:root {
  /* colors */
  --dark-ocean: #496a86;
  --dark-ocean-dark: #3f5b74;
  --credera-red: #e55f4c;
  --credera-red-dark: #d55847;
  --midnight-black: #3a3a3a;
  --pure-white: #ffffff;
  --gray-1: #757575;
  --gray-3: #cfcfcf;
  --gray-5: #f9f9f9;
  --error-color: #ae050d;

  /* typography */
  --font-body: 'Lato', Helvetica, sans-serif;
}

#wrapper {
  -webkit-font-smoothing: antialiased;
  font-smoothing: antialiased;
  padding: 0 !important;
  font-family: var(--font-body) !important;
  color: var(--font-body);
}

#wrapper * {
  box-sizing: border-box;
}

/* CONTENT */

#wrapper #main h1,
#wrapper #main h2,
#wrapper #main h3,
#wrapper #main .company-name {
  color: var(--midnight-black);
  font-family: var(--font-body) !important;
  font-weight: 500;
}

#wrapper #main a {
  color: var(--dark-ocean);
  transition: color 300ms ease;
}

#wrapper #main a:hover {
  color: var(--dark-ocean-dark);
}

#wrapper #main p,
#wrapper #main p span,
#wrapper #main ul li span,
#wrapper #main ul li {
  color: var(--midnight-black) !important;
}

#wrapper #main p,
#wrapper #main p span,
#wrapper #main p span strong span,
#wrapper #main p span strong,
#wrapper #main ul li span,
#wrapper #main ul li,
#wrapper #main .location {
  font-family: var(--font-body) !important;
  font-size: 16px !important;
}

/* END CONTENT */

#wrapper #main,
#wrapper #main #app_body {
  padding: 0 !important;
  max-width: none;
}

#wrapper #main #app_body #application {
  background-color: transparent;
  max-width: none;
  padding: 0;
}

#wrapper #main #app_body #application .field-error {
  border-color: var(--error-color) !important;
}

#wrapper #main #app_body #application div.field-error-msg {
  padding: 0;
  margin-top: 8px;
  font-weight: normal;
  font-size: 14px;
  color: var(--error-color);
}

#wrapper #main #app_body #application div.field-error-msg img {
  display: none;
}

#wrapper #main #app_body #application div.attach-or-paste a {
  font-size: 13px;
  font-weight: bold;
}

#wrapper #main #app_body #application div.attach-or-paste a:after {
  color: var(--dark-ocean);
}

#wrapper #main #app_body #application a.locate-me {
  display: none !important;
}

#wrapper #main #app_body #application a.locate-me + span + label {
  display: none !important;
}

@media (max-width: 640px) {
  .field .attach-or-paste .link-container a {
    border: 0px !important;
    color: var(--dark-ocean) !important;
    display: inline;
    padding: 0px;
    background-image: none;
    font-family: var(--font-body) !important;
  }
}

#wrapper #main #app_body #application #main_fields div.field,
#wrapper #main #app_body #application #eeoc_fields div.field,
#wrapper #main #app_body #application #custom_fields div.field {
  margin-bottom: 40px;
  line-height: normal;
}

#wrapper #main #app_body #application #main_fields div.field label,
#wrapper #main #app_body #application #eeoc_fields div.field label,
#wrapper #main #app_body #application #custom_fields div.field label {
  color: var(--midnight-black);
  display: block;
  float: none;
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 8px;
  margin-right: 0;
  width: auto;
  text-align: left;
  line-height: 24px;
}

#wrapper #main #app_body #application #custom_fields div.field label {
  margin-bottom: 0;
}

#wrapper #main #app_body #application #custom_fields div.field label input,
#wrapper #main #app_body #application #custom_fields div.field label select {
  margin-top: 8px;
}

#wrapper #main #app_body #application #main_fields div.field input[type='text'],
#wrapper #main #app_body #application #main_fields div.field textarea,
#wrapper #main #app_body #application #main_fields select,
#wrapper #main #app_body #application #eeoc_fields div.field input[type='text'],
#wrapper #main #app_body #application #eeoc_fields div.field textarea,
#wrapper #main #app_body #application #eeoc_fields select,
#wrapper #main #app_body #application #custom_fields div.field input[type='text'],
#wrapper #main #app_body #application #custom_fields div.field textarea,
#wrapper #main #app_body #application #custom_fields select,
#wrapper #main #app_body #application a.select2-choice {
  font-size: 16px;
  padding: 0 16px;
  color: var(--midnight-black);
  border-radius: 0;
  border-color: var(--gray-3);
  width: 100% !important;
  height: 48px;
  font-family: var(--font-body);
  font-weight: normal;
}

#wrapper #main #app_body #application a.select2-choice {
  line-height: 48px;
}

#wrapper #main #app_body #application #main_fields select,
#wrapper #main #app_body #application #eeoc_fields select,
#wrapper #main #app_body #application #custom_fields select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="%23757575" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-down"><polyline points="6 9 12 15 18 9"></polyline></svg>');
  background-repeat: no-repeat;
  background-position: right 16px center;
}

#wrapper #main #app_body #application .asterisk {
  color: var(--credera-red);
}

#wrapper #main #app_body #application #submit_buttons {
  text-align: center;
  margin-top: 60px;
}

#wrapper #main #app_body #application .button {
  background-color: var(--dark-ocean);
  background-image: none;
  border: 0;
  color: var(--pure-white);
  cursor: pointer;
  display: inline-block;
  font-size: 14px;
  font-weight: bold;
  line-height: 17px;
  padding: 16px 20px;
  text-decoration: none;
  text-transform: uppercase;
  outline: 0;
  text-shadow: none;
  border-radius: 0;
  margin: 0;
  font-family: var(--font-body);
  transition: background-color 300ms ease;
}

#wrapper #main #app_body #application .button:hover {
  background-color: var(--dark-ocean-dark);
}

#eeoc_fields #eeoc_title,
#eeoc_fields #disability_status_header {
  font-size: 16px;
  font-weight: bold !important;
  text-decoration: none;
  text-align: left;
  margin-bottom: 24px;
}

#wrapper #main #eeoc_fields div.eeoc_form_data p {
  font-size: 14px !important;
  text-align: left;
}

#eeoc_fields p + strong,
#eeoc_fields div + strong,
#eeoc_fields h3 + strong {
  display: block;
  margin-top: 32px;
  font-size: 14px;
  color: var(--midnight-black);
}

#eeoc_fields p + div,
#eeoc_fields ul + div {
  margin-top: 36px;
}

#eeoc_fields a {
  color: var(--credera-red);
  font-weight: bold;
  font-size: 16px;
}

#apply_with_buttons,
#education_section,
#add_education,
#education_instructions,
#main_fields h2.heading,
#main_fields div.required-fields {
  display: none !important;
}

#main_fields div.field textarea.paste {
  margin-left: 0px;
}

#resume_fieldset .attach-or-paste .link-container ::after {
  content: ",";
  color: var(--dark-ocean) !important;
}

.field .attach-or-paste .unstyled-button.link-button {
  color: var(--dark-ocean) !important;
  font-size: 13px;
  font-weight: bold;
  font-family: var(--font-body) !important;
  background-color: white;
}

ul.select2-results div.select2-result-label {
  font-family: var(--font-body);
  color: var(--midnight-black);
  font-size: 16px;
  padding: 10px 16px;
}

.select2-container a.select2-choice span.select2-arrow {
  width: 20px;
  right: 12px;
}

#wrapper #main #app_body #application .select2-container-active a.select2-choice {
  border-color: var(--midnight-black);
}
.select2-container a.select2-choice span.select2-arrow b {
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="%23757575" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-down"><polyline points="6 9 12 15 18 9"></polyline></svg>')
    no-repeat right 0 center !important;
}

div.select2-drop {
  box-shadow: none;
}

div.select2-drop-active,
div.select2-drop.select2-drop-above.select2-drop-active {
  border-color: var(--midnight-black);
  border-radius: 0;
}

div.select2-drop.select2-drop-above.select2-drop-active {
  transform: translateY(1px);
}

ul.select2-results {
  margin: 0;
  padding: 0;
}

ul.select2-results li.select2-highlighted div.select2-result-label {
  background: var(--gray-5);
  color: var(--midnight-black);
}

ul.select2-results li.select2-result[aria-selected='true'] div.select2-result-label {
  color: var(--credera-red);
}

.file-types {
  margin-top: 0px;
}