/*
 Theme Name:     Brandeniers
 Theme URI:      Brandeniers.nl
 Description:    Brandeniers Child Theme
 Author:         Brandeniers
 Author URI:     Brandeniers.nl
 Template:       Divi
 Version:        1.0.0
*/


/* =Theme customization starts here
------------------------------------------------------- */
@media (max-width: 768px) {
  #case-slide-sectie {
    display: none;
  }
}

.gfield_signature_container canvas {
	z-index: 1 !important;
}

#main-content {
  background-color: transparent!important;
}

/*fonts & headings*/

#page-container #et-boc h1 {
  font-size: 50px;
  font-weight: 800;
  text-transform: uppercase;
  overflow: hidden;
}


#page-container #et-boc h2 {
  font-size: 50px;
  font-weight: 800;
  text-transform: uppercase;
  overflow: hidden;

}

#page-container #et-boc h3 {
  font-size: 25px;
  font-weight: 800;
  text-transform: uppercase;
  overflow: hidden;
}

#page-container #et-boc h4 {
  font-size: 18px;
  font-weight: 800;
  text-transform: uppercase;
  overflow: hidden;

}

#page-container #et-boc h5 {
  font-weight: bold;
  font-size: 17px;
  overflow: hidden;


}




#page-container #et-boc #main-content .et_pb_text_inner li {
	line-height: 2.2em;
	
}

#page-container #et-boc #main-content .et_pb_text_inner {
  font-weight: 600;
}

@media all and (max-width: 980px) {
  #page-container #et-boc h1 {
    font-size: 30px;

  }


  #page-container #et-boc h2 {
    font-size: 30px;


  }

  #page-container #et-boc h3 {
    font-size: 19px;

  }

  #page-container #et-boc h4 {
    font-size: 17px;


  }

  #page-container #et-boc h5 {
    font-weight: bold;
    font-size: 15px;


  }

  #page-container #et-boc #main-content .et_pb_text_inner {
    font-weight: 600;
  }
}


@media all and (max-width: 479px) {
  #page-container #et-boc h1 {
    font-size: 27px;

  }


  #page-container #et-boc h2 {
    font-size: 27px;


  }

  #page-container #et-boc h3 {
    font-size: 18px;

  }

  #page-container #et-boc h4 {
    font-size: 16px;


  }

  #page-container #et-boc h5 {
    font-weight: bold;
    font-size: 14px;


  }

  #page-container #et-boc #main-content .et_pb_text_inner {
    font-weight: 600;
  }
}

#page-container #et-boc .et-l--header ul {
  line-height: 2.2em!important;
}



:root {
  /* Default + branding colors */
  --blauw: #0086F4;
  --groen: #14B4A5;
  --rood: #D10D46;
  --paars: purple;


}

@media all and (min-width: 981px) {

  #page-container #et-boc .frameworks-tekst>.et_pb_text_inner,
  #page-container #et-boc .branding-web-activatie-driehoek-sectie>.et_pb_text_inner {
    padding-right: 20%;
  }
}

#page-container #et-boc .intro-tekst>.et_pb_text_inner {

  font-size: 17px;
  line-height: 1.8em;
  /* min-width: 500px; */
  max-width: 100%;
}

#page-container #et-boc .case-vacature-intro-tekst>.et_pb_text_inner {
  font-size: 17px;
  line-height: 1.8em;
}

/* Default + branding */
#page-container #et-boc .et-menu a:hover,
#page-container #et-boc .menu-item.kleur a:before,
#page-container #et-boc .blauw,
#page-container #et-boc .kleur,
#page-container #et-boc .menu-cta.kleur-bg-transparant:hover a {
  color: var(--blauw) !important;
}

#page-container #et-boc .blauw-bg,
#page-container #et-boc .kleur-bg {
  background-color: var(--blauw) !important;
}

#page-container #et-boc .kleur-bg-transparant {
  background-color: #0086F4e6;
}

.toggle-sectie .overlay.kleur-border:hover,
#page-container #et-boc .blauw-border,
#page-container #et-boc .kleur-border {
  border-color: var(--blauw);
}

::-moz-selection,
::selection {
  background-color: #0086F4e6;
  color: white;
}


::selection {
  background-color: var(--blauw);
  color: white;
}


#page-container #et-boc .compacte-tekst  .et_pb_text {
	max-width: 460px;
}

/* Web */
.body-kleur-groen  #page-container #et-boc .menu-cta.kleur-bg-transparant:hover a, 
.body-kleur-groen  #page-container #et-boc .kleur,
.body-kleur-groen #page-container #et-boc .et-menu a:hover,
.body-kleur-groen  #page-container #et-boc .menu-item.kleur a:before,
.body-kleur-groen  #page-container #et-boc .et-menu a:hover,
.vacature-categorie-team-web #page-container #et-boc .et-menu a:hover,
.page-id-279 #page-container #et-boc .et-menu a:hover,
.vacature-categorie-team-web #page-container #et-boc .menu-item.kleur a:before,
.page-id-279 #page-container #et-boc .menu-item.kleur a:before,
.vacature-categorie-team-web #page-container #et-boc .kleur-bg.et_pb_button:hover,
.vacature-categorie-team-web #page-container #et-boc .kleur,
#page-container #et-boc .groen,
.page-id-279 #page-container #et-boc .kleur,
.vacature-categorie-team-web #page-container #et-boc .menu-cta.kleur-bg-transparant:hover a,
.page-id-279 #page-container #et-boc .menu-cta.kleur-bg-transparant:hover a {
  color: var(--groen) !important;
}





.body-kleur-groen #page-container #et-boc .kleur-bg, 
.body-kleur-groen #page-container .vacature-lijstje-shortcode li:after,
.body-kleur-groen .toggle-sectie .active,
.vacature-categorie-team-web #page-container .vacature-lijstje-shortcode li:after,
.page-id-279 #page-container .vacature-lijstje-shortcode li:after,
.page-id-279 .toggle-sectie .active,
.vacature-categorie-team-web .toggle-sectie .active,
.vacature-categorie-team-web #page-container #et-boc .kleur-bg,
#page-container #et-boc .groen-bg,
.page-id-279 #page-container #et-boc .kleur-bg {
  background-color: var(--groen) !important;
}

.body-kleur-groen  #page-container #et-boc .kleur-bg-transparant,

.vacature-categorie-team-web #page-container #et-boc .kleur-bg-transparant,
.page-id-279 #page-container #et-boc .kleur-bg-transparant,
.vacature-categorie-team-web #page-container #et-boc .et_pb_button.kleur-bg {
  background-color: #14B4A5e6;
}
.body-kleur-groen #page-container #et-boc .kleur-border, 
.body-kleur-groen .toggle-sectie .overlay.kleur-border:hover,
.body-kleur-groen  .toggle-sectie .active,
.page-id-279 .toggle-sectie .active,
.vacature-categorie-team-web .toggle-sectie .active,
.vacature-categorie-team-web .toggle-sectie .overlay.kleur-border:hover,
.page-id-279 .toggle-sectie .overlay.kleur-border:hover,
.vacature-categorie-team-web #page-container #et-boc .kleur-border,
.vacature-categorie-team-web #page-container #et-boc .et_pb_button.kleur-border,
#page-container #et-boc .groen-border,
.page-id-279 #page-container #et-boc .kleur-border {
  border-color: var(--groen) !important;
}

.body-kleur-groen ::selection,
.vacature-categorie-team-web ::selection,
.page-id-279 ::selection {
  background-color: var(--groen);
  color: white;
}

/* Activatie */
.body-kleur-rood #page-container #et-boc .menu-cta.kleur-bg-transparant:hover a, 
.body-kleur-rood #page-container #et-boc .kleur,
.body-kleur-rood #page-container #et-boc .et-menu a:hover,
.body-kleur-rood #page-container #et-boc .menu-item.kleur a:before,
.vacature-categorie-team-activatie #page-container #et-boc .et-menu a:hover,
.page-id-285 #page-container #et-boc .et-menu a:hover,
.page-id-285 #page-container #et-boc .menu-item.kleur a:before,
.vacature-categorie-team-activatie #page-container #et-boc .menu-item.kleur a:before,
.vacature-categorie-team-activatie #page-container #et-boc .kleur-bg.et_pb_button:hover,
.vacature-categorie-team-activatie #page-container #et-boc .kleur,
#page-container #et-boc .rood,
.page-id-285 #page-container #et-boc .kleur,
.vacature-categorie-team-activatie #page-container #et-boc .menu-cta.kleur-bg-transparant:hover a,
.page-id-285 #page-container #et-boc .menu-cta.kleur-bg-transparant:hover a {
  color: var(--rood) !important;
}

.body-kleur-rood #page-container #et-boc .kleur-bg,
.body-kleur-rood #page-container .vacature-lijstje-shortcode li:after,
.body-kleur-rood .toggle-sectie .active,
.vacature-categorie-team-activatie #page-container .vacature-lijstje-shortcode li:after,
.page-id-285 #page-container .vacature-lijstje-shortcode li:after,
.page-id-285 .toggle-sectie .active,
.vacature-categorie-team-activatie .toggle-sectie .active,
.vacature-categorie-team-activatie #page-container #et-boc .kleur-bg,
#page-container #et-boc .rood-bg,
.page-id-285 #page-container #et-boc .kleur-bg {
  background-color: var(--rood) !important;
}

.body-kleur-rood #page-container #et-boc .kleur-bg-transparant,
.vacature-categorie-team-activatie #page-container #et-boc .kleur-bg-transparant,
.page-id-285 #page-container #et-boc .kleur-bg-transparant,
.vacature-categorie-team-activatie #page-container #et-boc .et_pb_button.kleur-bg {
  background-color: #D10D46e6;
}

.body-kleur-rood  #page-container #et-boc .kleur-border,
.body-kleur-rood  .toggle-sectie .overlay.kleur-border:hover,
.body-kleur-rood  .toggle-sectie .active,
.page-id-285 .toggle-sectie .active,
.vacature-categorie-team-activatie .toggle-sectie .overlay.kleur-border:hover,
.page-id-285 .toggle-sectie .overlay.kleur-border:hover,
.vacature-categorie-team-activatie #page-container #et-boc .kleur-border,
.vacature-categorie-team-activatie #page-container #et-boc .et_pb_button.kleur-border,
#page-container #et-boc .rood-border,
.page-id-285 #page-container #et-boc .kleur-border {
  border-color: var(--rood) !important;
}

.body-kleur-rood ::selection 
.vacature-categorie-team-activatie ::selection,
.page-id-285 ::selection {
  background-color: var(--rood);
  color: white;
}

#page-container #et-boc .underline {
  text-decoration: underline;
}

/*
@media all and (max-width: 980px) {
  #page-container #et-boc .usp-row>.et_pb_column {
  display: flex;
  align-items: center;
  text-align: left;
}

#page-container #et-boc .usp-row>.et_pb_column>div:nth-child(1) {
  width: 33.3%;
  margin-bottom: 0;
}
}

@media (max-width: 767px) {
  #page-container #et-boc  .usp-row>.et_pb_column>div:nth-child(1) {
    width: 50%;
  }
}
*/

#page-container #et-boc .usp-sectie-padding-top {
  padding-top: 15vh;
  padding-bottom: 15vh;
}


#page-container #et-boc .usp-row {
  column-gap: 5%;

}

#page-container #et-boc .usp-row h4 {
  text-align: center;
}

#page-container #et-boc .usp-row h4 {
  text-align: center;
}






@media all and (min-width: 1201px) {
  #page-container #et-boc .usp-row.vacature-usps {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  }

  #page-container #et-boc .usp-row.vacature-usps>div {
    width: 100%;

  }

  #page-container #et-boc .usp-row.vacature-usps>div .et_pb_image {

    margin-bottom: 30px;
  }

  #page-container #et-boc .usp-row.vacature-usps>div .et_pb_text {

    margin-bottom: 30px;
  }
}

@media all and (max-width: 1200px) {
  #page-container #et-boc .usp-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 12px;
  }

  #page-container #et-boc .usp-row>div {
    margin-bottom: 30px;
  }

  #page-container #et-boc .usp-row>div {
    width: 100%;
    display: flex;
  }

  #page-container #et-boc .usp-row .et_pb_text {
    text-align: left;
    margin-top: 22px;
  }

  #page-container #et-boc .usp-row h4 {
    text-align: left;
  }

  #page-container #et-boc .usp-row .et_pb_image {
    margin-right: 12px;
  }

  #page-container #et-boc .usp-row .dsm_lottie {
    margin-left: 0px !important;
    margin-right: 20px !important;
    min-width: 38px;
  }

}

@media all and (max-width: 479px) {
  #page-container #et-boc .usp-row {
    grid-template-columns: 1fr
  }
}



/*mobiele/tablet flex-row*/

@media all and (mAx-width: 980px) {
  #page-container #et-boc .mobiele-flex-row {
    display: flex;
    flex-direction: row;
  }

  #page-container #et-boc .mobiele-flex-row>div {
    margin-bottom: 0px;
  }

}



/* buttons */
#page-container #et-boc .et_pb_button {
  letter-spacing: 1.4px;
  font-weight: 800;
  padding: 0.8em 1em !important;
  font-size: 20px;
  line-height: 1.7em !important;

}

#page-container #et-boc .et_pb_button:hover {
  background-color: white !important;
  border-color: white !important;
}

#page-container #et-boc .et_pb_button.blauwe-knop {
  background-color: #0086f4e6;
  border-color: var(--blauw);
}

#page-container #et-boc .et_pb_button.blauwe-knop:hover {
  color: var(--blauw) !important;
  background-color: white !important;
  border-color: white !important;
}

#page-container #et-boc .et_pb_button.groene-knop {
  background-color: #14B4A5e6;
  border-color: var(--groen);
}

#page-container #et-boc .et_pb_button.groene-knop:hover {
  color: var(--groen) !important;
  background-color: white !important;
  border-color: white !important;
}



#page-container #et-boc .et_pb_button.rode-knop {
  background-color: #D10D46e6;
  border-color: var(--rood) !important;
}

#page-container #et-boc .et_pb_button.rode-knop:hover {
  color: var(--rood) !important;
  background-color: white !important;
  border-color: white !important;
}

/*--menu---*/
#page-container .et-menu a:hover {
  opacity: 1;
}

.toggle-sectie {
  text-align: right;
  position: fixed;
  right: 10%;
  z-index: 9999999;
  padding: 0;
  margin: 0;
  top: 54px;

}

#page-container #et-boc .toggle-sectie>div {
  margin: 0px;
  padding: 0px;
}

#page-container #et-boc .slide-in-menu {
  height: 100vh;
  background: #323232;
  top: 0;
  z-index: 6;
  transition: 0.3s all ease-in-out;
  position: fixed;
  right: -100%;
  width: 80%;
}

#page-container #et-boc .slide-in-menu.open {
  right: 0;
  opacity: 1;
  z-index: 999999;
}

 .brandeniers_overlay {
  position: fixed;
  top: 0;
  right: 100%;
  transition: .3s ease-in-out;
  background: rgb(0 0 0 / 80%);
  width: 100%;
  height: 100%;
  z-index: 9;
}

.brandeniers_overlay.open {
  right: 0;
}

body.open {
  overflow: hidden;
}

#page-container #et-boc .slide-in-toggle {
  display: block;
  z-index: 99999
}

header .et_builder_inner_content {
  z-index: 3;
}

#page-container #et-boc .slide-in-menu .et_pb_menu .et_pb_menu__menu {
  display: block;
  width: 100%;
}


/* Mega menu styling*/
#theme-builder-area--et_header_layout .slide-in-menu {
  display: none !important;
}

#page-container #et-boc #mega-menu-rij>div.menu-kolom {
  background-color: #000B25;

}


#page-container #et-boc #mega-menu-rij>div {
  padding-top: max(220px, 15%);
  padding-bottom: 5%;
  padding-right: 5%;
  padding-left: 5%;
}


@media all and (max-width: 1200px) {
	#page-container #et-boc #mega-menu-rij>div {

	    padding-top: max(170px, 10%);
}
}

#page-container #et-boc #mega-menu-rij>div.vacature-kolom {
  padding-left: 10%;
}

@media all and (min-width: 981px) {
  #page-container #et-boc #mega-menu-rij>div.menu-kolom {
    width: 620px;
  }
  #page-container #et-boc #mega-menu-rij>div.vacature-kolom {
    width: -webkit-fill-available;
        height: fit-content;
  }
}



#page-container #et-boc #mega-menu-rij>div.vacature-kolom:before {
  content:"";
  width: 100%;
  height: 100%;
  background-color: #0000001c;
  top: 0px;
  left: 0px;
  position: absolute;
}

#page-container #et-boc #mega-menu-rij>.vacature-kolom {
  padding-right: 10%;

}

#page-container #et-boc .vacature-kolom {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, 1fr);
  grid-column-gap: 5%;
  grid-row-gap: 5%;
}





#page-container #et-boc .menu-titel {
  grid-area: 1 / 1 / 2 / 3;
  padding-bottom: 54px;
}

#page-container #et-boc .menu-titel img {
  width: 100%;
}

#page-container #et-boc .menu-adres {
  grid-area: 2 / 1 / 3 / 2;
}

#page-container #et-boc .menu-vacatures {
  grid-area: 2 / 2 / 3 / 3;
}

#page-container #et-boc .menu-vacatures>div.et_pb_code_inner {
  float: right;
  margin-right: 54px;
}


#page-container #et-boc .mega-menu-menu ul.et-menu {
  display: block;
}

#page-container #et-boc .mega-menu-logo {
  position: absolute;
  top: 10%;
}

#page-container #et-boc .mega-menu-logo img {
  width: 200px;
  max-width: 60vw;

}

#page-container #et-boc .mega-menu-menu li {
  font-size: 30px;
  font-weight: 800;
  text-transform: uppercase;
  line-height: 1.5em;


}

#page-container #et-boc .mega-menu-menu li:after {
  content: "";
  background-color: var(--blauw);
  height: 1px;
  width: 100%;
  position: absolute;
  bottom: 0px;
  opacity: .2;
}

#page-container #et-boc .mega-menu-menu li.page-item-494:after {
  display: none;
}

.body-kleur-groen #page-container #et-boc .mega-menu-menu li:after,
.vacature-categorie-team-web #page-container #et-boc .mega-menu-menu li:after,
.page-id-279 #page-container #et-boc .mega-menu-menu li:after {
  background-color: var(--groen);
}

.body-kleur-rood  #page-container #et-boc .mega-menu-menu li:after, 
.vacature-categorie-team-activatie #page-container #et-boc .mega-menu-menu li:after,
.page-id-285 #page-container #et-boc .mega-menu-menu li:after {
  background-color: var(--rood);
}

.body-kleur-groen #page-container #et-boc .vacature-kolom,
.vacature-categorie-team-web #page-container #et-boc .vacature-kolom,
.page-id-279 #page-container #et-boc .vacature-kolom {
  background-image: url(/wp-content/uploads/2024/02/BRD-BG-Kleuren-Groen-1.jpg);
}
.body-kleur-rood #page-container #et-boc .vacature-kolom, 
.vacature-categorie-team-activatie #page-container #et-boc .vacature-kolom,
.page-id-285 #page-container #et-boc .vacature-kolom {
  background-image: url(/wp-content/uploads/2024/02/BRD-BG-Kleuren-Rood-1.jpg);
}




#page-container #et-boc .menu-cta {
  font-size: 26px;
  margin-top: 20px;
  margin-bottom: 27px;
  padding: 0px!important;

}
#page-container #et-boc .menu-cta > a {
  padding: 0.8em 1em !important;
}

#menu-hoofdmenu>li.menu-cta>a {
  padding: 0px;
  font-size: 20px;
  line-height: initial;
}

#page-container #et-boc .header-sectie-logo {
  max-width: 60vw;
}

#page-container #et-boc .alleen-mobiel-menu {
  display: none;
}

#page-container #et-boc .alleen-mobiel-menu.mailmobielmenu>a:before {
  content: "M";
  font-weight: bold;
  width: 24px;
  display: inline-block;
  text-transform: uppercase;
}

#page-container #et-boc .alleen-mobiel-menu.telefoonmobielmenu>a:before {
  content: "T";
  font-weight: bold;
  width: 24px;
  display: inline-block;
  text-transform: uppercase;
}



span.voorvoegsel {
  font-weight: bold;
  display: inline-block;
  width: 25px;
}

#page-container .menu-vacatures .vacature-lijstje-shortcode {
  padding-bottom: 27px;
}

#page-container #et-boc .vacature-lijstje-shortcode .vacature-2597 {
	display: none!important;
}

/*---mobiel menu ---*/
@media all and (max-width: 980px) {
  #page-container #et-boc #mega-menu-rij>div.vacature-kolom {
    display: none;
  }

  #page-container #mega-menu-rij .et_mobile_nav_menu {
    display: none;
  }

  #page-container #et-boc .mega-menu-logo {
    position: relative;
  }

  #page-container #et-boc .mega-menu-menu {
    margin-top: 40px;
  }

  #page-container #et-boc .mega-menu-menu li {
    font-size: 18px;
  }

  #page-container #et-boc .alleen-mobiel-menu {
    display: block;
    font-weight: 500 !important;
    text-transform: lowercase !important;

  }

  #page-container #et-boc #mega-menu-rij>div {
    padding-top: 74px;
  }

  #menu-hoofdmenu>li.menu-cta>a {
    font-size: 16px;
  }

  .toggle-sectie {
    transform: scale(.4);

    top: 0px;
    right: 0;
  }

  #page-container #et-boc header>div>div {
    padding-top: 0px;
    padding-bottom: 0px;
  }


}


@media all and (max-width: 479px) {
  #page-container #et-boc #mega-menu-rij>div {
    padding-top: 27px;
  }
}


#page-container #et-boc #mega-menu-rij {
	        overflow-y: scroll;
}



/*---home----*/

#page-container #et-boc .home-header-sectie {
  min-height: 99vh;
  height: 99vh;
}

#page-container #et-boc .home-header-sectie:after {
  content: "";
  position: absolute;
  top: 0px;
  left: 0px;
  height: 100%;
  width: 100%;
  display: block;
  background-image: linear-gradient(180deg, #000b25 0%, rgba(0, 11, 37, 0) 30%, rgba(0, 11, 37, 0) 70%, #000b25 100%) !important;

}



#page-container #et-boc .home-header-menu-rij {
  height: 100%;

}

#page-container #et-boc .home-header-menu-rij>div {
  height: 100%;
  min-height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}



/*branding/website/activatie/*/

#page-container #et-boc .dienst-achtergrond-afbeelding-sectie {
  min-height: 70vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
}



#page-container #et-boc .dienst-achterliggend-header {
  padding: 0;
}

#page-container #et-boc .dienst-achterliggend-header > .tekst-afbeelding-rij {
  width: 100%;
  max-width: 100%;
  padding: 0px;
}

#page-container #et-boc .dienst-achterliggend-header > .tekst-afbeelding-rij .tekst-kolom {
  padding-left: 10%;
  padding-right: 5%;
  padding-top: 54px;
  padding-bottom: 54px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

@media all and (min-width: 981px) {
.post-type-archive-vacatures #et-boc > header,
.single-vacatures  #et-boc > header,
.page-id-2464  #et-boc > header,
.page-id-2452  #et-boc > header,
.page-id-2429  #et-boc > header,
.page-id-2441  #et-boc > header,
.page-id-2415  #et-boc > header,
.page-id-404  #et-boc > header,
.page-id-287  #et-boc > header,
.page-id-285  #et-boc > header,
.page-id-279  #et-boc > header {
position: absolute;
width: 100%;

}

#page-container #et-boc .dienst-achterliggend-header > .tekst-afbeelding-rij .afb-kolom img,
#page-container #et-boc .dienst-achterliggend-header > .tekst-afbeelding-rij .afb-kolom {
  height: 100vh;
  object-fit: cover;
}

}


/*seo*/



/*----cases-----*/
@media all and (max-width: 980px) {
  #page-container #et-boc .case-grid {
    display: none;
  }

}

#page-container #et-boc .case-grid .dp-dfg-items {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(4, 1fr);
  grid-column-gap: 10px;
  grid-row-gap: 10px;
}

@media all and (max-width: 980px) {
  #page-container #et-boc .case-grid .dp-dfg-items {
    grid-template-columns: repeat(2, 1fr);
  }
}

#page-container #et-boc .case-grid.vijf-cases .dp-dfg-items {
  grid-template-rows: repeat(1, 1fr);
}

#page-container #et-boc .case-grid.case-grid-vijf .dp-dfg-items {
  grid-template-rows: repeat(1, 1fr);
}

#page-container #et-boc .case-grid .dp-dfg-skin-default .dp-dfg-item {
  background-color: #fff0;
}

#page-container .case-grid .dp-dfg-items>article {
  aspect-ratio: 1 / 1;
}

#page-container .case-grid .dp-dfg-items>article:nth-child(10n+1) {

  grid-area: 1 / 1 / 2 / 2;
}

#page-container .case-grid .dp-dfg-items>article:nth-child(10n+2) {

  grid-area: 1 / 2 / 2 / 3;
}

#page-container .case-grid .dp-dfg-items>article:nth-child(10n+3) {

  grid-area: 2 / 1 / 3 / 2;
}

#page-container .case-grid .dp-dfg-items>article:nth-child(10n+4) {

  grid-area: 2 / 2 / 3 / 3;
}



#page-container .case-grid .dp-dfg-items>article:nth-child(10n+5) {

  grid-area: 1 / 3 / 3 / 5;
}

#page-container .case-grid .dp-dfg-items>article:nth-child(10n+6) {
  grid-area: 3 / 1 / 5 / 3;
}

#page-container .case-grid .dp-dfg-items>article:nth-child(10n+7) {
  grid-area: 3 / 3 / 4 / 4;
}

#page-container .case-grid .dp-dfg-items>article:nth-child(10n+8) {
  grid-area: 3 / 4 / 4 / 5;
}

#page-container .case-grid .dp-dfg-items>article:nth-child(10n+9) {
  grid-area: 4 / 3 / 5 / 4;
}

#page-container .case-grid .dp-dfg-items>article:nth-child(10n+10) {
  grid-area: 4 / 4 / 5 / 5;
}

#page-container .case-grid .dp-dfg-items>article:nth-child(10n+11) {
  grid-area: 5 / 3 / 7 / 5;
}

#page-container .case-grid .dp-dfg-items>article:nth-child(10n+12) {
  grid-area: 5 / 1 / 6 / 2;
}

#page-container .case-grid .dp-dfg-items>article:nth-child(10n+13) {
  grid-area: 5 / 2 / 6 / 3;
}

#page-container .case-grid .dp-dfg-items>article:nth-child(10n+14) {
  grid-area: 6 / 1 / 7 / 2;
}

#page-container .case-grid .dp-dfg-items>article:nth-child(10n+15) {
  grid-area: 6 / 2 / 7 / 3;
}



@media all and (max-width: 980px) {
  #page-container .case-grid .dp-dfg-items {
    grid-template-columns: repeat(2, 1fr);
    /* Adjust to two columns */
    grid-template-rows: auto;
    /* Adjust rows to auto for dynamic sizing */
  }

  /* Adjust grid-area for each article to fit the two-column layout */
  #page-container .case-grid .dp-dfg-items>article:nth-child(10n+1) {
    grid-area: 1 / 1 / 2 / 3;
  }

  #page-container .case-grid .dp-dfg-items>article:nth-child(10n+2) {
    grid-area: 2 / 1 / 3 / 2;
  }

  #page-container .case-grid .dp-dfg-items>article:nth-child(10n+3) {
    grid-area: 2 / 2 / 3 / 3;
  }

  #page-container .case-grid .dp-dfg-items>article:nth-child(10n+4) {
    grid-area: 3 / 1 / 4 / 2;
  }

  #page-container .case-grid .dp-dfg-items>article:nth-child(10n+5) {
    grid-area: 3 / 2 / 4 / 3;
  }

  #page-container .case-grid .dp-dfg-items>article:nth-child(10n+6) {
    grid-area: 4 / 1 / 5 / 3;
  }

  #page-container .case-grid .dp-dfg-items>article:nth-child(10n+7) {
    grid-area: 5 / 1 / 6 / 2;
  }

  #page-container .case-grid .dp-dfg-items>article:nth-child(10n+8) {
    grid-area: 5 / 2 / 6 / 3;
  }

  #page-container .case-grid .dp-dfg-items>article:nth-child(10n+9) {
    grid-area: 6 / 1 / 7 / 2;
  }

  #page-container .case-grid .dp-dfg-items>article:nth-child(10n+10) {
    grid-area: 6 / 2 / 7 / 3;
  }

}




#page-container #et-boc .case-grid .dp-dfg-image {
  height: 100%;
}

#page-container #et-boc .case-grid .dp-dfg-item .dp-dfg-image {
  transition: 300ms all ease-in;
}

#page-container #et-boc .case-grid .dp-dfg-item:hover .dp-dfg-image {
  transform: scale(1.05);
}

#page-container #et-boc .case-grid .dp-dfg-image-link {
  height: 100%;

}

#page-container #et-boc .case-grid .dp-dfg-image-link .dp-dfg-featured-image {
  height: 100%;
  object-fit: cover;

}

#page-container #et-boc .case-grid .dp-dfg-image img {
	    object-fit: cover;
    height: 100%;
}

#page-container #et-boc .case-grid .dp-dfg-items .new-wrapper-class {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;

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


#page-container #et-boc .case-grid .new-wrapper-class {
  padding-left: 5%;
  padding-right: 5%;
  padding-bottom: 5%;
}


#page-container #et-boc .case-grid .new-wrapper-class> :nth-child(1) {
  order: 2;
  position: relative;
  translate: 0px 25px;
  transition: translate 300ms ease-in-out, opacity 300ms ease-in-out;
}

#page-container #et-boc .case-grid .new-wrapper-class> :nth-child(2) {
  order: 3;
  transition: opacity 300ms ease-in-out;
  opacity: 0;
}

#page-container #et-boc .case-grid .new-wrapper-class> :nth-child(3) {
  order: 1;
  translate: 0px 25px;
  opacity: 0;
  transition: translate 300ms ease-in-out, opacity 300ms ease-in-out;
}



#page-container #et-boc .case-grid .dp-dfg-items>article:hover .new-wrapper-class> :nth-child(3),
#page-container #et-boc .case-grid .dp-dfg-items>article:hover .new-wrapper-class> :nth-child(2) {
  opacity: 1;

}

#page-container #et-boc .case-grid .dp-dfg-items>article:hover .new-wrapper-class> :nth-child(1),
#page-container #et-boc .case-grid .dp-dfg-items>article:hover .new-wrapper-class> :nth-child(3) {
  translate: 0px 0px;
}


#page-container #et-boc .case-grid .dp-dfg-image.entry-thumb a:before {
  content: "";
  top: 0px;
  left: 0px;
  display: block;
  position: absolute;
  background-image: linear-gradient(0deg, #000b25cc 0%, rgba(0, 11, 37, 0) 35%, rgba(0, 11, 37, 0) 100%);
  width: 100%;
  height: 100%;
}

#page-container #et-boc .case-grid .dp-dfg-header.entry-header {
  padding-bottom: 12px;
}

#page-container #et-boc .dp_oc_post_meta.dp_oc_post_categories a,
#page-container #et-boc .single-case-terms .terms a,
#page-container #et-boc .case-grid .dp-dfg-meta.entry-meta>span.terms a {

  pointer-events: none;
  cursor: default;

  text-transform: uppercase;
  border: 1px solid #FFFFFF33;
  border-radius: 3px;
  opacity: 1;
  backdrop-filter: blur(50px);
  -webkit-backdrop-filter: blur(50px);
  padding: 4px 9px 4px 9px;
  letter-spacing: 0.91px;

  background: rgba(255, 255, 255, 0.2);
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}




#page-container #et-boc .case-grid .dp-dfg-meta.entry-meta>span.terms {
  display: inline-flex;
  gap: 6px;
  flex-wrap: wrap;
}

#page-container #et-boc .single-case-terms .terms a.activatie:hover,
#page-container #et-boc .case-grid .dp-dfg-meta.entry-meta>span.terms a.activatie:hover {
  background-color: var(--rood);
}

#page-container #et-boc .single-case-terms .terms a.branding:hover,
#page-container #et-boc .case-grid .dp-dfg-meta.entry-meta>span.terms a.branding:hover {
  background-color: var(--blauw);
}

#page-container #et-boc .single-case-terms .terms a.website:hover,
#page-container #et-boc .case-grid .dp-dfg-meta.entry-meta>span.terms a.website:hover {
  background-color: var(--groen);
}

@media all and (min-width: 981px) and (max-width: 1200px) {
  #page-container #et-boc .case-grid .dp-dfg-meta.entry-meta>span.terms a {
    font-size: 8px;
  }
}

@media all and (min-width: 1201px) and (max-width: 1400px) {
  #page-container #et-boc .case-grid .dp-dfg-meta.entry-meta>span.terms a {
    font-size: 9px;
  }
}


#page-container #et-boc .case-grid .dp-dfg-meta.entry-meta>span.terms .term-separator {
  display: none;
  ;
}

#page-container #et-boc .case-grid .dp-dfg-custom-content {
  text-transform: uppercase;
  letter-spacing: 0.91px;
}


#page-container #et-boc .case-grid .dp-dfg-filters ul.dp-dfg-level {
  column-gap: 10px;
  width: 50%;
  float: right;
  margin-top: -54px;
  padding-bottom: 54px;
}

#page-container #et-boc .case-grid .dp-dfg-filter a {
  background: transparent;
  font-weight: bold;
  text-transform: uppercase;
  border-radius: 5px;
  border: 1px solid #FFFFFF33;
  padding-left: 25px;
  padding-right: 25px;
  transition: all .3s ease-in-out;
}

#page-container #et-boc .case-grid .dp-dfg-filter a.branding:hover,
#page-container #et-boc .case-grid .dp-dfg-filter a.branding.active {
  background-color: var(--blauw);
  border: 1px solid var(--blauw);
}

#page-container #et-boc .case-grid .dp-dfg-filter a.website:hover,
#page-container #et-boc .case-grid .dp-dfg-filter a.website.active {
  background-color: var(--groen);
  border: 1px solid var(--groen);
}

#page-container #et-boc .case-grid .dp-dfg-filter a.activatie:hover,
#page-container #et-boc .case-grid .dp-dfg-filter a.activatie.active {
  background-color: var(--rood);
  border: 1px solid var(--rood);
}

#page-container #et-boc .case-grid .dp-dfg-filters ul.dp-dfg-level>li:nth-child(1) {
  order: 2;
}

#page-container #et-boc .case-grid .dp-dfg-filters ul.dp-dfg-level>li:nth-child(2) {
  order: 1;
}

#page-container #et-boc .case-grid .dp-dfg-filters ul.dp-dfg-level>li:nth-child(3) {
  order: 3;
}

@media all and (max-width: 980px) {
  #page-container #et-boc .drie-kleine-afbeeldingen-rij {
    display: flex;
  }
}


#page-container #et-boc .acf-dubbele-afbeeldingen,
#page-container #et-boc .acf-repeater-images {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(0px, 1fr));
}

#page-container #et-boc .acf-dubbele-afbeeldingen img,
#page-container #et-boc .acf-repeater-images img {
  width: 100%;
  max-width: 100%;
	height: 100%;
}



#page-container #et-boc .kleurenblok-cases img {
  min-height: 10px;
  object-fit: cover;
}



.postid-465 .tekstblok-4-sectie.et_pb_with_background.et_section_regular > div > div.et_pb_column.et_pb_column_1_2.et_pb_column_26_tb_body.et_pb_css_mix_blend_mode_passthrough.et-last-child,
.postid-64 .tekstblok-4-sectie.et_pb_with_background.et_section_regular > div > div.et_pb_column.et_pb_column_1_2.et_pb_column_26_tb_body.et_pb_css_mix_blend_mode_passthrough.et-last-child {
  visibility: hidden;
}


/*stapppen*/

#page-container #et-boc .case-stap-tekstblok {
  max-height: 60vh;
 overflow-y: hidden; 
  /* Enable vertical scrolling */
}

#page-container #et-boc .case-stap-tekstblok .read-more-btn {
  display: none;
  /* Hide the button by default */
  cursor: pointer;
  /* Add any additional styling for the button here */
}

#page-container #et-boc .case-stappen-sectie button.et_pb_button {
  font-size: 12px!important;
  background-color: transparent!important;
  border-color: white!important;
}




#page-container #et-boc .case-stappen-sectie button {
  background: transparent !important;
  border: 2px solid white !important;
  transform-origin: top left;
  transform: scale(.6)
}

#page-container #et-boc .case-stap-tekstblok.truncated:before {
  content: "";
  position: absolute;
  background-image: linear-gradient(0deg, rgba(0, 11, 37, 1) 0%, rgba(255, 255, 255, 0) 100%);
  height: 90px;
  width: 100%;
  left: 0;
  bottom: 0px;
  display: block;
  z-index: 99;
}




/*timeline kpi's*/
#page-container #et-boc .kpi-tijdlijn-sectie {
  padding-bottom: 0;
}

.kpi-counter-module {
  display: grid;
  /* grid-template-columns: repeat(6, 1fr); */
  grid-template-rows: repeat(2, 1fr);
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  text-align: center;
}

.kpi-counter-module:after {
  content: "";
  width: 100%;
  height: 1px;
  background-color: #ffffff40;
  position: absolute;
  top: 50%;
}


.kpi-counter-module>div.kpi-item:nth-child(1) {
  grid-area: 1 / 1 / 2 / 2;
}

.kpi-counter-module>div.kpi-item:nth-child(2) {
  grid-area: 2 / 2 / 3 / 3;
}

.kpi-counter-module>div.kpi-item:nth-child(3) {
  grid-area: 1 / 3 / 2 / 4;
}

.kpi-counter-module>div.kpi-item:nth-child(4) {
  grid-area: 2 / 4 / 3 / 5;
}

.kpi-counter-module>div.kpi-item:nth-child(5) {
  grid-area: 1 / 5 / 2 / 6;
}

.kpi-counter-module>div.kpi-item:nth-child(6) {
  grid-area: 2 / 6 / 3 / 7;
}


.kpi-counter-module>div.kpi-item:nth-child(odd):after {
  content: "";
  position: absolute;
  background-image: url(/wp-content/uploads/2024/02/circeltje.png);
  width: 20px;
  height: 20px;
  background-size: contain;
  background-repeat: no-repeat;
  width: 100;
  margin-top: -9px;
  z-index: 10;

}

.kpi-counter-module>div.kpi-item:nth-child(even):before {
  content: "";
  position: absolute;
  background-image: url(/wp-content/uploads/2024/02/circeltje.png);
  width: 20px;
  height: 20px;
  background-size: contain;
  background-repeat: no-repeat;
  width: 100;
  margin-top: -9px;
  z-index: 10;

}




.kpi-number {
  font-weight: bold;
  font-size: 50px;
  line-height: 1.8em;
  padding-top: 27px;
}


.kpi-description {
  padding-bottom: 27px;
}


@media all and (max-width: 980px) {
  .kpi-number {
    font-size: 30px;
  }

  .kpi-description {
    font-size: 12px;
  }
}

@media all and (max-width: 500px) {
  #page-container .kpi-counter-rij {
    margin-right: 0;
    width: 90%;
  }

  .teller-module {
    overflow-x: scroll;
  }
}





#page-container .et_pb_number_counter h6 {
  text-transform: uppercase;
}


#page-container .teller-dynamisch-container {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  text-align: center;
}

@media all and (max-width:1300px) {
  #page-container .teller-dynamisch-container {

    grid-template-columns: 1fr 1fr;

  }
}
@media all and (max-width: 479px) {
  #page-container .teller-dynamisch-container {

    grid-template-columns: 1fr;

  }
}

/*partner logo's*/

.partner-logos>div {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  flex-wrap: wrap;
  opacity: .7;
}

.partner-logos>div>div {
  margin: 0px !important;
}

#page-container #et-boc .partner-logos>div>div {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

@media all and (max-width: 980px) {
  #page-container #et-boc .partner-logos>div {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 27px;

  }
}

#page-container #et-boc .marquee a {
  pointer-events: none;
  cursor: default;
}


/*social icons*/
#page-container #et-boc .et_pb_social_media_follow li a.icon {
  border-radius: 100px;
}




/*footer*/

#page-container #et-boc .contact-voor {
  width: 21px;
  display: inline-block;
}

#page-container #et-boc .footer-menu .menu-cta {
  display: none;
}

#page-container #et-boc .footer-menu a {
  text-transform: uppercase;
}


#page-container #et-boc .footer-menu .et-menu li>a {
  padding-top: 0px;
}

#page-container #et-boc .footer-menu li:not(:nth-last-child(-n+4)) {
  border-right: 1px solid #ccc;
  /* Adjust color (#ccc) and width (1px) as needed */
  margin-right: 20px;
  /* Adjust spacing between menu items if needed */
  padding-right: 20px;
  /* Adjust padding to ensure the divider does not touch the text */
}



#page-container #et-boc .footer-sitemap-sectie h4 {
  margin-bottom: 22px;
}

@media all and (min-width: 981px) {
  #page-container #et-boc .footer-sitemap-sectie>div {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
  }

  #page-container #et-boc .footer-sitemap-sectie>div>div {
    width: 100%;
  }

  #page-container #et-boc .footer-sitemap-sectie>div>div:nth-child(1) img {
    width: 80%;
    max-width: 300px;
  }
}

@media all and (max-width: 980px) {
  #page-container #et-boc .footer-sitemap-sectie>div {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-column-gap: 6px;
    grid-row-gap: 6px;
  }

  #page-container #et-boc .footer-sitemap-sectie>div>div:nth-child(1) {
    grid-area: 1 / 1 / 2 / 3;
    width: 100%;
  }

  #page-container #et-boc .footer-sitemap-sectie>div>div:nth-child(2) {
    grid-area: 3 / 1 / 4 / 2;
    width: 100%;
  }

  #page-container #et-boc .footer-sitemap-sectie>div>div:nth-child(3) {
    grid-area: 3 / 2 / 4 / 3;
    width: 100%;

  }

  #page-container #et-boc .footer-sitemap-sectie>div>div:nth-child(4) {
    grid-area: 2 / 1 / 3 / 3;
    padding-bottom: 54px;
    padding-top: 27px;
    width: 100%;

  }

  #page-container #et-boc .footer-nav-sectie .et_pb_column--with-menu,
  #page-container #et-boc .footer-sitemap-sectie>div>div:nth-child(4) .et_pb_text {
    display: none;
  }

  #page-container #et-boc .footer-nav-sectie {
    background-color: #000b25 !important;
  }

  #page-container #et-boc .footer-nav-sectie .et_pb_image_wrap {
    text-align: left;
  }

}

@media all and (max-width: 479px) {
  #page-container #et-boc .footer-sitemap-sectie>div {
    grid-template-columns: 1fr;
  }

  #page-container #et-boc .footer-sitemap-sectie>div>div:nth-child(1) {
    grid-area: 1 / 1 / 2 / 2;
    width: 100%;
  }

  #page-container #et-boc .footer-sitemap-sectie>div>div:nth-child(2) {
    grid-area: 3 / 1 / 4 / 2;
    width: 100%;
  }

  #page-container #et-boc .footer-sitemap-sectie>div>div:nth-child(3) {
    grid-area: 4 / 1 / 5 / 2;
    width: 100%;

  }

  #page-container #et-boc .footer-sitemap-sectie>div>div:nth-child(4) {
    grid-area: 2 / 1 / 3 / 2;
    padding-bottom: 54px;
    padding-top: 27px;
    width: 100%;

  }
}



#page-container #et-boc .mockup-afb
{
width: 50%;
display: inline-block;
}

#page-container #et-boc .mockup-afb > span.et_pb_image_wrap  {
	    width: 75%;
    margin-left: 15%;
}


/*----horizontale scroll-----*/

#page-container #et-boc .horizontal-section {
  height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
}





/*------Over ons ------*/


/*team*/

#page-container #et-boc .team-grid .dp-dfg-items {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-column-gap: 20px;
  grid-row-gap: 20px;
}

@media all and (min-width: 981px) {
  #page-container #et-boc .team-rij>.et_pb_column_1_4 {
    width: calc(25% - 20px);
    float: right;
    padding: 3%;
    border-radius: 10px;

  }
}

@media all and (max-width: 980px) {
  #page-container #et-boc .team-grid .dp-dfg-items {
    grid-template-columns: repeat(2, 1fr);

  }

  #page-container #et-boc .team-rij>.et_pb_column_1_4 {
    padding: 10%;
    top: 27px;

  }
}

@media all and (max-width: 767px) {
  #page-container #et-boc .team-grid .dp-dfg-items {

    grid-template-columns: repeat(1, 1fr);
  }
}


#page-container #et-boc .team-grid .dp-dfg-custom-content {
  aspect-ratio: 338 / 446;
}


#page-container #et-boc .team-grid .dp-dfg-cf-foto_standaard,
#page-container #et-boc .team-grid .dp-dfg-cf-foto_standaard_kopie {
  position: absolute;
  top: 0;
  transition: all 300ms ease-in-out;
  padding-bottom: 0px !important;
  width: 100%;
  height: 100%;
  min-width: 100%;
  max-width: 100%;

}

#page-container #et-boc .team-grid .dp-dfg-cf-foto_standaard img,
#page-container #et-boc .team-grid .dp-dfg-cf-foto_standaard_kopie img,
#page-container #et-boc .team-grid .dp-dfg-cf-foto_standaard span,
#page-container #et-boc .team-grid .dp-dfg-cf-foto_standaard_kopie span {
  width: 100%;
  height: 100%;
  min-width: 100%;
  max-width: 100%;
}

#page-container #et-boc .team-grid .dp-dfg-cf-foto_standaard {
  opacity: 1;
}

#page-container #et-boc .team-grid .dp-dfg-cf-foto_standaard_kopie {
  opacity: 0;
}

#page-container #et-boc .team-grid .dp-dfg-custom-content:hover .dp-dfg-cf-foto_standaard_kopie {
  opacity: 1;
}

#page-container #et-boc .team-grid .dp-dfg-custom-content:hover .dp-dfg-cf-foto_standaard {
  opacity: 0;
}

#page-container #et-boc .team-grid .dp-dfg-cf-foto_standaard img,
#page-container #et-boc .team-grid .dp-dfg-cf-foto_standaard_kopie img {
  border-radius: 10px;
}

#page-container #et-boc .team-grid .dp-dfg-custom-content {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

#page-container #et-boc .team-grid .dp-dfg-cf-functie,
#page-container #et-boc .team-grid .dp-dfg-cf-weergave_naam {
  z-index: 4;
  position: relative;
  padding-bottom: 0px;
  padding-left: 12px;
}

#page-container #et-boc .team-grid .dp-dfg-cf-weergave_naam span {
  font-weight: 900;
  text-transform: uppercase;
  font-size: 18px;
  line-height: 1em;
}

#page-container #et-boc .team-grid .dp-dfg-cf-functie span {
  text-transform: uppercase;
  font-size: 14px;
}


/*contact*/

#page-container #et-boc .contactgegevens-kolom {
  padding: 4%;
  border-radius: 10px;
  font-size: 19px;
}

#page-container #et-boc .contactgegevens-kolom p {
  padding-bottom: 0px!important;
}
#page-container #et-boc .contactgegevens-kolom h2 {
padding-bottom: 27px;
}
@media all and (max-width:980px ){
  #page-container #et-boc .contactgegevens-kolom {
    padding: 27px;
  }
}





hr.solid {
  opacity: .2;
  margin-block-start: 0;
  border-top: none;
  border-left: 0;
  border-right: 0;
  padding-top: 8px;
  padding-bottom: 12px;
  margin-bottom: 19px;
}

.gform_wrapper.gravity-theme .gfield textarea.medium {
  height: 133px;
}

#gform_2 > div.gform_footer.top_label {
  margin-bottom: 0;
    padding-bottom: 0px;
}
#gform_submit_button_2 {
  margin-bottom: 0px;
}

#page-container .formulier-witte-velden #gform_submit_button_2 {
background-color: #000B25!important;
	color: white!important;
}

.formulier-witte-velden #gform_2 input, 
.formulier-witte-velden #gform_2 textarea {
	background-color: #fff!important;
	    color: #000!important;

}

.formulier-witte-velden #gform_2 .ginput_container ::placeholder {
  color: #000 !important;
}


/* Animation */
@keyframes beat {
  to {
    transform: scale(1.4);
  }
}

.toggle-sectie .overlay {
  width: 75px;
  height: 75px;
  transition: 0.4s linear;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  flex-wrap: wrap;

  background: rgba(255, 255, 255, 0.2);
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(5px);
  border: 1px solid white;
  border-radius: 100px;
}

.toggle-sectie .overlay:hover {
  border-color: var(--blauw);
  cursor: pointer;
}

.toggle-sectie .overlay:hover .button:before,
.toggle-sectie .overlay:hover .button:after {
  width: 35px;
}

.toggle-sectie .button {
  width: 70px;
  height: 10px;
  background: #ffffff;
  transition: 900ms 175ms cubic-bezier(.6, -0.46, .21, 1.3);
  transform: skew(-9deg, -16deg) scale(0.45) rotate3d(1, 1, 1, -15deg)
}

.toggle-sectie .button:before,
.toggle-sectie .button:after {
  content: '';
  transition: 400ms cubic-bezier(1, -0.81, .17, 1.2);
  width: 70px;
  height: 10px;
  display: flex;
  background: #ffffff;
  position: relative;
}


.toggle-sectie .button:before {
  transform-origin: right;
  top: -25px;
}

.toggle-sectie .button:after {
  bottom: -16px;
  transform-origin: left;
  float: right;
}

.toggle-sectie .active .button:before {
  top: -34px;

}

.toggle-sectie .active .button:after {
  bottom: -23px;
}

.toggle-sectie .active {
  background: var(--blauw);
  border-color: var(--blauw);
  transform: rotate(270deg);
}


.toggle-sectie .active .button {
  transform: rotate(-45deg) scale(0.45);

}


.toggle-sectie .active .button:before,
.toggle-sectie .active .button:after {
  width: 35px;
  transform: rotate(-90deg);
}

@media all and (max-width: 980px) {
  .toggle-sectie .overlay {
    transform: scale(1.5);
    margin-top: 15px;
  }
}


/*-----single cases-----*/

#page-container #et-boc .case-categorieen-selecteren a {
  text-transform: uppercase;
  border: 1px solid #FFFFFF33;
  border-radius: 3px;
  opacity: 1;
  backdrop-filter: blur(50px);
  -webkit-backdrop-filter: blur(50px);
  padding: 4px 9px 4px 9px;
  letter-spacing: 0.91px;
  background: rgba(255, 255, 255, 0.2);
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}

#page-container #et-boc .case-categorieen-selecteren a #page-container #et-boc .case-categorieen-selecteren>div {
  color: transparent;
}

.single-cases #page-container header {
  position: absolute;
width: 100%;
}


#page-container #et-boc .specs-kolom {
  padding: 3%;
  border-radius: 10px;
}

@media all and (max-width: 980px) {
  #page-container #et-boc .specs-kolom {
    padding: 27px;
  }
}

div.werkzaamheden-lijst {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
    column-gap: 8px;
    text-transform: capitalize;
}

div.werkzaamheden-lijst span:not(:last-child)::after {
  content: "|";
  margin-left: 10px;
}

ul.samenwerkingen-lijst {
  padding: 0;
  list-style: none;
}

.in-samenwerking-titel {
  padding-bottom: 1em!important;
}


#page-container #et-boc .case-headerafbeelding-sectie {
  aspect-ratio: 21 / 9;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  flex-wrap: wrap;
}

#page-container #et-boc .case-headerafbeelding-sectie>div {
  padding-bottom: 0vh;
  margin-bottom: 10vh;
  padding-top: 20vh;
}


#page-container #et-boc .case-afbeelding-grid .et_pb_column {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(4, 1fr);
  grid-column-gap: 10px;
  grid-row-gap: 10px;
}
#page-container #et-boc .case-afbeelding-grid {
	padding-top: 10px;
}
#page-container #et-boc .case-afbeelding-grid > div,

	padding-top: 0px;
}

#page-container #et-boc .case-afbeelding-grid .et_pb_column>div {
  margin-bottom: 0px;
}

#page-container #et-boc .case-afbeelding-grid .et_pb_column>div>span {
  height: 100%;
  min-height: 100%;
  width: 100%;
  max-width: 100%;
  min-width: 100%;
}

#page-container #et-boc .case-afbeelding-grid .et_pb_column img {
  height: 100%;
  min-height: 100%;
  width: 100%;
  max-width: 100%;
  min-width: 100%;
  object-fit: cover;
  border-radius: 5px;
}

#page-container #et-boc .case-afbeelding-grid .et_pb_column>div:nth-child(1) {
  grid-area: 1 / 1 / 3 / 3;
	    margin-bottom: 0px!important;
}

#page-container #et-boc .case-afbeelding-grid .et_pb_column>div:nth-child(2) {
  grid-area: 1 / 3 / 3 / 4;
	 margin-bottom: 0px!important;
}

#page-container #et-boc .case-afbeelding-grid .et_pb_column>div:nth-child(3) {
  grid-area: 3 / 1 / 4 / 2;
	 margin-bottom: 0px!important;
}

#page-container #et-boc .case-afbeelding-grid .et_pb_column>div:nth-child(4) {
  grid-area: 4 / 1 / 5 / 2;
	 margin-bottom: 0px!important;
}

#page-container #et-boc .case-afbeelding-grid .et_pb_column>div:nth-child(5) {
  grid-area: 3 / 2 / 5 / 4;
	 margin-bottom: 0px!important;
}

@media all and (max-width: 767px) {
  #page-container #et-boc .case-afbeelding-grid>div>div {
    display: flex !important;
    flex-direction: column;
  }
}


/*case pagination*/

#page-container #et-boc .dp-dfg-pagination .pagination-item a {
  background: rgba(255, 255, 255, 0.2);
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(5px);
  border-radius: 5px;
  -webkit-backdrop-filter: blur(5px);
  font-weight: bold;
}

#page-container #et-boc .dp-dfg-pagination .pagination-item.active a {
  color: #000;
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(0px);
  border-radius: 5px;
  -webkit-backdrop-filter: blur(0px);
  background-color: white;
}

#page-container #et-boc .dp-dfg-pagination .pagination {
  gap: 5px;
}


/*--mobiele case carousel -----*/

@media all and (min-width: 981px) {
  #page-container #et-boc .mobiele-case-slider {
    display: none;

  }
}

#page-container #et-boc .mobiele-case-slider .owl-nav button {

  color: white;
  opacity: 1;
  bottom: -33px;
  top: inherit;
  width: fit-content;
}

#page-container #et-boc .mobiele-case-slider .owl-nav button:before {
  border: 1px solid white;
  border-radius: 100%;
  background: rgba(255, 255, 255, 0.2);
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(5px);
  font-size: 47px;
}

#page-container #et-boc .owl-dots {
  text-align: center;
  margin-top: 40px;


  display: flex;
  width: 40%;
  margin-left: 10%;

}
#page-container #et-boc .mobiele-case-slider .owl-item img,
#page-container #et-boc .mobiele-case-slider .owl-item > div
#page-container #et-boc .mobiele-case-slider .owl-item {
  aspect-ratio: 1/1;
  object-fit: cover;
}

#page-container #et-boc .mobiele-case-slider .owl-nav button.owl-next {
  right: 22px;
}

#page-container #et-boc .mobiele-case-slider .owl-nav button.owl-prev {
  left: initial;
  right: 80px;
}

#page-container #et-boc .owl-dots .owl-dot.active {
  opacity: 1;
}

#page-container #et-boc .owl-dots .owl-dot {
  opacity: .3;
  border-radius: 0;
  margin: 0;
  width: -webkit-fill-available;
  height: 4px;
}

#page-container #et-boc .mobiele-case-slider img {
  border-radius: 5px;
}


#page-container #et-boc .combined-info {
  position: absolute;
  bottom: 0;
  display: grid;
  padding: 5%;
}

#page-container #et-boc .combined-info .dp_oc_post_title {
  order: 2;
  line-height: 1.2em;
}

#page-container #et-boc .combined-info .post-meta.dp_oc_post_meta {
  order: 3;
}

#page-container #et-boc .combined-info .post-meta.dp_custom_field {
  order: 1;
}

#page-container #et-boc .combined-info .post-meta.dp_custom_field .dp_custom_field_name {
  display: none;

}

#page-container #et-boc .combined-info .post-meta.dp_custom_field .dp_custom_field_value {
  text-transform: uppercase;
}


#page-container #et-boc .post-meta.dp_oc_post_meta.dp_oc_post_categories {
  color: transparent;
}


#page-container #et-boc .post-meta.dp_oc_post_meta.dp_oc_post_categories a {
  color: white;
}

#page-container #et-boc .dp_oc_item>a:before {
  content: "";
  top: 0px;
  left: 0px;
  display: block;
  position: absolute;
/*   background-image: linear-gradient(0deg, #000b25cc 0%, #000b2575 35%, rgba(0, 11, 37, 0) 100%); */
	background-image: linear-gradient(0deg, #000b25cc 0%, #000b2575 23%, rgba(0, 11, 37, 0) 33%);
  width: 100%;
  height: 100%;
}


/*----stappen----*/

#page-container #et-boc .hoe-tp-werkt-cat {
  display: flex;
  gap: 40px;
  padding: 0 !important;
  /* overflow-x: scroll; */
  justify-content: flex-start;
}

#page-container #et-boc .hoe-tp-werkt-cat li {
  list-style-type: none;
  cursor: pointer;
}

#page-container #et-boc .hoe-tp-werkt-cat li.selected-cat {
  border-bottom: 2px solid var(--blauw);
  font-weight: bold;


}

#page-container #et-boc .hoe-tp-werkt-cat ul li a {
  color: var(--blauw);
}

@media all and (max-width: 980px) {
  #page-container #et-boc .hoe-werkt-het-rij {
    display: block;
  }
}

@media all and (max-width: 980px) {
  #page-container #et-boc .hoe-werkt-het-rij>div.getal-stap-kolom {
    display: none;
  }


}

@media all and (max-width: 350px) {
  #page-container #et-boc .hoe-tp-werkt-cat {
    display: block;
  }

  #page-container #et-boc .hoe-tp-werkt-cat li:not(:last-child):after {
    display: none;
  }
}

#page-container #et-boc #hoe-het-werkt .et_pb_code_inner,
#hoe-het-werkt .et_pb_code_1,
#hoe-het-werkt .et_pb_code_2,
#hoe-het-werkt .et_pb_module,
#hoe-het-werkt .et_pb_column {
  position: unset;
}

#page-container #et-boc button.previousCat,
button.nextCat {
  border: 2px solid #fff;
  background: #fff;
  color: #Fff;
  padding: 10px 15px;
  border-radius: 100px;
  font-weight: bold;
  cursor: pointer;
  position: absolute;
  top: -65px;
  font-size: 1rem;
  transition: .3s ease-in-out;
}

#page-container #et-boc button.previousCat:hover,
button.nextCat:hover {
  background-color: #fff;
  color: #019cb8;
}

#page-container #et-boc button.previousCat {
  left: 0;
}

#page-container #et-boc button.nextCat {
  right: 0;
}




#page-container #et-boc .afb-slide,
#page-container #et-boc .text-slide {
  opacity: 0;
  visibility: hidden;
  max-height: 0;
  transition: opacity 1.3s;
  margin-bottom: 0px !important;
}

#page-container #et-boc .afb-slide.selected-cat,
#page-container #et-boc .text-slide.selected-cat {
  opacity: 1;
  max-height: fit-content;
  visibility: visible;
}



/*#page-container #et-boc html {
scroll-behavior: smooth
}*/

#page-container #et-boc .case-stappen-sectie ul.bullets-nav {
  list-style-type: none;
  margin: auto;
  text-align: center
}

#page-container #et-boc .case-stappen-sectie .bullets-nav li {
  display: inline-block;
  cursor: pointer;
  margin-right: 5px
}

#page-container #et-boc .case-stappen-sectie .bullets-nav li a {
  display: inline-block;
  width: 10px;
  height: 10px;
  font-size: 0;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  outline: none;
  box-sizing: border-box;
  transition: .3s ease-in-out;
  border: 2px solid #fff;
  border-radius: 50%
}

#page-container #et-boc .case-stappen-sectie .bullets-nav li a.selected-cat {
  background-color: #fff
}

#page-container #et-boc .case-stappen-sectie .categories a {
  color: #fff;
  text-transform: uppercase;

}

.subtitle {
  font-weight: bolder;
  text-transform: uppercase;
}

.flex {
  display: flex;
  align-items: center;
  padding-bottom: 5vh;
}

.flex li {
  opacity: 0.6;
  list-style-type: none;
  margin-right: 25px;
  font-weight: bolder;
}

.flex li.active {
  opacity: 1;
  border-bottom: 1px solid var(--blauw);
}




/*---Werken bij / vacatures-----*/
#page-container #et-boc .onze-vacatures {
  padding-top: 10vh;
  padding-bottom: 10vh;
}


#page-container #et-boc .usp-sectie {
  padding-top: 10vh;
  padding-bottom: 10vh;
}

@media all and (max-width: 767px) {
  #page-container #et-boc .usp-sectie {
    padding-top: 0;
    padding-bottom: 0;
  }
  .post-type-archive-vacatures #page-container #et-boc .usp-sectie {
    padding-top: 54px;

  }
  #page-container #et-boc .cases-sectie  {
    padding-top: 0px;
  }

  #page-container #et-boc .usp-sectie-padding-top {

    padding-bottom: 0;
  }
}

.home #page-container #et-boc .usp-sectie-padding-top .et_pb_column {
  width: 16.6666667%;
  margin-right: 0%;
}




#page-container .vacature-grid .dp-dfg-item {
  background: rgba(255, 255, 255, 0.2);
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(5px);
}

#page-container .vacature-grid .dp-dfg-item {
  display: grid;
  grid-template-columns: 1fr 50px;
  grid-template-rows: repeat(2, 1fr);
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  padding: 27px;
}

#page-container .vacature-grid .dp-dfg-item>div.dp-dfg-header {
  grid-area: 1 / 1 / 2 / 2;
  align-self: end;
}

#page-container .vacature-grid .dp-dfg-item>div.read-more-wrapper {
  grid-area: 1 / 2 / 3 / 3;
  align-self: center;
}

#page-container .vacature-grid .dp-dfg-item>div.dp-dfg-custom-content {
  grid-area: 2 / 1 / 3 / 2;
}

#page-container .vacature-grid .dp-dfg-item>div.read-more-wrapper {
  content: url(/wp-content/uploads/2024/02/pijl-rechts.svg);
}

#page-container .solliciteer-nu-rij {
  background: #0086F499 0% 0% no-repeat padding-box;
  border-radius: 10px;
  opacity: 1;
  padding: 5%;
  backdrop-filter: blur(30px);
  -webkit-backdrop-filter: blur(30px);
}

#page-container #et-boc .dp-dfg-item.vacature-categorie-team-branding:hover {
  background-color: var(--blauw);
}

#page-container #et-boc .dp-dfg-item.vacature-categorie-team-web:hover {
  background-color: var(--groen);
}

#page-container #et-boc .dp-dfg-item.vacature-categorie-team-activatie:hover {
  background-color: var(--rood);
}





#page-container .vacature-lijstje-shortcode {
  padding: 0px;
}

#page-container .vacature-lijstje-shortcode {
  list-style: none;
}

#page-container .team-rij .vacature-lijstje-shortcode {
  padding-top: 20px;
}



#page-container .team-rij .vacature-lijstje-shortcode>li:not(:last-child) {
  border-bottom: 1px solid #ffffff36;
  padding-bottom: 10px;
}

#page-container .team-rij .vacature-lijstje-shortcode>li:not(:first-child) {
  padding-top: 7px;
}

#page-container .vacature-lijstje-shortcode li:after {
  width: 10px;
  height: 10px;
  content: "";
  position: absolute;
  border-radius: 100%;
  margin-left: 2px;
  background-color: var(--blauw);

}


/*
#page-container .vacature-lijstje-shortcode li.team-activatie:after {
  background-color: var(--rood);
}

#page-container .vacature-lijstje-shortcode li.team-branding:after {
  background-color: var(--blauw);
}

#page-container .vacature-lijstje-shortcode li.team-web:after {
  background-color: var(--groen);
}

#page-container .vacature-lijstje-shortcode li.team-administratie-overig:after {
  background-color: var(--paars);
}
*/


/*---werkwijze driehoek------*/

#page-container .brandeniers-werkwijze-driehoek .wit-transparante-knop {
  background: transparent;
  border: 2px solid white;
}


#page-container .brandeniers-werkwijze-driehoek img {
  width: 100%;
  padding: 54px 0px 54px 54px;

}

#page-container .brandeniers-werkwijze-driehoek>div>div:nth-child(2) {
  position: absolute;
  top: -22px;
  right: 0px;
}

#page-container .brandeniers-werkwijze-driehoek>div>div:nth-child(3) {
  position: absolute;
  top: 30%;
}

#page-container .brandeniers-werkwijze-driehoek>div>div:nth-child(4) {
  position: absolute;
  bottom: -24px;
  right: 0px;
}

@media (max-width: 1920px) {
  .brandeniers-werkwijze-driehoek>div>div {
    transform: scale(0.7);
  }

  #page-container .brandeniers-werkwijze-driehoek>div>div:nth-child(3) {
    top: 25%
  }

  #page-container .brandeniers-werkwijze-driehoek>div>div:nth-child(2),
  #page-container .brandeniers-werkwijze-driehoek>div>div:nth-child(4) {
    right: -35px;
  }
}

@media (max-width: 1300px) {
  #page-container .brandeniers-werkwijze-driehoek>div>div:nth-child(3) {
    top: 22%
  }
}

@media (max-width: 768px) {
  .brandeniers-werkwijze-driehoek>div>div {
    transform: scale(0.5);
  }

  #page-container .brandeniers-werkwijze-driehoek>div>div:nth-child(3) {
    position: absolute;
    top: 23%;
    left: -10%;
  }

  #page-container .brandeniers-werkwijze-driehoek>div>div:nth-child(2) {
    right: -35px;
  }

  #page-container .brandeniers-werkwijze-driehoek>div>div:nth-child(4) {
    position: absolute;
    bottom: -20px;
    right: -35px;
  }
}



#page-container #et-boc .et_pb_button.transp-activatieknop:hover {
  color: var(--rood) !important;
}

#page-container #et-boc .et_pb_button.transp-webknop:hover {
  color: var(--groen) !important;
}

/*-----Gravity forms-------*/

#page-container .gfield_description,
#page-container .gfield_label {
  color: white;
  text-transform: uppercase;
  font-weight: 900;
}

.gfield_validation_message li {
	color: #0086F499;
}

#page-container .gform_footer {
  float: right;
}

#page-container .gform_button {
  background: #000B25;
  color: white;
}



.lekker-gaan::selection {

  color: var(--rood);

}

#gform_2 input,
#gform_2 textarea {
  background: transparent;
  padding: 15px;
  border-radius: 5px;
  border: 1px solid rgba(255, 255, 255, 0.20);
  color: #fff;
}

#gform_1 input,
#gform_1 textarea {
  padding: 15px;
  border-radius: 5px;
  border: 1px solid white;
}


#page-container #et-boc .gform_button.button {
  background-color: #0086F4E6;
  font-size: 18px;
  border: 0;
  font-weight: bold;
  text-transform: uppercase;
  padding: 15px;
  border-radius: 5px;
  border: 1px solid var(--blauw);
  color: #fff;
}

#page-container #et-boc .gform_next_button
{
	  font-size: 18px;
	  font-weight: bold;
  text-transform: uppercase;
  padding: 15px;
	color: #000B25;
	background-color:#FFFFFF;
	  border: 1px solid #fff;
	border-radius: 5px;
}

#page-container #et-boc .gform_previous_button
{
	  font-size: 18px;
	  font-weight: bold;
  text-transform: uppercase;
  padding: 15px;
	color: #fff;
	background-color:#000B25;
	  border: 1px solid #fff;
	border-radius: 5px;
}

#gform_2 .gform_page_footer {
	display: flex;
	    justify-content: space-between;
}

#gform_2 .ginput_container ::placeholder {
  color: white !important;
}

#page-container #et-boc #gform_submit_button_1 {
  background-color: #000B25;
}


.gform_wrapper.gravity-theme .gfield textarea.large {
  height: 185px;
}

.gform_wrapper.gravity-theme .gfield_label {
  font-size: 14px;
}

.gform_required_legend {
  display: none;
}

.gform_wrapper.gravity-theme .gfield_required {
  color: white;
}


.gform_wrapper.gravity-theme .gform_drop_area {
  padding: 0px !important;
}

.gform_wrapper.gravity-theme .gform_drop_instructions {
  margin-bottom: 0px;
}

#gform_drag_drop_area_1_5>span {
  display: none;
}

#gfield_upload_rules_1_5 {
  display: none;
}

#gform_browse_button_1_5 {
  width: 100%;
  position: relative;
  z-index: 1;
  background: white;
  border: none;
  color: white;
  height: 100%;
  font-weight: 900;
  cursor: pointer;
  padding: 14px !important;
  color: #000B25;
  min-height: 50.5px;
  border-radius: 5px;
  transition: 300ms all ease-in;

}

#gform_browse_button_1_5:hover {
  opacity: .6;
}

#gform_drag_drop_area_1_5 {
  border: none;
}

#gform_fields_1 {
  padding-top: 27px;
}


#page-container #et-boc .gform_submission_error {
	    font-size: 20px;
	color: #c02b0a;
}

#page-container #et-boc .validation_message  {
		color: #c02b0a;
}

/*
@keyframes reveal {
  0% {
    transform: translate(0,100%);
  }
  100% {
    transform: translate(0,0);
  }
}
*/

.et_pb_column_18.et_pb_sticky_module {
  z-index: 1 !important;
}

.team-branding:hover,
.team-web:hover,
.team-activatie:hover {
  text-decoration: underline;
}

.horizontal-container .et_pb_row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.subtitle {
  font-weight: bolder;
  text-transform: uppercase;
}

@media (max-width: 980px) {
  .pin-spacer {
    display: none !important;
  }
}



@media all and (max-width: 767px) {
#page-container #et-boc .klanten-slider-sectie  {
/*   padding-top: 0px; */
  padding-bottom: 0px;
}
}


	
canvas {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;   /* Behind other content */
  pointer-events: none;  /* Allow interactions with other content */
}

@Media all and (max-width: 980px) {
canvas {
visibility: hidden;
}
}