/********* Compiled - Do not edit *********/
:root{--color-primary:#f13c46;--color-gradient-start:#f42958;--color-gradient-stop:#e4442a;}.woocommerce ul.products, .woocommerce-page ul.products{margin-left:-15px;margin-right:-15px;}.woocommerce ul.products li.product, .woocommerce-page ul.products li.product{padding-left:15px;padding-right:15px;}body{font-family:Work Sans;font-weight:400;line-height:1.7em;font-size:1.1em;color:#000000;}body.single-post .blog-single-title{font-family:inherit;}body.single-post .content{font-family:inherit;}.h1,h1{font-family:Roboto;font-weight:500;line-height:1.2em;font-size:52px;color:#181b31;}.h2,h2{font-family:Roboto;font-weight:500;line-height:1.2em;font-size:40px;color:#181b31;}.h3,h3{font-family:Roboto;font-weight:500;line-height:1.2em;font-size:32px;color:#181b31;}.h4,h4{font-family:Roboto;font-weight:500;line-height:1.2em;font-size:25px;color:#181b31;}.h5,h5{font-family:Roboto;font-weight:500;line-height:1.2em;font-size:21px;color:#181b31;}.h6,h6{font-family:Roboto;font-weight:500;line-height:1.2em;font-size:18px;color:#181b31;}.titlebar-inner h1{}.titlebar-inner p{}.poly img {
  object-fit: cover; /* houdt de verhoudingen netjes */
  width: 100%;
  height: auto;

  /* schuine hoeken */
  -webkit-clip-path: polygon(
    30px 0%, 
    calc(100% - 30px) 0%, 
    100% 30px, 
    100% calc(100% - 30px), 
    calc(100% - 30px) 100%, 
    30px 100%, 
    0% calc(100% - 30px), 
    0% 30px
  );
  clip-path: polygon(
    30px 0%, 
    calc(100% - 30px) 0%, 
    100% 30px, 
    100% calc(100% - 30px), 
    calc(100% - 30px) 100%, 
    30px 100%, 
    0% calc(100% - 30px), 
    0% 30px
  );
}


.btn-bordered {
  position: relative;
  overflow: hidden; /* voorkomt dat de inhoud buiten de vorm valt */

  -webkit-clip-path: polygon(
    12px 0%, 
    calc(100% - 12px) 0%, 
    100% 12px, 
    100% calc(100% - 12px), 
    calc(100% - 12px) 100%, 
    12px 100%, 
    0% calc(100% - 12px), 
    0% 12px
  );
  clip-path: polygon(
    12px 0%, 
    calc(100% - 12px) 0%, 
    100% 12px, 
    100% calc(100% - 12px), 
    calc(100% - 12px) 100%, 
    12px 100%, 
    0% calc(100% - 12px), 
    0% 12px
  );
}

.btn-bordered:hover {
  /* zelfde vorm behouden */
  -webkit-clip-path: polygon(
    12px 0%, 
    calc(100% - 12px) 0%, 
    100% 12px, 
    100% calc(100% - 12px), 
    calc(100% - 12px) 100%, 
    12px 100%, 
    0% calc(100% - 12px), 
    0% 12px
  );
  clip-path: polygon(
    12px 0%, 
    calc(100% - 12px) 0%, 
    100% 12px, 
    100% calc(100% - 12px), 
    calc(100% - 12px) 100%, 
    12px 100%, 
    0% calc(100% - 12px), 
    0% 12px
  );

  /* optioneel extra hover-effect */
  background-color: #000;   /* voorbeeld */
  color: #fff;              /* voorbeeld */
}














/* Zet 'booghoog' op je Image block of op de  zelf */
.wp-block-image.booghoog img,
.wpb_single_image.booghoog img,
img.booghoog {
  border-radius: 20px 20px 0 0; /* enkel boven afgerond */
  display: block;
  width: 100%;
  height: auto;
}

/* Optioneel: als 'booghoog' op de wrapper/figure staat, clip dan netjes mee */
.wp-block-image.booghoog,
.wpb_single_image.booghoog {
  overflow: hidden;
  border-radius: 20px 20px 0 0;
}

.booglaag {
  background-color: #fff;         /* witte achtergrond */
  border-bottom-left-radius: 20px; /* onder links afgerond */
  border-bottom-right-radius: 20px; /* onder rechts afgerond */
  border-top-left-radius: 0;       /* boven niet afgerond */
  border-top-right-radius: 0;      /* boven niet afgerond */
  margin-top: -2px;                /* zorgt dat hij strak tegen de image aansluit */
  padding: 20px;                   /* ruimte voor de tekst */
}