/*

Theme Name: Fertiliteitskliniek Twente
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 {
  --roze:			#A97F83;
  --groen:			#939A90;
  --donkergroen:	#52655B;
  --beige:			#D6C6B8;
  --lichtroze:		#E8E3E2;
  --witbeige:		#f6f5f4;
  --witroze:		#f7f5f5;
  --grijs:			#979797;
  --zachtroze:		#dccccd;
  --zachtgroen:		#b9c1bd;
}


@font-face {
  font-family: 'ClashGrotesk-Regular';
  src: url('fonts/ClashGrotesk-Regular.woff2') format('woff2'),
       url('fonts/ClashGrotesk-Regular.woff') format('woff'),
       url('fonts/ClashGrotesk-Regular.ttf') format('truetype');
  font-weight: 400;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: 'ClashGrotesk-Medium';
  src: url('fonts/ClashGrotesk-Medium.woff2') format('woff2'),
       url('fonts/ClashGrotesk-Medium.woff') format('woff'),
       url('fonts/ClashGrotesk-Medium.ttf') format('truetype');
  font-weight: 500;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: 'ClashGrotesk-Semibold';
  src: url('fonts/ClashGrotesk-Semibold.woff2') format('woff2'),
       url('fonts/ClashGrotesk-Semibold.woff') format('woff'),
       url('fonts/ClashGrotesk-Semibold.ttf') format('truetype');
  font-weight: 600;
  font-display: swap;
  font-style: normal;
}

#wrapper{
	font-family: 'ClashGrotesk-Regular';
}
#wrapper h1,
#wrapper h2,
#wrapper h3,
#wrapper h4,
#wrapper h5,
#wrapper h6{font-family:'ClashGrotesk-Medium';}


/* 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{display:inline-block; color:var(--donkergroen); background-color:#fff; border:1px solid var(--donkergroen); font-size:16px; text-decoration:none; line-height:40px; border-radius:20px; padding:0 20px !important; font-weight:normal;}
.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:#fff; background-color:var(--donkergroen);}

.knop.negatief a,
a.knop.negatief{background-color:var(--donkergroen); color:#fff;}
.knop.negatief a:hover,
a.knop.negatief:hover{background-color:#fff; color:var(--donkergroen);}

.knop.roze a,
a.knop.roze{background-color:#fff; color:var(--roze); border-color:var(--roze);}
.knop.roze a:hover,
a.knop.roze:hover{background-color:var(--roze); color:#fff;}

.knop.roze.negatief a,
a.knop.roze.negatief{background-color:var(--roze); color:#fff;}
.knop.roze.negatief a:hover,
a.knop.roze.negatief:hover{background-color:#fff; color:var(--roze);}

.knop.groen a,
a.knop.groen{background-color:#fff; color:var(--groen); border-color:var(--groen);}
.knop.groen a:hover,
a.knop.groen:hover{background-color:var(--groen); color:#fff;}

.knop.groen.negatief a,
a.knop.groen.negatief{background-color:var(--groen); color:#fff;}
.knop.groen.negatief a:hover,
a.knop.groen.negatief:hover{background-color:#fff; color:var(--groen);}

#masthead{background-color:transparent !important;}

.filter-button-group .filter-btn{background-color:var(--beige); border:0; color:#fff; height:35px; box-shadow:none;}
.filter-button-group .filter-btn.active{background-color:var(--roze);}


/* flickity */
#wrapper .flickity-page-dots{padding-left:0;}
#wrapper .flickity-page-dots .dot{height:21px; width:21px; margin:0 4px; opacity:1; background-color:#fff; border:1px solid var(--groen); border-radius:7px;}
#wrapper .flickity-page-dots .dot.is-selected{ background-color:var(--groen);}

#wrapper .home-reviews .flickity-page-dots .dot{border-color:var(--roze);}
#wrapper .home-reviews .flickity-page-dots .dot.is-selected{background-color:var(--roze);}


/* zoeken */
.search-toggle-open-container{}
.search-toggle-open-container .search-toggle-open{ }
.search-toggle-open-container .search-toggle-label{}

#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 */
#main-header{}
#main-header .site-main-header-inner-wrap{background-color:var(--witbeige); border-radius:40px; padding:2px;}
#main-header .site-header-main-section-left{padding-left:20px;}
#main-header .site-header-main-section-right{background-color:var(--lichtroze); border-radius:40px; padding-right:20px;}

#main-header .menu > li{position:relative;}
#main-header .menu > li:after{content:""; height:20px; width:1px; background-color:var(--roze); position:absolute; left:0; top:13px;}
#main-header .menu > li:first-of-type:after{display:none;}
#main-header .secondary-menu > li:after{background-color:var(--donkergroen);}


/* custom footer */
.custom-footer{position:relative;}
.custom-footer:before{content:""; position:absolute; left:0; top:0; width:100%; height:150px; background-color:var(--donkergroen); background-image:url('images/vorm_footer.svg'); background-size:cover;}
.custom-footer a{color:var(--beige); text-decoration:none;}
.custom-footer a:hover{color:var(--lichtroze);}
.custom-footer .custom-footer-links a{color:#fff; text-decoration:none;}
.custom-footer .custom-footer-links a:hover{color:var(--lichtroze);}


/* home custom blokken */
#wrapper .home-intro{overflow:hidden; padding-top:300px; padding-bottom:120px; margin-top:-360px;
-webkit-mask-image: url("images/vorm_rond.svg"); mask-image: url("images/vorm_rond.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;}

.home-slogan{}
.home-slogan h1,
.home-slogan h2{font-family: 'ClashGrotesk-Regular' !important;}

.home-blokken{}
.home-overons{}
.home-reviews{}
.home-vragen{}
.home-team{}
.home-nieuws{}

.home-route{}
.home-route .home-route-hartcontainer{margin-top:-350px; margin-right:-100px;}


/* gekleurd vlak content */
.vlak-kleur{position:relative; padding:150px 0;}
.vlak-kleur:before{content:""; position:absolute; left:0; top:0; width:100%; height:150px; background-color:inherit; background-image:url('images/vorm_vlak_boven.svg'); background-size:cover;}
.vlak-kleur:after{content:""; position:absolute; left:0; bottom:0; width:100%; height:150px; background-color:inherit; background-image:url('images/vorm_vlak_onder.svg'); background-size:cover;}

/* custom pagina blokken */
.pagina-intro{position:relative;}
.pagina-intro.tekst-wit{text-shadow: 0 1px 3px rgba(0,0,0,0.35);}
.pagina-intro.tekst-groen{text-shadow: 0 1px 3px rgba(255,255,255,0.35);}
.pagina-intro .kb-button,
.pagina-intro .knop{text-shadow:none;}


/* pagina met grote header */
.pagina-header-vlak{padding:0px 0 150px 0;}
.pagina-header-vlak:after{content:""; position:absolute; left:0; bottom:0; width:100%; height:150px; background-color:inherit; background-image:url('images/vorm_vlak_onder.svg'); background-size:cover;}
.pagina-header-vlak:after{content:""; position:absolute; left:0; bottom:0; width:100%; height:150px; background-color:inherit; background-image:url('images/vorm_vlak_onder.svg'); background-size:cover;}

.pagina-header-wrapper{}
.pagina-header-wrapper .pagina-intro{z-index:2;}
.pagina-header-wrapper .pagina-header-vlak{padding-top:250px; margin-top:-200px; z-index:1;}



/* nieuws */
.nieuws-bericht-wrapper{margin-top:-30px;}

.wp-block-kadence-posts{}
.wp-block-kadence-posts .post-thumbnail{border-radius:30px;}
.wp-block-kadence-posts .content-bg{}
.wp-block-kadence-posts .entry-taxonomies{letter-spacing:0; font-size:16px; text-transform:none;}
.wp-block-kadence-posts .entry-taxonomies .category-style-pill a{line-height:30px; padding:0 20px; border-radius:17px; font-weight:normal;}
.wp-block-kadence-posts .entry-taxonomies .category-style-pill a.category-link-behandeling{background-color:var(--beige);}
.wp-block-kadence-posts .entry-taxonomies .category-style-pill a.category-link-kosten{background-color:var(--groen);}
.wp-block-kadence-posts .entry-taxonomies .category-style-pill a.category-link-onderzoek{}
.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;}


#archive-container .post-thumbnail{border-radius:30px; margin-bottom:20px;}
#archive-container .entry-taxonomies .category-style-pill a{line-height:30px; padding:0 20px; border-radius:17px; font-weight:normal; text-transform:none; font-size:16px;}
#archive-container .entry-taxonomies .category-style-pill a.category-link-behandeling{background-color:var(--beige);}
#archive-container .entry-taxonomies .category-style-pill a.category-link-kosten{background-color:var(--groen);}
#archive-container .entry-taxonomies .category-style-pill a.category-link-onderzoek{}
#archive-container .entry-header .entry-title{ font-size:32px; color:var(--donkergroen);}
#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;}


/* LB partners */
.partner-wrapper{display:flex; flex-direction:row; flex-wrap:wrap; width:100%; justify-content:center; align-items:center;}
.partner-wrapper .partner-item{display:block; height:100px; width:33%; background-size:contain; background-repeat:no-repeat; background-position:center center;}


/* LB blokken */
.blok-wrapper{display:flex; flex-direction:row; flex-wrap:wrap; width:100%; justify-content:space-between; align-items:center;}
.blok-wrapper .blok-item{width:30%; height:440px; position:relative; }
.blok-wrapper .blok-visual{position:relative; height:100%; width:100%; background-size:cover; background-position:center center; background-repeat:no-repeat;
-webkit-mask-image: url("images/vorm_items.svg"); mask-image: url("images/vorm_items.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;}
.blok-wrapper .blok-item .blok-icoon{position:absolute; height:80px; width:80px; top:30px; left:30px;}
.blok-wrapper .blok-item .blok-icoon.behandelingen{background-image:url('images/icon_behandelingen.svg');}
.blok-wrapper .blok-item .blok-icoon.onderzoeken{background-image:url('images/icon_onderzoeken.svg');}
.blok-wrapper .blok-item .blok-icoon.tarieven{background-image:url('images/icon_kosten.svg');}
.blok-wrapper .blok-item .blok-content{color:#fff; width:100%; height:100%; padding:150px 30px 30px 30px;}
.blok-wrapper .blok-item .blok-content .blok-titel{font-size:32px; line-height:1.2; margin-bottom:20px; font-family: 'ClashGrotesk-Semibold'; text-shadow: 0 1px 3px rgba(0,0,0,0.35);}
.blok-wrapper .blok-item .blok-content .blok-tekst{font-size:22px; text-shadow: 0 1px 3px rgba(0,0,0,0.35);}
.blok-wrapper .blok-item .blok-btn{position:absolute; right:5px; bottom:5px; min-width:180px; text-align:center;}


/* LB team */
.team-wrapper {display: block; margin-left: -1.5%; margin-right: -1.5%;}
.team-wrapper .team-item {display: flex; flex-direction: column; width: 30.33%; margin: 0 1.5% 50px 1.5%; float: left; position: relative; min-height: 450px; }
.team-wrapper .team-item .team-img-wrapper{position:relative;}
.team-wrapper .team-item .team-img-wrapper:before{content:""; position:absolute; width:35%; height:100%; background-color:var(--groen); right:0; top:0; border-radius:30px 30px 0px 0px;}
.team-wrapper .team-item .team-img-wrapper .team-img{width:200px; aspect-ratio:1/1; border-radius:50%; background-size:cover; background-position:center center; margin-left:auto; margin-right:auto; position:relative;}
.team-wrapper .team-item .team-content{flex-grow: 1; color:#fff; padding:60px 30px 30px 30px; background-color:var(--groen);  border-radius:30px 0px 30px 30px; margin-top:-30px; }
.team-wrapper .team-item .team-content .team-naam{font-size:20px;}
.team-wrapper .team-item .team-content .team-functie{}
.team-wrapper .team-item .team-content .team-big-nummer{}
.team-wrapper .team-item .team-content .team-tekst{margin-top:20px;}

.team-wrapper .team-item:nth-of-type(6n+2) .team-img-wrapper:before,
.team-wrapper .team-item:nth-of-type(6n+2) .team-content,
.team-wrapper .team-item:nth-of-type(6n+4) .team-img-wrapper:before,
.team-wrapper .team-item:nth-of-type(6n+4) .team-content{background-color:var(--donkergroen);}
.team-wrapper .team-item:nth-of-type(6n+3) .team-img-wrapper:before,
.team-wrapper .team-item:nth-of-type(6n+3) .team-content,
.team-wrapper .team-item:nth-of-type(6n+5) .team-img-wrapper:before,
.team-wrapper .team-item:nth-of-type(6n+5) .team-content{background-color:var(--roze);}

.team-tags{text-align:center; margin-bottom:30px;}
.team-tags .filter-btn{background-color:var(--groen);}
.team-tags .filter-btn.active{background-color:var(--donkergroen);}

.team-slider{display:block; width:100%;}
.team-slider .team-item{margin:0 21px; width:30%; height:450px; margin-bottom:30px;}
.team-slider .team-item .team-content .team-tekst{display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 3;}


/* LB route */
.route-wrapper{position:relative;}
.route-wrapper .route-kaart{display:block; position:relative; width:500px; aspect-ratio:484 / 439; background-color:var(--roze); background-size:cover; background-position:center center; background-repeat:no-repeat;
-webkit-mask-image: url("images/vorm_hart.svg"); mask-image: url("images/vorm_hart.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;}
.route-wrapper .route-kaart .route-btn{position:absolute; left:50%; top:50%; transform: translate(-50%, -50%);}
.route-wrapper .route-sfeer{display:block; position:absolute; left:-170px; bottom:-60px; width:315px; aspect-ratio:1/1; background-color:var(--groen); border-radius:50%; background-size:cover; background-position:center center; background-repeat:no-repeat;}


/* LB reviews */
.review-wrapper{}
.review-wrapper .review-item{display:flex; flex-direction:row; align-items:center; border-radius:30px; padding:30px; margin-bottom:30px; background-color:var(--zachtgroen);}
.review-wrapper .review-content{width:calc(100% - 120px);}
.review-wrapper .review-content .review-naam{font-size:20px; margin-bottom:5px;}
.review-wrapper .review-content .review-tekst{}
.review-wrapper .review-cijfer{width:80px; height:80px; line-height:80px; margin-left:40px; font-size:30px; text-align:center; border-radius:50%; background-color:#fff; color:var(--donkergroen);}

.review-wrapper .review-item:nth-of-type(2n){background-color:var(--zachtroze);}


.review-slider{display:block; width:100%;}
.review-slider .review-item{margin:0 21px; width:30%; height:300px; margin-bottom:30px;}
.review-slider .review-content{width:100%;}
.review-slider .review-content .review-tekst{display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 7;}


/* LB vragen */
.vragen-tags{margin-bottom:30px; text-align:center;}
.vragen-wrapper { max-width: 1000px !important; margin: 20px auto; transition: none !important;}
.vragen-item {width: 100% !important; transition-duration: 0s !important;border: 1px solid var(--groen); background-color:#fff; padding: 7px 20px; border-radius:30px; margin-bottom:10px;}
.vragen-item .vragen-vraag {font-size:20px;cursor: pointer;padding: 10px 0; position: relative; display: flex; justify-content: space-between;align-items: center;}
.vragen-item .vragen-vraag::after {content: '+'; color:var(--roze); font-size:40px; line-height:28px; transition: transform 0.3s ease;}
.vragen-item .vragen-item.is-open .vragen-vraag::after {transform: rotate(45deg);}
.vragen-item .vragen-antwoord {transition-duration: 0s !important;display: none; padding: 10px 20px 20px 0;}


/* LB CTA */
.cta-item {display: flex; flex-direction: column; width:100%; float: left; position: relative; min-height: 450px; max-width:400px; }
.cta-item .cta-img-wrapper{position:relative;}
.cta-item .cta-img-wrapper:before{content:""; position:absolute; width:35%; height:100%; background-color:var(--groen); right:0; top:0; border-radius:30px 30px 0px 0px;}
.cta-item .cta-img-wrapper .cta-img{width:200px; background-color:var(--beige); aspect-ratio:1/1; border-radius:50%; background-size:cover; background-position:center center; margin-left:auto; margin-right:auto; position:relative;}
.cta-item .cta-content{flex-grow: 1; color:#fff; padding:60px 30px 30px 30px; background-color:var(--groen);  border-radius:30px 0px 30px 30px; margin-top:-30px; }
.cta-item .cta-content .cta-titel{font-size:20px;}
.cta-item .cta-content .cta-tekst{margin-top:20px;}
.cta-item .cta-content .cta-btn{margin-top:20px;}

.cta-item.groen .cta-img-wrapper:before{background-color:var(--groen);}
.cta-item.groen .cta-content{background-color:var(--groen);}
.cta-item.donkergroen .cta-img-wrapper:before{background-color:var(--donkergroen);}
.cta-item.donkergroen .cta-content{background-color:var(--donkergroen);}
.cta-item.donkergroen .cta-content .cta-btn{color:var(--groen); border-color:var(--groen);}
.cta-item.donkergroen .cta-content .cta-btn:hover{background-color:var(--groen); color:#fff;}
.cta-item.roze .cta-img-wrapper:before{background-color:var(--roze);}
.cta-item.roze .cta-content{background-color:var(--roze);}

.cta-item.vacature{
  min-height: inherit;
 
}
.cta-item .cta-content{
   padding:30px;
}


@media only screen and (max-width: 1200px) {
	#wrapper .home-intro{mask-size: 140% 100%; -webkit-mask-size: 140% 100%; mask-position: center center; -webkit-mask-position: center ce;}
}

@media only screen and (max-width: 1024px) {
	.custom-footer:before,
	.vlak-kleur:before,
	.vlak-kleur:after,
	.pagina-header-vlak:after{height:100px; width:140%; left:-5%;}
	
	.blok-wrapper .blok-visual{-webkit-mask-image:none; mask-image:none; border-radius:30px;}
	.blok-wrapper .blok-item .blok-icoon{top:20px; left:20px;}
	.blok-wrapper .blok-item .blok-content{padding:140px 20px 20px 20px;}
	.blok-wrapper .blok-item .blok-btn{right:0; left:50%; transform:translateX(-50%); bottom:20px;}

}

@media only screen and (max-width: 767px) {
	#wrapper .home-intro{mask-size: 180% 100%; -webkit-mask-size: 180% 100%; margin-top:-300px;}
	
	.custom-footer:before,
	.vlak-kleur:before,
	.vlak-kleur:after,
	.pagina-header-vlak:after{height:60px; width:140%; left:-5%;}
	
	.filter-button-group .filter-btn{margin-bottom:10px;}
	
	.blok-wrapper{flex-direction:column;}
	.blok-wrapper .blok-item{width:100%; margin-bottom:30px;}
	
	.review-slider .review-item{width:100%; }
	
	.team-wrapper .team-item{width:47%;}
	.team-slider .team-item{width:100%; max-width:380px;}
	
	.home-route .home-route-hartcontainer{margin-top:0px; margin-right:0px;}
}

@media only screen and (max-width: 479px) {	
	.route-wrapper .route-kaart{width:315px; margin:0 auto;}
	.route-wrapper .route-sfeer{display:none;}
	
	.team-wrapper .team-item{width:100%; max-width:380px;}
	
	.partner-wrapper{flex-direction:column;}
}