body {
  --black: #1d1d1b;
  --fog: #e0e0e0;
  --orange: #f60;
  --pale:  #f8f8f8;

  --spacing: 8px;
  --spacing2: 16px;
  --spacing3: 24px;
  --spacing4: 32px;
  --spacing5: 40px;
  --spacing6: 48px;
  --spacing10: 80px;

  --transition-default-timing: 200ms;
  --transition-default-easing: ease-out;
}

body {
  background-color:  var(--pale);
}

.job__embedded-wrapper .image-container .logo,
.job__embedded-wrapper .divider {
  display: none;
}

.application--container {
  position: relative;
}

.application--header {
  position: absolute;
  top: 100%;
  right: var(--spacing3);
  gap: unset;
  transform: translateY(calc((100% + var(--spacing5) + var(--spacing3)/2) * -1));
}

.application--header .application--header--title {
  display: none;
}

.application--header .application--header--required * {
  color: var(--black) !important;
}

#application-form {
  background-color: #FFFFFF;
  padding: var(--spacing10) var(--spacing3) var(--spacing5);
}

#application-form hr {
  display: none;
}

#application-form .application--questions {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: unset;
  justify-content: space-between;
}

#application-form .application--questions > div {
  flex: 0 0 calc(50% - var(--spacing4));
  margin-bottom: var(--spacing6);
  width: calc(50% - var(--spacing4));
}

#application-form .application--questions > div:last-child {
  flex: 0 0 100%;
  margin-bottom: var(--spacing);
  width: 100%;
}

#application-form .input-wrapper {
  background-color: var(--pale);
  border-radius: 0;
  max-width: unset;
  outline: none;
  position: relative;
}

#application-form .input-wrapper .label {
  color: var(--black);
  font-size: 12px;
  left: 0;
  padding-left: 0;
  position: absolute;
  top: 0;
  transform: translateY(calc(-100% - 0.5em));
  font-weight: 500;
  letter-spacing: 0.5px;
}

#application-form .input-wrapper .label span {
  color: var(--black);
}

#application-form .input-wrapper .input {
  background-color: var(--pale);
  border-bottom: 2px solid transparent;
  color: var(--black);
  height: 2.4rem;
  padding-left: var(--spacing2);
  outline: none;
  border-radius: 0;
}

#application-form .input-wrapper .input:focus {
  border-color: var(--black);
}


#application-form .file-upload .label {
  color: var(--black);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.5px;
}

#application-form .file-upload .file-upload__wrapper button {
  color:  var(--orange);
  text-decoration: none;
  transition: color var(--transition-default-timing) var(--transition-default-easing);
}

#application-form .file-upload .file-upload__wrapper button:hover {
  color:  var(--black);
}

#application-form .file-upload  .text-input-wrapper {
  margin-top: var(--spacing6);
}

#application-form .file-upload  .text-input-wrapper .input {
  height: 160px;
}

#application-form input[type=checkbox] {
  -moz-appearance: none;
  -webkit-appearance: none;
  -webkit-appearance: none;
  -webkit-border-radius: 0;
  appearance: none;
  border: 2px solid var(--fog);
  height: var(--spacing4);
  margin-right: var(--spacing2);
  width: var(--spacing4);
}

#application-form input[type=checkbox]:hover,
#application-form input[type=checkbox]:focus {
  background: var(--pale);
  cursor: pointer;
}

#application-form input[type=checkbox]:checked {
  background-color: var(--black);
  border:  none;
}

#application-form input[type=checkbox]:checked:after {
  background-image: url('data:image/svg+xml;utf8,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M16.8859 7.20712L9.80009 14.2929L6.31431 10.7071L4.91431 12.1071L7.70009 14.9929L9.80009 17.0929L18.3859 8.60712L16.8859 7.20712Z" fill="rgb(255,255,255, 1)"/></svg>');
  color: #FFFFFF;
  content: " ";
  display: block;
  height: 24px;
  margin-left: 5px;
  margin-top: 4px;
  position: absolute;
  width: 24px;
}

#application-form .checkbox__input .svg-icon {
  display: none;
}

#application-form .checkbox__wrapper label {
  letter-spacing: 0.5px;
  color:  var(--black);
  max-width: 680px;
}

#application-form .application--submit {
  justify-content: center;
}

#application-form .application--submit button {
  background: var(--orange);
  border: none;
  color: #FFFFFF;
  font-size: 16px;
  font-weight: 500;
  line-height: 2rem;
  margin-top: var(--spacing3);
  max-width: 100%;
  overflow-x: hidden;
  padding: var(--spacing) var(--spacing4);
  text-overflow: ellipsis;
  transition: background var(--transition-default-timing) var(--transition-default-easing);
  white-space: nowrap;
  border-radius: 0;
}

@media (min-width: 0px) and (max-width: 719px) {
  #application-form .application--questions > div {
    flex: 0 0 100%;
    width: 100%;
  }  
}