/** Recruitment Component Style **/

.recruitment-component-wrap {
  font-family: "Barlow";
}

.recruitment-component-wrap .jobs-wrapper, .recruitment-component-wrap .teaser {
  padding: 90px 0;
}

.recruitment-component-wrap .jobs-wrapper {
  background-color: #09121E;
  color: #ffffff;
}

@media screen and (max-width: 576px) {
  .recruitment-component-wrap .jobs-wrapper > div:first-child, .recruitment-component-wrap .teaser .row > div:first-child {
    padding-left: 30px;
  }
}

.recruitment-component-wrap .teaser {
  background-color: #FAFAFA;
}

.recruitment-component-wrap h2, .recruitment-component-wrap h3, .recruitment-component-wrap h4, .recruitment-component-wrap h5 {
  font-family: "Josefin Sans";
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: 3px;
}

.recruitment-component-wrap h2 {
  margin: 0 !important;
}

.recruitment-component-wrap h3 {
  font-size: 15px !important;
  margin: 0 !important;
}

.recruitment-component-wrap h4 {
  margin: 60px 0 0 0 !important;
}

.recruitment-component-wrap h5 {
  font-weight: 400 !important;
  margin: 10px 0 20px 0 !important;
}

.recruitment-component-wrap p {
  letter-spacing: 2px;
  font-weight: 300;
  line-height: 1.8;
}

.recruitment-component-wrap .teaser hr, .recruitment-component-wrap .jobs-wrapper hr {
  width: 60px;
  height: 4px;
  margin: 60px 0;
}

.recruitment-component-wrap .teaser hr {
  background-color: #09121E;
}

.recruitment-component-wrap .jobs-wrapper hr {
  background-color: #ffffff;
}

.recruitment-component-wrap input[type=button] {
  background-color: transparent;
  color: #09121E;
  border: solid #09121E 1px;
  text-transform: uppercase;
  margin-top: 20px;
  padding: 20px 30px 14px 30px;
  letter-spacing: 2px;
  font-size: 14px;
  font-family: "Josefin Sans";
  font-weight: 400;
}

.recruitment-component-wrap .jobs-wrapper input[type=button] {
  color: #ffffff;
  border: solid #ffffff 1px;
}

.recruitment-component-wrap input[type=button]:hover, .recruitment-component-wrap input[type=button]:active, .recruitment-component-wrap input[type=button]:focus {
  background-color: transparent;
}

.recruitment-component-wrap .teaser h3 {
  margin-bottom: 20px !important;
}

@media screen and (max-width: 992px) {
  .recruitment-component-wrap input[type=button] {
    font-size: 11px;
    padding: 15px 25px 12px 25px;
  }

  .recruitment-component-wrap p {
    font-size: 0.85rem;
  }
}