/* =========================================================
   1. RESET & GLOBAL SETTINGS


   NOTE: REDIRECTS FOR JDONATON IN js FILE AND IN HELIX CUSTOM CODE
   ========================================================= */


*, *::before, *::after {
    box-sizing: border-box;
}

img {
    max-width: 100%;
    height: auto;
}


@font-face {
  font-family: 'Nunito';
  src: url('/templates/shaper_helixultimate/fonts/Nunito-ExtraLight.ttf') format('truetype');
  font-weight: 100;
  font-style: normal;
}
@font-face {
  font-family: 'Nunito';
  src: url('/templates/shaper_helixultimate/fonts/Nunito-Light.ttf') format('truetype');
  font-weight: 200;
  font-style: normal;
}
@font-face {
  font-family: 'Nunito';
  src: url('/templates/shaper_helixultimate/fonts/Nunito-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: 'Nunito';
  src: url('/templates/shaper_helixultimate/fonts/Nunito-SemiBold.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: 'Nunito';
  src: url('/templates/shaper_helixultimate/fonts/Nunito-Bold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
}
@font-face {
  font-family: 'Nunito';
  src: url('/templates/shaper_helixultimate/fonts/Nunito-ExtraBold.ttf') format('truetype');
  font-weight: 800;
  font-style: normal;
}
body {
    margin: 0;
    font-family: 'Nunito', sans-serif;
    font-weight: 300;
    color: var(--color-dark);
}

/* Formulieren, knoppen, menu’s, inputs */
button,
input,
select,
textarea,
.nav,
.sp-megamenu-parent,
.sp-megamenu-parent a {
    font-family: 'Nunito', sans-serif !important;
}

body .sppb-row {
    margin:0;
}

/* =========================================================
   2. DESIGN TOKENS (COLORS, SPACING, RADII, TYPOGRAPHY)
   ========================================================= */

:root {
    --color-primary: #490722;
    --color-primary-light: #9b8595;


    --color-dark: #121212;
    --color-light: #f4f4f5;
    --color-grey: #ebebeb;   

/* Spacing scale */
    --space-xs: 10px;
    --space-sm: 20px;
    --space-md: 30px;
    --space-lg: 40px;
    --space-xl: 75px;

    --header-height: 143px;
    --max-width-content: 1140px;
    --col-max-width: calc(50% - var(--space-sm));
    --col-half-max-width: calc(25% - var(--space-sm));
    --min-height:350px;

    /* Typography */
    --font-base: 'Nunito', sans-serif;
    --font-weight-Xlight: 100;
    --font-weight-light: 200;
    --font-weight-regular: 400;
    --font-weight-semibold: 500;
    --font-weight-bold: 600;
    --font-weight-xbold: 800;

    --radius-md: 5px;
    --radius-lg: var(--space-xs);
    --border-radius: 0 10px 0 10px;
}

.itemid-133, .itemid-148, .itemid-163  { /* Home */
    --color-primary: #aa00aa;
    --color-primary-light: #ff00ff;
}
.itemid-138,.itemid-149, .itemid-164 { /* Wie */
    --color-primary: #490722;
    --color-primary-light: #9b8595;
}
.itemid-139, .itemid-150, .itemid-165 { /* Wat */
    --color-primary: #490722;
    --color-primary-light: #9b8595;
}
.itemid-140,.itemid-151, .itemid-166 { /* Nieuws */
    --color-primary: #337900;
    --color-primary-light: #70cd38;
}
.itemid-141.itemid-152, .itemid-167 { /* Help */
    --color-primary: #2e1a17;
    --color-primary-light: #e9ded0;
}
.itemid-142, .itemid-153, .itemid-168  { /* Contact */
    --color-primary: #490722;
    --color-primary-light: #9b8595;
}
.itemid-143, .itemid-154, .itemid-169 { /* Doneer */
    --color-primary: #ca243b;
    --color-primary-light: #dab0af;
}
.itemid-144, .itemid-155, .itemid-159 { /* Beleid */
    --color-primary: #490722;
    --color-primary-light: #9b8595;
}
.itemid-145, .itemid-156, .itemid-160 { /* Jaarverslagen */
    --color-primary: #0168de;
    --color-primary-light: #7faDc7;
}
.itemid-146, .itemid-157, .itemid-161 { /* Privacy */
    --color-primary: #034292;
    --color-primary-light: #3992d9;
}
.itemid-147, .itemid-158, .itemid-162 { /* Cookies */
    --color-primary: #ca243b;
    --color-primary-light: #d76867;
}
.itemid-243,.itemid-244 .itemid-245  { /* ISaac */
    --color-primary: #2e1a17;
    --color-primary-light: #e9ded0;
}
.itemid-250,.itemid-251, .itemid-252  { /* School */
    --color-primary: #0168de;
    --color-primary-light: #7faDc7;
}


.divider-1140px, .sppb-divider {
    border-bottom-width: 1px;
    width: 1140px;
    border-color: var(--color-primary-light);
    margin: var(--space-lg, 0) 0;
}
.divider-90px {
    border-bottom-width: 5px;
    width: 90px;
    border-color: var(--color-primary);
    margin: var(--space-lg, 0);
}

.footer-info {
    scroll-margin-top: var(--header-height, 80px);
}


@media (max-width:991.98px) {
    :root {
        --space-lg: var(--space-md);
    }
}

/* =========================================================
   3. LAYOUT WRAPPERS
   ========================================================= */
.section {
    min-height: var(--min-height);
}
.sppb-row-container {
    width: 1140px;
    margin: 0 auto;
    padding-left: var(--space-sm);
    padding-right: var(--space-sm);
    padding-bottom: var(--space-sm);
}
.container-max {
    max-width: var(--max-width-content);
    margin: 0 auto;
    padding: 0 var(--space-sm);
}
.inner-columns {
    display:flex;
    flex-wrap:wrap;
    justify-content: flex-start;
    gap:20px;
}

.inner-columns > .sppb-addon-wrapper{
    flex:0 0 auto;
    max-width:var(--col-max-width) ;
    width:100% ;
}
.content-row {
    max-width:var(--max-width-content);
}

.content-column-l, .content-column-r {
    width:100%;
    display:flex;
    flex-direction:column;
    justify-content:center;
    height:100%;
}


/* Kolom op 100% hoogte */
.image-column-r {
    height: 100%;
    display: flex;
    justify-content: center;
}

/* Alle tussenliggende containers op 100% hoogte */
 .image-column-r > .sppb-addon-wrapper,
 .sppb-addon.sppb-addon-single-image,
 .image-column-r .sppb-addon-content {
    height: 100%;
    display: flex;
}

/* Centreer de afbeelding */
 .sppb-addon-single-image-container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 100%;
}

/* Afbeelding binnen de container */
 .sppb-addon-single-image-container img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}


@media (max-width: 1121.98px) {
    .sppb-row-container {
        width:100%;
    }

}
@media (max-width: 549.98px) {
    .inner-columns .sppb-addon-wrapper {
        max-width:100%;
    }

}

/* =========================================================
   5. TYPOGRAPHY
   ========================================================= */
/* Koppen */
h2, h3, h4, h5, h6 {
    font-family: 'Nunito', sans-serif !important;
    font-weight: var(--font-weight-semibold);
}

/* Paragrafen */
p {
    font-family: 'Nunito', sans-serif !important;
    font-weight: var(--font-weight-regular);
}

/* Links */
a {
    font-family: 'Nunito', sans-serif !important;
    font-weight: var(--font-weight-semibold);
}
body h1 {
    font-size: 55px;
    font-weight: var(--font-weight-bold);
}

body h2 {
    font-size: 28px;
}
body h3 {
    font-size: 18px;

}

body a {
    color:var(--color-primary);
}
body a:hover {
    color:var(--color-light);
}


body p {
    line-height: 1.6;
}

.outline-text { 
    color: var(--color-light); 
    -webkit-text-stroke: 2px var(--color-dark); 
    text-shadow: -1px -1px 0 var(--color-dark), 1px -1px 0 var(--color-dark), -1px 1px 0 var(--color-dark), 1px 1px 0 var(--color-dark); 
}

.fas:before, .far:before {
    color: var(--color-primary-light);
}

@media (max-width:991.98px) {
    body h1 {
        font-size: 45px;
    }
}


@media (max-width:766.98px) {
    body h1 {
        font-size: 35px;
    }
    body h2 {
        font-size: 18px;
    }
}

/* =========================================================
   7. BUTTONS
   ========================================================= */

body .sppb-btn, .nspro_back_button .btn-default {
    display: flex!important;
    justify-content: center;
    flex-wrap:nowrap;
    align-items: center;
    height: 50px;
    width:250px;
    padding: 0px 0px;
    margin: var(--space-lg, 0);
    border-radius: var(--border-radius);
    font-weight: var(--font-weight-bold);
}
body .sppb-addon-button-group .sppb-addon-content {
    display: flex;
    gap: 15px;
    justify-content: center;
    margin-top:var(--space-md);
}

body .sppb-btn-primary, .btn-nspro-subscribe, .eb-floating-button, .btn-primary, .donation-submit-btn, .nspro_back_button .btn-default {
    background: var(--color-primary);
    color: var(--color-light);
    border-color: var(--color-primary);
}

body .sppb-btn-primary:hover, body .sppb-btn:hover, .eb-floating-button:hover, .btn-primary:hover .donation-submit-btn:hover, .nspro_back_button .btn-default:hover {
    background: var(--color-dark);
    color:var(--color-light);
    border-color: var(--color-light);
    border-style: solid; 
    border-width: 2px; 
}

body .sppb-btn-secondary {
    background: transparent;
    color: var(--color-light);
    border-color: var(--color-light);
    border-style: solid; 
    border-width: 2px; 
}

body .sppb-btn-secondary:hover {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color:var(--color-light);
}

body .sppb-btn-custom {
    background: var(--color-light);
    color: var(--color-primary);
    border-color: var(--color-primary);
    border-style: solid; 
    border-width: 2px; 
}

body .sppb-btn-custom:hover {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color:var(--color-light);
}

body .btn-lg {
    width:390px;
}
body .btn-xl {
    width:450px;
}
body .hero .sppb-btn-primary:hover, body .sp-megamenu-parent .sppb-btn-primary:hover {
    background: transparent;
}

.sppb-btn .fas, .sppb-btn .far  {
    padding-right:10px;
}

@media (max-width: 991.98px) {
    body .btn-lg {
        width: 250px;
    }
}
@media (max-width: 562.98px) {
    body .sppb-btn {
        font-size: 10;
    }
}


/* =========================================================
   7. HEADER / MENU (basis, uitbreidbaar)
   ========================================================= */
#sp-header {
    position: relative;
    z-index: 9990;
    height:135px;
    background-color: transparent;
}
#sp-top-bar {
    background-color: rgba(255, 255, 255, 0.1); /* wit + 50% transparant */
    color: var(--color-primary-light);
    padding: 5px;
    height:35px;
}

#sp-top-bar a {
    color:var(--color-primary);
    font-size:130%;
}

#sp-top2 .sp-column {
    display: flex;
    justify-content: right; /* of center / space-between */
    align-items: center;
    padding-right:5px;
    gap: 16px; /* optioneel: ruimte tussen telefoon/email en switcher */
}

.sp-contact-info {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    color:var(--color-primary);
    gap: 15px;
}

/* Basis styling */
.sp-contact-info li {
    display:flex;
    gap:10px;
    align-items:center;
}

.sp-contact-info .fa-phone,
.sp-contact-info .fa-envelope {
    display: inline-block;
    width: 19px;
    height: 19px;
    background-color: currentColor; /* kleur komt van parent */
    mask-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    -webkit-mask-repeat: no-repeat;
}

/* Telefoon */
.sp-contact-info .fa-phone {
    mask-image: url('/images/phone.svg');
    -webkit-mask-image: url('/images/phone.svg');
}

/* Mail */
.sp-contact-info .fa-envelope {
    mask-image: url('/images/mail.svg');
    -webkit-mask-image: url('/images/mail.svg');
}


#sp-header.header-sticky {
    background-color: var(--color-light); /* wit + 50% transparant */
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    animation: none ;
    margin-top: 0;
    position: fixed;
    z-index: 9990;
    height: var(--header-height);
}

#sp-header .logo {
    display: flex;
    position: relative;
    height: 100px;
    border-bottom: none;
    transition: height 0.3s ease;
    margin: 0;
}
#sp-header .logo-image {
    padding: 5px 0;
    width: auto;
    display: block;
    height: 80px!important;
}
/* ── Dropdown parent positioning ── */
nav.sp-megamenu-wrapper .sp-megamenu-parent > li.sp-has-child {
    position: relative;
}

/* ── Top-level links & headings ── */
.sp-megamenu-parent > li.sp-has-child > a,
.sp-menu-heading {
    padding-right: 18px !important;
    position: relative;
    display: flex;
    align-items: center;
}

/* ── Dropdown arrow ── */
.sp-megamenu-parent > li.sp-has-child > a:after {
    content: "\f107";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    font-size: 12px;
    color: inherit;
}

/* ── Dropdown panel: hidden by default ── */
.sp-megamenu-parent > li.sp-has-child .sp-dropdown {
    display: block !important;
    opacity: 0;
    visibility: hidden;
    transform: translateY(100px);
    pointer-events: none;
    transition: opacity 0.35s ease, transform 0.35s ease;
    z-index: 999;
}

/* ── Dropdown panel: visible on hover ── */
.sp-megamenu-parent > li.sp-has-child:hover .sp-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(-20px);
    pointer-events: auto;
}

/* ── Dropdown inner background ── */
#sp-header:not(.header-sticky) .sp-dropdown-inner,
.sp-megamenu-parent > li.sp-has-child .sp-dropdown-items > li > a {
    background: transparent;
}

#sp-header.header-sticky .sp-dropdown-inner {
    background: var(--color-light);
}

/* ── Dropdown items layout ── */
.sp-megamenu-parent > li.sp-has-child .sp-dropdown-items,
.sp-megamenu-parent > li.sp-has-child .sp-dropdown-items > li {
    display: block !important;
}

/* ── Top-level menu links ── */
body .sp-megamenu-parent > li > a {
    font-weight: var(--font-weight-bold);
    color: var(--color-light);
    font-size: 110%;
}

body .sp-megamenu-parent > li > a:hover,
#sp-header.header-sticky .sp-megamenu-parent > li > a:hover {
    color: var(--color-primary);
}

body .sp-megamenu-parent > li > a:hover {
    font-weight: var(--font-weight-xbold);
}

body #sp-header.header-sticky .sp-megamenu-parent > li > a {
    color: var(--color-primary);
}

/* ── Active state ── */
body .sp-megamenu-parent > li.active a,
#sp-header.header-sticky .sp-megamenu-parent > li.active a,
.sp-megamenu-parent > li.sp-menu-item.active > a,
.sp-megamenu-parent .sp-dropdown li.sp-menu-item.active > a {
    color: var(--color-primary-light);
}

/* ── Dropdown item links ── */
.sp-megamenu-parent > li.sp-has-child .sp-dropdown-items > li > a {
    display: block;
    padding: var(--space-xs) var(--space-sm);
    color: var(--color-primary);
    border-bottom: 1px solid rgba(255,255,255,0.1);
    transition: background 0.25s ease;
}

/* ── Dropdown item links: hover ── */
body .sp-megamenu-parent > li.sp-has-child .sp-dropdown-items > li > a:hover,
#sp-header.header-sticky .sp-megamenu-parent > .sp-has-child .sp-dropdown-items > li > a:hover {
    color: var(--color-primary-light);
}

#sp-header.header-sticky .sp-megamenu-parent > li.sp-has-child .sp-dropdown-items > li > a {
    color: var(--color-primary);
}

/* Sticky staat */ 
.header-sticky .burger-icon > span { 
    background-color: var(--color-primary);  
}

/* OFF-CANVAS MENU */
body.ltr.offcanvs-position-right.offcanvas-active .offcanvas-menu {
    Width: 100%;
    background-color:unset;
}
.offcanvas-menu .offcanvas-inner {
    width: 400px;
    margin:auto;

    padding-left:45px;
}
.menu.nav-pills > li > a {
    justify-content:start;
    margin:0;
}
.offcanvas-menu .offcanvas-inner ul.menu>li a:hover{
    color:#fff!important;
}
.offcanvas-inner .sp-contact-info {
    justify-content:flex-start
}
.offcanvas-menu .offcanvas-inner ul.menu>li a:hover, 
.offcanvas-menu .offcanvas-inner ul.menu>li a:focus, 
.offcanvas-menu .offcanvas-inner ul.menu>li span:hover, 
.offcanvas-menu .offcanvas-inner ul.menu>li span:focus {
    color: var(--color-light);
}
.offcanvas-menu .offcanvas-inner ul.menu>li.active:not(:last-child) a {
    color:var(--color-primary);
}
/*.offcanvas-menu .offcanvas-inner ul.menu>li:not(:last-child) { 
    margin-left: 15px; 
}*/
ul.mod-menu__sub.menu-child {
    padding-top:5px!important;
    border-top:3px solid var(--color-primary);
}

.menu-toggler {
    margin-right: 170px;
    color: var(--color-primary);
}
.offcanvas-menu a.sppb-btn.sppb-btn-primary { 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    text-align: center; 
    width:100px;
}

@media (max-width:1121.98px) {
    .sp-megamenu-parent>li>a, .sp-megamenu-parent>li span {
        padding: 0 5px;
     }
}


@media (max-width: 445.98px){
    #sp-top-bar a {
        font-size:100%;
    }
    .sp-contact-info {
        gap:5px;
    }
    #sp-top2 .sp-column {
        gap:0px
    }
}

/* ===========================================================
    language switcher  
   ===========================================================*/
.mod-languages__select button,
.mod-languages__select .dropdown-menu a {
    font-size: 0; /* verbergt de tekst */
    line-height: 0; /* voorkomt extra ruimte */
}

.mod-languages__select button {
    padding-right: 28px; /* ruimte voor het pijltje */
    position: relative;
}
.mod-languages__select button img {
    width: 20px;      /* of jouw gewenste vlaggrootte */
    height: auto;
    margin-right: 8px; /* ruimte tussen vlag en pijltje */
}

div.mod-languages .btn-group .btn  {
    background-color: transparent;
    border-color: var(--color-primary);
}

.mod-languages__select button::after {
    content: "";
    border: 4px solid transparent;
    border-top-color: #fff; /* kleur van het pijltje */
    position: absolute;
    right: 8px;             /* afstand van de rechterkant */
    top: 50%;
    transform: translateY(-25%);
}

.lang-block.dropdown-menu {
    background-color: var(--color-primary-light);
    width: auto; 
    min-width: auto; 
    padding: 4px 6px; 

}

#sp-top-bar .lang-block.dropdown-menu.show {
    transform: translate3d(15px, 35px, 0px)!important;
}
/* Verberg taalnamen in de language switcher dropdown */
.lang-block.dropdown-menu a {
    display: flex;
    align-items: center;
    gap: 0; /* geen ruimte tussen vlag en tekst */
    font-size: 0!important; /* verbergt de tekst */
}

/* Zorg dat de vlag wél zichtbaar blijft */
.lang-block.dropdown-menu a img {
    width: 20px;
    height: auto;
    font-size: initial; /* reset voor veiligheid */
}
div.mod-languages ul li.lang-active {
    padding:0px;
}

/* =========================================================
   9. HERO / BANNERS
   ========================================================= */

/* =========================================================
   HERO COMPONENT — TEXT COLORS
   ========================================================= */
.hero .content-column-l,
.hero .content-column-l h1,
.hero .content-column-l h2,
.hero .content-column-l p {
    color: var(--color-light);
    font-weight:600;
}
.hero .content-column-l p {
    font-size:20px;

}

   /* ALGEMEEN HERO */
.hero, #sp-nieuws {
    --display:grid;
    --justify-content:center;
    --position:relative;
    --overflow: hidden;
    --background-size: cover;
    --background-position: center;
    --background-repeat: no-repeat;
    --section-pb: var(--space-sm);

    --section-margin-top: calc(-1 * var(--header-height) * var(--hero-space)) !important;
}

#home-hero {
    --background-image: url("/images/hero/hero-7.jpg");
        --hero-space:1;
        --header-factor:5;
        --textblock-align: flex-end;
        --aspect-ratio: 3 / 2;
        --column-pb:min(max(50px, calc(50px + 0.468 * (100vw - 1500px))),1200px);
        --min-height: 650px;
}
#wie-hero {
    --background-image: url("/images/hero/hero-9.jpg");
    --hero-space:1;
    --header-factor:5;
    --textblock-align: flex-end;
    --aspect-ratio: 3 / 2;
    --column-pb:min(max(50px, calc(50px + 0.468 * (100vw - 1500px))),1200px);
        --min-height: 650px;
}
#wat-hero {
    --background-image: url("/images/hero/hero-10.jpg");
    --hero-space:1.5;
    --header-factor:5;
    --textblock-align: flex-end;
    --aspect-ratio: 3 / 2;
    --column-pb:min(max(50px, calc(50px + 0.468 * (100vw - 1500px))),1200px);
        --min-height: 650px;
}
#nieuws-hero, #sp-nieuws {
    --background-image: url("/images/hero/hero-14.jpg");
    --hero-space:1.2;
    --header-factor:5;
    --textblock-align: flex-end;
    --aspect-ratio: 3 / 2;
    --column-pb:min(max(50px, calc(50px + 0.468 * (100vw - 1500px))),1200px);
    --min-height: 650px;
}
#help-hero {
    --background-image: url("/images/hero/hero-12.jpg");
    --hero-space:3;
    --header-factor:5;
    --textblock-align: flex-end;
    --aspect-ratio: 3 / 2;
    --column-pb:min(max(50px, calc(50px + 0.468 * (100vw - 1500px))),1200px);
    --min-height: 650px;
}
#contact-hero {
    --background-image: url("/images/hero/hero-13.jpg");
    --hero-space:1;
    --header-factor:3;
    --textblock-align: flex-end;
    --aspect-ratio: unset;
    --column-pb:30px;
    --min-height: 650px;
}
#doneer-hero {
    --background-image: url("/images/hero/hero-6.jpg");
    --hero-space:1;
    --header-factor:3;
    --background-position: 60%;
    --textblock-align: flex-end;
    --aspect-ratio:unset;
    --column-pb:30px;
    --section-height: 850px;
}
#jaarverslagen-hero {
    --background-image: url("/images/hero/hero-1.jpg");
    --hero-space:1;
    --header-factor:3;
    --background-position: 40%;
    --textblock-align: flex-end;
    --aspect-ratio: unset;
    --section-height: 650px;
    --column-pb:30px;
}
#beleid-hero {
    --background-image: url("/images/hero/hero-16.jpg");
    --hero-space:1;
    --header-factor:2;
    --background-position: 40%;
    --textblock-align: flex-end;
    --aspect-ratio: unset;
    --section-height: 650px;
    --column-pb:30px;
}
#cookie-hero {
    --background-image: url("/images/hero/hero-6.jpg");
    --hero-space:1;
    --header-factor:3;
    --background-position: 35%;
    --textblock-align: flex-end;
    --aspect-ratio: unset;
    --section-height: 650px;
    --column-pb:30px;
}
#privacy-hero {
    --background-image: url("/images/hero/hero-5.jpg");
    --hero-space:1;
    --header-factor:3;
    --background-position: unset;
    --textblock-align: flex-end;
    --aspect-ratio: unset;
    --section-height: 650px;
    --column-pb:30px;
}
#isaac-hero {
    --background-image: url("/images/hero/hero-isaac.jpg");
    --hero-space:1;
    --header-factor:5;
    --textblock-align: flex-end;
    --section-height: 750px;
}

#school-hero {
    --background-image: url("/images/hero/hero-4.jpg");
    --hero-space:1;
    --header-factor:5;
    --textblock-align: flex-end;
    --section-height: 750px;
}
#medisch-hero {
    --background-image: url("/images/hero/hero-11.jpg");
    --hero-space:1;
    --header-factor:3;
    --background-position: center;
    --textblock-align: flex-end;
    --aspect-ratio: unset;
    --section-height: 750px;
    --column-pb:30px;
}
#empowerment-hero {
    --hero-space: 1;
    --header-factor: 3;

    --textblock-align: flex-end;
    --aspect-ratio: unset;
    --section-height: 750px;
    --column-pb: 30px;
    position: relative;
    overflow: hidden;
}

#empowerment-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url("/images/hero/hero-5.jpg");
    background-size: cover;
    background-position: 60% 20%;
    filter: brightness(80%);
    transform: scaleX(-1);
    z-index: 0;
}

#empowerment-hero > * {
    position: relative;
    z-index: 1;
}

#ark-hero {
    --background-image: url("/images/hero/hero-8.jpg");
    --hero-space:1;
    --header-factor:5;
    --background-position: 50% 50%;
    --textblock-align: flex-end;
    --aspect-ratio: unset;
    --section-height: 750px;
    --column-pb:30px;
}
#mwanzo-hero {
    --background-image: url("/images/hero/hero-26.jpg");
    --hero-space:1;
    --header-factor:5;
    --background-position: 80% 50%;
    --textblock-align: flex-end;
    --aspect-ratio: unset;
    --section-height: 750px;
    --column-pb:30px;
}


#sp-page-builder .page-content .sppb-section.hero > * {
    --position: relative;
    z-index: 2;

}
#wie-hero::before, #help-hero::before, #beleid-hero::before { 
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.1); /* dit is je ‘filter’ */
    z-index: 1;
    pointer-events:none;
}


#doneer-hero .addon-root-button-group {
    margin-right:auto;
}

.hero .content-column-l, #sp-nieuws .content-column-l {
    display:block;
    width:50%;
    padding-bottom: var(--column-pb);
}

 @media (max-width: 1499.98px) {
     #nieuws-hero, #wat-hero, #sp-nieuws  {
        --hero-space:1;
    }
       #help-hero {
        --hero-space:1.5;
       } 
}

@media (max-width: 1121.98px) {
    #sp-page-builder .page-content .sppb-section.hero, #sp-nieuws {
        --background-position: 40% 50%;
        --aspect-ratio:unset;
        --align-items: flex-end;
    }
    #sp-page-builder .page-content .sppb-section.hero > *,
    #sp-nieuws > *  {
        padding-left: var(--space-sm);
    }
    #wat-hero {
        --hero-space:1;
    }
    #help-hero    {
        --hero-space:1.5;
    }
    #doneer-hero {
        --background-position: 65%!important;
    }

}
@media (max-width: 991.98px) {
    #sp-page-builder .page-content .sppb-section.hero,
    #sp-nieuws {
        --justify-content: flex-start;   /* horizontaal links */
        --align-content: flex-end;    /* verticaal midden (of flex-start als je boven wilt) */
    }

    #sp-page-builder .page-content .sppb-section.hero > *,
    #sp-nieuws > * {
        padding-left: var(--space-sm);  /* eventueel iets meer/minder voor mobiel */
        padding-right: var(--space-sm);
    }
}
@media (max-width:767px) {
    #doneer-hero .content-column-l, #isaac-hero .content-column-l, 
    #school-hero .content-column-l, #medisch-hero .content-column-l, 
    #empowerment-hero .content-column-l, #ark-hero .content-column-l, 
    #mwanzo-hero .content-column-l {
        width:70%;
    }
    #doneer-hero .sppb-btn, #isaac-hero .sppb-btn, 
    #medisch-hero .sppb-btn, #school-hero .sppb-btn, 
    #empowerment-hero .sppb-btn, #ark-hero .sppb-btn, 
    #mwanzo-hero .sppb-btn {
        margin-bottom:0;
    }
}
@media (max-width:449.98px) {
    #doneer-hero .content-column-l, #isaac-hero .content-column-l, 
    #school-hero .content-column-l, #medisch-hero .content-column-l, 
    #empowerment-hero .content-column-l, #ark-hero .content-column-l, 
    #mwanzo-hero .content-column-l {
        width:90%;
    }
}

/* =========================================================
   8. SECTION CONFIG PER CLASS OR ID
   ========================================================= */

#usp-section {
    --min-height: 30px;
    --section-height: 30px;
    --background-color: var(--color-dark);
}

.afgerond {
    --min-height: 350px;
}

#wat-we-doen {
    --section-margin-top: var(--space-xl);
}
#featured {
    --section-margin-top: var(--space-xl);

}
#nieuws {
    --section-margin-top: var(--space-xl);
}

#afgerond-1 .inner-columns {
    margin-top: var(--space-xl);
}
#werkbezoek {
    --background-color: var(--color-primary-light);
    --section-pt: 75px;
}
#wat-we-niet-doen {
    --section-margin-top: var(--space-xl);
}

#check {
    --section-pt: 75px;
    --background-color: var(--color-light);
}

#wie-we-zijn {
    --section-pt: 75px;
}
#intro-campaigns {
    --section-pt: 75px;
    --background-color: var(--color-primary-light);
}
#intro-algemeen {
    --background-color: var(--color-primary-light);

}
#intro-algemeen .divider-1140px{
    border-color: var(--color-primary);
}
#campaigns {
    --section-pt: 75px;
    --background-color: var(--color-light);
}
#donation-form {
    --background-color:var(--color-primary-light);
}

#ANBI {
    --background-color: var(--color-primary-light);
    --section-height:auto;
    --section-pt: var(--space-md);
    --display:flex;

}
/* Geef de eerste child (content-column-l) 70% breedte */
#ANBI .sppb-div-addon.inner-columns {
    flex-wrap:nowrap
}
#ANBI .sppb-div-addon.inner-columns > .sppb-addon-wrapper:nth-child(1) {
    width: calc(0.6 * (var(--max-width-content) - var(--space-sm)));
    max-width:100%;
    flex: 0 0 auto; /* Voorkomt groeien/krimpen */
}

/* Geef de tweede child (image-column-r) 30% breedte */
#ANBI .sppb-div-addon.inner-columns > .sppb-addon-wrapper:nth-child(2) {
    width: calc(0.4 * (var(--max-width-content) - var(--space-sm)));
    max-width:100%;
    flex: 0 0 auto; /* Voorkomt groeien/krimpen */
}

#ANBI .content-column-l {
    width: calc(0.7 * (var(--max-width-content) - var(--space-sm)));
}

#ANBI .image-column-r {
    width: calc(0.3 * (var(--max-width-content) - var(--space-sm)));
}
#ANBI /* Zorg dat de kolommen zelf 100% van de wrapper-breedte innemen */
.sppb-div-addon.inner-columns .sppb-div-addon {
    width: 100%;
}



/* =========================================================
    SECTION ENGINE
   ========================================================= */
#sp-page-builder .page-content .sppb-section, #sp-nieuws, #sp-footersection {
    aspect-ratio: var(--aspect-ratio);
    min-height: var(--min-height);
    height: var(--section-height, auto); 

    display: var(--display, flex);
    justify-content: var(--justify-content, flex-start);
    align-items: var(--textblock-align);
    position: var(--position);
    overflow: var(--overflow);
    background-color: var(--background-color)!important;
    background-image: var(--background-image,none)!important;
    background-size: var(--background-size)!important;
    background-repeat: var(--background-repeat)!important;
    background-position: var(--background-position)!important;

    max-height: var(--section-max-height);
    margin: var(--section-margin);
    margin-top: var(--section-margin-top);
    padding-top: var(--section-pt);
    padding-bottom: var(--section-pb);

    z-index: 0;

}

@media (max-width:1140px) {
  #ANBI .sppb-div-addon.inner-columns {
    flex-wrap: wrap;
  }
      #ANBI .sppb-div-addon.inner-columns > .sppb-addon-wrapper, 
      #ANBI .content-column-l,  #ANBI .image-column-r {
        width:100%;
        max-width:100%;
    }
}
@media (max-width:991.98px) {
    #empowerment .content-column-l .sppb-addon-content {
        column-count: 2;
    }

    #empowerment .inner-columns > .sppb-addon-wrapper {
        max-width:100%;
    }
        #empowerment .inner-columns > div:nth-child(1) {
        order:2;
    }
            #empowerment .inner-columns > div:nth-child(2) {
        order:1;
    }
}
@media (max-width:629.98px) {
    #empowerment .content-column-l .sppb-addon-content {
        column-count: 1;
    }
}

/* =========================================================
   USP COMPONENT 
   ========================================================= */
#usp-section .sppb-container-inner {
    width:100%
}

#usp-section #usp-bar {
    margin:0 auto;
}

   .usp-bar-wrapper {
    max-width:var(--max-width-content);
    margin:0 auto;
}
#usp-bar .usp-outer-div {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    max-width: 1140px;
    width: 100%;
    margin: 0 auto;
    padding: 0 var(--space-sm, 16px);
}
/* ── De drie wrapper-divs als flex-kinderen ── */
#usp-bar .usp-outer-div > .sppb-addon-wrapper {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
}
#usp-bar .usp-inner-div { 
    display: flex; 
    --textblock-align: center; 
    gap: var(--space-xs); 
} 
#usp-bar .usp-inner-div p { 
    margin: 0 !important; 
}



@media (max-width: 767.98px) {
       /* Outer container moet een vast frame zijn */ 
    #usp-bar .usp-outer-div { 
        position: relative; 
        height: 30px; 
        /* pas aan naar jouw hoogte */ 
        overflow: hidden; 
    } 
    /* Alle USP-wrappers bovenop elkaar leggen */ 
    #usp-bar .usp-outer-div > .sppb-addon-wrapper { 
        position: absolute !important; 
        top: 0; 
        left: 0; 
        width: 100% !important; 
        display: none !important; 
        justify-content: center !important; 
        align-items: center !important; 
        text-align: center !important; 
        /* BELANGRIJK: reset alle transforms van SP Pagebuilder */ 
        transform: translateX(0) !important; 
    } 
    /* Alleen de actieve wrapper tonen */ 
    #usp-bar .usp-outer-div > .sppb-addon-wrapper.active { 
        display: flex !important; 
    } 
    /* Animatieklassen */ 
    .slide-out-left { 
            animation: slideOutLeft 0.4s forwards ease; 
        } 
    .slide-in-right { 
            animation: slideInRight 0.4s forwards ease; 
        } 
        /* Van rechts naar binnen */ 
        @keyframes slideInRight { 
            from { 
                transform: translateX(100%); opacity: 0; } to { transform: translateX(0); opacity: 1; 
            } 
        } 
            /* Naar links naar buiten */ 
        @keyframes slideOutLeft { 
                from { transform: translateX(0); opacity: 1;} to { transform: translateX(-100%); opacity: 0; } 
            }
    /* Verticaal centreren van de USP in de zwarte balk */ 
    #usp-bar .usp-outer-div { 
            display: flex !important; 
            justify-content: center !important; 
            align-items: center !important;  /* DIT centreert verticaal */ 
            height: 30px; /* jouw bestaande hoogte */ 
        } 
    /* De USP-wrappers blijven absolute positioned */ 
    #usp-bar .usp-outer-div > .sppb-addon-wrapper { 
            top: 0; left: 0; height: 100% !important; /* vult nu de hele balk */ 
            display: none !important; justify-content: center !important; 
            align-items: center !important; /* extra zekerheid */ text-align: center !important; 
    } 
    #usp-bar .usp-outer-div > .sppb-addon-wrapper.active { 
            display: flex !important;
    }  
}

/* =========================================================
   13. Homepagina
   ========================================================= */
/*Help mee */
#sppb-addon-00b9ba7e-f35c-4d75-af16-a8531b3d2c53, 
#sppb-addon-c6803108-e8b8-4d93-b902-5077cd54aca7,
#sppb-addon-3be507d3-94c4-4353-984f-6e97e1809848 {
    height: 100%;
    display: flex;
    flex-direction: column;
}

#sppb-addon-00b9ba7e-f35c-4d75-af16-a8531b3d2c53 .sppb-media-content,
#sppb-addon-c6803108-e8b8-4d93-b902-5077cd54aca7 .sppb-media-content,
#sppb-addon-3be507d3-94c4-4353-984f-6e97e1809848 .sppb-media-content {
    display: flex;
    flex-direction: column;
    flex: 1;
}

#sppb-addon-00b9ba7e-f35c-4d75-af16-a8531b3d2c53 .sppb-btn, 
#sppb-addon-c6803108-e8b8-4d93-b902-5077cd54aca7 .sppb-btn,
#sppb-addon-3be507d3-94c4-4353-984f-6e97e1809848 .sppb-btn {
    margin-top: auto;
    align-self: flex-start; /* of center of flex-end, naar smaak */
}



#sppb-addon-00b9ba7e-f35c-4d75-af16-a8531b3d2c53 .sppb-addon-content,
#sppb-addon-c6803108-e8b8-4d93-b902-5077cd54aca7 .sppb-addon-content,
#sppb-addon-3be507d3-94c4-4353-984f-6e97e1809848 .sppb-addon-content {
    display: flex;
    flex-direction: column;
    flex: 1;
    height:100%
}
#home-help-mee  .sppb-addon-feature {
    height:100%;
}

#bestuur .inner-columns > .sppb-addon-wrapper {
    max-width: calc(33% - var(--space-sm));
    padding: var(--space-xs);
    border-radius: var(--border-radius);
    box-shadow: 10px 5px 10px var(--color-primary-light);
}
#bestuur img {
    margin-bottom: var(--space-sm);
}

@media (max-width:991.98px) {
    #bestuur .inner-columns > .sppb-addon-wrapper {
        max-width: var(--col-max-width);
    }
    #home-help-mee .inner-columns > .sppb-addon-wrapper {
        max-width:100%;
    }

}
@media (max-width:549.98px) {
    #bestuur .inner-columns > .sppb-addon-wrapper {
        max-width: 100%;
    }
}
/* =========================================================
   13. Wie we zijn
   ========================================================= */
   #bestuur .image-column-l .sppb-addon-single-image-container img {
    max-height:400px;   
}
.heading-bestuur {
    display: flex;
    justify-content: center;
    margin-bottom: var(--space-xl);
}
/* =========================================================
   14. Nieuws
   ========================================================= */
#nieuws .sppb-img-responsive, #sp-nieuws .sppb-img-responsive {
    max-width:360px;
    max-height:360px;
}
#nieuws .sppb-addon-article-layout, #sp-nieuws .sppb-addon-article-layout {
    margin-top: var(--space-sm);
}
#featured .embed-responsive-item {
    height:500px!important;
}

 #intro-algemeen .sppb-row-container {
    display:flex;
    flex-direction:column;
    justify-content:center;
 }

 .sppb-addon-article-layout-magazine-wrapper {
    box-shadow: 10px 5px 10px #9b8595;
    border-radius: var(--border-radius);
 }


/* =========================================================
   13. JD campaigns (basis)
   ========================================================= */

.jd-campaigns-grid {
    margin-bottom:0px;
}

#campaigns .jd-campaigns-grid > div:nth-child(1) {
    order:1;
}
#campaigns .jd-campaigns-grid > div:nth-child(2) {
    order:3;
}
#campaigns .jd-campaigns-grid > div:nth-child(3) {
    order:4;
}
#campaigns .jd-campaigns-grid > div:nth-child(4) {
    order:2;
}

.jd-campaigns-wrapper {
    padding: 0px;
}
   .jd-campaign-card {
    box-shadow: 10px 5px 10px var(--color-primary-light);
    border-radius: var(--border-radius);
}

.jd-campaign-description,
.jd-stat-label,.jd-meta-item,
.jd-meta-item i, .default-layout-campaign-title, #showMoreBtn, #amount_container .otheramountlabel {
    color:var(--color-primary);
}
.jd-progress-bar-fill, .default-layout-campaign-progress-fill {
    background:var(--color-primary);
}
.image-column-r,
.image-column-r .sppb-addon-wrapper,
.image-column-r .clearfix,
.image-column-r .sppb-addon,
.image-column-r .sppb-addon-content,
.image-column-r .jd-campaigns-wrapper,
.image-column-r .jd-campaigns-grid {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.image-column-r .jd-campaigns-grid {
    justify-content: flex-end;
}

#aboutCampaign strong {
    font-weight: 600;
}

/* buttons aangepaste tekst */
.jd-campaigns-grid .jd-campaign-card .jd-donate-button {
    font-size: 0;
    color: transparent;
    background: var(--color-primary);
}

/* NL. ===================================================================*/

/* Isaac — 1e kaart */
.sp-campaigns-nl .jd-campaigns-grid .jd-campaign-card:nth-child(1) .jd-donate-button::after {
    content: "Help Isaac van start →";
    font-size: 16px;
    color: white;
}

/* Schoolgeld — 2e kaart */
.sp-campaigns-nl .jd-campaigns-grid .jd-campaign-card:nth-child(4) .jd-donate-button::after {
    content: "Geef een kind een jaar naar school →";
    font-size: 16px;
    color: white;
}

/* Medisch — 3e kaart */
.sp-campaigns-nl .jd-campaigns-grid .jd-campaign-card:nth-child(2) .jd-donate-button::after {
    content: "Geef zorg aan een kind →";
    font-size: 16px;
    color: white;
}

/* Weerbaarheid — 4e kaart */
.sp-campaigns-nl .jd-campaigns-grid .jd-campaign-card:nth-child(3) .jd-donate-button::after {
    content: "Investeer in hun toekomst →";
    font-size: 16px;
    color: white;
}
/* The Ark */
.ark-campaigns-nl .jd-campaigns-grid .jd-campaign-card .jd-donate-button::after {
    content: "Steun The Ark in hun werk →";
    font-size: 16px;
    color: white;
}

/* Mwanzo */
.mw-campaigns-nl .jd-campaigns-grid .jd-campaign-card .jd-donate-button::after {
    content: "Help Mwanzo helpen →";
    font-size: 16px;
    color: white;
}



/* EN. ===================================================================*/
/* Isaac — 1e kaart */
.sp-campaigns-en .jd-campaigns-grid .jd-campaign-card:nth-child(1) .jd-donate-button::after {
    content: "Help Isaac taking off →";
    font-size: 16px;
    color: white;
}

/* Schoolgeld — 2e kaart */
.sp-campaigns-en .jd-campaigns-grid .jd-campaign-card:nth-child(4) .jd-donate-button::after {
    content: "Give a child a year in school →";
    font-size: 16px;
    color: white;
}

/* Medisch — 3e kaart */
.sp-campaigns-en .jd-campaigns-grid .jd-campaign-card:nth-child(2) .jd-donate-button::after {
    content: "Give care to a child →";
    font-size: 16px;
    color: white;
}

/* Weerbaarheid — 4e kaart */
.sp-campaigns-en .jd-campaigns-grid .jd-campaign-card:nth-child(3) .jd-donate-button::after {
    content: "Invest in their future →";
    font-size: 16px;
    color: white;
}
/* The Ark */
.ark-campaigns-en .jd-campaigns-grid .jd-campaign-card .jd-donate-button::after {
    content: "Support The Ark in their work →";
    font-size: 16px;
    color: white;
}

/* Mwanzo */
.mw-campaigns-en .jd-campaigns-grid .jd-campaign-card .jd-donate-button::after {
    content: "Help Mwanzo help →";
    font-size: 16px;
    color: white;
}


/* SW. ===================================================================*/
/* Isaac — 1e kaart */
.sp-campaigns-sw .jd-campaigns-grid .jd-campaign-card:nth-child(1) .jd-donate-button::after {
    content: "Msaidie Isaac aanze →";
    font-size: 16px;
    color: white;
}

/* Schoolgeld — 2e kaart */
.sp-campaigns-sw .jd-campaigns-grid .jd-campaign-card:nth-child(4) .jd-donate-button::after {
    content: "Mpe mtoto mwaka mmoja wa masomo →";
    font-size: 16px;
    color: white;
}

/* Medisch — 3e kaart */
.sp-campaigns-sw .jd-campaigns-grid .jd-campaign-card:nth-child(2) .jd-donate-button::after {
    content: "Toa huduma ya matibabu kwa mtoto →";
    font-size: 16px;
    color: white;
}

/* Weerbaarheid — 4e kaart */
.sp-campaigns-sw .jd-campaigns-grid .jd-campaign-card:nth-child(3) .jd-donate-button::after {
    content: "Wekezeni katika mustakabali wao →";
    font-size: 16px;
    color: white;
}
/* The Ark */
.ark-campaigns-sw .jd-campaigns-grid .jd-campaign-card .jd-donate-button::after {
    content: "Saidia The Ark katika kazi yake  →";
    font-size: 16px;
    color: white;
}

/* Mwanzo */
.mw-campaigns-sw .jd-campaigns-grid .jd-campaign-card .jd-donate-button::after {
    content: "Saidia Mwanzo kusaidia →";
    font-size: 16px;
    color: white;
}

/* JD donation form */
#field_Periodieke_gift {
    padding:10px;
}

.row #donation-form .donation-default-switch-amounts input:checked + label {
    background-color: var(--color-primary) !important;
}
.donation-default-switch-amounts label.selected {
    background: var(--color-primary-light);
}

/* generiek ===================================================================*/

#campaing .inner-columns {
    justify-content: space-between;
}

@media (max-width: 991.98px) {
    #campaigns .inner-columns .sppb-addon-wrapper {
        max-width:100%;
    }

}

/* =========================================================
   14. Feature-box
   ========================================================= */
#help-mee .inner-columns > .sppb-addon-wrapper {
    max-width: 90%;
    margin-bottom: var(--space-lg);
}
   .sppb-addon-feature {
    Padding: 10px;
    height: auto;
    border-radius: var(--border-radius);
    box-shadow: 10px 5px 10px var(--color-primary-light);
}
.sppb-feature-box-title {
    margin-bottom:10px;
    padding-bottom:3px;
    padding-top:10px;
    
}

.sppb-addon-feature .sppb-addon-text ul {
        list-style: none;
}

.sppb-addon-feature .sppb-icon {
    padding-bottom: 10px;
}
.sppb-addon-feature .sppb-btn-primary {
    margin: var(--space-sm) auto;
    /*width: calc(100% - var(--space-sm));*/
}
#help-mee .content-row {
    margin: var(--space-xl, 0) ;
}

#help-mee .inner-columns {
    justify-content: center;
}


/* =========================================================
   14. FORMS (basis)
   ========================================================= */
.rpx_field_10 {
    display:flex;
    gap:20px;
    align-items:center;
}
   .rpx_field_10 .rpx_label { 
    order: 2; 
} 
    .rpx_field_10 .rpx_field_input { 
        order: 1; 
    }


/* Zet de hele regel in flex en centreer verticaal */
.rpx_field_10.form-group {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Zorg dat de labels zelf geen baseline-gedrag forceren */
.rpx_field_10 .rpx_label label,
.rpx_field_10 .rpx_field_input label {
    display: flex;
    align-items: center;
}
.rpx_field_captcha {
    overflow-x:unset;
    overflow-y:unset;
}

/* Form field order */
.rpx_form {
    display:flex;
    flex-direction:column;
}
.rpx_field_1 {
    order:1;
}
.rpx_field_2, .rpx_field_7, .rpx_field_14 {
    order: 2;
}
.rpx_field_3, .rpx_field_8, .rpx_field_15 {
    order: 3;
}
.rpx_field_4, .rpx_field_9, .rpx_field_16 {
    order: 4;
}
.rpx_field_5, .rpx_field_11, .rpx_field_17 {
    order: 6;
    display: flex;
    flex-direction: row;
}
.rpx_field_6, .rpx_field_12, .rpx_field_18 {
    order: 5;
}
.rpx_field_copy{
    order:7;
}
.rpx_field_copy {
    order:8;
}
.rpx_field_captcha {
    order:10;
}
.rpx_field_button {
    order:9;
}
.rpx-field-input {
    order: 1;
}
.rpx_label {
    order:2;
}
.rpx_form_container input.rapid_contact_ex {
    margin-bottom: 7px;
}
/* =========================================================
   13. ANBI
   ========================================================= */
#anbi .inner-columns {
    margin-top:var(--space-md);
}

#anbi .content-column-r{

    align-items: flex-start;
    justify-content:flex-start;
    gap: 12px;
}
/* =========================================================
   14. FOOTER
   ========================================================= */

.footer-info, #sp-footersection {
    --display: block;
    --position:relative;
    --section-pt:75px;
    --section-pb:75px;
    --background-color:var(--color-primary);
    color:var(--color-light);
}

.footer-info-row-1 .inner-columns > .sppb-addon-wrapper{
    flex:0 0 auto;
    max-width:var(--col-half-max-width) ;
    width:100% ;
}
.footer-info-row-1 .inner-columns > div:nth-child(1) {
    order:3;
    }
.footer-info-row-1 .inner-columns > div:nth-child(2) {
    order:2;
    }
.footer-info-row-1 .inner-columns > div:nth-child(3) { 
    order:1;
    }
.footer-info-row-1 .inner-columns > div:nth-child(4) { 
    order:4;
    }

.footer-info-row-2 .image-column-l {
    display: flex;
    justify-content: center;
    padding-right: 20px;
}
.footer-info-row-2 .content-column-r  {
    flex-direction:row;
    }
.footer-info-row-2 .content-column-r > .sppb-addon-wrapper {
    max-width: var(--col-max-width);
    width:100%;
}
.footer-info-row-2 .content-column-r img {
    height:70px;
}

@media (max-width:766.98px) {
    .footer-info-row-1 .inner-columns > .sppb-addon-wrapper {
        max-width:  var(--col-max-width);
        width:  var(--col-max-width);
    }
    .footer-info-row-2 .inner-columns > div:nth-child(1) {
    flex:0 0 auto;
    max-width:100% ;
    width:100% ;
    }
        .footer-info-row-2 .inner-columns > div:nth-child(2) {
    flex:0 0 auto;
    max-width:100% ;
    width:100% ;
    }
    .footer-info-row-2 .content-column-r > .sppb-addon-wrapper {
        max-width: 50%;
        width:100%;
    }
}


.footer-info-row-1 .column-half {
    display:flex;
    flex-direction:column;
    height:100%;
}

.footer-info-row-1 .column-half .addon-root-image {
    margin-top:auto;
    }

.footer-info a {
    color: var(--color-light);
    text-decoration: none;
}

.footer-info a:hover {
    color: var(--color-light);
}

 .footer-info .sppb-addon-title  {
    font-weight:600;
    color:var(--color-light);
    margin-bottom:0px;
}

.footer-info ul.mod-menu, .footer-info ul.footer-contact-info   {
    list-style: none;
    padding:0;
}
.footer-info ul.footer-contact-info {
    color: var(--color-light)
}

.rpx_field_7 {
    margin-top:70px;

}
.rpx_msg_sent {
        color:var(color-light);
}
.footer-info-row-1 .btn { /* Nieuwsbrief aanmelden*/
    --bs-btn-color: var(--color-dark)!important;
    background-color: var(--color-primary-light)!important;
    border-color: var(--color-light)!important;
    border-width: 3px;
    --bs-btn-hover-color: #fff!important;
    margin-top:var(--space-xs);
}
 

body #sp-footer {
    background: var(--color-primary);
}