/*
Theme Name: VCPOZ Bestuur
Template: kadence
Author: Cloudwise
Version: 1.0.1
Text Domain: cloudwise-basis-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
*/

:root {
	--gap: 40px;
	
	--rood: 		#E52A21;
	--oranje: 		#E18E6A;
	--geel:			#F6A027;
	--lichtgeel:	#F5D699;
	--lichtgroen: 	#86BD40;
	--groen:		#3FA535;
	--paars:		#951B81;
	--lichtpaars:	#C693C2;
	--donkerblauw:	#19488F;
	--blauw:		#3EA3DC;
	--staalblauw :	#ACC7D7;
	--lichtblauw:	#E5F3FB;
	--grijs:		#707070;
	--lichtgrijs:	#D8D8D8;
	--donker:		#1D1D1B;	
}

/* knoppen */
.kb-button:not(.kb-btn-global-inherit),
.kb-form .kadence-blocks-form-field .kb-forms-submit{ }
.kb-button:not(.kb-btn-global-inherit).knop{}
.kb-button:not(.kb-btn-global-inherit).knop:hover{}

.kb-button.knop-terug:after{display:none}
.kb-button.knop-terug:before{content: "\f104"; font-family: 'Font Awesome 5 Free'; font-weight: 700; padding-right:10px; position:relative; opacity:1;}

.knop a,
.knop a:active,
.knop a:visited,
a.knop,
a.knop:active,
a.knop:visited,
#wrapper .wp-block-kadence-posts a.post-more-link,
#wpwrap .wp-block-kadence-posts a.post-more-link,
#wrapper #archive-container a.post-more-link,
#wpwrap #archive-container a.post-more-link{postion:relative; display:inline-block; margin-right:15px; font-size:14px; height:45px; line-height:45px; padding:0 30px; border-radius:23px; transition:all 0.3s ease; text-align:center; color:#fff; background-color:var(--paars); border:1px solid var(--paars); text-decoration:none;}
.knop a:hover,
a.knop:hover,
#wrapper .wp-block-kadence-posts a.post-more-link:hover,
#wpwrap .wp-block-kadence-posts a.post-more-link:hover,
#wrapper #archive-containers a.post-more-link:hover,
#wpwrap #archive-container a.post-more-link:hover {color:var(--paars); background-color:#fff; text-decoration:none;}

a.knop.wit{background-color:#fff; border-color:#fff; color:var(--paars);}
a.knop.wit:hover{background-color:var(--paars); color:var:#fff; border-color:var(--paars);}
a.knop.groen{background-color:var(--groen); border-color:var(--groen);}
a.knop.groen:hover{background-color:#fff; color:var(--groen);}
a.knop.lichtgroen{background-color:var(--lichtgroen); border-color:var(--lichtgroen);}
a.knop.lichtgroen:hover{background-color:#fff; color:var(--lichtgroen);}
a.knop.blauw{background-color:var(--blauw); border-color:var(--blauw);}
a.knop.blauw:hover{background-color:#fff; color:var(--blauw);}
a.knop.donkerblauw{background-color:var(--donkerblauw); border-color:var(--donkerblauw);}
a.knop.donkerblauw:hover{background-color:#fff; color:var(--donkerblauw);}
a.knop.geel{background-color:var(--geel); border-color:var(--geel);}
a.knop.geel:hover{background-color:#fff; color:var(--geel);}
a.knop.oranje{background-color:var(--oranje); border-color:var(--oranje);}
a.knop.oranje:hover{background-color:#fff; color:var(--oranje);}
a.knop.rood{background-color:var(--rood); border-color:var(--rood);}
a.knop.rood:hover{background-color:#fff; color:var(--rood);}
a.knop.paars{background-color:var(--paars); border-color:var(--paars);}
a.knop.paars:hover{background-color:#fff; color:var(--paars);}


/* flickity */
#wrapper .flickity-page-dots{padding-left:0;}
#wrapper .flickity-page-dots .dot{height:15px; width:15px; margin:0 4px; opacity:1; background-color:var(--lichtgrijs);}
#wrapper .flickity-page-dots .dot.is-selected{ background-color:var(--paars);}


/* zoeken */
.search-toggle-open-container{margin-left:20px;}
.search-toggle-open-container .search-toggle-open{height;36px; line-height:38px; border-radius:18px; padding:0 20px; border:1px solid #e7eff3;}
.search-toggle-open-container .search-toggle-label{ margin-right:20px;}

#search-drawer .drawer-inner input.search-field{border-radius:33px; padding:12px 30px !important;}
#search-drawer .drawer-inner input.search-field:focus{box-shadow:none !important;}

.search-items .wp-block-post-excerpt__more-text{display:none;} 


/* zoeken x  (browser default overschrijven) */
#search-drawer input[type="search"]::-webkit-search-cancel-button {
    -webkit-appearance: none; appearance: none;
	width: 20px; height: 20px; background-color: #fff; border-radius: 50%; cursor: pointer;
    -webkit-mask-image: url("data:image/svg+xml;utf8,\
    <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'>\
    <path fill='black' d='M18.3 5.7a1 1 0 0 0-1.4 0L12 10.6 7.1 5.7a1 1 0 1 0-1.4 1.4L10.6 12l-4.9 4.9a1 1 0 1 0 1.4 1.4L12 13.4l4.9 4.9a1 1 0 0 0 1.4-1.4L13.4 12l4.9-4.9a1 1 0 0 0 0-1.4z'/>\
    </svg>");-webkit-mask-repeat: no-repeat;-webkit-mask-position: center; -webkit-mask-size: contain;
}


/* header */
.site-top-header-wrap{transform:translateY(36px);}
.site-container .site-header-main-section-right .site-header-item{align-items:end;}


/* menu */
#primary-menu li.current-menu-item > a{font-weight:bold;}
#primary-menu ul.sub-menu {border-radius:10px; overflow:hidden; padding-top:10px; padding-bottom:10px;}

#secondary-menu li.knop{}
#secondary-menu li.knop a{color:#fff; padding:0 30px; height:36px; line-height:36px; border-radius:18px;}
#secondary-menu li.knop a:hover{color:var(--paars);}


/* content */
#primary.content-area{margin-top:30px; margin-bottom:50px;}


/* banner */
.banner{width:1550px !important;  margin-left:50% !important; transform:translateX(-50%);
-webkit-mask-image: url("images/banner_halfrond.svg"); mask-image: url("images/banner_halfrond.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center top; mask-position: center top; webkit-mask-size: 100% 100%;mask-size: 100% 100%;}





/* nieuws kadence */
/* kadence nieuws overzicht */
.wp-block-kadence-posts{}
.wp-block-kadence-posts .post-thumbnail{}
.wp-block-kadence-posts .content-bg{}
.wp-block-kadence-posts .entry-taxonomies{}
.wp-block-kadence-posts .entry-taxonomies .category-style-pill a{}
.wp-block-kadence-posts .entry-header{margin:0;}
.wp-block-kadence-posts .entry-header .entry-title{}
.wp-block-kadence-posts .entry-header .entry-title a{}
.wp-block-kadence-posts .entry-header .entry-title a:hover{}
.wp-block-kadence-posts .entry-header .entry-meta{}
.wp-block-kadence-posts .entry-summary{margin:0;}
.wp-block-kadence-posts .entry-summary p{margin:0;}
.wp-block-kadence-posts .entry-actions{}
.wp-block-kadence-posts .entry-content-wrap .entry-footer a.post-more-link{ text-transform:none; letter-spacing:0;}
.wp-block-kadence-posts .entry-content-wrap .entry-footer a.post-more-link:hover{}
.wp-block-kadence-posts .entry-content-wrap .entry-footer a.post-more-link .kadence-svg-iconset{display:none;}

/* kadence nieuws archief */
#archive-container .post-thumbnail{}
#archive-container .entry-taxonomies .category-style-pill a{}
#archive-container .entry-header .entry-title{}
#archive-container .entry-header .entry-title a{}
#archive-container .entry-header .entry-title a:hover{}
#archive-container .entry-header .entry-meta{}
#archive-container .entry-content-wrap .entry-footer a.post-more-link{ text-transform:none; letter-spacing:0;}
#archive-container .entry-content-wrap .entry-footer a.post-more-link:hover{}
#archive-container .entry-content-wrap .entry-footer a.post-more-link .kadence-svg-iconset{display:none;}


/* vacatures */
.vacature-lijst-wrapper{display:flex; flex-wrap:wrap; column-gap:var(--gap); margin-bottom:20px;} 
.vacature-lijst-item{position:relative; width:calc((100% - var(--gap)) / 2); background-color:var(--lichtblauw); margin-bottom:30px;
-webkit-mask-image: url("images/blok_vierkant.svg"); mask-image: url("images/blok_vierkant.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;} 
.vacature-lijst-item .vacature-lijst-img{width:100%; aspect-ratio:16/9; background-repeat:no-repeat; background-size:cover; background-position:center center;} 
.vacature-lijst-item .vacature-lijst-fte{ background-color:var(--blauw); color:#fff; border-radius:5px; padding:5px 10px; position:absolute; right:20px; top:30px;}
.vacature-lijst-item .vacature-lijst-content{ padding:30px 50px; text-align:center;} 
.vacature-lijst-item .vacature-lijst-title{color:var(--paars); font-size:24px; font-weight:700;} 
.vacature-lijst-item .vacature-lijst-cat{color:var(--blauw); font-size:20px; font-weight:700;}
.vacature-lijst-item .vacature-lijst-short{padding:20px 0 10px 0;} 
.vacature-lijst-item .vacature-lijst-btn {margin-top:20px;} 


.vacature-post-wrapper{}
.vacature-post-img-wrapper{position:relative; max-width:400px;}
.vacature-post-img-wrapper:before{content:''; position:absolute; width:100%; aspect-ratio: 371 / 374; background-size:cover; background-repeat:no-repeat; background-position:center center; background-color:var(--lichtgrijs); transition:all 0.3s ease;
-webkit-mask-image: url("images/blok_stippels.svg"); mask-image: url("images/blok_stippels.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;}
.vacature-post-img{position:relative; width:75%; aspect-ratio: 1 / 1;  background-size:cover; background-repeat:no-repeat; background-position:center center; background-color:#fff; margin:0 auto; margin-top:50px;
-webkit-mask-image: url("images/blok_cirkel.svg"); mask-image: url("images/blok_cirkel.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat}


/* verhalen */
.VerhalenMainWrapper{}

.VerhalenSingleWrapper{}

.VerhalenItem{position:relative; display:flex; column-gap:var(--gap); flex-wrap: nowrap; align-items: stretch; margin:60px 0px;}
.VerhalenItem::before{content:""; width:calc(77% + 175px); height:100%; position:absolute; top:0; right:-175px; background-color:var(--lichtblauw);
-webkit-mask-image: url("images/blok_rechthoek.svg"); mask-image: url("images/blok_rechthoek.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;}
.VerhalenItem .VerhalenImgWrapper{aspect-ratio: 1/1; position:relative; display:flex;  align-items: center; justify-content: center;}
.VerhalenItem .VerhalenImgWrapper .VerhalenImgBg{position:absolute; width:100%; aspect-ratio: 371 / 374; background-size:cover; background-repeat:no-repeat; background-position:center center; background-color:var(--donkerblauw); transition:all 0.3s ease;
-webkit-mask-image: url("images/blok_stippels.svg"); mask-image: url("images/blok_stippels.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat}
.VerhalenItem .VerhalenImgWrapper .VerhalenImg{position:relative; width:75%; aspect-ratio: 1 / 1;  background-size:cover; background-repeat:no-repeat; background-position:center center; background-color:#fff;
-webkit-mask-image: url("images/blok_cirkel.svg"); mask-image: url("images/blok_cirkel.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat}
.VerhalenItem .VerhalenContent{padding:70px 100px; position:relative; color:var(--donkerblauw); height:100%}
.VerhalenItem .VerhalenContent  h1,
.VerhalenItem .VerhalenContent  h2,
.VerhalenItem .VerhalenContent  h3,
.VerhalenItem .VerhalenContent  h4,
.VerhalenItem .VerhalenContent  h5{color:var(--donkerblauw);}
.VerhalenItem .VerhalenContent .VerhalenTitel{ margin-bottom:10px;}
.VerhalenItem .VerhalenContent .VerhalenDescr{ padding:20px 0 30px 0;}
.VerhalenItem .VerhalenContent .VerhalenPersoon{font-weight:bold;}
.VerhalenItem .VerhalenContent .VerhalenPersoon .VerhalenNaam{}
.VerhalenItem .VerhalenContent .VerhalenPersoon .VerhalenFunctie{font-style:italic;}
.VerhalenItem .VerhalenContent .VerhalenPersoon .VerhalenFunctie:before{content:"- "}
.VerhalenItem .VerhalenContent .VerhalenBtn{margin-top:25px;}

.VerhalenMainWrapper .VerhalenItem:nth-of-type(2n){flex-direction: row-reverse;}
.VerhalenMainWrapper .VerhalenItem:nth-of-type(2n):before{right:auto; left:-175px;}

.VerhalenMainWrapper .VerhalenItem:nth-of-type(3n+1):before{background-color:var(--lichtblauw)}
.VerhalenMainWrapper .VerhalenItem:nth-of-type(3n+2):before{background-color:var(--lichtpaars)}
.VerhalenMainWrapper .VerhalenItem:nth-of-type(3n+3):before{background-color:var(--lichtgeel)}


/* oude size classes */
.one-half, .one-third, .two-third, .one-fourth, .three-fourth, .fullpane { box-sizing:border-box; }
.one-half     { width:calc((100% - var(--gap)) / 2); }
.one-third    { width:calc((100% - ( var(--gap) * 2)) / 3);} 
.two-third    { width:calc((((100% - ( var(--gap) * 2)) / 3) * 2 ) + var(--gap)); }
.one-fourth   { width:calc((100% - ( var(--gap) * 3)) / 4); } 
.three-fourth { width:calc((((100% - ( var(--gap) * 3)) / 4) * 3 ) + (var(--gap) * 2)); }



/* LB blok */
.BlokWrapper{ position:relative; display:flex; column-gap:var(--gap); flex-wrap: nowrap; align-items: stretch; margin:60px 0px;}
.BlokWrapper::before{content:""; width:calc(77% + 175px); height:100%; position:absolute; top:0; left:-175px; background-color:var(--grijs);
-webkit-mask-image: url("images/blok_rechthoek.svg"); mask-image: url("images/blok_rechthoek.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;}
.BlokWrapper .BlokContent{padding:70px 100px; position:relative; color:#fff; height:100%;}
.BlokWrapper .BlokContent  h1,
.BlokWrapper .BlokContent  h2,
.BlokWrapper .BlokContent  h3,
.BlokWrapper .BlokContent  h4,
.BlokWrapper .BlokContent  h5{color:#fff;}
.BlokWrapper .BlokContent .BlokTitel{display:block;}
.BlokWrapper .BlokContent .BlokTekst{}
.BlokWrapper .BlokContent  .BlokTekst a:link,
.BlokWrapper .BlokContent  .BlokTekst a:active,
.BlokWrapper .BlokContent  .BlokTeksta:visited,
.BlokWrapper .BlokContent  .BlokTekst a:hover{color:#fff; text-decoration:underline;}
.BlokWrapper .BlokContent .BlokBtn{margin-top:20px; text-decoration:none;}
.BlokWrapper .BlokImgWrapper{display:flex;  align-items: center; justify-content: center;}
.BlokWrapper .BlokImgWrapper .BlokImg{width:100%; aspect-ratio: 1 / 1;  background-size:cover; background-repeat:no-repeat; background-position:center center;
-webkit-mask-image: url("images/blok_vierkant.svg"); mask-image: url("images/blok_vierkant.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;}
.BlokWrapper .BlokStripes{position:absolute; right:0; top:0; display:block; width:20%; aspect-ratio:262 / 289; background-image:url("images/blok_streepjes.svg"); background-repeat:no-repeat; background-size:contain; background-position:center center;}


.BlokWrapper.tekstrechts{flex-direction: row-reverse;}
.BlokWrapper.tekstrechts::before{left:auto; right:-175px;}
.BlokWrapper.tekstrechts .BlokStripes{right:auto; left:0;}

.BlokWrapper.strepenonder .BlokStripes{top:auto; bottom:0;}

.BlokWrapper.geenstrepen .BlokStripes{display:none;}


.BlokWrapper.geel::before{background-color:var(--geel);}
.BlokWrapper.geel .BlokContent .BlokBtn{background-color:var(--rood); border-color:var(--rood);}
.BlokWrapper.geel .BlokContent .BlokBtn:hover{background-color:#fff; color:var(--rood);}

.BlokWrapper.oranje::before{background-color:var(--oranje);}
.BlokWrapper.oranje .BlokContent .BlokBtn{background-color:var(--donkerblauw); border-color:var(--donkerblauw);}
.BlokWrapper.oranje .BlokContent .BlokBtn:hover{background-color:#fff; color:var(--donkerblauw);}

.BlokWrapper.blauw::before{background-color:var(--blauw);}
.BlokWrapper.blauw .BlokContent .BlokBtn{background-color:var(--donkerblauw); border-color:var(--donkerblauw);}
.BlokWrapper.blauw .BlokContent .BlokBtn:hover{background-color:#fff; color:var(--donkerblauw);}

.BlokWrapper.staalblauw::before{background-color:var(--staalblauw);}
.BlokWrapper.staalblauw .BlokContent,
.BlokWrapper.staalblauw .BlokContent  h1,
.BlokWrapper.staalblauw .BlokContent  h2,
.BlokWrapper.staalblauw .BlokContent  h3,
.BlokWrapper.staalblauw .BlokContent  h4,
.BlokWrapper.staalblauw .BlokContent  h5,
.BlokWrapper.staalblauw .BlokContent  .BlokTekst a:link,
.BlokWrapper.staalblauw .BlokContent  .BlokTekst a:active,
.BlokWrapper.staalblauw .BlokContent  .BlokTeksta:visited,
.BlokWrapper.staalblauw .BlokContent  .BlokTekst a:hover{color:var(--donkerblauw);}
.BlokWrapper.staalblauw .BlokContent .BlokBtn{background-color:var(--donkerblauw); border-color:var(--donkerblauw);}
.BlokWrapper.staalblauw .BlokContent .BlokBtn:hover{background-color:#fff; color:var(--donkerblauw);}

.BlokWrapper.groen::before{background-color:var(--groen);}
.BlokWrapper.groen .BlokContent .BlokBtn{background-color:var(--donkerblauw); border-color:var(--donkerblauw);}
.BlokWrapper.groen .BlokContent .BlokBtn:hover{background-color:#fff; color:var(--donkerblauw);}

.BlokWrapper.lichtgroen::before{background-color:var(--lichtgroen);}
.BlokWrapper.lichtgroen .BlokContent .BlokBtn{background-color:var(--paars); border-color:var(--paars);}
.BlokWrapper.lichtgroen .BlokContent .BlokBtn:hover{background-color:#fff; color:var(--paars);}

.BlokWrapper.paars::before{background-color:var(--paars);}
.BlokWrapper.paars .BlokContent .BlokBtn{background-color:var(--donkerblauw); border-color:var(--donkerblauw);}
.BlokWrapper.paars .BlokContent .BlokBtn:hover{background-color:#fff; color:var(--donkerblauw);}

.BlokWrapper.lichtpaars::before{background-color:var(--lichtpaars);}
.BlokWrapper.lichtpaars .BlokContent,
.BlokWrapper.lichtpaars .BlokContent  h1,
.BlokWrapper.lichtpaars .BlokContent  h2,
.BlokWrapper.lichtpaars .BlokContent  h3,
.BlokWrapper.lichtpaars .BlokContent  h4,
.BlokWrapper.lichtpaars .BlokContent  h5,
.BlokWrapper.lichtpaars .BlokContent  .BlokTekst a:link,
.BlokWrapper.lichtpaars .BlokContent  .BlokTekst a:active,
.BlokWrapper.lichtpaars .BlokContent  .BlokTeksta:visited,
.BlokWrapper.lichtpaars .BlokContent  .BlokTekst a:hover{color:var(--donkerblauw);}
.BlokWrapper.lichtpaars .BlokContent .BlokBtn{background-color:var(--donkerblauw); border-color:var(--donkerblauw);}
.BlokWrapper.lichtpaars .BlokContent .BlokBtn:hover{background-color:#fff; color:var(--donkerblauw);}


/* LB scholen */
/* Scholen */
.ScholenWrapper{display:flex; column-gap:var(--gap); flex-wrap: wrap;}
.ScholenWrapper .ScholenItem{position:relative; margin-bottom:60px;}
.ScholenWrapper .ScholenItem .ScholenImgWrapper{aspect-ratio: 1/1; position:relative; display:flex;  align-items: center; justify-content: center;}
.ScholenWrapper .ScholenItem .ScholenImgWrapper .ScholenImgBg{position:absolute; width:100%; aspect-ratio: 371 / 374; background-size:cover; background-repeat:no-repeat; background-position:center center; background-color:var(--lichtgrijs); transition:all 0.3s ease;
-webkit-mask-image: url("images/blok_stippels.svg"); mask-image: url("images/blok_stippels.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat}
.ScholenWrapper .ScholenItem .ScholenImgWrapper .ScholenImg{position:relative; width:75%; aspect-ratio: 1 / 1;  background-size:cover; background-repeat:no-repeat; background-position:center center; background-color:var(--grijs);
-webkit-mask-image: url("images/blok_cirkel.svg"); mask-image: url("images/blok_cirkel.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat}
.ScholenWrapper .ScholenItem .ScholenContent{ text-align:center; position:relative; padding-bottom:60px; padding-top:20px;}
.ScholenWrapper .ScholenItem .ScholenContent .ScholenNaam{font-size:24px; color:var(--paars); font-weight:400; padding-bottom:0px;}
.ScholenWrapper .ScholenItem .ScholenContent .ScholenPlaats{font-size:18px; color:var(--blauw); font-weight:400; margin-bottom:10px; font-style:italic;}
.ScholenWrapper .ScholenItem .ScholenContent .ScholenDescr{color:var(--donker);}
.ScholenWrapper .ScholenItem .ScholenBtnWrapper{position:absolute; width:100%; text-align:center; left:0; bottom:0;}
.ScholenWrapper .ScholenItem .ScholenBtnWrapper .ScholenBtn{}

.ScholenItem:has(.ScholenBtn:hover) .ScholenImgBg { background-color: var(--paars);}

/* Scholen main only */
.ScholenMainWrapper{text-align:center; color:var(--paars);}
.ScholenMainWrapper h1{}

/* Scholen slider */
.ScholenSliderMainWrapper{}
.ScholenSliderMainWrapper h1{text-align:center; color:#fff;}
.ScholenSlider{margin-bottom:80px; display:block;}
.ScholenSlider .ScholenItem{margin-left:20px; margin-right:20px;}
.ScholenSlider .ScholenItem .ScholenContent .ScholenNaam{}
.ScholenSlider .ScholenItem .ScholenContent .ScholenDescr{display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 4;}


/* Scholen lijst */
.ScholenLijst { column-count: 2; column-gap: var(--gap); list-style-type: none; padding: 0; margin: 0;}
.ScholenLijst .ScholenItem { break-inside: avoid; }
.ScholenLijst .ScholenItem a::before {font-family: "Font Awesome 5 Free"; content: "\f054"; font-weight:900; font-size:10px; vertical-align:middle; padding-right:7px; color:var(--donker);}


/* LB kaart */
.KaartMainWrapper{position:relative; display:flex; justify-content:center;}
.KaartMainWrapper .KaartWrapper{position:relative; width:1550px; height:800px; aspect-ratio:1543 / 806; background-image: url("images/kaart_zeeland.png"); background-color:var(--blauw); background-repeat:no-repeat; background-position:center center; background-size:cover; 
-webkit-mask-image: url("images/banner_halfrond.svg"); mask-image: url("images/banner_halfrond.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;}
.KaartMainWrapper .KaartWrapper .Marker{ position:absolute; cursor:pointer; height:17px; width:17px; transform-origin: center center; background-color:#fff; border-radius:50%;}
.Marker .Snippet {display: none; position: absolute; left: 25px;  top: -5px; background: #fff; color:var(--donkerblauw); padding: 2px 6px; border-radius: 4px; white-space: nowrap; font-size: 13px;}
.KaartMainWrapper .KaartWrapper .Marker.active{background-color:var(--donkerblauw);}
.KaartMainWrapper .KaartWrapper .Marker.active .Snippet {display: block;}


/* LB team */
.TeamWrapper{display:flex; column-gap:var(--gap); flex-wrap: wrap;}
.TeamWrapper .TeamItem{ margin-bottom:40px; position:relative; padding-bottom:55px;}
.TeamWrapper .TeamItem .TeamImgWrapper{position:relative; display:block; aspect-ratio:375 / 363; width:100%; margin-bottom:20px;}
.TeamWrapper .TeamItem .TeamImgWrapper .TeamImgBg{aspect-ratio:375 / 363; width:100%; background-color:var(--grijs);
-webkit-mask-image: url("images/blok_cirkel_lijnen.svg"); mask-image: url("images/blok_cirkel_lijnen.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;}
.TeamWrapper .TeamItem .TeamImgWrapper .TeamImg{ display:block; background-size:cover; background-repeat:no-repeat; background-position:center center; aspect-ratio: 1/1; position:absolute; width: 68%; left: 50%; top: 14%; transform: translateX(-50%); background-color:var(--grijs);
-webkit-mask-image: url("images/blok_cirkel.svg"); mask-image: url("images/blok_cirkel.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;}
.TeamWrapper .TeamItem .TeamContent{text-align:center; position:relative; display:block;}
.TeamWrapper .TeamItem .TeamContent .TeamNaam{font-size:24px; font-weight:600; color:var(--geel); line-height:1.5; margin-bottom:10px;}
.TeamWrapper .TeamItem .TeamContent .TeamFunctie{}
.TeamWrapper .TeamItem .TeamBtn{position:absolute; width:100%; max-height: 40px; text-align:center; left:0; bottom:0;}
.TeamWrapper .TeamItem .TeamBtn a{position:relative; display:inline-block; height:40px; width:40px; line-height:40px; border-radius:50%; text-align:center; color:#fff; background-color:var(--grijs); border:1px solid var(--grijs); transition:all 0.3s ease; }
.TeamWrapper .TeamItem .TeamBtn a:hover{background-color:#fff; color:var(--grijs);}
.TeamWrapper .TeamItem .TeamBtn a::after{position:absolute; top:0; left:0; width:40px; height:40px; color:inherit; content: "\f0c9"; display: block; font-family: 'Font Awesome 5 Free'; font-weight: 900; font-size:20px; }
.TeamWrapper .TeamItem .TeamBtn a.TeamTelefoon{color:#fff; background-color:var(--lichtgroen); border-color:var(--lichtgroen);}
.TeamWrapper .TeamItem .TeamBtn a.TeamTelefoon:hover{background-color:#fff; color:var(--lichtgroen);}
.TeamWrapper .TeamItem .TeamBtn a.TeamTelefoon::after{content: "\f095";}
.TeamWrapper .TeamItem .TeamBtn a.TeamEmail{color:#fff; background-color:var(--paars); border-color:var(--paars);}
.TeamWrapper .TeamItem .TeamBtn a.TeamEmail:hover{background-color:#fff; color:var(--paars);}
.TeamWrapper .TeamItem .TeamBtn a.TeamEmail::after{content: "\f0e0";}


/* LB Documenten */
.DocsLijstWrapper{width:100%;}
.DocsLijstWrapper .DocsItem{width:100%; display:flex; justify-content: space-between; align-items: center; padding:10px 10px; box-sizing:border-box;}
.DocsLijstWrapper .DocsItem:nth-of-type(2n){background-color:var(--lichtblauw);}
.DocsLijstWrapper .DocsItem .DocTitel{}
.DocsLijstWrapper .DocsItem .DocsBtn{margin-right:0; margin:0; min-width:100px;}


/* LB Citaten */
.QuoteMainWrapper{ margin-bottom:80px; padding:60px 100px;}

.QuoteItem{width:100%; display:flex; align-items: center; justify-content: space-between; }
.QuoteItem .QuoteImgWrapper{aspect-ratio: 1/1; position:relative; display:flex;  align-items: center; justify-content: center;}
.QuoteItem .QuoteImgWrapper .QuoteImgBg{width:50%; height:100%; position:absolute; left:0; top:0; background-color:var(--lichtpaars);
-webkit-mask-image: url("images/blok_halvecirkel.svg"); mask-image: url("images/blok_halvecirkel.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; }
.QuoteItem .QuoteImgWrapper .QuoteImg{position:relative; width:60%; aspect-ratio: 1 / 1;  background-size:cover; background-repeat:no-repeat; background-position:center center; background-color:var(--grijs);
-webkit-mask-image: url("images/blok_cirkel.svg"); mask-image: url("images/blok_cirkel.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; }
.QuoteItem .QuoteContent{}
.QuoteItem .QuoteContent .QuoteQuote{font-size:24px; color:var(--donkerblauw);}
.QuoteItem .QuoteContent .QuotePersoon{font-size:16px; padding-top:15px; color:var(--donkerblauw)}
.QuoteItem .QuoteContent .QuoteNaam{font-weight:500;}
.QuoteItem .QuoteContent .QuoteFunctie{}



/*Vacature badge*/
.vacature-knop a {position: relative; overflow: visible !important;}
.vacature-bolletje { position:absolute; display:block; top: -2px; right:-10px; height:25px;width:25px; line-height:25px; text-align:center; font-weight:bold; border-radius:50%; background-color:var(--blauw); text-align: center; color: #fff;
-webkit-animation: bounce 2s ease infinite; animation: bounce 2s ease infinite;}


@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-10px);
  }
  60% {
    transform: translateY(-5px);
  }
}

@-webkit-keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -webkit-transform: translateY(0);
  }
  40% {
    -webkit-transform: translateY(-10px);
  }
  60% {
    -webkit-transform: translateY(-5px);
  }
}



/* media queries */
@media only screen and (max-width: 1500px) {
	.banner{webkit-mask-size: 140% 100%; mask-size: 140% 100%;}
}

@media only screen and (max-width: 1290px) {
	.banner{webkit-mask-size: 150% 100%; mask-size: 150% 100%;}
}

@media only screen and (max-width: 1024px) {
	.banner{webkit-mask-size: 170% 100%; mask-size: 170% 100%;}
	
	.BlokWrapper .BlokContent{padding:50px 70px}
	
	.QuoteMainWrapper{padding:0;}
}

@media only screen and (max-width: 767px) {
	.one-half, .one-third, .two-third, .one-fourth, .three-fourth, .one-fifth, .two-fifth, .three-fifth, .four-fifth, .one-sixth, .five-sixth {float:none; margin-right:0; width:100%;}	
	
	.BlokWrapper{ flex-direction:column !important}
	.BlokWrapper::before{display:none; }
	.BlokWrapper .BlokContent{padding: 50px 50px; background-color:var(--grijs);
	-webkit-mask-image: url("images/blok_rechthoek.svg"); mask-image: url("images/blok_rechthoek.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;}
	.BlokWrapper.geel .BlokContent{background-color:var(--geel);}
	.BlokWrapper.oranje .BlokContent{background-color:var(--oranje);}
	.BlokWrapper.blauw .BlokContent{background-color:var(--blauw);}
	.BlokWrapper.staalblauw .BlokContent{background-color:var(--staalblauw);}
	.BlokWrapper.groen .BlokContent{background-color:var(--groen);}
	.BlokWrapper.lichtgroen .BlokContent{background-color:var(--lichtgroen);}
	.BlokWrapper.paars .BlokContent{background-color:var(--paars);}
	.BlokWrapper.lichtpaars .BlokContent{background-color:var(--lichtpaars);}
	.BlokWrapper .BlokImgWrapper .BlokImg{margin-top:30px;}
	.BlokWrapper .BlokStripes{ display:none !important}
	
	.ScholenWrapper .ScholenItem .ScholenImgWrapper{max-width:250px; margin-left:auto; margin-right:auto;}
	
	.TeamWrapper .TeamItem .TeamImgWrapper{max-width:250px; margin-left:auto; margin-right:auto;}
	
	.QuoteItem .QuoteImgWrapper{width:200px;}
	.QuoteItem .QuoteContent .QuoteQuote{font-size:20px;}
	
	.vacature-lijst-item{width:100%;}
	
	.VerhalenItem,
	.VerhalenMainWrapper .VerhalenItem:nth-of-type(2n){flex-direction:column;}
	.VerhalenItem .VerhalenImgWrapper{max-width:250px; margin-left:auto; margin-right:auto; margin-bottom:20px;}
	.VerhalenItem .VerhalenContent{padding:30px 30px; text-align:center;}
	.VerhalenMainWrapper .VerhalenItem:before,
	.VerhalenSingleWrapper .VerhalenItem:before{display:none;}
	.VerhalenMainWrapper .VerhalenItem .VerhalenContent,
	.VerhalenSingleWrapper .VerhalenItem .VerhalenContent{background-color:var(--lichtblauw);
	-webkit-mask-image: url("images/blok_rechthoek.svg"); mask-image: url("images/blok_rechthoek.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat}
	.VerhalenMainWrapper .VerhalenItem:nth-of-type(3n+1) .VerhalenContent{background-color:var(--lichtblauw)}
	.VerhalenMainWrapper .VerhalenItem:nth-of-type(3n+2) .VerhalenContent{background-color:var(--lichtpaars)}
	.VerhalenMainWrapper .VerhalenItem:nth-of-type(3n+3) .VerhalenContent{background-color:var(--lichtgeel)}
	
}

@media only screen and (max-width: 479px) {	

	.banner{webkit-mask-size: 300% 100%; mask-size:300% 100%;}
	.banner.alleen-afbeelding{height:500px; webkit-mask-size: 250% 100%; mask-size:250% 100%;}
	
	.QuoteItem{flex-direction:column;}
	.QuoteItem .QuoteImgWrapper{margin-bottom:20px;}
	.QuoteItem .QuoteContent{margin-bottom:10px;}
}
