@charset "UTF-8";
/* Styles used to dev careers pages */
/* Version 1.0 Sat 4 Jan at 13:31 */
/* Variables */
/* Text Styling */
.sans {
  font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

.h1-smaller {
  font-size: calc(3em - 0.8em) !important;
}

.h2-smaller {
  font-size: calc(1.625em - 0.8em) !important;
}

.h1-larger {
  font-size: calc(3em + 0.8em) !important;
}

.h2 {
  /* Added as not applying .h2 in esg-style as no body#esg tag here */
  font-size: 1.625em !important;
}

.h2-larger {
  font-size: calc(1.625em + 0.8em) !important;
}

/* Align bullet list items in ESG based pages only */
/* Edit h4 headings in ESG based pages only */
body#esg .bullet li {
  list-style: disc;
  list-style-position: inside;
  margin-left: 0;
  padding-left: 1.4em;
  text-indent: -1em;
}
body#esg h4 {
  font-size: 1.125em;
  text-shadow: none;
}

/* Get figure.wp-block-image (like logos etc.) to align left (not centered) */
body#esg {
  /*figure .wp-block-image .logo {
    margin: 0!important;
  }*/
}
body#esg figure {
  /*margin: auto;*/
}

/* BG Cols */
.bg-bbGreen {
  background-color: #80c19b !important;
}

.bg-bbGreen10 {
  background-color: rgba(128, 193, 155, 0.1) !important;
}

.bg-bbGreen20 {
  background-color: rgba(128, 193, 155, 0.2) !important;
}

.bg-bbGreen30 {
  background-color: rgba(128, 193, 155, 0.3) !important;
}

.bg-bbBlue {
  background-color: #003d79 !important;
}

.bg-bbBlue10 {
  background-color: rgba(0, 61, 121, 0.1) !important;
}

.bg-bbBlue20 {
  background-color: rgba(0, 61, 121, 0.2) !important;
}

.bg-bbBlue30 {
  background-color: rgba(0, 61, 121, 0.3) !important;
}

.bg-atseaBlue {
  background-color: #0077be !important;
}

.bg-onshoreGreen {
  background-color: #009b68 !important;
}

.bg-darkgreyTint60 {
  background-color: rgba(39, 35, 36, 0.6) !important;
}

/* Txt Cols */
.text-BB-Blue {
  color: #003d79 !important;
}

.text-atseaBlue {
  color: #0077be !important;
}

.text-onshoreGreen {
  color: #009b68 !important;
}

/* Txt Effects */
.text-shadow-0 {
  text-shadow: none !important;
}

.text-shadow-1 {
  text-shadow: 0px 2px 3px rgba(0, 0, 0, 0.9) !important;
}

/* Object Fit */
.object-fit-cover {
  object-fit: cover;
}

/* Button Effects */
/* Add right chevron to wp-block-button */
.right-chevron a.wp-element-button {
  font-weight: 400;
  letter-spacing: 0.02em;
  padding-left: 2em;
  padding-right: 2em;
  margin-left: 1em;
  margin-right: 1em;
}

.right-chevron a.wp-element-button::after {
  content: "";
  display: inline-block;
  margin-left: 1em;
  font-family: "Font Awesome 5 Pro";
}

/* Value Panels */
.valuePanels .valueTxt {
  padding: 4em 2em 1em 2em !important;
}
.valuePanels h3 {
  font-size: 1.375em !important;
}

/* Why You Will Love Us - Feature Panels */
.bb-featurePanel .imageTint {
  position: relative;
  display: inline-block;
  /* Ensures the container fits the image */
}
.bb-featurePanel .imageTint img {
  display: block;
  /* Remove extra space below image */
}
.bb-featurePanel .imageTint::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.2);
  /* Change color and opacity as needed */
  z-index: 1;
  /* Ensures the overlay is above the image */
  border-radius: 10px;
}

.bb-featureTxt {
  position: absolute;
  bottom: 1.875em;
  padding-left: 1.875em;
  padding-right: 1.875em;
  z-index: 1;
}
.bb-featureTxt h3 {
  font-weight: 400 !important;
  font-size: 1.4em !important;
  text-shadow: 2px 2px 2px black;
}
@media (min-width: 576px) {
  .bb-featureTxt h3 {
    font-size: 2em !important;
  }
  .bb-featureTxt a {
    font-size: 1.125em !important;
  }
}
@media (min-width: 768px) {
  .bb-featureTxt h3 {
    font-weight: 300 !important;
    font-size: 3em !important;
  }
  .bb-featureTxt a {
    font-size: 1.25em !important;
  }
}
@media (min-width: 992px) {
  .bb-featureTxt h3 {
    font-weight: 300 !important;
    font-size: 4em !important;
  }
  .bb-featureTxt a {
    font-size: 1.25em !important;
  }
}
@media (min-width: 1200px) {
  .bb-featureTxt h3 {
    font-weight: 300 !important;
    font-size: 5em !important;
  }
  .bb-featureTxt a {
    font-size: 1.25em !important;
  }
}

/* Our Benefits - Benefit Panels */
#esgProjects .project {
  /* Correct padding-right 9px from style-dev.css */
  padding-right: 15px;
}

.project.careerBenefit img {
  border-bottom: 4px solid #80c19b !important;
}

/* 50:50 Feature Panels */
.fifty50Feature .textContent-left,
.fifty50Feature .textContent-right {
  margin-left: auto;
  margin-right: auto;
}
@media (min-width: 576px) {
  .fifty50Feature .textContent-left,
.fifty50Feature .textContent-right {
    max-width: 540px;
  }
}
@media (min-width: 768px) {
  .fifty50Feature .textContent-left,
.fifty50Feature .textContent-right {
    max-width: 360px;
    /* Half the 720px .container width for break point */
  }
  .fifty50Feature .textContent-left {
    margin-right: 15px;
  }
  .fifty50Feature .textContent-right {
    margin-left: 15px;
  }
}
@media (min-width: 992px) {
  .fifty50Feature .textContent-left,
.fifty50Feature .textContent-right {
    max-width: 475px;
    /* Half the 970px .container width for break point */
  }
  .fifty50Feature .textContent-left {
    margin-right: 15px;
  }
  .fifty50Feature .textContent-right {
    margin-left: 15px;
  }
}
@media (min-width: 1200px) {
  .fifty50Feature .textContent-left,
.fifty50Feature .textContent-right {
    max-width: 570px;
    /* Half the 1140px .container width for break point */
  }
  .fifty50Feature .textContent-left {
    margin-right: 15px;
  }
  .fifty50Feature .textContent-right {
    margin-left: 15px;
  }
}

/* Full width Image Section with Text & Links on top */
/* e.g. Our Values & Safety panel */
@media (min-width: 992px) {
  .imgSect {
    min-height: 28.125em;
  }
}
@media (min-width: 1200px) {
  .imgSect {
    min-height: 31.25em;
  }
}
@media (min-width: 1440px) {
  .imgSect {
    min-height: 35em;
  }
}
/* Awards List */
.awards-list dt, .awards-list dd {
  position: relative;
  line-height: 1;
}
.awards-list dt i, .awards-list dd i {
  position: absolute;
  left: -1.6em;
  font-size: 1.2em;
  color: #009b68;
}
.awards-list dt {
  margin-bottom: 0.4em;
}
.awards-list dd {
  margin-bottom: 1.2em;
  line-height: 1.2;
}

/* Manning Agents */
.country-manning-agents {
  border-bottom: 1px solid #272324;
}
.country-manning-agents .agent-country {
  border-bottom: 1px solid #272324;
  margin-bottom: 1em;
}
.country-manning-agents .manning-agent {
  position: relative;
  display: flex;
  flex-direction: column;
  border-bottom: 1px dashed #272324;
  padding-bottom: 1.6em;
  margin-bottom: 1.6em;
}
@media (min-width: 768px) {
  .country-manning-agents .manning-agent {
    flex-direction: row;
  }
  .country-manning-agents .manning-agent .agent-address {
    flex: 0 0 60%;
  }
  .country-manning-agents .manning-agent .agent-contact {
    flex: 0 0 40%;
    margin-top: 0;
    padding-top: 0;
  }
}
.country-manning-agents .manning-agent:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}
.country-manning-agents .agent-address {
  display: inline-block;
  float: none;
  flex: 0 0 100%;
  margin-right: 0;
  padding-right: 1em;
  /*@media (min-width: 768px) {
    .agent-address {
      width: 60%;
    }
  }*/
}
.country-manning-agents .agent-contact {
  display: inline-block;
  float: none;
  flex: 0 0 100%;
  padding-left: 0;
  /*@media (min-width: 768px) {
    .agent-contact {
      width: 40%;
      margin-top: 0;
      padding-top: 0;
    }
  }*/
}

/* Breadcrumb Styles - Yoast */
#breadcrumbs {
  font-size: 14px;
  margin: 10px 0;
}

#breadcrumbs a {
  text-decoration: none;
  color: #ffffff;
  /* Change this to your preferred colour */
}

#breadcrumbs a:hover {
  text-decoration: underline;
}

#breadcrumbs .separator {
  margin: 0 5px;
  /* Spacing between separators */
}

/* Health & Wellbeing Sub Menu/Nav */
#wellbeing-nav.extra_menu {
  display: block !important;
}
#wellbeing-nav.extra_menu ul li {
  display: flex;
  flex-direction: row;
  align-items: baseline;
  margin-bottom: 2em;
}
#wellbeing-nav.extra_menu ul li::before {
  color: #009b68;
  font-size: 1.2em;
  font-weight: bold;
  padding-right: 1em;
  width: 40px;
  text-align: center;
}
#wellbeing-nav.extra_menu ul li::after {
  content: "";
  padding-left: 0.5em;
  color: #003d79;
}
#wellbeing-nav.extra_menu ul li a {
  color: #003d79;
  background-color: transparent;
  font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  font-size: 1.125em;
  text-transform: uppercase;
  padding: 0;
}
