.elementor-kit-9{--e-global-color-primary:#EAEADF;--e-global-color-secondary:#F59E52;--e-global-color-text:#343434;--e-global-color-accent:#FFFFFF;--e-global-color-43661f7:#F7F7F7;--e-global-color-5d21edc:#02010100;--e-global-color-d504aff:#214D53;--e-global-color-ec4a2c7:#9FBAE8;--e-global-color-486002f:#A73C50;--e-global-color-b2c03a2:#334589;--e-global-color-578656f:#E2C21F;--e-global-color-0dd3918:#91A465;--e-global-color-1ee0413:#D0B1D1;--e-global-color-aa54266:#EFEEE6;--e-global-color-3d6326e:#C7D2B2;--e-global-color-396c27b:#444444;--e-global-typography-primary-font-family:"Sansita";--e-global-typography-primary-font-size:4.5rem;--e-global-typography-primary-font-weight:800;--e-global-typography-primary-line-height:1em;--e-global-typography-secondary-font-family:"Sansita";--e-global-typography-secondary-font-size:clamp(2.4rem, 2.1231rem + 1.2308vw, 3rem);--e-global-typography-secondary-font-weight:600;--e-global-typography-secondary-line-height:1.5em;--e-global-typography-text-font-family:"co-text";--e-global-typography-text-font-size:1rem;--e-global-typography-text-font-weight:400;--e-global-typography-text-line-height:1.5em;--e-global-typography-accent-font-family:"co-text";--e-global-typography-accent-font-size:0.875rem;--e-global-typography-accent-font-weight:500;--e-global-typography-accent-line-height:1.5em;--e-global-typography-e39e01c-font-family:"Sansita";--e-global-typography-e39e01c-font-size:clamp(1.6rem, 1.5308rem + 0.3077vw, 1.75rem);--e-global-typography-e39e01c-font-weight:500;--e-global-typography-e39e01c-line-height:1.3em;--e-global-typography-bb25952-font-family:"Sansita";--e-global-typography-bb25952-font-size:clamp(1.4rem, 1.3538rem + 0.2051vw, 1.5rem);--e-global-typography-bb25952-font-weight:600;--e-global-typography-bb25952-line-height:1.2em;--e-global-typography-fa430d4-font-family:"Sansita";--e-global-typography-fa430d4-font-size:clamp(1.2rem, 1.1769rem + 0.1026vw, 1.25rem);--e-global-typography-fa430d4-font-weight:500;--e-global-typography-fa430d4-line-height:1.1em;--e-global-typography-fe87d79-font-family:"co-headline";--e-global-typography-fe87d79-font-size:2.2rem;--e-global-typography-fe87d79-font-weight:600;--e-global-typography-fe87d79-line-height:1em;--e-global-typography-b80e91d-font-family:"co-text";--e-global-typography-b80e91d-font-size:1rem;--e-global-typography-b80e91d-font-weight:700;--e-global-typography-b80e91d-line-height:1.5em;--e-global-typography-128670f-font-family:"co-text";--e-global-typography-128670f-font-size:1.15rem;--e-global-typography-128670f-line-height:1.5em;--e-global-typography-ce8222c-font-family:"co-text";--e-global-typography-ce8222c-font-size:1.1rem;--e-global-typography-ce8222c-font-weight:700;--e-global-typography-ce8222c-line-height:1.5em;--e-global-typography-c940302-font-family:"co-text";--e-global-typography-c940302-font-size:1rem;--e-global-typography-c940302-font-weight:600;--e-global-typography-c940302-line-height:1.5em;--e-global-typography-798b7a3-font-family:"co-text";--e-global-typography-798b7a3-font-size:1rem;--e-global-typography-798b7a3-font-weight:700;--e-global-typography-798b7a3-text-transform:uppercase;--e-global-typography-798b7a3-line-height:1.2em;--e-global-typography-65d2e1a-font-family:"co-text";--e-global-typography-65d2e1a-font-size:1.3rem;--e-global-typography-65d2e1a-font-weight:700;--e-global-typography-65d2e1a-line-height:1.5em;background-color:var( --e-global-color-aa54266 );}.elementor-kit-9 button,.elementor-kit-9 input[type="button"],.elementor-kit-9 input[type="submit"],.elementor-kit-9 .elementor-button{background-color:var( --e-global-color-d504aff );font-family:var( --e-global-typography-b80e91d-font-family ), Sans-serif;font-size:var( --e-global-typography-b80e91d-font-size );font-weight:var( --e-global-typography-b80e91d-font-weight );line-height:var( --e-global-typography-b80e91d-line-height );color:var( --e-global-color-accent );border-radius:25px 25px 25px 25px;}.elementor-kit-9 a{color:var( --e-global-color-secondary );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1618px;}.e-con{--container-max-width:1618px;--container-default-padding-top:0px;--container-default-padding-right:0px;--container-default-padding-bottom:0px;--container-default-padding-left:0px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.elementor-lightbox{--lightbox-ui-color:var( --e-global-color-secondary );--lightbox-ui-color-hover:var( --e-global-color-b2c03a2 );--lightbox-text-color:var( --e-global-color-primary );--lightbox-header-icons-size:32px;--lightbox-navigation-icons-size:32px;}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1200px){.elementor-kit-9{--e-global-typography-primary-font-size:3.7rem;--e-global-typography-128670f-font-size:1.1rem;}}@media(max-width:1024px){.elementor-kit-9{--e-global-typography-primary-font-size:3.7rem;--e-global-typography-primary-line-height:1em;--e-global-typography-128670f-font-size:1.1rem;}.elementor-kit-9 button,.elementor-kit-9 input[type="button"],.elementor-kit-9 input[type="submit"],.elementor-kit-9 .elementor-button{font-size:var( --e-global-typography-b80e91d-font-size );line-height:var( --e-global-typography-b80e91d-line-height );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-9{--e-global-typography-primary-font-size:2.5rem;--e-global-typography-primary-line-height:1em;--e-global-typography-128670f-font-size:1.1rem;}.elementor-kit-9 button,.elementor-kit-9 input[type="button"],.elementor-kit-9 input[type="submit"],.elementor-kit-9 .elementor-button{font-size:var( --e-global-typography-b80e91d-font-size );line-height:var( --e-global-typography-b80e91d-line-height );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */@keyframes fadeDown {
    from {
        opacity: 0;
        transform: translate3d(0,-30px,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.elementor-element.fadeInDown {
    animation-name: fadeDown
}

@keyframes fadeLeft {
    from {
        opacity: 0;
        transform: translate3d(-30px,0,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.elementor-element.fadeInLeft {
    animation-name: fadeLeft
}

@keyframes fadeRight {
    from {
        opacity: 0;
        transform: translate3d(30px,0,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.elementor-element.fadeInRight {
    animation-name: fadeRight
}

@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translate3d(0,30px,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.elementor-element.fadeInUp {
    animation-name: fadeUp
}

.knop .elementor-button:hover {
    transform: translateY(-3px);
    transition: transform 0.3s ease;
}

.elementor-widget-text-editor p:last-child{ margin-bottom:0px;}

.knopje2 {
  position: relative;
  display: inline-block;
  padding: 15px 25px;
  color: #fff;
  background-color: transparent; /* Houd de achtergrond aanvankelijk transparant */
  border: 0px solid #334589; /* Je bestaande randkleur */
  cursor: pointer;
  overflow: hidden; /* Zorg ervoor dat de animatie binnen het element blijft */
  z-index: 1;
  transition: color 0.6s ease-in-out; /* Zorgt voor een vloeiende kleurverandering */
}

.knopje2::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 10px; /* Startpuntgrootte van de cirkel (kan naar wens worden aangepast) */
  height: 10px; /* Startpuntgrootte van de cirkel */
  background-color: #9FBAE8; /* De opvulkleur */
  border-radius: 50%; /* Cirkelvorm */
  transform: translate(-50%, -50%) scale(0); /* Start als een punt */
  z-index: -1; /* Achter de tekst */
  transition: transform 0.8s cubic-bezier(0.5, 0, 0.1, 1); /* Inkomende animatie */
}

.knopje2:hover::after {
  transform: translate(-50%, -50%) scale(50); /* Cirkel breidt uit en vult de knop */
}

.knopje2:hover {
  color: #334589; /* Verandert de kleur van de tekst bij hover */
}

.knopje2:hover .tekstknop2 {
  color: #fff; /* Verandert de tekstkleur van .tekstknop naar wit bij hover */
  transition: color 0.8s cubic-bezier(0.5, 0, 0.1, 1); /* Zorgt ervoor dat de tekstkleurverandering overeenkomt met de inkomende animatie */
}

.knopje2:not(:hover)::after {
  transition: transform 0.4s ease-out; /* Snelle uitgaande animatie */
}

.knopje2:not(:hover) {
  transition: color 0.4s ease-out; /* Snelle uitgaande kleurverandering */
}

.tekstknop2 {
  color: white; /* Initiële kleur voor de tekst */
  transition: color 0.8s cubic-bezier(0.5, 0, 0.1, 1); /* Trage inkomende tekstkleur */
}

.knopje {
  position: relative;
  display: inline-block;
  padding: 15px 25px;
  color: #fff;
  background-color: transparent; /* Houd de achtergrond aanvankelijk transparant */
  border: 2px solid #334589; /* Je bestaande randkleur */
  cursor: pointer;
  overflow: hidden; /* Zorg ervoor dat de animatie binnen het element blijft */
  z-index: 1;
  transition: color 0.6s ease-in-out; /* Zorgt voor een vloeiende kleurverandering */
}

.knopje::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 10px; /* Startpuntgrootte van de cirkel (kan naar wens worden aangepast) */
  height: 10px; /* Startpuntgrootte van de cirkel */
  background-color: #334589; /* De opvulkleur */
  border-radius: 50%; /* Cirkelvorm */
  transform: translate(-50%, -50%) scale(0); /* Start als een punt */
  z-index: -1; /* Achter de tekst */
  transition: transform 0.8s cubic-bezier(0.5, 0, 0.1, 1); /* Inkomende animatie */
}

.knopje:hover::after {
  transform: translate(-50%, -50%) scale(50); /* Cirkel breidt uit en vult de knop */
}

.knopje:hover {
  color: #FBFCF7; /* Verandert de kleur van de tekst bij hover */
}

.knopje:hover .tekstknop {
  color: #fff; /* Verandert de tekstkleur van .tekstknop naar wit bij hover */
  transition: color 0.8s cubic-bezier(0.5, 0, 0.1, 1); /* Zorgt ervoor dat de tekstkleurverandering overeenkomt met de inkomende animatie */
}

.knopje:not(:hover)::after {
  transition: transform 0.4s ease-out; /* Snelle uitgaande animatie */
}

.knopje:not(:hover) {
  transition: color 0.4s ease-out; /* Snelle uitgaande kleurverandering */
}

.tekstknop {
  color: #334589; /* Initiële kleur voor de tekst */
  transition: color 0.8s cubic-bezier(0.5, 0, 0.1, 1); /* Trage inkomende tekstkleur */
}

/* Ronde hoeken voor Elementor Lightbox afbeeldingen */
.elementor-lightbox .elementor-lightbox-item img {
  border-radius: 2rem;
}/* End custom CSS */