/* FONTS Fakt Pro */
@font-face {
    font-family: 'FaktPro';
    src: url('../fonts/faktpro-black-webfont.woff') format('woff2'),
    url('../fonts/faktpro-black-webfont.woff2') format('woff');
    font-weight: 900;
}

@font-face {
    font-family: 'FaktPro';
    src: url('../fonts/faktpro-normal-webfont.woff') format('woff2'),
    url('../fonts/faktpro-normal-webfont.woff2') format('woff');
    font-weight: 400;
}

@font-face {
    font-family: 'FaktPro';
    src: url('../fonts/faktpro-light-webfont.woff') format('woff2'),
    url('../fonts/faktpro-light-webfont.woff2') format('woff');
    font-weight: 300;
}

/* ROOT */
:root {
    --tps-blue: #0F3350;
    --tps-dark-blue: #062842;
    --tps-dark-blue-font: rgba(6, 40, 66, 0.8);
    --tps-light-orange: #FDF4EF;
    --tps-orange: #EE9261;
    --tps-dark-orange: #f0783a;
    --tps-light-gray: #0F33501A;
    --tps-gray: #FFFFFF4D;

    --tps-border-radius-small: 4px;
    --tps-border-radius-big: 16px;

    --tps-regular-weight: 400;
    --tps-medium-weight: 700;
    --tps-bold-weight: 900;

    --bs-body-font-family: "FaktPro", var(--bs-font-sans-serif);
    --bs-body-font-size: 1.125rem;
    --bs-body-line-height: 1.8;
}

/* LAY-OUT SPACING */
section {
    margin-top: 1.5rem;
}

.image-column {
    padding: 0;
}

.text-image-layout img {
    border-radius: var(--tps-border-radius-small);
}

@media (min-width: 992px) {
    section.text-image-layout .col-12:nth-child(1).image-column {
        padding-left: 0;
        padding-right: 1.5rem;
        display: flex;
    }

    section.text-image-layout .col-12:nth-child(2).image-column:not(.order-1) {
        padding-right: 0;
        padding-left: 1.5rem;
        display: flex;
    }

}

/* TEXT IMG LAY OUT */
.text-image-lay-out img {
    object-fit: cover;
    padding-right: 0;
    height: 100%;
    width: 100%;
}

.text-image-lay-out .col-12 + .col-12 img {
    padding-left: 0;
}

.bg-light-orange,
.text-image-lay-out img {
    border-radius: var(--tps-border-radius-small);
}

/* BACKGROUNDS */
.bg-light-small {
    position: relative;
}

.bg-light-small:before {
    content: '';
    background-color: var(--tps-light-gray);
    position: absolute;
    top: 0;
    left: 5%;
    width: 90%;
    height: 100%;
    z-index: -1;
}

.bg-light-orange {
    background-color: #FDF4EF;
}

.bg-light-orange p {
    color: var(--tps-blue);
}

.col-12.col-lg-6.bg-light,
.row.bg-light,
.with-border,
.col-12.col-lg-6.bg-light-orange,
.text-image-lay-out img {
    border: .75rem solid white;
}

.divider {
    opacity: .6;
    display: flex;
    align-items: center;
    color: var(--tps-dark-blue);
}

.divider::before {
    margin: 5px 10px 0 0;
}

.divider::after {
    margin: 5px 0 0 10px;
}

.divider::before, .divider::after {
    flex: 1;
    content: '';
    padding: 1px;
    background-color: #E2E2E2;
}

@media (min-width: 992px) {
    .text-image-lay-out img {
        border: none;
    }
}

.bg-gray-small {
    background: rgb(255, 255, 255);
    background: linear-gradient(to right, rgba(255, 255, 255, 1) 10%, #0F33501A 10% 90%, rgba(255, 255, 255, 1) 90%);
}

.bg-light {
    background-color: #E7EBED !important;
}

.bg-orange-halve {
    background: rgb(255, 255, 2555);
    background: linear-gradient(180deg, rgb(255, 255, 255) 40%, rgba(238, 146, 97, 1) 40%);
    border-radius: var(--tps-border-radius-small);
}

.bg-dark-orange {
    background-color: var(--tps-dark-orange);
}

.bg-dark-blue {
    background-color: var(--tps-dark-blue);
    color: #FFFFFF;
    border-radius: var(--tps-border-radius-small);
}

.bg-dark-blue h1, .bg-dark-blue h2, .bg-dark-blue h3, .bg-dark-blue h4, .bg-dark-blue h5, .bg-dark-blue p {
    color: #FFFFFF;
}

.bg-dark-blue p {
    opacity: 60%;
}

.bg-gray {
    background-color: var(--tps-light-gray);
    border-radius: var(--tps-border-radius-small);
}

@media (min-width: 576px) {
    .bg-gray-small {
        background: rgb(255, 255, 255);
        background: linear-gradient(to right, rgba(255, 255, 255, 1) 20%, #0F33501A 20% 80%, rgba(255, 255, 255, 1) 80%);
    }
}

@media (min-width: 768px) {
    .bg-gray-small {
        background: rgb(255, 255, 255);
        background: linear-gradient(to right, rgba(255, 255, 255, 1) 20%, #0F33501A 20% 80%, rgba(255, 255, 255, 1) 80%);
    }
}

@media (min-width: 992px) {
    .bg-gray-small {
        background: rgb(255, 255, 255);
        background: linear-gradient(to right, rgba(255, 255, 255, 1) 20%, #0F33501A 20% 80%, rgba(255, 255, 255, 1) 80%);
    }

    .col-12.col-lg-6.bg-light,
    .row.bg-light,
    .with-border,
    .col-12.col-lg-6.bg-light-orange {
        border: none;
    }
}

@media (min-width: 1200px) {
    .bg-gray-small {
        background: rgb(255, 255, 255);
        background: linear-gradient(to right, rgba(255, 255, 255, 1) 20%, #0F33501A 20% 80%, rgba(255, 255, 255, 1) 80%);
    }
}

@media (min-width: 1440px) {
    .bg-gray-small {
        background: rgb(255, 255, 255);
        background: linear-gradient(to right, rgba(255, 255, 255, 1) 30%, #0F33501A 30% 70%, rgba(255, 255, 255, 1) 70%);
    }
}

/* TEXT */
.vacancy-detail ol,
.vacancy-detail ul,
.col-12 ul,
p {
    opacity: .8;
    color: var(--tps-dark-blue);
}

.col-12 ul.list-unstyled,
.vacancy-tags {
    opacity: 1 !important;
    color: unset !important;
}

p:has(a img){
    opacity: 1;
}

.col-12 a.btn + p {
    margin-top: 1rem;
}

a {
    color: var(--tps-orange);
    text-decoration: none;
}
li {
    /* color: var(--tps-dark-orange); */
}
.text-blue {
    color: var(--tps-dark-blue);
}

.underlined-link {
    text-decoration: underline;
    text-decoration-skip-ink: none;
    text-decoration-color: var(--tps-dark-orange);
    color: #FFFFFF;
}

h1 {
    font-size: 3rem;
}

h2 {
    font-size: 2rem;
}

/* Spacing between headings if everything is in 1 column */
.col-12 .btn + h2,
.col-12 ul + h2,
.col-12 p + h2,
.col-12 img + h2,
.col-12 img + a.btn {
    margin-top: 2.5rem;
}

h6, .h6,
h5, .h5,
h4, .h4,
h3, .h3,
h2, .h2,
h1, .h1 {
    letter-spacing: 1px;
    font-weight: var(--tps-bold-weight);
    color: var(--tps-blue);
}

.text-orange {
    color: var(--tps-orange) !important;
}

img + h1,
img + h2,
img + h3,
img + h4,
img + h5,
img + h6 {
    margin-top: 1.5rem;
}

@media (min-width: 768px) {
    h1 {
        font-size: 5rem;
    }

    h2 {
        font-size: 2.5rem;
    }
}

/* BUTTONS */
.btn {
    padding: 1rem;
    position: relative;
    font-weight: var(--tps-medium-weight);
    border-radius: var(--tps-border-radius-small);
}

.btn-wrapper {
    margin: 0.5rem 0.5rem 0 0;
    display: inline-block;
    width: 100%;
}

p ~ .btn-wrapper {
    width: initial;
}

.btn:not(.card-carousel-next-btn):not(.card-carousel-previous-btn) svg {
    margin-left: 7px;
}

.btn svg path {
    transition: fill 0.15s ease-in-out;
}

.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--tps-blue);
    --bs-btn-border-color: var(--tps-dark-blue);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--tps-dark-blue);
    --bs-btn-hover-border-color: var(--tps-dark-blue);
    --bs-btn-focus-shadow-rgb: 49, 132, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--tps-dark-blue);
    --bs-btn-active-border-color: var(--tps-dark-blue);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}

.btn-outline-primary {
    --bs-btn-color: var(--tps-blue);
    --bs-btn-border-color: var(--tps-blue);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--tps-blue);
    --bs-btn-hover-border-color: var(--tps-blue);
    --bs-btn-focus-shadow-rgb: 49, 132, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--tps-dark-blue);
    --bs-btn-active-border-color: var(--tps-dark-blue);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-gradient: none;
}

.btn-secondary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--tps-orange);
    --bs-btn-border-color: var(--tps-orange);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--tps-dark-orange);
    --bs-btn-hover-border-color: var(--tps-dark-orange);
    --bs-btn-focus-shadow-rgb: 130, 138, 145;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--tps-dark-orange);
    --bs-btn-active-border-color: var(--tps-dark-orange);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}

.btn-secondary svg path {
    fill: var(--tps-blue);
}

.btn-outline-secondary {
    --bs-btn-color: var(--tps-blue);
    --bs-btn-border-color: var(--tps-orange);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--tps-orange);;
    --bs-btn-hover-border-color: var(--tps-orange);;
    --bs-btn-focus-shadow-rgb: 108, 117, 125;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--tps-orange);;
    --bs-btn-active-border-color: var(--tps-orange);;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-gradient: none;
    backdrop-filter: blur(4px);
}

.btn svg {
    transition: margin-left .3s;
}

.btn:not(.card-carousel-next-btn):not(.card-carousel-previous-btn):hover svg {
    margin-left: 1rem;
}

.btn-outline-secondary:hover svg path {
    fill: white;
}

a.btn + a.btn {
    margin-left: 1rem;
}

.btn-reset {
    all: unset;
}

.nav-item-icon svg path {
    stroke: white;
    transition: stroke .3s;
}

.nav-item-icon:hover svg path {
    stroke: var(--tps-orange);
}

.nav-item-icon.active svg path {
    fill: var(--tps-orange);
    stroke: var(--tps-orange);
}

/* NAVBAR */
.navbar {
    position: absolute;
    width: 100%;
    top: 1rem;
    z-index: 9999;
    --bs-navbar-color: var(--tps-dark-blue);
    --bs-nav-link-color: var(--tps-dark-blue);
    --bs-navbar-hover-color: var(--tps-orange);
    --bs-navbar-active-color: var(--tps-orange);
    --bs-nav-link-font-size: 1.5rem;
    background-color: transparent;
}

.navbar .navbar-toggler {
    border: none;
}

.navbar .navbar-toggler:focus {
    box-shadow: none;
}

.navbar .offcanvas {
    width: 100%;
    --bs-body-bg: var(--tps-blue);
    --bs-body-color: white;
    border: none;
}

.navbar .btn-secondary {
    padding: .5rem 2rem;
}

.navbar .nav-item {
    text-align: center;
}

.navbar .nav-item.nav-button {
    margin-top: 1rem;
}

.navbar .navbar-nav .nav-link {
    --bs-nav-link-font-weight: var(--tps-medium-weight);
    --bs-nav-link-color: #fff;
    text-transform: uppercase;
    text-align: center;
}

.navbar .dropdown-menu {
    border: none;
    --bs-dropdown-link-active-bg: transparent;
    --bs-dropdown-link-hover-bg: transparent;
    margin: 0;
}

.navbar .dropdown-menu .dropdown-item.nav-link {
    font-size: 1rem;
    line-height: 1;
    margin-bottom: .4rem;
}

.navbar .dropdown-menu .dropdown-item.nav-link:last-of-type {
    margin-bottom: 0;
}

.navbar .dropdown-menu .dropdown-item.nav-link:active {
    background-color: white;
}

.navbar.nav-jobs .dropdown-item.nav-link.last:after {
  content: "";
  display: inline-block;
  width: 15px;
  height: 15px;
  margin-left: 0.5em;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30' fill='none'><g clip-path='url(%23clip0_486_11845)'><path fill-rule='evenodd' clip-rule='evenodd' d='M16.1925 6.5625C16.1925 6.31386 16.0937 6.0754 15.9179 5.89959C15.7421 5.72377 15.5036 5.625 15.255 5.625H2.8125C2.06658 5.625 1.35121 5.92132 0.823762 6.44876C0.296316 6.97621 0 7.69158 0 8.4375L0 27.1875C0 27.9334 0.296316 28.6488 0.823762 29.1762C1.35121 29.7037 2.06658 30 2.8125 30H21.5625C22.3084 30 23.0238 29.7037 23.5512 29.1762C24.0787 28.6488 24.375 27.9334 24.375 27.1875V14.745C24.375 14.4964 24.2762 14.2579 24.1004 14.0821C23.9246 13.9063 23.6861 13.8075 23.4375 13.8075C23.1889 13.8075 22.9504 13.9063 22.7746 14.0821C22.5988 14.2579 22.5 14.4964 22.5 14.745V27.1875C22.5 27.4361 22.4012 27.6746 22.2254 27.8504C22.0496 28.0262 21.8111 28.125 21.5625 28.125H2.8125C2.56386 28.125 2.3254 28.0262 2.14959 27.8504C1.97377 27.6746 1.875 27.4361 1.875 27.1875V8.4375C1.875 8.18886 1.97377 7.9504 2.14959 7.77459C2.3254 7.59877 2.56386 7.5 2.8125 7.5H15.255C15.5036 7.5 15.7421 7.40123 15.9179 7.22541C16.0937 7.0496 16.1925 6.81114 16.1925 6.5625Z' fill='%23EE9261'/><path fill-rule='evenodd' clip-rule='evenodd' d='M30.0002 0.9375C30.0002 0.688859 29.9014 0.450403 29.7256 0.274587C29.5498 0.098772 29.3113 0 29.0627 0L19.6877 0C19.4391 0 19.2006 0.098772 19.0248 0.274587C18.849 0.450403 18.7502 0.688859 18.7502 0.9375C18.7502 1.18614 18.849 1.4246 19.0248 1.60041C19.2006 1.77623 19.4391 1.875 19.6877 1.875H26.7996L11.524 17.1487C11.4368 17.2359 11.3676 17.3394 11.3205 17.4533C11.2733 17.5672 11.249 17.6892 11.249 17.8125C11.249 17.9358 11.2733 18.0578 11.3205 18.1717C11.3676 18.2856 11.4368 18.3891 11.524 18.4762C11.6111 18.5634 11.7146 18.6326 11.8285 18.6797C11.9424 18.7269 12.0644 18.7512 12.1877 18.7512C12.311 18.7512 12.433 18.7269 12.5469 18.6797C12.6608 18.6326 12.7643 18.5634 12.8515 18.4762L28.1252 3.20062V10.3125C28.1252 10.5611 28.224 10.7996 28.3998 10.9754C28.5756 11.1512 28.8141 11.25 29.0627 11.25C29.3113 11.25 29.5498 11.1512 29.7256 10.9754C29.9014 10.7996 30.0002 10.5611 30.0002 10.3125V0.9375Z' fill='%23EE9261'/></g><defs><clipPath id='clip0_486_11845'><rect width='30' height='30' fill='white'/></clipPath></defs></svg>");
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
  margin-bottom: 0.3em;
    
}

@media (min-width: 1200px) {
    .navbar {
        top: 3rem;
        background-color: transparent;
        --bs-nav-link-font-size: 18px; /* Bootstrap default */
    }

    .navbar .nav-item {
        --bs-nav-link-color: white;
        margin: auto 0;
    }

    .navbar .navbar-nav > .nav-item:not(:last-child) {
        margin-right: 1rem;
    }

    .navbar .nav-item .nav-link {
        margin-bottom: 0;
        text-align: left;
    }

    .navbar .nav-item.nav-button {
        margin-top: auto;
    }
}

/* FOOTER */
footer {
    border: 1rem solid white;
    background-color: var(--tps-blue);
    color: white;
    padding: 4rem 0 0;
    text-align: center;
    border-radius: var(--tps-border-radius-small);
}

footer .hover-effect {
    text-decoration: none;
    background-image: linear-gradient(var(--tps-orange), var(--tps-orange));
    background-position: 0% 100%;
    background-repeat: no-repeat;
    background-size: 0% 2px;
    transition: background-size .3s;
}

footer .hover-effect:hover,
footer .hover-effect:focus {
    background-size: 100% 2px;
}


@media (max-width: 992px) {
    footer h2 {
        margin-top: 1rem !important;
    }
}


footer p {
    color: #FFFFFF;
    opacity: 1;
}

.copyright p, .footer-intro {
    opacity: .6;
    font-size: 1rem;
    font-weight: 300;
}

.footer-bottom {
    display: flex;
    border-top: 1px solid var(--tps-dark-orange);
    justify-content: space-between;
}

.footer-bottom .extra, .footer-bottom .copyright {
    margin-top: 1rem;
}

.extra a {
    color: #FFFFFF;
    opacity: .6;
    font-size: 1rem;
    font-weight: 300;
}

.extra {
    display: flex;
    gap: 1rem;
}

.footer-socials {
    display: flex;
    justify-content: center;
    margin-bottom: 4rem;
    align-items: center;
}

.footer-socials img {
    width: 26px;
    height: 100%;
}

.footer-socials a:nth-child(1) {
    margin-right: 0.5rem;
}

.footer-socials a:nth-child(3) {
    margin-left: 0.5rem;
}

@media (min-width: 992px) {
    .footer-socials a:nth-child(1) {
        margin-right: 0rem;
    }

    .footer-socials a:nth-child(3) {
        margin-left: 0rem;
    }

    .footer-socials img {
        margin-left: 1rem;
    }

    .footer-socials {
        justify-content: end;
        margin-bottom: 1rem;
    }
}

.trustpilot {
    margin-bottom: 2rem;
    margin-top: 2rem
}

@media (min-width: 768px) {
    footer {
        text-align: start;
        border-width: 2rem;
    }

    .trustpilot {
        margin-bottom: 0;
    }
}

/* Remove whitespace */
.footer-adres {
    font-size: 0;
}

.footer-adres div {
    font-size: 1.1rem;
}


/* Header */
header {
    /* height: 70vh; */
    /* height: 70dvh; */
    height: calc(var(--vh, 1vh) * 70);
    min-height: 530px;
}

@media (max-width: 768px) {
    header:not(:has(form)) {
        height: calc(var(--vh, 0.3vh) * 70);
        min-height: 350px;
    }
}

header p {
    display: none;
    opacity: 1;
}

header h1 {
    text-transform: uppercase;
    font-size: 2.5rem;
    overflow-wrap: break-word;
}

@media (min-width: 992px) {
    header h1 {
        font-size: 4.5rem;
    }
}

header * {
    color: white;
}

header a {
    color: white !important;
}

header.header-vacancy .jquery-background-video-wrapper {
    background-size: cover;
    background-image: var(--cta-vacancy-intro-default-img);
}

body:has(header video) {
    overflow-x: hidden;
}

.my-background-video {
    width: 100% !important;
    height: 100% !important;
}

.header-full-height {
    /* height: 100vh;
    height: 100dvh; */
    height: calc(var(--vh, 1vh) * 100);
}

header .row,
header .container {
    height: 100%;
}

header .row {
    align-content: end;
    position: relative;
    bottom: 3rem;
}

@media (min-width: 768px) {
    header p {
        display: block;
    }

    .header-full-height {
        height: 90vh;
        height: 90dvh;
        max-height: 1320px;
    }

    header .row {
        bottom: 4rem;
    }

    .header-full-height > div.element-with-video-bg {
        max-height: 1320px;
    }
}

/* Header video */
.element-with-video-bg {
    position: absolute !important;
    width: 100%;
    height: 100%;
    margin: auto;
    left: 0;
    right: 0;
    top: 0;
    transition: 250ms;
    background-color: var(--tps-blue);
}

header:not(.header-full-height) .element-with-video-bg {
    height: calc(var(--vh, 1vh) * 70);
}

@media (max-width: 768px) {
    header:not(.header-full-height):not(:has(form)) .element-with-video-bg {
        height: calc(var(--vh, .55vh) * 70);
    }
}

@media (max-width: 768px) AND (max-height: 667px) {
    header:not(.header-full-height):not(:has(form)) .element-with-video-bg {
        height: calc(var(--vh, .85vh) * 70);
    }
}

@media(max-height: 650px){
    header:not(.header-full-height) .element-with-video-bg {
    height: calc(var(--vh, 1vh) * 80);
}
}
@media(max-height: 570px){
    header:not(.header-full-height) .element-with-video-bg {
    height: calc(var(--vh, 1vh) * 90);
}
}
.vacancy-ref .btn-light {
    padding: .5rem 1rem;
    border-radius: var(--tps-border-radius-big);
    font-weight: var(--tps-regular-weight);
    margin-right: 1.5rem;
}

@media (min-width: 768px) {
    .header-full-height .element-with-video-bg {
        height: 90%;
    }
}

/* INTRO SEARCH BAR */
header form {
    background-color: white;
    padding: 1.5rem;
    border-radius: var(--tps-border-radius-small);
}

header form input {
    color: black !important;
}

header .form-header button {
    padding-left: 4rem;
    padding-right: 4rem;
}

header .form-control {
    background-color: var(--tps-light-gray);
    padding: 1rem;
    border-radius: var(--tps-border-radius-small);
}

header .form-header .input-group {
    flex-direction: column;
    gap: 1rem;
}

header .form-header button,
header .form-header .form-control {
    width: 100%;
}

@media (min-width: 768px) {
    header .form-header .input-group {
        flex-direction: row;
    }

    header .form-control {
        padding: .5rem 1rem;
    }

    header .form-header button,
    header .form-header .form-control {
        width: auto;
    }
}

@media (max-width: 768px) {
    header.header-full-height .btn {
        width: 100%;
    }
        header.header-full-height a.btn + a.btn {
        margin-left: 0;
        margin-top: 1rem;
    }
}

header + section {
    margin-top: 2.5rem;
}

@media (min-width: 768px) {
    header + section {
        margin-top: 4rem;
    }
}

ul#autocomplete-results {
    background-color: white;
    opacity: 1;
    border-radius: 0.5rem;
    overflow: hidden;
}

ul#autocomplete-results .list-group-item {
    border-radius: 0;
    transition: background-color 0.2s ease;
}

ul#autocomplete-results .list-group-item.active {
    outline: none;
    /* box-shadow: 0 0 0 0.25rem rgba(130, 138, 145, 0.5); */
    /* box-shadow: 0 0 0 0.25rem rgba(238, 146, 97, 0.5); # orange */
    /* border-radius: .1rem; */
    
    color: white;
    background-color: var(--tps-orange);
    border-color: var(--tps-orange);
}

ul#autocomplete-results .list-group-item span {
    color: black;
}

ul#autocomplete-results .list-group-item:first-child {
    background-color: #f0f0f0;
    cursor: default;
}

ul#autocomplete-results .list-group-item:not(:first-child):hover {
    background-color: #D3D3D3;
    cursor: pointer;
}

ul#autocomplete-results .list-group-item svg{
    width: 22px;
    margin-right: 1rem;
}

ul#autocomplete-results .list-group-item:focus {
    outline: none;
    box-shadow: 0 0 0 0.25rem rgba(130, 138, 145, 0.5);
    border-radius: .1rem;
}


/* BREAD CRUMBS */
.breadcrumb-custom {
    --bs-breadcrumb-padding-x: 0;
    --bs-breadcrumb-padding-y: 0;
    --bs-breadcrumb-margin-bottom: 0;
    --bs-breadcrumb-item-padding-x: 0;
    --bs-breadcrumb-divider: '';
    
    background: rgba(26, 40, 47, 0.4);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-radius: 4px;
    display: inline-block;
    padding: 0.75rem;
    margin-bottom: 1rem;
}

.breadcrumb-custom .breadcrumb {
    margin: 0;
    padding: 0;
    background: transparent;
    display: flex;
    align-items: center;
    list-style: none;
}

.breadcrumb-custom .breadcrumb-item {
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0;
    /* line-height: 1; */
    text-transform: uppercase;
    height: 1em;
}

.breadcrumb-item a,
.breadcrumb-item span {
    text-decoration: none;
    color: white;
    text-transform: uppercase;
    font-weight: var(--tps-medium-weight);
    line-height: 1;
    transform: translateY(0.2rem);
}

.breadcrumb-custom .breadcrumb-item + .breadcrumb-item::before {
    content: "";
    width: 16px;
    height: 16px;
    display: inline-flex;
    align-items: center;
    /* margin: .95rem 0.75rem .55rem 0.75rem; */
    margin: 0 1rem;
    padding: 0;
    color: var(--tps-orange);

    background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.20579 14.4386L6.72283 12.9684L10.6156 9.07564H1.49414V6.91513H10.6156L6.72283 3.02876L8.20579 1.5522L14.649 7.99538L8.20579 14.4386Z' fill='%23EE9261'%3E%3C/path%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.breadcrumb-item a:focus-visible {
    outline: none;
    border: none;
}

.breadcrumb-item:has(a:focus-visible) {
    outline: none;
    box-shadow: 0 0 0 0.25rem rgba(130, 138, 145, 0.5);
    border-radius: .1rem;
}

/* BREAD CRUMB END */

/* VACANCY FILTERS */
.vacancy-filters .filter-toggle {
    border: none;
    outline: none;
    background: transparent;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0;
    margin-bottom: 0;
}

/* .vacancy-filters .filter-toggle:focus-visible {
    outline: none;
    box-shadow: 0 0 0 0.25rem rgba(130, 138, 145, 0.5);
    border-radius: .25rem;
} */

.vacancy-filters .bg-light {
  transition: box-shadow 0.15s ease-in-out;
}

.vacancy-filters .bg-light:has(.filter-toggle:focus-visible) {
  outline: none;
  box-shadow: 0 0 0 .25rem rgba(130, 138, 145, 0.5);
  border-radius: .25rem;
}

.vacancy-filters button[data-bs-toggle=collapse] {
    width: 100%;
    position: relative;
}

.vacancy-filters button[data-bs-toggle=collapse]:before {
    content: '';
    width: 16px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    background-image: url("data:image/svg+xml,%3Csvg width='17' height='17' viewBox='0 0 17 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.699219' y='7.30859' width='16' height='3' fill='%23EE9261'/%3E%3Crect x='10.1992' y='0.808594' width='16' height='3' transform='rotate(90 10.1992 0.808594)' fill='%23EE9261'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: center;
}

.vacancy-filters button[data-bs-toggle=collapse][aria-expanded=true]:before {
    background-image: url("data:image/svg+xml,%3Csvg width='17' height='4' viewBox='0 0 17 4' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.699219' y='0.046875' width='16' height='3' fill='%23EE9261'/%3E%3C/svg%3E%0A");
}

.vacancy-filters h2,
.vacancy-filters button.h5 {
    margin-bottom: 0;
}

/* VACANCY OVERVIEW */
.vacancy-overview .vacancy-row {
    box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.15);
    padding: 1.5rem;
    position: relative;
    margin-bottom: 1.5rem;
}

.vacancy-overview .new-label {
    background-color: var(--tps-dark-blue);
    color: white;
    text-transform: uppercase;
    font-size: .8rem;
    padding: 0.25rem 0.75rem;
    border-radius: 2px;
}

.vacancy-overview .favorite-job {
    position: absolute;
    right: 0.75rem;
    top: 0.75rem;
    z-index: 2;
    border-radius: 100%;
    transition: box-shadow 0.15s ease-in-out;
}

.vacancy-overview .favorite-job:focus-visible {
  outline: none;
  box-shadow: 0 0 0 0.25rem rgba(238, 146, 97, 0.5);
  border-radius: 100%;
}

.vacancy-overview .vacancy-row .link {
    opacity: 0;
    transition: opacity .3s;
    font-weight: bold;
    border-bottom: 1px solid var(--tps-orange);
    display: none;
}

.vacancy-overview .vacancy-row:hover .link {
    opacity: 1;
}

.vacancy-overview .apply-button-wrapper, .vacancy-overview .apply-button-wrapper .btn {
    width: 100%;
}

@media (min-width: 768px) {
    .vacancy-overview .vacancy-row .link {
        display: block;
    }

    .vacancy-overview .apply-button-wrapper, .vacancy-overview .apply-button-wrapper .btn {
        width: auto;
    }
}

/* VACANCY OVERVIEW USP's */
.vacancy-overview-usp {
    background-color: #EE926120;
    border-radius: 2px;
    height: 150px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 0.5rem;
}

.vacancy-overview-usp p {
    margin-bottom: 0;
    line-height: 1.2;
    opacity: 1;
}

.vacancy-overview-usp i {
    color: var(--tps-orange);
}

@media (min-width: 992px) {
    .vacancy-overview-usp {
        padding: 1rem;
    }
}

/* VACANCY UNAVAILABLE MESSAGE */
.vacancy-archived-message-container {
    width: 100%;
    height: 100%;
    z-index: 1020;
    top: 3rem;
}

.vacancy-archived-message-container .message-wrapper {
    padding: 2rem;
    background-color: white;
}

.vacancy-archived-overlay {
    position: fixed;
    height: 100%;
    width: 100%;
    background-color: rgba(6, 40, 66, 0.7);
    top: 0;
    left: 0;
    z-index: 1020;
}

@media (min-width: 992px) {
    .vacancy-archived-message-container {
        top: 10rem;
    }
}

/* FORMS */
.hide-input {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.form-control {
    background-color: #E7EBED;
    border-radius: 0;
}

.form-control:focus {
    box-shadow: none;
    background-color: #E7EBED;
    border-color: #E7EBED;
}

.form-check-input[type=checkbox] {
    border-color: var(--tps-blue);
    border-radius: 0;
    background-color: transparent;
}

.form-check-label {
    opacity: .6;
    color: var(--tps-dark-blue);
}

textarea.form-control {
    min-height: 150px !important;
}

textarea.form-control#working_experience + label[for="working_experience"] {
    white-space: break-spaces;
}

.form-control + label {
    line-height: 1.35;
    color: #657D8F;
}

.form-check-input:checked {
    background-color: var(--tps-orange);
    border-color: var(--tps-orange);
}

.form-check-input:focus {
    box-shadow: 0 0 10px var(--tps-orange);
}

.form-floating > label {
    padding: 1rem 1.5rem;
}

.form-floating > .form-control:focus ~ label::after,
.form-floating > .form-control:not(:placeholder-shown) ~ label::after,
.form-floating > .form-control-plaintext ~ label::after,
.form-floating > .form-select ~ label::after {
    color: #657D8F;
    background-color: transparent;
}

.form-floating > select.form-control:not(:placeholder-shown) ~ label {
    transform: scale(0.85) translateY(-0.5rem) translateX(1rem);
}

.form-floating > .form-control:not(:placeholder-shown) ~ label {
    background: transparent;
    height: auto;
    padding-bottom: 1px;
}

select.form-control.default {
    color: #657D8F;
}

.file-wrapper {
    background-color: #E7EBED;
    width: 100%;
    height: 60px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
}

.custom-file-input input[type="file"] {
    position: absolute;
    opacity: 0;
    z-index: -1;
    cursor: pointer;
}

.custom-file-input button {
    background-color: transparent;
    border: none;
    color: #657D8F;
    width: 100%;
    padding-left: 1.5rem;
    height: 100%;
    text-align: left;
    line-height: 1;
}

.custom-file-input label {
    height: 100%;
    padding: 0 1.5rem;
    background-color: #858585;
    color: #ffffff99;
    cursor: pointer;
    width: auto;
    text-wrap: nowrap;
    display: flex;
    align-items: center;
}

.file-name {
    margin-left: 1.5rem;
    display: inline-block;
    font-size: 17px;
    color: #657D8F;
}

.form-floating > .form-control {
    padding-left: 1.4rem;
}

.custom-file-input label span:last-of-type {
    background-color: #858585;
    color: #FFFFFF;
    cursor: pointer;
    height: 100%;
    display: flex;
    align-items: center;
    width: 190px;
    padding: 10px;
    font-size: 1rem;
}

/* APPLICATION FORM */
.application-form {
    padding: 2.5rem 0;
    background-color: white;
    box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.15);
}

.application-form .iti {
    width: 100%;
}

.application-form .iti__selected-country {
    padding-left: 12px;
}

.application-form #phone {
    height: 58px;
    padding-left: 60px !important;
}

section:has(.application-form) {
    margin: 10rem 0;
}

/* BRANCH HIGHLIGHTS */
.branch-highlight-wrapper {
    margin-bottom: 1rem;
    position: relative;
}

.branch-highlight {
    box-shadow: 0 0 16px 0 #00000026;
    max-width: inherit;
    border: none;
    aspect-ratio: 1/1;
}

.branch-title {
    position: absolute;
    margin-left: 1rem;
    bottom: 0;
    z-index: 1;
}

.branch-title p {
    opacity: 1;
    line-height: 30px;
    color: #FFFFFF;
    font-size: 1.5rem;
    font-weight: 900;
    font-family: var(--bs-body-font-family);
    margin-left: -12px;
    white-space: normal;
    hyphenate-character: auto;
    hyphens: auto;
}

@media (min-width: 768px) {
    .branch-title p {
        margin-left: 0;
    }
}

.overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: linear-gradient(#00000030, #00000030);
}

.branch-highlight {
    overflow: hidden;
}

@media (min-width: 768px) {
    .branch-highlight {
        height: 220px;
        aspect-ratio: initial;
    }
}

.branch-link .branch-highlight-image {
    transition: 0.3s;
    min-height: 220px;
    object-fit: cover;
    transform: scale(1.25);
}

.branch-link:hover .branch-highlight-image {
    transform: scale(1.15);
}

/* LOGO SLIDER */
.logo-slider img {
    /* animation: scroll 30s linear infinite; */
  /*   width: 150px;
  height: 150px; */
    object-fit: contain;
    margin: 0 3em;
}

/* .logo-slider .slide-track {
    width: 100%;
    display: flex;
    gap: 6em;
    overflow: hidden;
} */

.logo-slider .slider {
    background-color: whitesmoke;
}

@keyframes scroll {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translatex(-1000%)
    }
}

/* PARTNERSHIP SLIDER */
.partnership-slider .flickity-viewport {
    transition: height .15s;
}

.partnership-slider .slide .logo {
    max-width: 125px;
    max-height: 165px;
    object-fit: contain;
    margin-bottom: 1.5rem;
}

.partnership-slider .flickity-button {
    display: none;
}

.partnership-slider .flickity-page-dots {
    bottom: 20px;
}

.partnership-slider .flickity-page-dots .dot {
    background-color: #BCC6CE;
    border-radius: 0;
    opacity: 1;
    margin: 0 0.35rem;
}

.partnership-slider .flickity-page-dots .dot.is-selected {
    background-color: var(--tps-orange);
}

@media (min-width: 768px) {
    .partnership-slider .slide {
        width: 80%;
        margin: 0 10%;
    }

    .partnership-slider .slide .logo {
        max-width: 175px;
        max-height: 230px;
    }

    .partnership-slider .flickity-button {
        display: initial;
        border-radius: 2px;
        background-color: var(--tps-blue);
        color: white;
    }

}

@media (min-width: 1200px) {
    .partnership-slider .slide {
        width: 60%;
        margin: 0 20%;
    }
}

/* LATEST NEWS */
.latest-news {
    margin: 1.5rem 0;
}

.latest-news:after {
    content: 'flickity';
    display: none;
}

.latest-news .article {
    text-align: start;
    --bs-card-inner-border-radius: 2px;
    --bs-card-border-color: transparant;
    --bs-card-height: 100%;
    --bs-card-cap-bg: #fff;
    height: 520px;
    margin-left: 10px;
    margin-right: 10px;
}

.latest-news .article .overflow-hidden {
    height: 232px;
    min-height: 232px;
    display: flex;
}

.latest-news .article .overflow-hidden img {
    height: 232px !important;
    max-height: 232px;
    object-fit: cover;
}

.latest-news .article .link {
    color: var(--tps-dark-blue);
    text-decoration: underline;
    text-decoration-color: var(--tps-dark-orange);
    text-decoration-thickness: 2px;
    opacity: 1;
    font-weight: 600;
    text-underline-offset: 10px;
}

.latest-news .article {
    box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.15);
    margin-left: 0;
    margin-right: 0;
    transition: 250ms box-shadow;
}

.latest-news .article:hover {
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.15);;
}

.latest-news .article .label {
    position: absolute;
    right: 0;
    bottom: -1px;
    border-radius: 8px 0 0 0;
    background: rgba(238, 146, 97, 0.60);
    backdrop-filter: blur(3.5px);
    color: #fff;
    width: 100px;
    text-align: center;
}

.latest-news .article .card-title {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.latest-news .article .card-text {
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.article .card-footer {
    margin-bottom: 10px;
}

@media ( min-width: 768px ) {
    .latest-news:after {
        content: '';
    }
}

/* QUOTE SLIDER */
.quote-title, .quote-signoff {
    color: #FFFFFF;
}

.quote-content {
    font-weight: 300;
}

.quote-content p {
    margin-bottom: 0;
}

.quote-slide {
    margin: 0 1rem;
    width: 100%;
}

.quote-content-wrapper {
    padding: 0;
}

.quote-image-wrapper {
    position: relative;
    height: 100%;
    display: flex;
    padding-top: 6rem;
}

@media (min-width: 321px) {
    .quote-image-wrapper {
        padding-top: 0;
    }
}

.quote-image {
    height: 400px;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    object-fit: cover;
}

@media (min-width: 768px) {
    .quote-image {
        height: 600px;
    }

    .quote-slider {
        height: 600px;
    }


    .quote-slide {
        margin: 1rem 2rem 3rem 0;
        width: unset;
    }
}

.quote-slider .flickity-page-dots {
    display: none;
}

@media (min-width: 768px) {
    .quote-slider .flickity-page-dots {
        display: flex;
        justify-content: center;
        position: absolute;
        left: -290px;
        bottom: 150px;
    }
}

@media (min-width: 992px) {
    .quote-slider .flickity-page-dots {
        left: -184px;
        bottom: 60px;
    }
}

@media (min-width: 1200px) {
    .quote-slider .flickity-page-dots {
        left: -225px;
        bottom: 105px;
    }
}

@media (min-width: 1400px) {
    .quote-slider .flickity-page-dots {
        left: -273px;
    }
}

.quote-slider .flickity-page-dots .dot {
    width: 10px;
    height: 10px;
    background-color: #ffffff;
    border-radius: 0;
    margin: 0 8px;
    cursor: pointer;
    opacity: 1;
}

.quote-slider .flickity-page-dots .dot.is-selected {
    background-color: #EE9261;
}

.quote-signoff-wrapper {
    position: relative;
    bottom: unset;
    margin-top: 2rem;
    flex-direction: column;
}

.quote-button {
    bottom: 30px;
    width: auto;
    right: 30px;
    position: absolute;
    z-index: 1;
}

@media (min-width: 992px) {
    .quote-image {
        position: absolute;
    }

    /*     .quote-signoff-wrapper {
        display: flex;
        position: absolute;
        bottom: -100px;
    } */
}

/* cta-block */

.cta-wrpr {
    display: flex;
    justify-content: center;
}

@media (min-width: 768px) {
    .cta-wrpr {
        display: block;
    }
}

.cta-block-wrapper {
    display: flex;
    align-items: center;
    border: none;
    box-shadow: 0 0 16px 0 #00000026;
    margin-bottom: 1rem;
}

@media (min-width: 992px) {
    .cta-block-wrapper {
        margin-bottom: 0;
    }
}

.cta-block {
    width: inherit;
    min-height: 200px;
    line-height: 25px;
    column-gap: 10px;
    text-align: center;
}

.cta-block img {
    margin-bottom: 12px;
}

/* Latest vacancies */
.latest-vacancy-slider .flickity-viewport {
    overflow: hidden;
}

.latest-vacancy-slide {
    margin: 0 1rem;
}

.latest-vacancy-slide .tag {
    --bs-nav-pills-link-active-color: var(--tps-dark-blue);
}

.latest-vacancy-slide .card {
    border: none;
    border-radius: var(--tps-border-radius-small);
    box-shadow: 0 0 16px 0 #00000026;
    margin-bottom: 10px;
}

.latest-vacancy-slide .card-body {
    padding: 1rem;
}

.latest-vacancy-slide .card-header {
    padding-left: 5px;
    padding-right: 0.5rem;
}

.latest-vacancy-slide .card-header, .latest-vacancy-slide .card-footer {
    background-color: transparent;
    border: none;
}

.latest-vacancy-slide .card-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 2rem;
    padding-left: 5px;
}

.card-carousel .flickity-page-dots,
.latest-vacancy-slider .flickity-page-dots,
.review-slider .flickity-page-dots{
    display: flex;
    justify-content: space-between;
    align-items: center;
    list-style: none;
    padding: 0;
    margin: 0;
    width: 100%;
    bottom: 28px;
}

.card-carousel .flickity-page-dots .dot,
.latest-vacancy-slider .flickity-page-dots .dot,
.review-slider .flickity-page-dots .dot {
    flex: 1;
    height: 3px;
    background-color: #fff;
    border-radius: 0;
    opacity: 1;
    margin: 0;
}

.review-slider .flickity-page-dots .dot {
    background-color: #E7EBED;
}

.card-carousel .flickity-page-dots .dot.is-selected,
.latest-vacancy-slider .flickity-page-dots .dot.is-selected,
.review-slider .flickity-page-dots .dot.is-selected {
    background-color: var(--tps-orange);
}

.latest-vacancy-slide .card-footer .btn {
    width: 250px;
}

.latest-vacancy-slide .vacancy-info {
    padding-left: 5px;
}

.latest-vacancy-slide .vacancy-info p {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 7;
    line-clamp: 7;
    -webkit-box-orient: vertical;
}

.button-end-wrapper {
    display: flex;
}

.hover-link {
    display: none;
}

@media (min-width: 992px) {
    .button-end-wrapper {
        justify-content: end;
    }

    .latest-vacancy-slide .card-footer .btn {
        width: auto;
    }

    .hover-link {
        display: block;
    }

    .latest-vacancy-slide .hover-link {
        text-decoration: underline 2px;
        text-decoration-color: var(--tps-orange);
        color: var(--tps-dark-blue);
        font-weight: bold;
        opacity: 0;
        height: 0;
        overflow: hidden;
        transition: opacity 0.2s ease, height 0.2s ease;
    }

    .latest-vacancy-slide:hover .hover-link {
        opacity: 1;
        height: auto;
    }

}

.vacancy-tags {
    display: inline-block;
    text-align: center;
}

.vacancy-tags .tag, .tag.active {
    background-color: var(--tps-light-gray) !important;
    color: var(--tps-dark-blue);
    border-radius: 1.375rem;
    font-weight: 300;
}

.vacancy-tags.blur .tag {
    background: linear-gradient(0deg, rgba(32, 59, 76, 0.20) 0%, rgba(32, 59, 76, 0.20) 100%), url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=), lightgray 50% / cover no-repeat;
    backdrop-filter: blur(10px);
}

header .vacancy-tags.blur .tag {
    color: white;
}

.col-12:has(.big-image) {
    padding-left: 0;
    padding-right: 0;
}

.big-image {
    width: inherit;
}

/* Team member overview */
.team-member-overview-wrapper .team-card .card-body, .project-overview-wrapper .team-card .card-body {
    text-align: center;
}

/* .team-member-overview-wrapper:not(.project-overview-wrapper.team-member-overview-wrapper) .col-12:nth-child(even) .team-card .card-body, */
.reference-wrapper .col-12:nth-child(odd) .article-img-wrapper,
    /* .team-member-overview-wrapper:not(.project-overview-wrapper.team-member-overview-wrapper) .col-12:nth-child(n+5):nth-child(odd) .team-card .card-body, */
.team-member-overview-wrapper:not(.project-overview-wrapper.team-member-overview-wrapper) .col-12.light .team-card .card-body
{
    background-color: var(--tps-light-gray);
}

/* .team-member-overview-wrapper:not(.project-overview-wrapper.team-member-overview-wrapper) .col-12:nth-child(odd) .team-card .card-body, */
.reference-wrapper .col-12:nth-child(even) .article-img-wrapper,
    /* .team-member-overview-wrapper:not(.project-overview-wrapper.team-member-overview-wrapper) .col-12:nth-child(n+5):nth-child(even) .team-card .card-body, */
.team-member-overview-wrapper:not(.project-overview-wrapper.team-member-overview-wrapper) .col-12.darker .team-card .card-body{
    background-color: #FDF4EF;
}

.reference-wrapper .article .overflow-hidden img {
    object-fit: contain;
    max-width: 80%;
    max-height: 80%;
}

@media (max-width: 767px) {
    .team-member-overview-wrapper .flickity-prev-next-button {
        bottom: -10px;
        
    }
    
    .team-member-overview-wrapper .flickity-prev-next-button.previous {
        left: 0px;
    }
    
    .team-member-overview-wrapper .flickity-prev-next-button.next {
        right: 0px;
    }
    
    .team-member-overview-wrapper .flickity-page-dots {
        bottom: 0;
    }
}

@media (min-width: 768px) {
    
    .team-member-overview-wrapper .flickity-prev-next-button.previous {
        left: -50px;
    }
    
    .team-member-overview-wrapper .flickity-prev-next-button.next {
        right: -50px;
    }
}

@media (min-width: 992px) {
    .team-member-overview-wrapper .flickity-prev-next-button, .team-member-overview-wrapper .flickity-page-dots {
        display: none;
    }
}

@media (max-width: 768px) {
    .team-member-overview-wrapper:not(.project-overview-wrapper.team-member-overview-wrapper) .col-12:nth-child(odd) .team-card .card-body {
        background-color: #FDF4EF;
    }

    .team-member-overview-wrapper:not(.project-overview-wrapper.team-member-overview-wrapper) .col-12:nth-child(even) .team-card .card-body {
        background-color: var(--tps-light-gray);
    }
}

.team-card {
    margin-bottom: 3rem;
}

.team-card .card-body {
    padding: 5rem 0 0;
}

.team-name,
.team-role {
    margin-bottom: 0;
}

.team-role {
    font-size: 1rem;
}

.project-overview-wrapper .team-story-card .card-body {
    padding: 0 !important;
    display: flex;
    justify-content: center;
}

.project-overview-wrapper .team-card .team-img {
    object-fit: cover;
}

.project-overview-wrapper .team-story-card .team-card {
    min-height: 100%;
}

.team-story-card .card-body {
    padding: 2rem 0 0;
}

.team-story-card .team-card {
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.15);
    transition: 250ms box-shadow;
}

.team-story-card .team-card:hover {
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.15);;
}

.team-story-description,
.reference-description {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    line-clamp: 4;
    -webkit-box-orient: vertical;
}

.reference-description {
    -webkit-line-clamp: 3;
    line-clamp: 3;
}

.team-card, .team-card .card-body {
    border: none;
    border-radius: var(--tps-border-radius-small);
}

.team-card .card-footer {
    border: none;
    background-color: transparent;
    padding-left: 0;
    padding-top: 1rem;
}

.team-story-card .card-footer {
    padding: 1rem;
}

.team-card .team-img {
    max-height: 400px;
}

@media (min-width: 768px) {
    .team-card .team-img {
        max-height: 305px;
    }
}

.team-number, .team-email, .team-function {
    text-decoration: underline;
    text-decoration-color: var(--tps-dark-blue);
    text-decoration-skip-ink: none;
    font-size: 1rem;
}

.team-card .link {
    font-weight: bold;
    border-bottom: 1px solid var(--tps-orange);
    color: var(--tps-dark-blue);
    font-size: 1rem;
}

.team-function {
    text-decoration: none;
    color: var(--tps-orange);
}

.team-socials .social-media-icon {
    width: 25px;
    height: 25px;
}

.team-slide {
    padding: 1rem;
}

@media (min-width: 762px) {
    .team-slide {
        padding: 0 calc(var(--bs-gutter-x) * 0.5);

    }
}


.cta-team-wrapper {
    display: flex;
    width: 100%;
    justify-content: end;
    max-width: 360px;
    border-radius: var(--tps-border-radius-small);
    background-color: rgba(238, 146, 97, 0.4);
    height: 100%;
    min-height: 315px;
    position: relative;
    margin-bottom: 1rem;
}

.cta-team-wrapper img {
    position: absolute;
    bottom: 0;
    max-width: 360px;
    width: 100%;
}

.cta-team-info {
    padding: 1.5rem;
    border-radius: var(--tps-border-radius-small);
}

.cta-team-info h5 {
    margin-bottom: 0;
}

.cta-team-info p {
    opacity: 1;
}

.cta-team-info-link {
    text-decoration: underline;
    text-decoration-color: var(--tps-orange);
    text-decoration-skip-ink: none;
    color: var(--tps-dark-blue);
}

.cta-team-button {
    margin-top: 2rem;
}

.cta-team-contact-info {
    display: flex;
    flex-direction: column;
}

.contact-card-cta-row {
    width: 100%;
    margin: 0;
    margin-top: 2rem;
}

.cta-team-image-wrapper {
    margin-bottom: 1rem;
}

@media (min-width: 1200px) {
    .cta-team-image-wrapper {
        margin-bottom: 0
    }
}

.contact-card-cta-row .col-12:has(.cta-team-wrapper) {
    display: flex;
    justify-content: center;
}

@media (min-width: 992px) {
    .cta-team-wrapper {
        margin-bottom: 0;
    }

    .cta-team-contact-info {
        display: block;
    }

    .cta-team-contact-info a {
        margin-right: 1rem;
    }


}

@media (min-width: 1200px) {
    .contact-card-cta-row .col-12:has(.cta-team-wrapper) {
        justify-content: end;
    }
}

/* CARD CAROUSEL */
.col-12:has(.card-carousel) {
    overflow: hidden;
}

.card-carousel {
    margin: 1rem 0;
}

.card-carousel i {
    font-size: 1.5rem;
    color: var(--tps-orange);
}

.card-carousel p:last-child {
    margin-bottom: 0;
}

.card-carousel .flickity-viewport {
    overflow: initial;
}

.card-carousel .flickity-page-dots .dot {
    background: rgba(15, 51, 80, 0.10);
}

/* Vacancy detail */
.vacancy-sum li {
    list-style-image: url('../img/icons/check.svg');
    opacity: 0.8;
    color: var(--tps-blue)
}

.vacancy-sum.block li {
    list-style-image: url('../img/icons/blockcheck.svg');
    opacity: 0.8;
    color: var(--tps-blue);
}

.vacancy-detail-slide {
    width: 415px;
    margin-right: 1.25rem;
    min-height: 100%;
}

.vacancy-detail-slider-card {
    border: none;
    box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.15);

}

.vacancy-detail p {
    opacity: 0.8;
    color: var(--tps-blue);
}

.progress-bar {
    height: 4px;
    border-radius: 1rem;
    background-color: var(--tps-light-gray);
    position: relative;
}

.progress-bar {
    width: calc(100% - 12px);
}

.progress-bar-wrapper {
    margin-top: 1rem;
    position: relative;
    width: 100%;
    overflow: hidden;
}

.progress-bar-wrapper .row {
    --bs-gutter-y: 1rem;
}

@media (min-width: 768px) {
    .progress-bar {
        width: 100%;
        max-width: 800px;
    }
}

.progress-bar-percentage {
    background-color: var(--tps-orange);
    transition: 250ms width;
    height: 100%;
    width: 0;
}

.vacancy-detail-contact {
    max-width: 305px;
    border: none;
    position: sticky;
    top: 10px;
}

.vacancy-detail-contact .card-header {
    background-color: var(--tps-orange);
    border: none;
    padding: 0;
    width: 100%;
}

.vacancy-detail-contact .card-header img {
    width: inherit;
}

.vacancy-detail-contact .card-body, .vacancy-detail-contact .card-footer {
    background-color: var(--tps-light-gray);
    border: 0;
}

.vacancy-detail-contact .cta-team-contact-info {
    display: flex;
}

@media (max-width: 992px) {
    .col-12:has(.vacancy-detail-contact) {
        display: flex;
        justify-content: center;
        margin-bottom: 1rem;
    }
}

/* LAZY LOADING */
.blur-up {
    -webkit-filter: blur(5px);
    filter: blur(5px);
    transition: filter 300ms 500ms, -webkit-filter 300ms 500ms;
}

.blur-up.lazyloaded {
    -webkit-filter: blur(0);
    filter: blur(0);
}

.application-form-overlay {
    position: relative;
}

.application-form-overlay:after {
    content: '';
    width: 100%;
    height: 80px;
    background-color: red;
    position: absolute;
    background-color: var(--tps-blue);
    border-top-left-radius: var(--tps-border-radius-small);
    border-top-right-radius: var(--tps-border-radius-small);
    opacity: .1;
}

.application-form-overlay:not(.bottom):after {
    margin-top: -80px;
}

.application-form-overlay.bottom:after {
    transform: rotate(180deg);
}

.input-group:not(.has-validation) > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu):not(.form-floating) {
    border-radius: var(--tps-border-radius-small);
    border: none;
}

.input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
    margin-left: calc(var(--bs-border-width) * -1);
    border-top-left-radius: var(--tps-border-radius-small);
    border-bottom-left-radius: var(--tps-border-radius-small);
}

/* LOADING SPINNER */
@keyframes ldio-w41d9ds3bfn {
    0% {
        transform: translate(-50%, -50%) rotate(0deg);
    }
    100% {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}

.ldio-w41d9ds3bfn div {
    position: absolute;
    width: 60px;
    height: 60px;
    border: 10px solid #ee9261;
    border-top-color: transparent;
    border-radius: 50%;
}

.ldio-w41d9ds3bfn div {
    animation: ldio-w41d9ds3bfn 1s linear infinite;
    top: 50px;
    left: 50px
}

.loadingio-spinner-rolling-ptm5zrcjebr {
    width: 70px;
    height: 70px;
    display: inline-block;
    overflow: hidden;
    background: #ffffff;
}

.ldio-w41d9ds3bfn {
    width: 100%;
    height: 100%;
    position: relative;
    transform: translateZ(0) scale(0.7);
    backface-visibility: hidden;
    transform-origin: 0 0; /* see note above */
}

.ldio-w41d9ds3bfn div {
    box-sizing: content-box;
}

figure.quote {
    border-left: .4rem solid #ee9261;
    padding-left: 1.25rem;
    margin: 2rem 0 2rem 1.5rem;
}

figure.quote blockquote {
    font-style: italic;
}

figure.quote .blockquote-footer {
    font-size: 1rem;
}

.form-floating > .form-control:focus ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-control-plaintext ~ label, .form-floating > .form-select ~ label {
    color: #657D8F;
}

/* POPOVER */
.custom-popover {
    --bs-popover-max-width: 450px;
    --bs-popover-border-color: var(--tps-dark-blue);
    --bs-popover-header-bg: var(--tps-dark-blue);
    --bs-popover-header-color: white;
}

.application-banner {
    text-align: center;
    padding: 2.5rem 0;
    box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.15);
}

.application-banner h2 {
    font-size: 3.5rem;
}

@media (max-width: 768px) {
    .mobile-padding-top {
        padding-top: 3rem !important;
    }
}

#CookiebotWidget :focus-visible, #CookiebotWidget:not(.CookiebotWidget-open) .Cookiebotwidget-logo {
    outline: none !important;
    outline-offset: 0 !important;
}

@media (min-width: 768px) {
    .apply-now-mobile-btn {
        display: none !important;
    }
}

.apply-now-mobile-btn {
    position: fixed;
    bottom: 1rem;
    left: 0;
    right: 0;
    margin: auto;
    width: 60vw;
    z-index: 10;
}

.apply-now-mobile-btn a {
    width: 100%;
}

@media (max-width: 768px) {
    .services-layout .branch-link .branch-highlight-image {
        max-height: 100px;
        min-height: unset;
    }
    
    .services-layout .branch-highlight {
        height: 100px;
        width: 100%;
    }
    
    .services-layout .branch-title {
        position: relative;
        margin-left: 2.25rem;
    }
    
    .services-layout .branch-link {
        display: flex;
        align-items: center;
        justify-content: left;
        flex-direction: row-reverse;
    }
    
    .services-layout .branch-link .branch-desc p {
        font-size: .875rem;
        font-weight: normal;
        line-height: 1;
    }
    
    .services-layout .branch-title p {
        color: var(--tps-blue);
    }
    
    .services-layout .branch-title p {
        font-size: 1.25rem;
        margin-bottom: .5rem;
    }
    
    .services-layout .card {
        border-radius: 0;
    }
}

.sticky-nav .navbar {
    transition: 0.5s;
    opacity: 1;
}

.sticky-nav .hide {
    opacity: 0;
    visibility: hidden;
}

.sticky-nav .fade-in {
    opacity: 1;
    visibility: visible;
}

.sticky-nav .navbar.fixed {
    position: fixed;
    top: 0;
}

@media (min-width: 992px) {
    .sticky-nav .navbar.fixed {
        position: fixed;
        top: 1rem;
    }   
}

.sticky-nav .navbar.fixed.show {
  opacity: 1;
}

.sticky-nav .navbar.fixed .container {
    background-color: #062842bf;
    border-radius: 1rem;
    padding: 1rem;
}

@media (max-width: 992px) {
    .sticky-nav .navbar.fixed .container {
        margin: 0 .5rem;
    }
}

section p a img:not(.img-fluid) {
    max-width: 100%;
    height: auto;
}


/* VERTICAL TIMELINE */
section:has(.progress-line) {
    overflow-x: hidden;
}

.progress-line {
    position: absolute;
    display: flex;
    height: 100%;
    z-index: -1;
}

.progress-line .progress-highlight {
    display: block;
    position: absolute;
    background-color: var(--tps-blue);
    width: 4px;
    height: 80px;
    top: 0;
    z-index: 1;
}

.progress-line .point {
    position: relative;
    /* margin-left: -8px; */
}

.point::before {
    z-index: 2;
    position: absolute;
    left: -44px;
}

.point::before {
    background-color: var(--tps-orange);
    content: attr(data-year);
    font-size: 1.75rem;
    border-radius: 50%;
    font-weight: bold;
    height: 90px;
    width: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.point.past::before {
    background-color: var(--tps-blue) !important;
    color: var(--tps-orange);
}

.vr {
    background-color: #D9D8D9;
    width: 4px;
    opacity: 1;
    z-index: 0;
}

.vertical-timeline {
    position: relative;
}

.vertical-timeline .timeline-item {
    text-align: start;
    margin-bottom: 1.5rem;
}

.vertical-timeline .timeline-item .timeline-title {
    color: white;
    font-weight: 400;
    font-size: 2rem;
    background-color: var(--tps-orange);
    padding: 1rem;
    border-radius: 4px;
}

.vertical-timeline .timeline-item p {
    font-size: 1rem;
}

@media (min-width: 992px) {
    .progress-line {
        left: 50%;
    }
}

/* FAQ */

.accordion {
    --bs-accordion-active-bg: var(--tps-orange);
    --bs-accordion-border-color: unset;
}

.accordion-button {
    color: var(--tps-blue);
    background-color: var(--tps-light-orange);
    font-weight: var(--tps-bold-weight);
    font-size: 1.25rem;
}

.accordion-button:not(.collapsed) {
    color: var(--tps-blue);
}

.accordion-button:focus {
    box-shadow: none;
}

.accordion-button::after {
    background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 6L9.7146 13.7148L17.4294 6' stroke='black' stroke-width='2'/%3E%3C/svg%3E%0A");
}

.accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 6L9.7146 13.7148L17.4294 6' stroke='black' stroke-width='2'/%3E%3C/svg%3E%0A");
}

.accordion-item:first-of-type .accordion-button, .accordion-item:last-of-type .accordion-button.collapsed {
    border-radius: 2px 2px 0 0;
}

.accordion-item {
    border-radius: 2px;
}

.accordion-item .accordion-body > * {
    opacity: 1 !important;
    color: var(--bs-accordion-color) !important;
}

.accordion-item:has(.accordion-button[aria-expanded="true"]) {
    box-shadow: 0 0 16px rgba(0, 0, 0, 0.15);
}

.accordion-item .accordion-body > *:last-child {
  margin-bottom: 0;
}

/* Category selector */
.category-selector-item {
    background-color: var(--tps-light-gray);
    color: var(--tps-blue);
    font-weight: var(--tps-medium-weight);
    font-size: 1.125rem;
    padding: 10px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s ease;
    text-wrap: nowrap;
}

.category-selector-item:not(.active):hover {
    box-shadow:inset 0px 0px 0px .25rem var(--tps-light-gray);
    background-color: transparent;
    
}

.category-selector-item:not(.active) {
    box-shadow:inset 0px 0px 0px .25rem transparent;
    background-color: var(--tps-light-gray);
    
}

.category-selector-item.active {
    background-color: var(--tps-orange);
    color: white;
}

.category-selector-item.active:hover:not([data-category="all"]) {
    background-color: var(--tps-dark-orange);
}

.category-selector-item[data-category="all"].active {
    cursor: default;
}

/* Category selector horizontal scroll for mobile */
@media (max-width: 992px) {
    .category-selector-wrapper {
        position: relative;
    }

    #accordionCategorySelector {
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        -ms-overflow-style: none;
        padding-bottom: 10px;
        /* Remove scroll-behavior: smooth if it's causing issues */
    }

    #accordionCategorySelector::-webkit-scrollbar {
        display: none;
    }

    .category-selector-wrapper::before,
    .category-selector-wrapper::after {
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        width: 2rem;
        z-index: 10;
        pointer-events: none;
        opacity: 0;
        transition: opacity 0.3s ease;
    }

    .category-selector-wrapper::before {
        left: 0;
        background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
    }

    .category-selector-wrapper::after {
        right: 0;
        background: linear-gradient(to left, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
    }

    .category-selector-wrapper.show-left-fade::before {
        opacity: 1;
    }

    .category-selector-wrapper.show-right-fade::after {
        opacity: 1;
    }
}

/* 
    ### Aanpak Stepper Layout
*/

.stepper_center {
    display: none;
    transition: all .2s ease;
}

.stepper-wrapper {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.stepper_item {
    /*padding: 14px 16px;*/
    border-radius: 14px;
    transition: all .25s ease;
}

.stepper_item h4 {
    margin: 0 0 6px;
    font-weight: 800;
}

.stepper_item h4 span {
    color: var(--tps-orange);
}

.stepper-title .orange-dot {
    color: var(--tps-orange);
}

@media (min-width: 1200px) {
    
    .stepper_item p {
        font-size: 1rem;
    }
    
    .stepper_item h4 {
        font-size: 1rem;
    }
    
    .stepper {
        /*border: 2px solid blue;*/
        height: 800px;
        margin-bottom: 2rem;
    }

    .stepper-wrapper {
        position: relative;
        margin: 0 auto;
        height: 100%;
        width: 100%;
    }

    .stepper-title {
        position: absolute;
        left: 50%;
        transform: translate(-50%, -50%);
        margin: 0;
        width: 100%;
        text-align: center;
    }

    .stepper_center {
        margin-top: 4rem;
            
        display: grid;
        place-items: center;
        position: absolute;
        inset: 50% auto auto 50%;
        transform: translate(-50%, -50%);
        width: 200px;
        height: 200px;
        border-radius: 50%;
        /* box-shadow: 0 12px 36px rgba(0, 0, 0, .12); */
        background: var(--tps-dark-blue);
    }

    .stepper_item {
        --dx-mid: 200px;
        --dx-end: 50px;
        --dy-end: 300px;
        --dy-mid: 100px;
        
        margin-top: 4rem;
        
        position: absolute;
        top: 50%;
        left: 50%;
        width: 400px;
        height: 150px;
        background: transparent;
        box-shadow: none;
        transform: translate(-50%, -50%);

        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .stepper_item:hover {
        scale: 1.03;
    }

     /* Stepper offsets */
    .stepper_item:nth-of-type(1) {
        transform:
                translate(0, -50%)
                translate(var(--dx-end), calc(var(--dy-end) * -1));
    }

    .stepper_item:nth-of-type(2) {
        transform:
                translate(0, -50%)
                translate(var(--dx-mid), calc(var(--dy-mid) * -1));
    }

    .stepper_item:nth-of-type(3) {
        transform:
                translate(0, -50%)
                translate(var(--dx-mid), var(--dy-mid));
    }

    .stepper_item:nth-of-type(4) {
        transform:
                translate(0, -50%)
                translate(var(--dx-end), var(--dy-end));
    }

    .stepper_item:nth-of-type(5) {
        transform:
                translate(-100%, -50%)
                translate(calc(var(--dx-end) * -1), var(--dy-end));
    }

    .stepper_item:nth-of-type(6) {
        transform:
                translate(-100%, -50%)
                translate(calc(var(--dx-mid) * -1), var(--dy-mid));
    }

    .stepper_item:nth-of-type(7) {
        transform:
                translate(-100%, -50%)
                translate(calc(var(--dx-mid) * -1), calc(var(--dy-mid) * -1));
    }

    .stepper_item:nth-of-type(8) {
        /*border: 2px solid blue;*/
        transform:
                translate(-100%, -50%)
                translate(calc(var(--dx-end) * -1), calc(var(--dy-end) * -1));
    }
}

.review-initial {
    color: white;
    background-color: var(--tps-blue);
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 40px;
}

.reviews-wrapper .card {
    background-color: #e7eaed;
    --bs-card-cap-bg: #e7eaed;
    --bs-card-border-width: 0;
}

.reviews-wrapper .review-header {
    display: flex;
    gap: 1rem;
    border-bottom: 1px solid var(--tps-blue);
    padding-bottom: var(--bs-card-spacer-y);
    position: relative;
}

.reviews-wrapper .review-rating,
.reviews-wrapper .review-name,
.reviews-wrapper a[data-readmore-toggle] {
    font-weight: bold;
    color: var(--tps-blue);
}

.reviews-wrapper .review-rating {
    display: flex;
    gap: .5rem;
    align-items: center;
}

.reviews-wrapper .card-footer {
    padding-top: 0;
}

.reviews-wrapper .google-icon {
    position: absolute;
    top: calc(50% - 1rem);
    transform: translateY(-50%);
    right: 0;
}

.reviews-wrapper .review-date {
    color: #0F335078;
    margin-top: -10px;
    font-size: 1rem;
}

.reviews-wrapper .card-text {
    overflow: hidden;
}

.reviews-wrapper {
    margin: 0 .5rem;
}

/* 
    Aanpak Stepper Layout ###
*/