/**
 * The base file that should be imported by every file.
 * There should be no CSS generation in this or from imported scss files at all!
 */
/**
 * Library
 */
/**
 * Variables and functions
 */
@font-face {
  font-family: "Heading Now";
  font-weight: bold;
  src: url("/app/themes/nfc-talent-pro/assets/fonts/heading-now/HeadingNow-56Bold.woff2");
  font-display: swap; }

@font-face {
  font-family: "Heading Now";
  font-weight: normal;
  src: url("/app/themes/nfc-talent-pro/assets/fonts/heading-now/HeadingNow-64Regular.woff2");
  font-display: swap; }

@font-face {
  font-family: "Heading Now";
  font-weight: 500;
  src: url("/app/themes/nfc-talent-pro/assets/fonts/heading-now/HeadingNowTrial-55Medium.woff2");
  font-display: swap; }

@font-face {
  font-family: "Carlito";
  font-weight: normal;
  src: url("/app/themes/nfc-talent-pro/assets/fonts/Carlito/Carlito-Regular.ttf");
  font-display: swap; }

@font-face {
  font-family: "Carlito";
  font-weight: normal;
  font-style: italic;
  src: url("/app/themes/nfc-talent-pro/assets/fonts/Carlito/Carlito-Italic.ttf");
  font-display: swap; }

@font-face {
  font-family: "Carlito";
  font-weight: bold;
  src: url("/app/themes/nfc-talent-pro/assets/fonts/Carlito/Carlito-Bold.ttf");
  font-display: swap; }

@font-face {
  font-family: "Carlito";
  font-weight: bold;
  font-style: italic;
  src: url("/app/themes/nfc-talent-pro/assets/fonts/Carlito/Carlito-BoldItalic.ttf");
  font-display: swap; }

@font-face {
  font-family: 'Fallback';
  src: local(Impact);
  size-adjust: 96%;
  ascent-override: 115%;
  descent-override: normal;
  line-gap-override: normal; }

.menu-icon {
  position: relative;
  height: 15px;
  width: 22px;
  cursor: pointer;
  background-color: transparent;
  border: 0;
  padding: 0;
  transition: transform 0.2s linear 0s; }
  .menu-icon .bar {
    width: 100%;
    height: 2px;
    background-color: var(--black);
    transition: transform 0.2s linear 0.2s; }
    .menu-icon .bar-1 {
      position: absolute;
      inset: 0px 0 0 0; }
    .menu-icon .bar-2 {
      position: absolute;
      inset: 6px 0 0 0; }
    .menu-icon .bar-3 {
      position: absolute;
      inset: 12px 0 0 0; }
  .menu-icon.open {
    transform: rotate(90deg);
    left: 1px; }
    .menu-icon.open .bar-2 {
      opacity: 0; }
    .menu-icon.open .bar-1 {
      transform: rotate(45deg);
      position: absolute;
      inset: 8px 0 0 0; }
    .menu-icon.open .bar-3 {
      transform: rotate(-45deg);
      position: absolute;
      inset: 8px 0 0 0; }

#site-header {
  background-color: var(--white);
  height: 86px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  margin: 0 auto;
  padding: 0 5%;
  width: 100%;
  z-index: 99999;
  transition: background-color .2s ease-in-out;
  position: relative; }
  @media (min-width: 981px) {
    #site-header {
      padding: 0 5%; } }
  #site-header.slide-in-open {
    z-index: 0; }
  #site-header .logo {
    flex-basis: 170px; }
    @media (min-width: 981px) {
      #site-header .logo {
        z-index: 9999;
        flex-basis: 222px; }
        #site-header .logo svg {
          position: relative;
          top: 3px;
          max-width: 100%;
          height: auto; } }
  #site-header .menu-container {
    position: relative;
    z-index: 9999;
    display: flex;
    flex-wrap: wrap;
    gap: 1em;
    align-items: center;
    flex: 1; }
    @media (min-width: 1200px) {
      #site-header .menu-container {
        flex: unset; } }
    #site-header .menu-container .whislist, #site-header .menu-container .phone, #site-header .menu-container .menu {
      width: 42px;
      height: 42px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
      transition: color .3s ease-in-out, background-color .3s ease-in-out;
      margin-left: auto; }
      #site-header .menu-container .whislist a:after, #site-header .menu-container .phone a:after, #site-header .menu-container .menu a:after {
        content: '';
        position: absolute;
        inset: 0; }
    #site-header .menu-container .whislist, #site-header .menu-container .phone {
      display: none;
      background-color: var(--dark-gray);
      color: var(--white); }
      #site-header .menu-container .whislist a, #site-header .menu-container .phone a {
        color: var(--white); }
      #site-header .menu-container .whislist span, #site-header .menu-container .phone span {
        width: auto; }
        #site-header .menu-container .whislist span:before, #site-header .menu-container .phone span:before {
          width: auto; }
      @media (min-width: 981px) {
        #site-header .menu-container .whislist, #site-header .menu-container .phone {
          display: flex; } }
    #site-header .menu-container .button-wrap {
      display: flex;
      align-items: center;
      gap: .5em;
      margin-left: auto; }
      #site-header .menu-container .button-wrap .btn {
        font-size: 12px;
        line-height: 1;
        padding: 5px;
        font-weight: 800; }
        @media (min-width: 981px) {
          #site-header .menu-container .button-wrap .btn {
            font-size: 22px;
            padding: 10px 15px;
            border-radius: 25px; } }
    @media (min-width: 1200px) {
      #site-header .menu-container .menu {
        display: none; } }
    #site-header .menu-container .menu.header-btn-ab-test {
      margin-left: auto; }

.header-spacing {
  margin-top: 86px; }

#site-header.nav-up {
  position: fixed;
  transition: top .5s ease-in-out;
  top: -86px; }

#site-header.nav-down {
  position: fixed;
  top: 0;
  transition: top .5s ease-in-out; }

#site-header.yellow {
  background-color: var(--yellow); }
  #site-header.yellow .st0 {
    fill: var(--white); }

#site-header.red {
  background-color: var(--red); }
  #site-header.red .st0, #site-header.red .st1 {
    fill: var(--white); }
  #site-header.red .st2 {
    fill: var(--red); }
  @media (min-width: 981px) {
    #site-header.red .menu-container .whislist, #site-header.red .menu-container .phone {
      background-color: var(--white);
      color: var(--dark-gray); }
      #site-header.red .menu-container .whislist a, #site-header.red .menu-container .phone a {
        color: var(--dark-gray); }
    #site-header.red .menu-container .menu {
      background-color: var(--dark-gray); } }
  @media (max-width: 980px) {
    #site-header.red .menu-container .menu .bar {
      background-color: var(--white); } }

#site-header.magenta {
  background-color: var(--magenta); }
  #site-header.magenta .st0, #site-header.magenta .st1 {
    fill: var(--white); }
  #site-header.magenta .st2 {
    fill: var(--red); }
  @media (min-width: 981px) {
    #site-header.magenta .menu-container .whislist, #site-header.magenta .menu-container .phone {
      background-color: var(--white);
      color: var(--dark-gray); }
      #site-header.magenta .menu-container .whislist a, #site-header.magenta .menu-container .phone a {
        color: var(--dark-gray); }
    #site-header.magenta .menu-container .menu {
      background-color: var(--dark-gray); } }
  @media (max-width: 980px) {
    #site-header.magenta .menu-container .menu .bar {
      background-color: var(--white); } }

#site-header.dark-gray {
  background-color: var(--dark-gray); }
  #site-header.dark-gray .st0 {
    fill: var(--white); }
  #site-header.dark-gray .menu-container .whislist, #site-header.dark-gray .menu-container .phone {
    background-color: var(--white);
    color: var(--dark-gray); }
    #site-header.dark-gray .menu-container .whislist a, #site-header.dark-gray .menu-container .phone a {
      color: var(--dark-gray); }
  @media (max-width: 980px) {
    #site-header.dark-gray .menu-container .menu .bar {
      background-color: var(--white); } }

@media (min-width: 981px) {
  #site-header.transparent {
    background-color: transparent;
    transition: background-color .2s ease-in-out; }
    #site-header.transparent:not(.nav-down):not(.mega-menu-open) .logo svg path.st0 {
      fill: var(--white); }
    #site-header.transparent.mega-menu-open {
      background-color: var(--white) !important; } }
  @media (min-width: 981px) and (min-width: 981px) {
    #site-header.transparent + main {
      margin-top: -86px; } }

@media (min-width: 981px) {
    #site-header.transparent + main .section-heading {
      padding-top: 180px; } }

#site-header.transparent:has(~ #section-vacancy-loop) {
  background-color: transparent; }
  @media (min-width: 981px) {
    #site-header.transparent:has(~ #section-vacancy-loop) .menu .bar {
      background-color: var(--white); } }

#site-header.transparent.is-menu-on:has(~ #section-vacancy-loop) {
  background-color: var(--white); }
  #site-header.transparent.is-menu-on:has(~ #section-vacancy-loop) .menu .bar {
    background-color: var(--dark-gray); }

@media (min-width: 981px) {
  #site-header.transparent ~ #section-vacancy-loop {
    margin-top: -86px; } }

#site-header.transparent.nav-down {
  background-color: var(--white) !important; }

@media (min-width: 981px) {
  #site-header.transparent ~ main .section-standard-heading {
    padding-top: 200px; } }

body.admin-bar #site-header .desktop-header__mega-menu--open {
  top: calc(86px + 32px); }

body.admin-bar #site-header .mobile-header--open {
  top: calc(86px + 32px); }

/*# sourceMappingURL=header.css.map */