/* stylelint-disable selector-id-pattern */

/* latin */
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('https://www.bamboohr.com/styles/fonts/inter-regular.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('https://www.bamboohr.com/styles/fonts/inter-medium.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('https://www.bamboohr.com/styles/fonts/inter-bold.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
  font-family: Fields;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('https://www.bamboohr.com/styles/fonts/fields-regular.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
  font-family: Fields;
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('https://www.bamboohr.com/styles/fonts/fields-semi-bold.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
  font-family: Fields;
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('https://www.bamboohr.com/styles/fonts/fields-bold.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root,
:host {
  /* Primary brand colors - can be customized for your brand */
  --color-green-4: #2E7918;
  --color-green-5: #03551C;
  --primary-brand-color: var(--color-green-4);
  ;
  --light-primary-brand-color: rgb(53 116 214 / 10%);
  --color-gray-13: #38312F;
  --color-gray-3: #D4D2D0;
  --color-gray-4: #C6C2BF;
  --color-1-shade-5: #1d9336;
  --color-white: #fff;
  --heading-font-family: 'Fields', 'Lato', georgia;
  --body-font-family: 'Inter', 'Lato', arial;

  /* Default colors - not recommended to change */
  --full-page-background-color: var(--color-white);
  --application-background-color: var(--color-white);
  --footer-color: var(--color-white);
  --main-text-color: var(--color-gray-13);
  --sub-header-color: var(--color-gray-13);
  --link-color: var(--color-green-4);
  --field-border-color: var(--color-gray-4);
}

/* Set the background color and font for the entire page */
body {
  background-color: var(--full-page-background-color);
  font-family: var(--body-font-family);
  color: var(--color-gray-13);
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
}

h1, h2, h3, h4, h5 {
  font-family: var(--heading-font-family);
  margin: 3rem 0 1rem;
}

a,
.attach-or-paste .unstyled-button.link-button {
  text-decoration: underline;
  color: var(--color-green-4);
}

a:hover,
.attach-or-paste .unstyled-button.link-button:hover {
  text-decoration: none;
  color: var(--color-green-5);
}

p,
ul li {
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
}

/* Set the background color, width, and padding for the main content container */
body #wrapper {
  background-color: var(--color-white);
  min-height: 100vh;
  max-width: 800px;
  padding: 0 48px;
}

/* Style the job locations */
#main .location {
  font-size: 18px;
  font-weight: 500;
  line-height: 27px;
  color: var(--sub-header-color);
  padding-bottom: 32px;
  margin-bottom: 48px;
  border-bottom: 1px solid var(--color-gray-3);
}

/* Style the main app body container */
div#app_body {
  max-width: none;
  padding: 0 20px;
}

#app_body .logo-container {
  display: none;
}

div#app_body #header {
  padding-right: 0;
}

/* Style the app title within the main app body */
div#app_body .app-title {
  font-family: var(--heading-font-family);
  font-size: 56px;
  line-height: 67px;
  font-weight: 700;
}

/* Hide the company name within the header */
div#app_body #header .company-name {
  display: none;
}

/* Style the apply button within the header */
div#app_body div#header #apply_button {
  top: auto;
  background-color: rgb(53 116 214);
  padding-top: 8px;
  padding-bottom: 8px;
  font-weight: 600;
}

/* Style the submit application button */
div#submit_buttons {
  text-align: center;
}

div#submit_buttons input#submit_app {
  background-color: var(--color-green-4);
  padding: 18px 40px;
  font-family: var(--body-font-family);
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  color: var(--color-white);
  border-radius: 100px;
  cursor: pointer;
  display: inline-block;
  transition: background-color 0.1s;
  letter-spacing: .5px;
  text-decoration: none;
}

div#submit_buttons input#submit_app:hover,
div#submit_buttons input#submit_app:focus {
  background-color: var(--color-green-5);
}

#content .content-intro p strong {
  font-family: var(--heading-font-family);
  font-size: 24px;
  font-weight: 700;
  line-height: 30px;
}

div#main #application_form h2.heading {
  font-size: 36px;
  font-weight: 700;
  line-height: 46px;
}

h3 {
  font-size: 24px;
  line-height: 30px;
  font-weight: 700;
}

/* Style the application container */
div#application {
  background-color: var(--application-background-color);
  border-top: 1px solid var(--field-border-color);
  padding-left: 0;
  padding-right: 0;
  max-width: none;
}

/* Style the main and custom fields in the application form */
div#main_fields, div#custom_fields {
  font-weight: 400;
  line-height: 26px;
}

/* Style the field labels in the application form */
div#application div.field label {
  color: var(--sub-header-color);
  display: block;
  float: none;
  font-size: 12px;
  font-weight: 400;
  text-align: left;
}

/* Style the asterisk symbol in the field labels */
div#application div.field label span.asterisk {
  font-size: 12px;
}

/* Remove left margin from textarea elements in main fields */
div#application #main_fields div.field textarea {
  margin-left: 0;
}

/* Style text input fields in the application form */
div#application div.field input[type=text] {
  border: solid 1px var(--field-border-color);
  height: 25px;
  padding-left: 12px;
  width: 455px;
}

/* Adjust the width of text input fields on smaller screens */
@media (max-width: 640px) {
  div#application div.field input[type=text] {
      width: 100%;
  }
}

/* Style the input fields with "MM" and "YYYY" placeholders */
div#application div.field input[placeholder="MM"] {
  padding-left: 10px;
}

div#application div.field input[placeholder="YYYY"] {
  padding-left: 7px;
}

/* Remove the float property from legend elements */
div#application legend {
  float: none;
}

/* Add bottom margin to the field container */
div#field {
  margin-bottom: 10px;
}

/* Remove left padding from the field error message */
#main_fields div.field div.field-error-msg {
  padding-left: 0;
}

/* Add top padding to the message container */
div.field div.msg-container {
  padding-top: 5px;
}

/* Style the select boxes */
.select2-container .select2-choice {
  height: 35px;
  width: 464px;
  margin-top: 6px;
}

.select2-container .select2-chosen {
  line-height: 35px;
}

.select2-container .select2-arrow {
  padding-top: 4px;
  padding-right: 4px;
}

/* Remove top margin from the select2-container within the application form */
#application .field .select2-container {
  margin-top: 0;
}

/* Display the "locate me" link as a block element */
div#application div.field a.locate-me {
  display: block;
}

/* Style the textarea fields in the application form */
div#application div.field textarea {
  border-color: var(--field-border-color);
  width: 455px;
}

/* Adjust the width of textarea fields on smaller screens */
@media (max-width: 640px) {
  div#application div.field textarea {
      width: 100%;
  }
}

/* Set the width of the select2-container in the application form */
div#application div.field div.select2-container {
  width: 455px !important;
}

/* Adjust the width of the select2-container on smaller screens */
@media (max-width: 640px) {
  div#application div.field div.select2-container {
      width: 100% !important;
  }
}

/* Hide the S3 upload form */
div.s3-upload-form {
  display: none;
}
@media (max-width: 600px) {
  div#app_body .app-title {
    font-size: 42px;
    line-height: 54px;
  }

  body #wrapper {
    padding: 0 10px;
  }
}