:root {
    --bs-gray: #295878;
    --bs-primary: #406385;
    --bs-secondary: #A4B1C1;
    --bs-light: #EDF2FA;
    --bs-dark: #101827;
    --bs-primary-rgb: 64, 99, 133;
    --bs-secondary-rgb: 164, 177, 193;
    --bs-light-rgb: 237, 242, 250;
    --bs-dark-rgb: 16, 24, 39;
    --bs-white-rgb: 255, 255, 255;
    --bs-black-rgb: 0, 0, 0;
    --bs-body-rgb: 129, 129, 129;
    --bs-font-sans-serif: "Lato", sans-serif;
    --bs-gradient: linear-gradient(180deg, rgba(32, 32, 32, 0.15), rgba(255, 255, 255, 0));
    --bs-body-font-family: var(--bs-font-sans-serif);
    --bs-body-font-size: 1rem;
    --bs-body-font-weight: 500;
    --bs-body-line-height: 1.5;
    --bs-body-color: #333B31;
    --bs-body-bg: #fff;
  
    --byf-header-font: 'Roboto Slab', serif;
  }

 /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
  CAREERS
  - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
.careers-section .feature {
  flex: 1 1 calc(33.333% - 2rem); /* Optional: ensures 3 per row */
  text-align: center;
  background-color: #f0f8ff; /* Very light blue */
  padding: 1.5rem;
  border-radius: 8px;
}

#pageContent a.btn-primary {
    background-color: #003071;
    color: #fff;
    border: none;
    padding: 0.7rem;
    text-decoration: none;
    margin-top: 1rem;
}

.features-grid {
      display: flex;
      flex-wrap: wrap;
      gap: 2rem;
      margin-top: 2rem;
    }

    .feature {
      flex: 1 1 calc(33% - 2rem);
      text-align: center;
    }

    .feature i {
      font-size: 48px;
      color: #0056b3;
      margin-bottom: 1rem;
    }

    @media (max-width: 768px) {
      .feature {
        flex: 1 1 100%;
      }
    }



  /*=====================
  NAV
  ======================*/

.dropdown-item {
    display: block;
    width: 100%;
    padding: 0.25rem 1rem;
    clear: both;
    font-weight: 500;
    color: #262626;
    text-align: inherit;
    text-decoration: none;
    white-space: nowrap;
    background-color: transparent;
    border: 0;
}

.dropdown-menu {
    min-width: 10rem;
    padding: 0.5rem 0;
    margin: 0;
    font-size: 0.9rem;
    color: #262626;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0, 0, 0, 0.15);
}

.dropdown-menu[data-bs-popper] {
    top: 100%;
    left: 0;
    margin-top: 0.125rem;
    padding: 0.8rem;
}


ul.dropdown-menu.show a {
    text-decoration: none;
    font-size: 1rem;
}

ul.dropdown-menu.show li {
    padding-bottom: 0.6rem;
}


  /*=====================
  TYPOGRAPHY
  ======================*/
.card.transformer .icon {
    background-color: var(--bs-primary);
}

  h1, h2, h3, h4, h5 {
      font-family: var(--byf-header-font);
      font-weight: 600;
  }

#pageContent h4 {
    color: var(--bs-gray);
    font-weight: 400;
}

h1 {
 padding-bottom: 0.7rem;
}

#main p, #footer p {
    font-weight: 400;
}

 a {
      color: var(--bs-primary);
  }

#footer .logo {
    background: #fff;
    padding-left: 1rem;
    padding-bottom: 0.5rem;
}


label {
    display: inline-block;
    font-family: 'Lato';
}


.hasBgImg .overlay {
    opacity: 0.8;
}

p {
    margin-top: 0;
    margin-bottom: 1rem;
    font-size: 1rem;
}

h1 {
font-family: "Roboto Slab", serif;
}

h2 {
font-family: "Roboto Slab", serif;
}

h3 {
font-family: "Roboto Slab", serif;
}

.text-primary {
    color: var(--bs-primary) !important;
}

.btn-light {
      background-color: var(--bs-secondary);
      border-color: var(--bs-secondary);
      color: var(--bs-light);
  }

.btn-lg {
padding: 1rem;
}


#cta .btn-light{
color: #111;
display: block;
max-width: fit-content;
margin-left: auto;
margin-right: auto;
}

#cta .btn-light:hover{
color: #fff;
}

#homepageCta h3 {
    font-weight: 400;
}

#auxMenu .nav-link small, #auxMenu .nav-link .small {
    font-size: 11px;
    font-weight: 700;
    line-height: 1.4;
    opacity: 1;
    text-transform: uppercase;
}

.btn-dark {
    color: #222;
    background-color: transparent;
    border-color: #262626;
    border-width: 0.15rem;
transition: color 0.3s ease, background-color 0.4s ease-in-out;
}


.btn-dark:hover, .btn-dark:focus {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
    color: #fff;
}



.btn-light:hover, .btn-light:focus {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
    color: #fff;
}



.btn-primary {
    color: #000;
    background-color: var(--bs-secondary);
    border-color: var(--bs-secondary);
}

.bg-primary {
    background-color: var(--bs-primary) !important;
}

.btn-primary:hover {
    background-color: var(--bs-primary) !important;
    border-color: var(--bs-primary) !important;
}

.fw-bold {
    font-weight: 600 !important;
}

body {
    background-color: #fff;
}


  /*=====================
  NAV
  ======================*/
#websiteMainNav {
    justify-content: center;
}

#header img {
    max-width: 65%;
}

  /*=====================
  HOMEPAGE CONTENT
  ======================*/


#homepageContent h1 {
    color: var(--bs-primary) !important;
    font-weight: 600 !important;
}

#homepageContent h2 {
    color: var(--bs-primary) !important;
    font-weight: 400;
}

#pageContent h1 {
    color: var(--bs-primary) !important;
margin-bottom: 1.5rem;
padding-top: 1rem;
}

#homepageContent {
    background-color: #fff !important;
}

#homepageContent a {
    color: var(--bs-primary);
    text-decoration: underline;
}


#homepageContent p strong {
    color: #333b31;
}

#homepageCta .hasBgImg .overlay {
    opacity: 0.7;
}

.hasBgImg .overlay {
    opacity: 1;
}

 /*=====================
  HEADER
  ======================*/
#headerTop a {
    color: #333b31;
    text-decoration: none;
    font-family: 'Lato';
    font-size: 1rem;
}

#header img.img-fluid {
    width: 50% !important;
}


#auxMenu .nav-link {
    padding: 0 1rem 0 0;
    color: var(--bs-gray);
    font-family: 'Raleway', sans-serif;
    font-weight: 500;
}



#auxMenu .nav-link:hover, #auxMenu .nav-link:focus {
    color: var(--bs-secondary) !important;
    opacity: 1;
}

#auxMenu .icon {
    text-align: center;
    color: var(--bs-dark) !important;
    margin-right: 0.5rem;
    font-size: calc(1.26rem + 0.12vw);
}


#header .navbar .nav-link:hover, #header .navbar .nav-link:focus {
    background-color: transparent !important;
    color: var(--bs-secondary) !important;
}

#header .navbar .nav-link {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    transition: all 0.5s ease;
    font-weight: 400;
}

#header .navbar .nav-link:not(.active):not(:active) {
    color: var(--bs-light);
    font-weight: 400;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    font-size: 1rem;
}

.dropdown-item.active, .dropdown-item:active {
    color: #fff;
    text-decoration: none;
    background-color: var(--bs-primary) !important;
}

#header {
    background: #fff !important;
z-index: 99999 !important;
}

#headerTop {
    padding-top: 0.7rem !important;
    padding-bottom: 0.7rem !important;
}


#pageContent {
    width: 100%;
}


#footer, #footer .logo a {
    color: #fff;
}

#header .navbar {
    background-color: var(--bs-dark) !important;
    z-index: 99999;
}



#header .navbar .nav-link:not(.active):not(:active) {
    color: var(--bs-light);
}




 /*=====================
  STAFFCARDS
  ======================*/
#staffCards a.card:hover {
    background-color: var(--bs-gray);
    color: #fff;
    box-shadow: none;
}

#staffCards {
    display: none;
}


#staffCards a.card
   transition: all 0.5s ease-in-out;
 box-shadow: 1px 2px 5px rgb(57 54 54 / 43%);
 border: none;
}

#homepageStaff {
    display: none;
}



#homepageStaff h3 {
    color: var(--bs-gray);
}

#staffCards a.card {
    transition: all 0.5s ease-in-out;
    color: var(--bs-gray);
    font-family: 'Raleway', sans-serif;
}


#homepageStaff .row {
    justify-content: center;
}

#cta {
    background-attachment: fixed;
    background-position: bottom;
}

 /*=====================
  AFFILIATES
  ======================*/

#homepageAffiliates img.img-fluid {
    padding: 1rem 2rem;
    max-width: 80%;
}


 /*=====================
  FOOTER
  ======================*/
#footer h4 span {
    font-style: italic;
    font-family: 'Raleway';
    color: var(--bs-secondary);
    font-weight: 500;
}

#footer h6 {
padding-top: 1.5rem !important;
font-size: 1rem;
}