/*
FONTS
font-family: 'Poppins', sans-serif;

 */

body {font-family: 'Poppins', sans-serif;font-weight:300;}
a, a:hover, a:active {text-decoration:none; color:#000;}
img {max-width: 100%;}
.bgsand {background:#fef8f8;}

.row {
    --bs-gutter-x: 0rem;
}

.poppins-light {
    font-family: "Poppins", sans-serif;
    font-weight: 300;
    font-style: normal;
}

.poppins-regular {
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-style: normal;
}

.poppins-semibold {
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-style: normal;
}

.poppins-bold {
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    font-style: normal;
}

.poppins-light-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 300;
    font-style: italic;
}

@media screen and (min-width: 1200px) {
    .container {max-width: 1140px;}
}

/*header menu*/
.header {background:#fff; position:fixed;width:100%;z-index:9999;-webkit-box-shadow: 0px 1px 11px -2px rgba(0,0,0,0.66);
    box-shadow: 0px 1px 11px -2px rgba(0,0,0,0.66);}
.mainheader {padding:15px 0;position:relative;}
.logo {padding:0;}
.logo img {max-width:64px;}
.menu-item {padding-right:30px;font-size:16px;font-weight:300;transition: all 0.5s ease;}
.menu-item:hover {color:#216478;text-decoration: underline;transition: all 0.5s ease;}
.mainmenu {padding:30px 0 0 0;}
/*.mainmenu-phone {color:#316a72;font-size:14px;font-weight:400;}*/

.menu-bubble {background: #216478;    padding: 10px 28px;    text-align: center;    color: #fff;    border-radius: 50px;font-weight:600;}
.menu-bubble:hover {background: #216478; color: #fff!important;   text-decoration: none!important;}
.body-main {padding-top:105px;}

/*hero*/
.herobg {background-size:cover;background-position:bottom; background-repeat: no-repeat;}
.herobg2 {background-size:cover;background-position:center; background-repeat: no-repeat;}
.mainhero {min-height:350px;padding:90px 0;}
.mainhero h1 {color:#fff;font-weight:bold;}
.mainhero h3 {color:#fff;font-size:22px;}

/*jobs overview*/
.job-overview {background:#fff;}
.job-overview-heading {padding:40px 0 20px 0;}
.job-overview-heading h4 {font-size:24px;font-weight:500;color:#316a72;}
.job-block {margin-bottom:35px;}
.job-block-left {padding-right:20px;padding-left:0px;}
.job-block-center {padding-right:10px;padding-left:10px;}
.job-block-right {padding-right:0px; padding-left:20px;}

.job-block-ins {min-height:535px; -webkit-box-shadow: 0px 0px 18px 0px rgba(0, 0, 0, 0.17);
    -moz-box-shadow: 0px 0px 18px 0px rgba(0, 0, 0, 0.17);
    box-shadow: 0px 0px 18px 0px rgba(0, 0, 0, 0.17);
    transition: all 0.5s ease;}
.job-block-ins:hover {-webkit-box-shadow: 0px 0px 18px 0px rgba(0, 0, 0, 0.32);
    -moz-box-shadow: 0px 0px 18px 0px rgba(0, 0, 0, 0.32);
    box-shadow: 0px 0px 18px 0px rgba(0, 0, 0, 0.32);
    transition: all 0.5s ease;}
.job-block-ins img {height:220px;width:100%; object-fit: cover; transition: filter .5s ease-in-out;}
.job-block-ins img:hover { }
.job-block-ins h2 {font-size:18px;font-weight:400;line-height:150%; padding: 10px 25px;}
.job-block-ins h2:hover {color:#316a72;}
.job-descr {font-size:14px;padding: 0px 25px;}
.job-specs {font-size:14px;color:#316a72;    padding: 0px 25px 12px 25px;}

.job-overview-heading h3 {font-weight:500;font-size: 2.4rem!important;color:#316a72!important;padding: 30px 0px!important;}

/*vacancy split page*/
.vacancy-type-block-left {float:left; width:50%;margin-bottom:50px;}
.vacancy-type-block-right {float:right; width:50%;margin-bottom:50px;}
.vacancy-type-block-left-ins {padding-right:10px;}
.vacancy-type-block-right-ins {padding-left:10px;}
.vacancy-type-block-ins {background:#f4a261; padding:20px 30px;min-height:220px;}
.vacancy-type-block-ins h3 {font-size:30px;font-weight:500;line-height:150%; padding:20px 0 10px 0;color:#ffffff;}
.vacancy-type-block-ins p {color:#ffffff;}
.vacancy-type-block-ins a {}
.vacancy-type-btn {background: #316a72; color: #fff; border: 2px solid #316a72; font-weight: 500;  font-size: 16px; border-radius: 50px; text-align: center;  padding: 7px 25px; transition: all 0.5s ease; cursor: pointer;  display: inline-block;cursor:pointer;}
.vacancy-type-btn:hover { color: #fff; background: #004750; border: 2px solid #004750;  }

.job-ins-img {}

/*info block*/
.overview-infoblock {background:#f4f0f0;padding:50px 0;}


/*info block*/
.overview-infoblock2 {background:#fff;padding:50px 0;}
.content-infoblock h2 {color:#000;font-weight:700;padding-bottom: 30px;}
.img-infoblock img {border-radius:30px; width:250px; height:250px; object-fit: cover;}
.headings-spacer {margin-bottom:30px;height:2px;}
.headings-line {border: 0px; border-style: solid; border-bottom-width: 2px; border-color:#316a72; width: 50px; float: left;-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.content-infoblock a {color:#316a72;font-weight:700;transition: all 0.5s ease;}
.content-infoblock a:hover {color:#004750;transition: all 0.5s ease;}

.overview-infoblock-bgblue {background:#316a72;color:#ffffff;}
.overview-infoblock-bgblue a {color:#fff!important;font-weight:700;text-decoration:underline;transition: all 0.5s ease;}
.overview-infoblock-bgblue a:hover {color:#f4a261!important;transition: all 0.5s ease;}

/*CTA*/
.maincta {padding:60px 0 85px 0;}
.maincta h2{color:#316a72;font-size:28px; font-weight:500;}
.maincta h4{font-size:20px; font-weight:400;line-height:150%;padding-top:10px;}
.col-cta {max-width:720px;margin:0 auto;}

/*SHARE*/
.mainsocialshare {padding:60px 0 90px 0;}
.mainsocialshare h2{color:#316a72;font-size:28px; font-weight:300;}

/*FOOTER*/
.mainfooter {margin-top:-160px;background:#216478;border-radius: 30px;padding: 50px 15px 40px 15px;;font-size:16px;color:#fff;}
.mainfooter h4 {font-size:16px;font-weight:500;padding-bottom:0px;}
.mainfooter p {font-size:16px;font-weight:300;}
.mainfooter a {color:#fff;}
.footer-cols {max-width:100%;margin:0 auto;}

.footer-credits {text-align:center;padding:50px 0 60px 0;}
.footer-credits a {color:#000; padding:0px 30px;font-size:16px;font-weight:600;transition: all 0.5s ease;}
.footer-credits a:hover {color:#000; transition: all 0.5s ease;}
.footer-logo {padding-bottom:10px;text-align:center;}
.footer-logo img{width:130px;}
.social-icons {padding-top:20px;}
.footer-mail a:hover {text-decoration: underline;}

.bg-footer {background:#ccc;height:380px;background-image: url("../images/diensten-02.jpg"); background-size:cover;
    background-position:center center; background-repeat: no-repeat;}

/*detailpage*/
.detailhero {background: rgba(15, 15, 15, 0.55);min-height:340px;padding:80px 0;position: relative;}
.detailhero h1 {color:#fff;font-weight:500;font-size: 32px;max-width: 70%;}
.detailhero h3 {color:#fff;font-size:18px;font-weight:500;padding-bottom:10px;}
.detailhero-text {max-width:980px; margin:0 auto;}
.backto-overview{position: absolute; top:10px; left:25px; color:#fff;font-size:12px;font-weight: 500;}
.backto-overview a {color:#fff;cursor:pointer;}
.backto-overview a:hover{text-decoration:underline;}
.detail-maincontent {max-width:980px; margin:0 auto;}
.detail-intro {margin-top:-70px;overflow:auto;background:#fff;border-top:6px #316a72 solid;padding:25px 25px;position:relative; border-radius: 30px;
    -webkit-box-shadow: 0px -9px 21px -14px rgba(0,0,0,0.70);-moz-box-shadow: 0px -9px 21px -14px rgba(0,0,0,0.70);    box-shadow: 0px -9px 21px -14px rgba(0,0,0,0.70);}
.detail-intro-text {float:left;padding-right:20px;}
.detail-intro-text h5 {font-size:20px;font-weight:400;color:#316a72;}
.detail-intro-text p {font-size:14px;}
.detail-intro-text ul li {font-size:14px;}
.detail-chart {margin:0 auto;padding-top:10px;}

.btn {width: 200px; background: #316a72; color: #fff; border: 2px solid #316a72; font-weight: 500;  font-size: 16px; border-radius: 50px; text-align: center;  padding: 7px 25px; transition: all 0.5s ease; cursor: pointer;  display: inline-block;cursor:pointer;}
.btn:hover { color: #fff; background: #004750; border: 2px solid #004750;  }
.btn-upload {background: #316a72; color: #fff; border: 2px solid #316a72;font-size: 12px;padding: 5px 10px;width: 140px;  }
.btn-upload:hover {background: #004750; color: #fff; border: 2px solid #004750;  }
.btn-large {width:240px!important;}

/*solliciteren*/
.backto-vacacy {color:#000;font-size:14px;font-weight: 300;}
.backto-vacacy:hover {text-decoration: underline;color:#000;}
.sollicitatie-intro-text {padding:25px 0;max-width:700px; margin:0 auto;}
.sollicitatie-intro-text h3 {font-weight: 300;font-size:30px;color:#004750;}
.sollicitatie-intro-text p {font-weight: 400;font-size:18px;color:#000;}
.sollicitatie-intro-text p span {font-weight:500;}
.sollicitatie-form {}
.soll-input {padding-right:20px;padding-bottom:20px;}
.soll-input input{width:100%;border-radius: 50px;border: 1px solid #ddd;padding:8px 14px;}
.soll-input textarea {width:100%;border-radius: 15px;border: 1px solid #ddd;padding:10px 14px;}
.soll-input label {font-size:16px; padding-bottom:6px;}

.upload-btn-wrapper {    position: relative;    overflow: hidden;    display: inline-block;}
.upload-btn-wrapper input[type=file] {    font-size: 100px;    position: absolute;    left: 0;    top: 0;    opacity: 0;}
.soll-upload small {padding-top:5px;font-size:11px;}
.soll-checkbox {padding:20px 0;font-size:14px;}
.soll-send {}
.checkbox-col {float:left;width:30px;padding:2px 0px 0px 4px;overflow:auto;}
.checkbox-text {float:left;width: calc(100% - 30px);overflow:auto;}
.checkbox-row {padding-bottom:10px;overflow:auto;}
.bg-element {background-image: url("../images/bg-element.png"); background-size:auto 100%;background-position:right center; background-repeat: no-repeat;}

/*home slider diensten*/
.slide-bg1 {background-image: url("../images/diensten-01.jpg"); background-size:cover;background-position:bottom center; background-repeat: no-repeat;}
.slide-bg2 {background-image: url("../images/diensten-02.jpg"); background-size:cover;background-position:bottom center; background-repeat: no-repeat;}
.slide-bg3 {background-image: url("../images/diensten-03.jpg"); background-size:cover;background-position:bottom center; background-repeat: no-repeat;}


/*team*/
.overview-team {background:#f4f0f0;padding:50px 0;}
.team-member {}
.team-member h3 {padding:15px 0 0 0;font-size:18px;font-weight:500;color:#000;}
.team-member p {}
.team-intro {padding: 80px 0 35px 0;}
.team-intro h3{font-weight: 700;}
.bg-orange {background:#f4a261; color:#fff; }
.bg-orange h3 {font-size:30px;color:#fff;font-weight:500;margin-bottom: 10px;}

/*homepage*/
.bg-main {background-size:100% auto;background-position:top; background-repeat: no-repeat;background-attachment:fixed;}
.bg-white {background:#ffffff;}
.homeherobg {background-size:cover;background-position:bottom; background-repeat: no-repeat;}
.homehero {min-height:550px;padding:100px 0 0 0;position: relative;}
.homehero h1 {color:#fff;font-weight:bold;font-size: 32px;}
.homehero h3 {color:#fff;font-weight:bold;font-size: 20px;}
.homehero p {color:#fff;font-weight:bold;font-size: 16px;max-width:50%;padding-top:20px;}
.homehero-text {}
.home-opener-text {color:#fff;padding-top: 220px; z-index:999; overflow:auto;position:relative;text-align:center;}
.home-opener-text h2 {font-weight:500;color:#fff;font-size: 3rem;text-shadow: 4px 1px 5px rgba(0, 0, 0, 0.5);}
.home-opener-text p {font-weight:500;font-size: 1.7rem;text-shadow: 4px 1px 5px rgba(0, 0, 0, 0.5);}

.home-opener-text2 {color:#fff;padding-top: 380px; z-index:999; overflow:auto;position:relative;text-align:center;}
.team-infoblock2 {   background: #ffffff;    padding: 50px 0;}

.home-main {color:#fff;margin-top:250px; z-index:999; overflow:auto;position:relative;text-align:center;}
.home-main-text1 {padding: 45px 70px 45px 70px;border-right: 0px solid;border-radius: 30px;background: #216478;transition: all 0.5s ease;}
.home-main-text1:hover {background:#004750;  transition: all 0.5s ease;}
.home-main-text2 {padding:0px;border-right:0px solid; border-color: rgba(231, 231, 231, 0.51)!important;}
.home-main-text3 {padding:45px 60px 45px 60px;background: #216478;transition: all 0.5s ease;border-radius: 30px;}
.home-main-text3:hover {background:#004750;  transition: all 0.5s ease;}
.home-main-text h2 {font-weight:700;color:#fff;font-size:22px;padding-bottom:20px;}
.home-main-text p {font-weight:300;font-size:16px;padding-bottom:5px;}
.home-main-text em {position: absolute; bottom:15px;font-size:14px;}
.home-main-text a {color:#fff;}
.pd-right-30 {padding-right:30px;}
.pd-left-30 {padding-left:30px;}

/*.home-opening-blocks-cntr {max-width:870px;}*/
.mr-neg-50 {margin-top:-50px;}
.mr-neg-120 {margin-top:-140px;height:150px; background:#fff;}
.home-vacancies {padding:110px 0 40px 0;}
.home-vacancies2 {padding:60px 0 40px 0;}
.home-vacancies-text {margin:0 auto; text-align:center;}
.home-vacancies-text h2{font-weight:500;font-size: 3rem;color:#316a72;}
.home-vacancies-text p{font-size:18px; font-weight:300;padding:0px 30px 5px 30px;}
.btn-primair {background:#316a72;color:#fff;width:auto;padding:10px 35px; border-radius:50px;font-size:16px; font-weight:400;transition: all 0.5s ease;}
.btn-primair:hover {background:#004750;transition: all 0.5s ease;}

.bg-grey {background-color: rgb(244, 244, 244);}
.home-blocks {padding:70px 0 30px 0;}
.home-blocks-text {margin:0 auto; text-align:center;}
.home-blocks-text h2{font-weight:300;font-size:36px;color:#000;}
.home-blocks-text p{font-size:16px; font-weight:300;padding-bottom:10px;max-width:65%;margin:0 auto;}

.home-blocks-wrapper {width:100%; padding:30px 0 20px 0;}
.ll-info {min-height: 400px;background:#fff;box-shadow: 0 1px 3px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .1);transition: all 0.5s ease;}
.ll-info:hover {box-shadow: 0 8px 16px rgba(0, 0, 0, .16), 0 4px 4px rgba(0, 0, 0, .2);transition: all 0.5s ease;}
.ll-info-header {background-color: #316a72;display: block; height: 100px; width: 100%;}
.ll-info-wrapper {padding: 0 30px 40px;text-align:center;}
.ll-info-icon {margin-top: -50px; position: relative; text-align: center;}
.ll-info-wrapper h2 {color: #316a72; font-size: 22px; font-weight:300;margin: 20px 0; padding: 0;}
.ll-info-wrapper p {}
.home-blocks-wrapper-ins {float:left; padding:0 10px;}

.home-info {padding:70px 0 60px 0;}
.home-info-wrapper {width:100%;}
.home-info-wrapper-ins {float:left;padding:0 20px 0 0;}
.block-info h2 {color: #316a72; font-size: 28px; font-weight:500;margin: 20px 0; padding: 0;}
.block-info p {font-weight:300;}
.block-info img {max-width:100%;margin-bottom:25px;}
.block-info em {font-size:14px;color: #316a72;}
.social-channels {font-weight:300;}
.social-channels img {max-width:100%;margin-bottom:3px;}

b, strong {font-weight: bold!important;}
.bg-sand {background:#f5ebde;}
.bg-darkgrey {background:#252525;}
.bg-darkgrey-buildings {background-image: url("../images/bg24.jpg"); background-size:cover;background-position: center; background-repeat: no-repeat;background-color: #252525b5;    background-blend-mode: darken;}
.bg-testimonials{background-size:cover;background-position:center; background-repeat: no-repeat;}
.home-testimonial {padding:60px 0 30px 0;}
.home-testimonial-text {text-align:center;color:#000;margin:0 auto;}
.home-testimonial-text h2 {font-weight:700;font-size: 2rem;padding-bottom:30px; }
.home-testimonial-text p {font-weight:300;}
.home-testimonial-author {padding:30px 0 30px 0;}

.home-main-sidebar {margin-bottom:20px; margin-top:-90px;overflow:auto;background:#fff;    border-radius: 30px;padding:25px 25px;text-align:center;position:relative; -webkit-box-shadow: 0px 2px 11px 3px rgba(0,0,0,0.1); -moz-box-shadow: 0px 2px 11px 3px rgba(0,0,0,0.1);box-shadow: 0px 2px 11px 3px rgba(0,0,0,0.1);}
.home-main-sidebar h3 {font-weight:500;color:#316a72;font-size:24px;padding-bottom:0px;}
.sidebar-row {padding:15px 0; border-bottom:1px solid #ccc;}
.sidebar-row:hover {cursor:pointer;}
.sidebar-row h4 a {font-weight:500;color:#000000;font-size:16px;transition: all 0.5s ease;}
.sidebar-row h4 a:hover {color:#316a72;transition: all 0.5s ease;}
.sidebar-row p {margin-bottom:0px;font-size:14px;}
.sidebar-btn {padding:25px 20px 10px 20px;}
.sidebar-btn .btn {width:100%;}

/*buttons*/
.filled-petrol-button {display: inline-flex; align-items: center; padding: 10px 28px; border: 2px solid #216478; border-radius:50px;color: white!important;
    background-color: #216478;font-size: 16px; font-weight:700; text-decoration: none; transition: all 0.3s ease; cursor: pointer;}
.filled-petrol-button:hover {background-color: transparent;color: #216478!important;}
.filled-button {display: inline-flex; align-items: center; padding: 10px 28px; border: 2px solid white; border-radius:50px;color: #216478!important;
    background-color: white;font-size: 16px; font-weight:700; text-decoration: none; transition: all 0.3s ease; cursor: pointer;}
.filled-button:hover {background-color: transparent;color: white!important;}
.outline-button {display: inline-flex; align-items: center; padding: 8px 16px; border: 2px solid white; border-radius:50px; color: white;
    background-color: transparent; font-size: 14px; text-decoration: none; transition: all 0.3s ease; cursor: pointer;}
.outline-button:hover {background-color: white; color: black;}
.outline-button .arrow-right { margin-left: 10px; transition: all 0.3s ease;}
.outline-button:hover .arrow-right { color: black;}
.arrow-right { display: inline-block; transition: all 0.3s ease;}

/*home new*/
.home-jobs {text-align:center;padding:80px 20px 85px 20px;}
.home-jobs h2 {font-weight:700;color:#fff;padding-bottom: 30px;}

.block-content {padding:80px 16px 85px 16px;}
.block-content-wrapper {overflow:auto;}
.block-content-left {width:50%;float:left;}
.block-content-left img {border-radius:5%; width:500px; height:500px; object-fit: cover;}
.block-content-right {width:50%;float:left;}
.block-content-right h2 {font-weight:700;color:#000;padding-bottom: 30px;padding-top:30px;}
.block-content-right p {font-weight:300; color:#000;}

.block-content2 {padding:80px 16px 85px 16px;}
.block-content2-wrapper {overflow:auto;}
.block-content2-left {width:50%;float:left;}
.block-content2-left h2 {font-weight:700;color:#000;padding-bottom: 30px;padding-top:30px;}
.block-content2-left p {font-weight:300; color:#000;padding-bottom: 20px;}
.block-content2-right {width:50%;float:left;text-align:right;}
.block-content2-right img {border-radius:5%; width:500px; height:500px; object-fit: cover;}

/*candidates new*/
.block-main-content {margin-top:-140px;}
.block-main-content-wrapper {background:#f5ebde;overflow:auto;border-radius:30px;padding:50px 50px;}
.block-main-content-left {width:60%;float:left;}
.block-main-content-left h2 {font-weight:700;padding-bottom:30px;}
.block-main-content-right {width:40%;float:left;text-align:right;}
.block-main-content-right img {border-radius:5%; width:380px; height:500px; object-fit: cover;}

.highlight-jobs {text-align:center;padding:80px 0px 85px 16px;}
.highlight-jobs h2 {font-weight:700;color:#000;padding-bottom: 30px;}
.highlight-jobs-wrapper {overflow:auto;}
.block-highlight-job {text-align:center; border-radius:20px; background:#fff; border:1px solid #ccc;padding: 30px 20px 15px 20px; min-height: 320px;transition: all 0.5s ease;}
.block-highlight-job:hover {background:#f5ebde;transition: all 0.5s ease;}
.block-highlight-job h3 {font-weight:600;font-size:1.25rem;padding-bottom:20px;}
.block-highlight-job p.details {color:#216478}
.box-highlight-job {width:33.3%; float:left;padding-right:20px;}

.block-procedure {text-align:center;padding:80px 0px 85px 16px;}
.block-procedure h2 {font-weight:700;color:#000;padding-bottom: 25px;}
.block-procedure-wrapper {}
.block-procedure-item {padding:20px 0;overflow:auto;}
.block-procedure-item-left {width:40%;float:left;text-align:left;padding-right:30px;}
.block-procedure-item-right {width:60%;float:left;text-align:left;}
.block-procedure-item h3 {font-weight:600;word-break: break-word; hyphens: auto; font-size: 1.5rem;}
.procedure-line {background:#000; height:1px; border:none;}



/*clients*/
.block-cta {text-align:center;padding:80px 20px 85px 20px;}
.block-cta-wrapper {overflow:auto;}
.block-cta-left {float:left;width:30%;}
.block-cta-left img {border-radius:5%; width:240px; height:240px; object-fit: cover;}
.block-cta-right {float:left;width:70%;text-align:left;}
.block-cta-right h2 {font-weight:700;color:#fff;padding-bottom: 18px;width:70%;}
.block-cta-right p {color:#fff;padding-bottom: 6px;width:90%;}

.cta-color-black {color:#000!important;}
.sticky {position: -webkit-sticky;position: sticky;top: 120px; }

/*download flyer btn*/
.btn-download-flyer {background:#316a72; padding:10px 25px; color:#fff; max-width:240px; text-align:center; font-size:16px; font-weight:500; border:0px; text-decoration: none;transition: all 0.5s ease;}
.btn-download-flyer:hover {background:#004750; text-decoration: none;transition: all 0.5s ease;}

/*candidates page*/
.candidates-block01 {padding-right:50px!important;}
.candidates-hours {font-weight:500;font-size:14px;}

/*procedure page */
.procedure-block {}
.content-procedure-block01 {text-align:center; padding:50px 10px;}
.content-procedure-block01 h3 {font-size: 3rem; color: #316a72; font-weight: 500; margin-bottom: 10px}
.bg-petrolblue {background: #216478;}

.content-procedure-block02 {text-align:center; padding:50px 10px;}
.content-procedure-block02 h3 {font-size: 1.6rem;font-weight:500;color:#ffffff; margin-bottom: 10px}
.content-procedure-block02 h4 {font-size: 1.6rem;font-weight:500;color:#000000; margin-bottom: 10px}
.content-procedure-block02 p {font-size: 1.6rem;font-weight:300;color:#fff; }
.bg-white {background: #ffffff;}
.bg-white p {color: #000000;}
.bg-procedure-petrolblue p {color: #ffffff!important;    font-size: 1.4rem!important;}
.bg-procedure-petrolblue {border-radius: 30px;background: #316a72; padding:10px 25px;}

/*CTA procedure*/
.procedure-cta {padding:60px 0 95px 0; max-width: 600px;margin: 0 auto;}
.procedure-cta h2 {color:#ffffff;font-size:22px; font-weight:500;padding-top: 12px;}
.procedure-cta h4 {color:#ffffff;font-size:16px; font-weight:400;line-height:150%;padding-top:10px;}
.procedure-block-cta {}
.procedure-cta a {color:#ffffff; text-decoration: underline;}
.procedure-block-cta-img {text-align:center;}
.procedure-block-cta-img img {max-width:140px;}

/*contact*/
.locallegal-contactform form{}
.locallegal-contactform .formInput{position:relative; margin:0 0 15px 0;}
.locallegal-contactform .formInput label { display: inline-block;  font-size: 16px; line-height: 140%; font-weight: 400; color: #41413F; margin: 0 0 10px 0;}
.locallegal-contactform input[type=text], .locallegal-contactform input[type=password] { min-height: 40px;    width: 100%;    border-radius: 40px;background: #d5d5d5;    border: 0px solid #ECECEC;  padding: 5px 15px; -webkit-appearance: none;outline: none;}
.locallegal-contactform textarea {min-height: 40px;    width: 100%;    border-radius: 20px; background: #d5d5d5;   border: 0px solid #ECECEC;  padding: 5px 15px; -webkit-appearance: none;outline: none;}
.locallegal-contactform form .formInput {    margin: 0 0 15px 0;}

.contactpage-bussinessinfo h3 {font-weight:600;font-size:1.5rem;padding-bottom:20px;}
.contactpage-bussinessinfo {    padding-right: 45px;}
.businessinfo-box {background:#216478; border-radius:30px; color:#fff!important; padding:50px 40px;}
.businessinfo-box p { color:#fff!important; }
.businessinfo-box a { color:#fff!important; }
.businessinfo-box a:hover { color:#fff!important; text-decoration:underline; }
.buttonContainer {text-align:right;}
.buttonContainer .btn {text-align:center;}

.block-maps h2 {font-weight:700; padding-bottom:30px;}
.block-maps a {color:#000;}
.block-maps a:hover {color:#000;text-decoration: underline;}
.block-maps img {border-radius:30px;}
.block-maps-right {padding-left: 62px;}
.block-maps-enlarge-map {padding:10px 0px 70px 0px;}

/*vacature detail new*/
.block-vacature {text-align:left;padding:130px 20px 90px 20px;}
.block-vacature-wrapper {width:90%;}
.block-vacature-wrapper h1 {font-weight:700;font-size:2.5rem;padding-bottom:15px;color:#fff;}
.block-vacature-wrapper h3 {font-weight:300;font-size:1.5rem;color:#216478;padding-bottom:20px;}
.bg-vacancydetail-head .block-vacature-wrapper h3 {font-weight:300;font-size:1.5rem;color:#fff;padding-bottom:20px;}
.detail-vacature-left {float:left;width:30%;}
.detail-vacature-right {float:left;width:70%;}

.detail-vacature {padding:80px 0 70px 0; border-top:0px solid #ddd;}
.detail-vacature-titel {float:left;padding-right:50px;}
.detail-vacature-titel h3 {font-weight:700;color:#fff;font-size:1.5rem;padding-bottom:20px;}
.detail-vacature-tekst {float:left;}
.detail-vacature-tekst h2 {font-weight:700;color:#000;padding-bottom:30px;}

.detail-vacature-sidebar {background:#216478; padding:50px 20px 50px 40px;border-radius:30px;}
.detail-vacature-sidebar p{color:#fff;}
.detail-vacature-sidebar .filled-button {width:217px;text-align:center;margin-top:15px;}

.all-vacancies {padding-top:20px;}
.all-vacancies a {text-decoration:underline; color:#000;}

/*about new*/
.block-about-content {margin-top:-140px;}
.block-about-content-wrapper {background:#216478;color:#fff;overflow:auto;border-radius:30px;padding:50px 50px;}
.block-about-content-wrapper h2 {font-weight:700;padding-bottom:30px;}
.about-container-buttons {padding-top:20px;}
.about-container-buttons .filled-button {margin-right:10px;}
.whitespace-100px {height:100px;}
.text-white {color:#fff;}

/*grid*/
.block-grid {padding:80px 16px 85px 16px;}
.block-grid-wrapper {}
.grid-item {border:1px solid #ccc;border-radius:30px;overflow:auto;min-height:308px; margin-bottom:20px;}
.grid-item-left {float:left; width:30%;background:#ccc;min-height:308px;}
.grid-item-right {float:left; width:70%;padding:30px 50px 20px 50px;}
.grid-item-right h3 {font-weight:600;padding-bottom:20px;font-size:1.5rem;}
.grid-item-details {}
.grid-item-text {padding-bottom: 0px;}
.grid-item-subdetails {padding-bottom: 10px;color:#216478!important;}

.detailhero {background:none;}
.detailhero h1 {color: #000;font-weight: 700;font-size: 1.75rem;}
.detailhero h3 {color:#000; font-weight:300;}
.backto-vacacy {color:#000;font-size:14px;font-weight: 300;}
.detail-intro {margin-top: 0px;
    border-top: 0px #316a72 solid;
    padding: 25px 25px;
    border-radius: 0px;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;}
.sollicitatie-intro-text h3 {font-weight:700;font-size:1.75em; padding-bottom:20px;color:#000;}

.terms-text h3 {font-weight:700;padding-bottom:30px;}

.clients-logos {    padding: 80px 15px 0px 15px!important;}
.clients-logos h2 {padding-bottom: 0px!important;}

.ll-carousel-container {
    width: 100%;
    overflow: hidden;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px 0;
}

.ll-carousel {
    display: flex;
    width: max-content;
}

.ll-carousel-track {
    display: flex;
    transition: transform 0.5s ease-in-out;
}

.ll-carousel-item {
    min-width: 340px;
    margin: 0 10px;
}

.ll-carousel-item img {
    max-width: 100%;
    height: auto;
    max-height: 180px;
}



/*slider*/
.simple-wbr-slider-container {
    position: relative;
}

.simple-wbr-slider {
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.simple-wbr-slider figure {
    position: absolute;
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    transition: opacity 1s ease-in-out;
    animation-name: simpleWbrSlider;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-duration: 12s;
}

.simple-wbr-slider img {
    object-fit: cover;
}

figure {
    display: inline-block;
    margin: 0;
}

.progressive {
    background: none;
}

/*
source: http://css3.bradshawenterprises.com/cfimg/

For "n" images You must define:
a=presentation time for one image
b=duration for cross fading
Total animation-duration is of course t=(a+b)*n

t = (a+b)*n
animation-delay = t/n or = a+b

Percentage for keyframes:
0%
a/t*100%
(a+b)/t*100% = 1/n*100%
100%-(b/t*100%)
100%

So 2 images:
a = 5s
b = 1s
(animation-duration) = t = (5+1)*2 = 12
animation-delay = 12 / 2 = 6
*/

.simple-wbr-slider figure:nth-of-type(1) {
    animation-delay: 12s;
}
.simple-wbr-slider figure:nth-of-type(2) {
    animation-delay: 6s;
}

@keyframes simpleWbrSlider {
    0% {
        opacity:1;
    }
    41.66% {
        opacity:1;
    }
    50% {
        opacity:0;
    }
    91.666% {
        opacity:0;
    }
    100% {
        opacity:1;
    }
}

.simple-wbr-testimonials {
    position: relative;
    display: flex;
    overflow: hidden;
}

.simple-wbr-testimonials-item {
    position: relative;
    min-width: 100%;
    transition: left 1s ease-in-out;
    animation-name: simpleWbrTestimonials;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-duration: 36s;
}

@keyframes simpleWbrTestimonials {
    0% {
        left: 0;
    }
    29% {
        left: 0%;
    }
    30% {
        left: -100%;
    }
    59% {
        left: -100%;
    }
    60% {
        left: -200%;
    }
    99% {
        left: -200%;
    }
    100% {
        left: 0;
    }
}
@media screen and (min-width: 769px) {
    .overlay {display: none;}
    .nav-mobile {display: none;}

}

@media screen and (max-width: 768px) {
    .row {
        --bs-gutter-x: 0rem;
    }

    .body-main .container {
        padding: 0;
    }

    .mainmenu {
        display: none;
    }

    .logo {
        width: 100%;
        text-align: center;
    }

    .home-main .col-4 {
        width: 100%;
        position: relative;
    }

    .home-main-text1 {
        padding: 30px 40px 30px 40px;
        border-bottom: 1px solid;
    }

    .home-main-text2 {
        padding: 30px 40px 30px 40px;
        border-bottom: 1px solid;
    }

    .home-main-text3 {
        padding: 30px 40px 30px 40px;
        border-bottom: 0px solid;
    }

    .home-vacancies {
        padding: 40px 0 50px 0;
    }

    .home-vacancies .col-8 {
        width: 100%;
        padding: 0 20px;
    }

    .home-vacancies-text h2 {
        font-size: 28px;
    }

    .home-blocks {
        padding: 30px 0 20px 0;
    }

    .home-blocks-text h2 {
        font-size: 28px;
    }

    .home-blocks-text {
        padding: 0 30px;
    }

    .home-blocks-text p {
        max-width: 90%;
        padding-bottom: 0;
    }

    .home-blocks-wrapper .col-4 {
        width: 100%;
        padding: 0 20px 20px 15px;
    }

    .ll-info {
        min-height: 280px;
    }

    .home-info {
        padding: 30px 0 30px 0;
    }

    .home-info-wrapper .col-4 {
        width: 100%;
        padding: 0;
    }

    .home-testimonial .col-8 {
        width: 100%;
        padding: 0 15px;
    }

    .home-testimonial {
        padding: 35px 0 40px 0;
    }

    .footer-cols .col-3 {
        width: 100%;
        padding: 0;
    }

    .footer-credits a {
        width: 100%;
        float: left;
        padding-right: 0;
    }

    .footer-credits {
        overflow: auto;
    }

    .homehero {
        min-height: 350px;
    }

    .mainhero {
        min-height: 220px;
        padding: 0px 0;
    }


    .col-2 {width:100%;}
    .col-3 {width:100%;}
    .col-4 {width:100%;}
    .col-5 {width:100%;}
    .col-6 {width:100%;}
    .col-8 {width:100%;}
    .col-9 {width:100%;}
    .job-block-left, .job-block-right {padding-left:15px; padding-right:15px;}
    .job-overview-heading {padding:20px 15px 10px 15px;}
    .job-overview-heading .headings-spacer {margin-bottom: 10px;}
    .content-infoblock {padding:20px 15px;}
    .overview-infoblock {padding: 50px 0 20px 0;}
    .overview-infoblock2 {padding: 20px 0 20px 0;}
    .maincta h2 {font-size: 24px;}
    .maincta h4 {font-size: 18px;}
    .home-main-sidebar {display:none;}
    .content-infoblock h3 {font-size:24px;}
    .mobile-off {display:none;}
    .contactpage .maincta {padding: 20px 0 25px 0;}
    .contactpage-bussinessinfo {padding:0 15px 10px 15px;}
    .btn {width:100%;}
    .detailhero-text {padding:0px 15px;}
    .detailhero h1 {    font-size: 24px;        max-width: 100%;}
    .backto-overview {    left: 15px;}
    .detailhero h3 {    font-size: 16px;}
    .detail-vacature {    padding: 25px 15px 20px 15px;}
    .detail-vacature-tekst h4 {    font-size: 20px;}
    .maincta {    padding: 40px 15px 85px 15px;}
    .sollicitatie-form {padding:0px 15px;}
    .sollicitatie-intro-text {padding:0;}


    /*vacancy split page*/
    .vacancy-type-block-left {float:left; width:100%;margin-bottom:20px;}
    .vacancy-type-block-right {float:right; width:100%;margin-bottom:20px;}
    .vacancy-type-block-left-ins {padding-right:0px;}
    .vacancy-type-block-right-ins {padding-left:0px;}
    .vacancy-type-block-ins {background:#f4f0f0; padding:20px 30px;min-height:120px;}

/*website2024*/
    .bg-main {background-size: auto 400px;}
    .home-opener-text p {font-size: 1.2rem;  padding: 0 60px;}
    .home-opener-text h2 {font-size: 2rem; padding: 0 20px;}
    .home-opener-text {padding-top: 220px;}
    .home-main { padding-top: 20px; margin-top: 0px;    padding-left: 15px; padding-right: 15px;}
    .home-main-text1 {margin-left:0;    background: #316a72;margin-bottom:15px;}
    .home-main-text2 {padding: 10px 0px 10px 0px; border-bottom: 0px solid;}
    .home-main-text3 {margin-right:0;    background: #316a72;}
    .mr-neg-50 {margin-top:0;}
    .home-vacancies {padding: 40px 0 30px 0;}

    .pd-right-30 {padding-right:0;}
    .pd-left-30 {padding-left:0;}
    .split-mob-block {padding:0 15px;}
    .block-content-left {width:100%;}
    .block-content-right {width:100%;}
    .block-content-left img {border-radius: 30px;    height: 200px;}
    .block-content {padding: 15px 16px 55px 16px;}
    .home-jobs {padding: 30px 20px 35px 20px;text-align:center;}
    .footer-credits a {padding:0;}
    .footer-credits {padding: 16px 0 20px 0;}
    .footer-cols {text-align:center;}

    .footer-logo {margin-bottom:30px;}
    .slider {min-height: 350px;}
    .slide h2 {padding-top: 50px;font-size: 2rem;}
    .slide p {padding-top: 20px;padding-bottom: 20px;}
    .slide .btn {width: 200px!important;}
    .home-info {padding: 30px 15px 30px 15px;}
    .bg-main-vacancy .home-opener-text { padding-top: 200px!important;}
    .bg-main-vacancy .home-main {margin-top: -90px;background: none!important;}
    .bg-main-vacancy {background-size: auto 300px!important;}
    .img-block1-clients {padding-top:0px;}
    .procedure-block-cta {    padding: 0px 20px; text-align: center;}
    .cntr-footer {padding-right: 1rem!important; padding-left: 1rem!important;}
    .home-opener-text2 {padding-top: 280px;}
    .block-about-content-wrapper {padding: 40px 25px;  width: 90%; margin: 0 auto;}
    .block-about-content-wrapper h2 {padding-bottom: 15px;}
    .block-cta-left {width:100%;padding-bottom:20px;}
    .block-cta-right {width:100%;}
    .block-cta {    padding: 40px 20px 45px 20px;}
    .block-cta-right h2{width:100%;}
    .block-cta-right p{width:100%;}
    .block-maps-right {    padding: 0px 15px 40px 15px;}
    .block-maps-left {padding:0 15px;}
    .block-maps img {    height: 220px;width: 100%;object-fit: cover;}
    .block-maps-enlarge-map {    padding: 10px 0px 20px 0px;}
    .block-maps h2 {padding-left:15px;}

    .about-container-buttons {padding-top: 10px; text-align: center;}
    .about-container-buttons .filled-button {margin-bottom: 10px;margin-right:0px;}
    .about-container-buttons .filled-petrol-button {margin-bottom: 10px;margin-right:0px;}

    .block-main-content-wrapper {padding: 40px 25px;  width: 90%; margin: 0 auto;}
    .block-main-content-wrapper h2 {padding-bottom: 15px;}
    .block-main-content-left {width:100%;}
    .block-main-content-right {width:100%; padding-top:20px;}

    .block-main-content-right img {border-radius:30px; height:220px;}
    .highlight-jobs {padding: 50px 20px 55px 20px;}
    .box-highlight-job {width: 100%; padding-right: 0px;margin-bottom: 15px;min-width: 100% !important;}
    .block-highlight-job p.details {margin-bottom: 0px;}

    .block-procedure-item-left{width:100%;padding-right: 0px;}
    .block-procedure-item-right{width:100%;}
    .block-procedure {padding: 50px 20px 55px 20px;}
    .block-procedure-item h3 {font-size: 1.2rem;}
    .block-procedure h2 {    padding-bottom: 10px;}

    .block-content2 {padding: 50px 20px 55px 20px;}
    .block-content2-left {width:100%;}
    .block-content2-right {width:100%; padding-top:20px;}
    .block-content2-right img {border-radius:30px; height:220px;}
    .block-content2-left h2 {    padding-bottom: 15px;  padding-top: 0px;}

    .whitespace-100px {height:50px;}
    .grid-item-left {width:100%;min-height:200px;}
    .grid-item-right {width:100%;    padding: 30px 20px 20px 20px;}
    .block-grid {padding: 30px 20px 45px 20px;}
    .grid-item-right h3 {padding-bottom: 5px;}
    .grid-item-subdetails {padding-bottom: 0px;}

    .block-vacature-wrapper h1 {    font-size: 1.75rem;   padding-bottom: 15px;word-break: break-word;}
    .block-vacature {padding: 80px 20px 70px 20px;}
    .block-vacature-wrapper h3 {font-size: 1.2rem;}
.detail-vacature-left {width:100%}
    .detail-vacature-right {width:100%}
    .detail-vacature-titel {padding-right: 0px;}
    .detail-vacature-tekst h2 {padding-bottom: 10px; padding-top: 30px;}
    .detail-vacature {padding: 25px 20px 20px 20px;}

    .ll-carousel-item {min-width: 180px;}
    .ll-carousel-item img {max-height: 190px;}

    .flip-row {text-align: center!important;}
    .flip-container {margin: 0 auto 15px auto!important;float:none!important;}
.back a {color:#fff!important;}

    /*mobile menu*/

    .nav-mobile img {
        width: 45px;
        padding-top: 5px;
        position:absolute;
        top:27px;
        left:10px;
    }

    .overlay {
        /* Height & width depends on how you want to reveal the overlay (see JS below) */
        height: 100%;
        width: 0;
        position: fixed; /* Stay in place */
        z-index: 9999; /* Sit on top */
        left: 0;
        top: 0;
        background-color: rgb(0, 0, 0); /* Black fallback color */
        background-color: rgba(0, 70, 80, 0.9); /* Black w/opacity */
        overflow-x: hidden; /* Disable horizontal scroll */
        transition: 0.5s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width,  reveal) */
    }

    /* Position the content inside the overlay */
    .overlay-content {
        position: relative;
        top: 15%; /* 25% from the top */
        width: 100%; /* 100% width */
        text-align: left; /* Centered text/links */
        padding-left:20px;
        margin-top: 30px; /* 30px top margin to avoid conflict with the close button on smaller screens */
    }

    /* The navigation links inside the overlay */
    .overlay a {
        padding: 8px;
        text-decoration: none;
        font-size: 21px;
        color: #fff;
        display: block; /* Display block instead of inline */
        transition: 0.3s; /* Transition effects on hover (color) */
    }

    /* When you mouse over the navigation links, change their color */
    .overlay a:hover, .overlay a:focus {
        color: #f1f1f1;
    }

    /* Position the close button (top right corner) */
    .overlay .closebtn {
        position: absolute;
        top: 8px;
        right: 20px;
        font-size: 45px;
    }
}

/* When the height of the screen is less than 450 pixels, change the font-size of the links and position the close button again, so they don't overlap */
@media screen and (max-height: 450px) {
    .overlay a {font-size: 20px}
    .overlay .closebtn {
        font-size: 40px;
        top: 15px;
        right: 35px;
    }
}

.bg-vacancydetail-head {background: rgba(15, 15, 15, 0.55);}

.detail-vacature-tekst ul li p {margin-bottom: 0rem;}
.detail-vacature-tekst ul {margin-bottom: 2rem;}