/*
Theme Name: Waves Child
Author: 0117 Web Wizards
Author URI: https://www.0117.nl
Template:   make-some-waves-master
*/

.wp-block-jetpack-videopress .jetpack-videopress-player__wrapper {
  border-radius: 16px;
  overflow: hidden;
}
.z-index{
	z-index: 1;
	margin-bottom: -80px!important;
}

.overflow-hidden{
  overflow: hidden;
}

.grow-box {
  width: 100%!important;
  transform-origin: top center;
  transition: transform 0.1s linear;
  margin-bottom: 20px!important;
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1500px) {
.grow-box {
  margin-bottom: 200px!important;
}}

/* Optional: Ultra wide screens (1600px and up) */
@media (min-width: 1800px) {
.grow-box {
  margin-bottom: 300px!important;
}}

/* (custom) button :hover */
.wp-block-button .wp-block-button__link {
  transition: all 0.2s ease;
}

 .wp-block-post-title a{
     text-decoration: underline 3px transparent;
     transition: text-decoration .3s;
     text-underline-offset: 4px;
}
    
.wp-block-post-title a:hover{
    text-decoration-color: var(--wp--preset--color--primary-200);
    transition: text-decoration .1s;
 }

.wp-block-post.type-post.has-post-thumbnail img{
    filter: brightness(1);
    transform: scale(1);
    transition: all .3s ease;
}

.wp-block-post.type-post.has-post-thumbnail:hover img{
    filter: brightness(1.05);
    transform: scale(1.01);
    transition: all .1s ease;
}

 .wp-block-post.type-post.has-post-thumbnail{
    position: relative;
 }



 h2.wat-wij-doen-titles{
      top: 5px !important;
      left: 20px;
      color: white;
      font-size: 1.6em;
    z-index: 4;
    position: absolute;
 }

.wp-block-columns > .wp-block-column:nth-of-type(3) h2.wat-wij-doen-titles {
      /* color: black; */

}
 .huut-block a{
	 text-decoration: none;
	 color: inherit;
 }
 
 .huut-over-block a{
	 text-decoration: none;
   pointer-events: none;
	 color: inherit;
 }

 .huut-block svg{
	color: var(--wp--preset--color--red);
	   transition: all .3s ease;	
 }
 
 .huut-block:hover svg{ 
   rotate: -45deg;
 }

.huut-block.huut-first{
  min-height: 300px;
}

@media (max-width: 781px) { 
.huut-block.huut-first{
  min-height: 150px!important;
}
.huut-block .inner{
    min-height: 100px!important;
}
 .huut-block{
     min-height: 400px!important;
}
}

 .huut-block, .huut-over-block{
	 position: relative;
	 overflow: hidden; 
     min-height: 350px;
}


.huut-block .inner, .huut-over-block .inner{
    min-height: 300px;
}



 .huut-block .wat-wij-doen-titles a::after{
	z-index: 2;
    content: " ";
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 10px!important;
    width: 100%;
    height: 100%;
 }

 .huut-block a::after{
	z-index: 2;
    content: " ";
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
 }

  .huut-over-block a::after{
	z-index: 2;
    content: " ";
    position: absolute;
    cursor: pointer;
    pointer-events: none;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
 }
 
 .huut-block img, .huut-over-block img{
	 z-index: 1;
	 position: absolute;
	 margin-left: 20px;
	 rotate: 8deg;
 	top: 100px;
   	transition: all .25s ease;	 
 }
 
 .huut-block:hover img, .huut-over-block:hover img{
	rotate: 5deg;
 	top: 100px;
 }
 

 .huut-block .over-ons:hover img, .huut-over-block .over-ons:hover img{
	rotate: 5deg!important;
	opacity: 0;

 }
 
 .huut-block .over-ons p, .huut-over-block .over-ons p{
	opacity: 0!important;
   	transition: all .25s ease;	
}

 .huut-block .over-ons:hover p, .huut-over-block .over-ons:hover p{
	opacity: 100!important;

}
 
 /* ervaringen, carousel */
 .ervaringen .wp-block-splide-carousel .splide__pagination__page{
	 background: #FCEAEE;
 }
 
 .ervaringen .wp-block-splide-carousel .splide__arrow{
	 background: var(--wp--preset--color--light-pink);
 }
 
 .ervaringen .wp-block-splide-carousel .splide__arrow svg {
	 fill: var(--wp--preset--color--pink);
 }
 
 .ervaringen .wp-block-splide-carousel .splide__pagination__page.is-active{
	 background: white;
 }

 .ervaringen .splide .wp-block-image img {
    border-radius: 100%!important;
}

/* Default (desktop) */
.ervaringen .splide__arrow--prev {
  left: -50px !important;
}

.ervaringen .splide__arrow--next {
  right: -50px !important;
}

/* Tablet */
@media (max-width: 1024px) {
  .ervaringen .splide__arrow--prev {
    left: -25px !important;
  }

  .ervaringen .splide__arrow--next {
    right: -25px !important;
  }
}

/* Mobile */
@media (max-width: 768px) {
  .ervaringen .splide__arrow--prev {
    left: 0 !important;
  }

  .ervaringen .splide__arrow--next {
    right: 0 !important;
  }
}


 /* cases */
 .cases * .wp-block-post-title{
	 margin-top: -80px!important;
	 z-index: 3;
     position: absolute;
	 font-size: 1.4em;
	 margin-left: 20px;
 }
 
  .cases * .wp-block-post-title a{
	 color: white;
	 text-decoration: none;
  }
 
 .cases * figure a{
	 border-radius: 15px !important;
	 overflow: hidden !important;
 }
 
 .cases * figure h2 a{
	 border-radius: 0px !important;
 }
 
 .cases .wp-block-post.type-post.has-post-thumbnail:hover img {
     filter: brightness(0.7);
     transform: scale(1.2);
     transition: all .3s ease;
 }

  .cases * .has-post-thumbnail:hover img {
     filter: brightness(0.7);
     transform: scale(1.2);
     transition: all .3s ease;
 }

   .cases * .has-post-thumbnail img {
     filter: brightness(1);
     transform: scale(1.0);
     transition: all .3s ease;
 }
 
 /* overlay */
 .cases * .has-post-thumbnail {
     position: relative;
 }

 /* Overlay */
 .cases * .has-post-thumbnail::after {
     content: "";
     position: absolute;
     inset: 0;
     background-color: rgba(15, 45, 235, 0.15);
     opacity: 0;
     transition: opacity 0.3s ease;
     border-radius: 15px;
     z-index: 1;
 }

 /* Arrow icon (top right, white) */
 .cases * .has-post-thumbnail::before {
     content: "";
     position: absolute;
     top: 16px;
     right: 16px;
     width: 36px;
     height: 36px;
	   rotate: -45deg;
     background-color: #fff;
     -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cpath d='M571.3 267.3c6.2-6.2 6.2-16.4 0-22.6l-144-144c-6.2-6.2-16.4-6.2-22.6 0s-6.2 16.4 0 22.6L521.4 240 16 240c-8.8 0-16 7.2-16 16s7.2 16 16 16l505.4 0-116.7 116.7c-6.2 6.2-6.2 16.4 0 22.6s16.4 6.2 22.6 0l144-144z'/%3E%3C/svg%3E");
     -webkit-mask-repeat: no-repeat;
     -webkit-mask-size: contain;
     -webkit-mask-position: center;
     mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3Cpath d='M571.3 267.3c6.2-6.2 6.2-16.4 0-22.6l-144-144c-6.2-6.2-16.4-6.2-22.6 0s-6.2 16.4 0 22.6L521.4 240 16 240c-8.8 0-16 7.2-16 16s7.2 16 16 16l505.4 0-116.7 116.7c-6.2 6.2-6.2 16.4 0 22.6s16.4 6.2 22.6 0l144-144z'/%3E%3C/svg%3E");
     mask-repeat: no-repeat;
     mask-size: contain;
     mask-position: center;
     opacity: 0;
     transition: opacity 0.3s ease;
     z-index: 2;
 }

 /* Hover */
 .cases * .has-post-thumbnail:hover::after,
 .cases * .has-post-thumbnail:hover::before {
     opacity: 1;
 }

 .cases * .has-post-thumbnail a::after{
	z-index: 2;
    content: " ";
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
 }
 
 /* width fix for columns 'cause shit ain't workin in wordpress */
.w-100{
	 width: 100%;
 }
 
 .yoast-breadcrumbs{
	 text-align: center;
	 text-decoration: none;
	 font-size: 0.8em;
	 margin-bottom: -20px!important;
 }
 
 .yoast-breadcrumbs a{
	 text-decoration: none;
 }
 
 .overflow-hidden{
	 overflow: hidden!important;
 }
 
 footer{
	 margin-top: 0px!important;
 }
 
 mark {
     position: relative;
     display: inline-block;
     padding: 0.1em 0.2em; 
     color: white !important;
     background: transparent!important;
     z-index: 0;      
 }

 mark::before {
     content: "";
     position: absolute;
     top: 50%;
     left: 0;
     width: 100%;
     height: 100%;
     background-color: #0F2DEB;
     transform: rotate(-1deg) translateY(-50%);
     transform-origin: left center;
     z-index: -1;    
     pointer-events: none; 
	 margin-top: 3px;
 }
 
 /* Parent reset voor counter */
 .huut-list {
   counter-reset: white-block;
   position: relative; 
 }

 /* Divs tellen en positioneren */
 .huut-list .wp-block-columns-is-layout-flex{
   position: relative;
   counter-increment: white-block;
   padding-left: 40px;
 }

 /* Nummer cirkel */
 .huut-list .wp-block-columns-is-layout-flex::before {
   content: counter(white-block);
   position: absolute;
   top: 50%;   
   left: 0;        
   transform: translate(-50%, -50%);
   width: 35px;
   height: 35px;
   background: var(--wp--preset--color--red);
   color: #fff;
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 16px;
   font-weight: bold;
 }
 
 /* Ninja */
 .ninja-forms-field.nf-element{
	 height: 50px!important;
	 padding: 3px 10px!important;
	 border: 1px solid #cccccc;
	 border-radius: 5px;
 }
 
 textarea.ninja-forms-field.nf-element{
	 height: 250px!important;
	 padding: 13px 10px!important;
	 border: 1px solid #cccccc;
	 border-radius: 5px;
 }
 
 #nf-field-4{
	 background-color: var(--wp--preset--color--primary-100);
	 color: var(--wp--preset--color--white);
	 font-weight: bold;
	 border-radius: 5px;
	 font-family: "Sanchez";
	 width: 140px!important;
	 cursor: pointer;
	 font-size: 0.9em;
 }
 
 #nf-field-4:hover{
	 background-color: var(--wp--preset--color--white);
	 color: var(--wp--preset--color--red);
	 border-color: var(--wp--preset--color--red);
 } 
 
 .ninja-forms-req-symbol{
	 color: var(--wp--preset--color--red);
 }

.nf-form-fields-required{
  margin-bottom: 20px;
  font-style: italic;
  opacity: 0.5;
}
 
/* Customise the SPLIDE (desktop) */
 .splide .wp-block-image img{
	 border-radius: 15px;
 }
 
 .wp-block-splide-carousel .splide__arrow {
   background: var(--wp--preset--color--red);
 }
 
 .wp-block-splide-carousel .splide__arrow svg {
	 fill: white;
 }

 .splide__arrow--prev {
   left: -18px !important;
 }

 .splide__arrow--next {
   right: -18px !important;
 }

.photo-slider .splide__arrow {
  margin-left: 25px !important;
  margin-right: 25px !important;
 }

  .photo-slider .splide__arrow--prev {
   left: 0px !important;
 }

 .photo-slider .splide__arrow--next {
   right: 0px !important;
 }

 .photo-slider .splide__slide img {
  width: auto!important;
  height: 500px!important; 
  object-fit: contain!important;    
  
}

.photo-slider .splide__slide {
  width: max-content!important;
  height: 100%!important;
  text-align: center!important;
  height: 100%!important;        
  text-align: center!important;    
  padding: 0!important;     
}

/* Tablet */
@media (max-width: 1024px) {
    .splide__arrow--prev {
      left: -16px !important;
    }

    .splide__arrow--next {
      right: -16px !important;
    }
    .photo-slider .splide__slide img {
      height: 300px!important;
    }
}

/* Mobile */
@media (max-width: 768px) {
  .splide__arrow--prev {
    left: -14px !important;
  }

  .splide__arrow--next {
    right: -14px !important;
  }
  .photo-slider .splide__slide img {
    height: 300px!important;

  }
}

/* FAQ */
summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    cursor: pointer;
    position: relative; /* Zorgt ervoor dat het icoon absoluut gepositioneerd kan worden */
}

summary a{
  text-decoration: none!important;
}

summary::after {
    content: '';
    display: inline-block;
    width: 36px;
    height: 36px;
    background-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20d%3D%22M12%206L8%2010L4%206%22%20fill%3D%22none%22%20stroke%3D%22%23D3D3D3%22%20stroke-width%3D%221%22%2F%3E%3C%2Fsvg%3E');
    background-size: contain;
    background-repeat: no-repeat;
    transition: transform 0.2s ease-in-out;
    flex-shrink: 0;
}

details[open] summary::after {
    transform: rotate(180deg); 
}

summary::-webkit-details-marker {
    display: none;
}

/* Reverse columns */
@media (max-width: 768px) {
  .reverse-columns .wp-block-column:first-child {
    order: 2;
  }

  .reverse-columns .wp-block-column:last-child {
    order: 1;
  }
}

/* Reverse columns */
@media (max-width: 768px) {
  .header-frontpage h1{
    font-size: 1.8em!important;
  }
}

/* menu */
/* Navbar */
.wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container{
  border: none !important;
  padding: 10px 5px !important;
  margin-top: 3px;
  color: var(--wp--preset--color--dark-200)!important;
  background-color: var(--wp--preset--color--pink)!important;
}

.wp-block-navigation__responsive-container{
  background-color: var(--wp--preset--color--light-200)!important;
}

.wp-block-navigation a {
  text-decoration: underline;
  text-decoration-color: transparent;
  text-underline-offset: 5px;
  transition: text-decoration .3s;
}

@media (hover: hover){
  .wp-block-navigation a:hover {
    text-decoration-color: var(--wp--preset--color--dark-200);
  }
}

.wp-block-navigation .wp-block-navigation__submenu-container a {
  text-decoration-color: transparent;
}

.wp-block-navigation .current-menu-item > a {
  text-decoration-color: currentColor;
}