:root {
--body-darkest: #131313;
--body-darker: #1c1c1c;
--body-opacity-25: rgba(38,38,38,0.25);
--body-opacity-50: rgba(38,38,38,0.5);
--body-opacity-90: rgba(38,38,38,0.9);
--body: #262626;
--body-light: #939393;
--body-lighter: #c9c9c9;
--body-lightest: #f4f4f4;
--primary-darkest: #69142b;
--primary-darker: #9d1f40;
--primary-opacity-25: rgba(210,41,86,0.25);
--primary-opacity-50: rgba(210,41,86,0.5);
--primary-opacity-90: rgba(210,41,86,0.9);
--primary: #d22956;
--primary-light: #e994ab;
--primary-lighter: #f4c9d5;
--primary-lightest: #fdf4f6;
--secondary-darkest: #364b4e;
--secondary-darker: #517076;
--secondary-opacity-25: rgba(108,150,157,0.25);
--secondary-opacity-50: rgba(108,150,157,0.5);
--secondary-opacity-90: rgba(108,150,157,0.9);
--secondary: #6c969d;
--secondary-light: #b6cbce;
--secondary-lighter: #dae5e6;
--secondary-lightest: #f8fafa;
--info-darkest: #1f4462;
--info-darker: #2f6694;
--info-opacity-25: rgba(63,136,197,0.25);
--info-opacity-50: rgba(63,136,197,0.5);
--info-opacity-90: rgba(63,136,197,0.9);
--info: #3f88c5;
--info-light: #9fc4e2;
--info-lighter: #cfe1f0;
--info-lightest: #f5f9fc;
--highlight-darkest: #7e401c;
--highlight-darker: #be612b;
--highlight-opacity-25: rgba(253,129,57,0.25);
--highlight-opacity-50: rgba(253,129,57,0.5);
--highlight-opacity-90: rgba(253,129,57,0.9);
--highlight: #fd8139;
--highlight-light: #fec09c;
--highlight-lighter: #fedfcd;
--highlight-lightest: #fff9f5;
--font-family-sans-serif: Montserrat, sans-serif
}


.header .oi {
  display: none;
}
.header .oi.oi-bell {
  display: inline-block;
}

.brand-caption {
  background-color: var(--dark);
  color: white;
  font-size: 0.6rem;
}

@media (min-width:567px) {
  .brand-caption {
    font-size: 1rem;
  }
}

.sticky-header {
  background-color: var(--primary);
}

.sticky-header .nav-link {
  color: white !important;
}

/* Added a comment so the size will be different */
.home-content,
.jobs-content,
[class^="content jobs-"]
 {
  background: url('https://chx4-jobs-api-uat.azurewebsites.net/api/document/getfile?name=fd7b0908-0246-4e20-bd75-71e59e0e23a0.jpg') no-repeat;
  background-size: 100vw 100vh;
  background-attachment: fixed;
  line-height: 1.6;
}


.search-panel {
    background-color: rgba(255, 255, 255, 0.8);
}

.hero-text {
  color: white;
}

.hero-text h1 {
  font-size: 3rem;
  padding-top: 4rem;
  padding-left: 2rem;
}

.hero-text h3 {
  font-size: 1.8rem;
  padding-bottom: 3rem;
  padding-left: 2rem;
}

#cmsHomeLowerContent {
  margin-top: 4rem;
}

.our-people,
.our-benefits,
.working-here {
  background-color: white;
  padding-top: 3rem;
  position: relative;
}

@media (min-width:567px)
{
  .our-benefits::before {
    content: '';
    display: block;
    position: absolute;
    width: 10rem;
    height: calc(60%);
    background-color: var(--highlight);
    border-radius: 5px 0 0 5px;
    right: 0;
    top: 25%;
  }

  .our-people::before {
    content: '';
    display: block;
    position: absolute;
    width: 10rem;
    height: calc(60%);
    background-color: var(--highlight);
    border-radius: 0 5px 5px 0;
    left: 0;
    top: 25%;
  }

  .working-here::before {
    content: '';
    display: block;
    position: absolute;
    width: 10rem;
    height: calc(60%);
    background-color: var(--highlight);
    border-radius: 0 5px 5px 0;
    left: 0;
    top: 25%;
  }
}
.our-people img,
.working-here img {
  width: 100%;
  border-radius: 6px;
}

/* Added a comment so the size will be different agin */
.happy-staff::before {
  content: '';
  background-image: url('https://chx4-jobs-api-uat.azurewebsites.net/api/document/getfile?name=8e597780-c2c6-492f-ad1d-4467ac75f5ac.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  width: 100%;
  display: block;
  height: 320px;
}

.role-tiles {
  flex-wrap: wrap;
  gap: 1rem;
}

.role-link {
  flex-grow: 1;
  transition: box-shadow .25s ease-in-out;
}

.role-link:hover {
  box-shadow: 2px 6px 12px 0 rgba(0,0,0,.25);
}

.role-tile {
  text-align: center;
  background-color: var(--primary-lightest);
  padding: 1rem;
  border-radius: 4px;
  border: 1px solid var(--primary);
}

.hs-container {
  max-width: 400px;
}

.job-card .card-header a {
  font-weight: 600;
}

.jobs-content .list-navigation .float-right .input-group-text {
  display: none !important;
}