/*
Theme Name: Wux Theme
Author: Wux
Author URI: https://wux.nl/
Description: Wux is het custom wordpress thema van Wux - Internetbureau
Version: 1.5
Requires PHP: 8.0.0
Text Domain: wux
*/

@import url("https://use.typekit.net/upp5lyt.css");

:root {
    --fs: 1.4rem;
    --lh: 1.6;

    /* Color variables */
    --clr-gold: #A19B70;
    --clr-gold-120: #A29B71;
    --clr-gold-rgb: 161, 155, 112;
    --clr-red: #793120;
    --clr-red-rgb: 121, 49, 32;

    --clr-heading: #A48377;
    --clr-text: #000000;

    --clr-purple: #704C4C;
    --clr-dark: #000000;
    --clr-darkgreen: #212719;
    --clr-darkgreen-80: #454A3D;

    --clr-darkgrey: #5A6056;

    --clr-darkgrey-120: #3E4436;

    --clr-grey: #ACAA99;
    --clr-light: #EBEADB;
    --clr-light-80: #F3E9DD;
    --clr-light-90: #B4B2A5;
    --clr-light-110: #DFDDD7;
    --clr-light-130: #9EA793;

    --clr-border: rgb(222, 226, 230); 
    
    /* Font variables */
    --font-heading: "pf-marlet-display", sans-serif;
    --font-text: "source-sans-pro", sans-serif;

    /* Container max-width variables */
    --container-width: 100%;
    --container-width--sm: 1500px;
    --container-width--md: 1500px;
    --container-width--lg: 1500px;
    --container-width--xl: 1500px;
    --container-width--xxl: 1540px;
    --container-width--xxxl: 1680px;

}

@media (min-width: 768px) {
    :root {
        --fs: 1.8rem;
    }
}

body, .wpb-navigation .menu-item a, .btn  { font-family: var(--font-text); }

/*** ---------- Typography ---------- ***/
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { font-family: var(--font-heading); color: var(--clr-heading); font-weight: 300; }
h1, .h1 { --fs: clamp(3.2rem, 4vw, 6.3rem); --lh: 1.3; font-weight: 500; }
h2, .h2 { --fs: clamp(2.8rem, 4vw, 5.5rem); --lh: 1.2; }
h3, .h3 { --fs: clamp(2.4rem, 3vw, 4.5rem); --lh: 1; }
h4, .h4 { --fs: 1.8rem; --lh: 2.4rem; }
p, .p   { --fs: 1.8rem; font-family: var(--font-text); }

:is(h1, h2, h3) em{ font-weight: 300; font-style: normal;}

.wpb-text .btn-group{ --mt: 3.2rem !important; }

/*** ---------- Whitespace ---------- ***/
[class*="wpb-wst"] { --pt: 0; padding-top: var(--pt); }
[class*="wpb-wsb"] { --pb: 0; padding-bottom: var(--pb); }

.wpb-wst--none { --pt: 0; }
.wpb-wst--small { --pt: 1.4rem; }
.wpb-wst--medium { --pt: 2.8rem; }
.wpb-wst--large { --pt: 4.8rem; }

.wpb-wsb--none { --pb: 0; }
.wpb-wsb--small { --pb: 1.4rem; }
.wpb-wsb--medium { --pb: 2.8rem; }
.wpb-wsb--large { --pb: 4.8rem; }

@media (min-width: 992px) {
    .wpb-wst--small { --pt: 4.8rem; }
    .wpb-wst--medium { --pt: 7.4rem; }
    .wpb-wst--large { --pt: 11rem; }
    
    .wpb-wsb--small { --pb: 4.8rem; }
    .wpb-wsb--medium { --pb: 7.4rem; }
    .wpb-wsb--large { --pb: 11rem; }
}



/*** ---------- Icons ---------- ***/
.wpb-icon-wrapper { --size: 5rem; width: var(--size); height: var(--size); min-width: var(--size); min-height: var(--size); border-radius: 50%; display: inline-grid; place-items: center; }
.wpb-icon-wrapper--primary { background-color: var(--clr-gold); }
.wpb-icon-wrapper--primary .wpb-icon { --clr: #fff; }
.wpb-icon-wrapper--secondary { background-color: var(--clr-secondary); }  
.wpb-icon-wrapper--secondary .wpb-icon { --clr: #fff; }

.wpb-icon-wrapper--small { --size: 2.5rem; }
.wpb-icon-wrapper--small .wpb-icon { --w: 1.6rem; --h: 1.6rem; }

.wpb-icon-wrapper--medium {--size: 3rem; }
.wpb-icon-wrapper--medium .wpb-icon { --w: 1.8rem; --h: 1.8rem; }

.wpb-icon-wrapper--large { --size: 10rem; }
.wpb-icon-wrapper--large .wpb-icon { --w: 7.5rem; --h: 7.5rem; }

.wpb-icon-wrapper--20 { --size: 2rem; }
.wpb-icon-wrapper--20 .wpb-icon { --w: 1.2rem; --h: 1.2rem; }

.wpb-icon-wrapper.wpb-icon-wrapper--increment { --size: 3rem; background-color: var(--bg-clr); color: #fff; font-size: 1.8rem; font-style: italic; padding-right: .3rem; }

@media (min-width: 992px) {
    .wpb-icon-wrapper.wpb-icon-wrapper--increment { --size: 4.2rem; font-size: 2.2rem; }
}


/*** ---------- Background colors ---------- ***/
.wpb-bg-clr--dark       { background-color: var(--clr-dark); }
.wpb-bg-clr--darkgreen  { background-color: var(--clr-darkgreen); --label-clr: var(--clr-darkgrey-120) !important; }
.wpb-bg-clr--light      { background-color: var(--clr-light); }
.wpb-bg-clr--grey       { background-color: var(--clr-grey); --label-clr: var(--clr-light-90) !important; }
.wpb-bg-clr--darkgrey   { background-color: var(--clr-darkgrey); --label-clr: rgba(255,255,255,0.12) !important; }
.wpb-bg-clr--darkgrey-120 { background-color: var(--clr-darkgrey-120); --label-clr: var(--clr-darkgreen-80) !important;}
.wpb-bg-clr--gold       { background-color: var(--clr-gold); }
.wpb-bg-clr--red        { background-color: var(--clr-red); }
.wpb-bg-clr--light-130  { background-color: var(--clr-light-130); --label-clr: #A8B19E !important; }
.wpb-bg-clr--gold-120  { background-color: var(--clr-gold-120); }
.wpb-bg-clr--light-80   { background-color: var(--clr-light-80); }

.wpb-bg-clr--dark .wpb-text *:not(.btn, .btn *,h1, h1 * h2, h2 *, h3, h3 *, .wpb-card, .wpb-card *), 
:is(.wpb-bg-clr--gold, .wpb-bg-clr--red, .wpb-bg-clr--grey, .wpb-bg-clr--darkgrey, .wpb-bg-clr--darkgreen) .wpb-text *:not(.btn, .btn *, .wpb-card, .wpb-card *){ color: #fff; }
:is(.wpb-bg-clr--primary, .wpb-bg-clr--dark) .btn.btn--primary, .button { --clr: #fff; }
.wpb-bg-clr--dark :is(h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 ){ color: var(--clr-gold); }

.wpb-bg-clr--light .btn .wpb-icon.wpb-icon--arrow-right-2{ --clr: var(--clr-heading); }
.wpb-bg-clr--red .btn{ --clr: var(--clr-gold) !important; }
:is(.wpb-bg-clr--gold, .wpb-bg-clr--grey, .wpb-bg-clr--darkgrey, .wpb-bg-clr--red) .btn{ --clr: #fff !important; }
:is(.wpb-bg-clr--gold, .wpb-bg-clr--grey, .wpb-bg-clr--darkgrey, .wpb-bg-clr--red) .btn .wpb-icon.wpb-icon--arrow-right-2{ --clr: #fff; }

:is(.wpb-bg-clr--darkgreen) :is(h1,  h3, h4, h5), :is(.wpb-bg-clr--darkgreen) :is(h1, h3, h4, h5) * { color: var(--clr-heading) !important; }
:is(.wpb-bg-clr--darkgrey-120) :is(h1, h2, h3, h4, h5), :is(.wpb-bg-clr--darkgreen-120) :is(h1, h2, h3, h4, h5) * { color: var(--clr-gold) !important; }
:is(.wpb-bg-clr--darkgrey-120) :not(h1, h2, h3, h4, h5, .btn, span, .wpb-label-massive) * { color: #FFF; --clr: #FFF !important; }
:is(.wpb-bg-clr--light-130) *:not(.btn, .wpb-icon, h1) {color: #FFF; }
:is(.wpb-bg-clr--light-130) h1, :is(.wpb-bg-clr--light-130) h1 * { color: #FFF !important; }
:is(.wpb-bg-clr--gold-120) *:not(.btn, .wpb-icon, h1) { color: #FFF; }
:is(.wpb-bg-clr--light-80) *:not(.btn, .wpb-icon, h1) { color: var(--clr-dark); }

@media (min-width: 576px) {
    :is(.wpb-block, .wpb-archive){ --w: 60rem; --h: 60rem; }
}
@media (min-width: 992px) {
    :is(.wpb-block, .wpb-archive){ --w: 110rem; --h: 110rem; }
}
@media (min-width: 1200px) {
    :is(.wpb-block, .wpb-archive){ --w: 140rem; --h: 140rem; }
}


/*** ---------- Buttons ---------- ***/
.btn, .gform_button, .gform_next_button, .gform_previous_button, .button { font-family: var(--font-text); --fs: clamp(1.4rem, 2vw, 1.7rem); --lh: 1; --p: 0; --br: 0; }
.gform_button{ --fs: clamp(1.7rem, 3vw, 2rem); }

.btn.btn--primary, .button { text-transform: uppercase; --fs: 1.8rem; --hover-bg-clr: var(--clr-darkgreen); --clr: #FFF; background-color: var(--clr-darkgrey-120); --border: 1px solid transparent; --p: .6rem 1.2rem; font-weight: 600;}
.btn.btn--secondary { font-weight: 600; text-transform: uppercase; --fs: 1.8rem; --hover-bg-clr: var(--clr-light-130); --clr: #FFF; background-color: var(--clr-light-130); --border: 1px solid transparent; --p: .6rem 1.2rem; }
.btn.btn--darkgrey-200 { text-transform: uppercase; --fs: 1.8rem; --hover-bg-clr: var(--clr-darkgrey); --clr: #FFF; background-color: var(--clr-darkgrey); --border: 1px solid transparent; --p: .6rem 1.2rem; font-weight: 600; }
.btn.btn--purple { align-items: center; justify-content: center; text-transform: uppercase; --fs: 1.8rem; --hover-bg-clr: var(--clr-purple); --clr: #FFF; background-color: var(--clr-purple); --border: 1px solid transparent; --p: .6rem 1.2rem; font-weight: 600;}
.btn.btn--heading { text-transform: uppercase; --fs: 1.8rem; --hover-bg-clr: var(--clr-heading); --clr: #FFF; background-color: var(--clr-heading); --border: 1px solid transparent; --p: .6rem 1.2rem; font-weight: 600;}

.btn.js-nav-toggle{ min-height: 4.4rem; display: flex; justify-content: center; align-items: center; }
.btn:has(.wpb-icon--xmark){ --hover-bg-clr: #fff8; border: none !important; background-color: #fff; }
.btn:has(.wpb-icon--xmark) .wpb-icon{ --clr: var(--clr-dark); }

.btn.btn--scroll-to-top { position: fixed; bottom: 1.4rem; right: 1.4rem; border-radius: 50%;padding: 1.2rem; background-color: #FFF; --clr: var(--clr-dark); --hover-bg-clr: var(--clr-dark); --hover-clr: #FFF; --border: 1px solid var(--clr-dark); z-index: 1000; box-shadow: 0 2px 10px rgba(0,0,0,0.1); transition: background-color var(--ts-25) ease-in-out; }

@media(min-width: 768px) {
    .btn.btn--scroll-to-top { bottom: 2.4rem; right: 2.4rem; } 
}

/*** ---------- Navigation ---------- ***/
.wpb-navigation { z-index: 1020; background: var(--clr-dark); }
.wpb-navigation .wpb-logo img{ width: 8rem; }
.wpb-navigation__main { display: flex; width: 100%; justify-content: space-between; align-items: center;  }
.wpb-navigation__main .btn--nav-toggle{ margin-left: auto; z-index: 5; }

@media (min-width: 992px){
    .wpb-navigation .wpb-logo img { width: 13rem; }

    .wpb-navigation__main { display: grid; width: 100%; grid-template-columns: repeat(3, minmax(0,1fr)); }
    .wpb-navigation__main .btn-group .btn { height: 3.5rem; align-items: center; }
}

/*** ---------- Header ---------- ***/
.wpb-header--home .container { display: grid; gap: var(--gap); --gap: 2.4rem;  grid-template-columns: 1fr;}

.wpb-cta { background-color: var(--clr-purple); padding-top: 3.4rem; padding-bottom: 3.4rem; }
.wpb-cta .btn { --mt: 0 !important; }
.wpb-cta .wpb-text { gap: 1.2rem; }
.wpb-cta .wpb-text span { color: var(--clr-light-80); font-weight: 600; font-size: clamp(2rem, 4vw, 2.6rem);}

.wpb-header--404 { padding-top: 10.8rem; }


@media (min-width: 992px){
    .wpb-header--home .container { grid-template-columns: 1fr 1fr; align-items: center; }

    .wpb-cta .wpb-text { gap: 11.2rem; }

    .wpb-header--subpage { --gc: 2; gap: 0;}
    .wpb-header--subpage .container{ min-height: 100vh; margin-left: 4rem;}
    .wpb-header--subpage .container .wpb-label{ bottom: -4rem; }
    .wpb-header--subpage .container .wpb-logo { grid-column: 2;}
    .wpb-header--subpage .container .wpb-text { grid-column: 2;}

    .wpb-header--404 { padding-top: 14rem; }

}

@media(min-width: 1200px) {
    .wpb-header--home .container { grid-template-columns: minmax(0, 55rem) 1fr; --gap: 6.4rem; }
}

@media(min-width: 1400px) {
    .wpb-header--home .container { --gap: 8rem; }
}

@media(min-width: 1600px) {
    .wpb-header--home .container { --gap: 14.3rem; }

    .wpb-header--subpage .container { margin-left: calc(10% + 4rem); max-width: 67.5rem; }

}

/*** ---------- Footer ---------- ***/
.by-wux { display: flex; align-items: center; gap: .4rem; text-decoration: none; }
.by-wux span { font-size: 1.1rem; }
.by-wux i { --clr: rgb(255,255,255,.5); --w: 4.7rem; --h: 1.5rem; }


/* Maps block */
.wpb-block--maps .wpb-text{ max-width: 100.5rem; }
.wpb-block--maps .container.align-center{ display: flex; flex-direction: column; justify-content: center; gap: 4.2rem; }
.wpb-map{ width: 100%; height: 59.4rem; }
.wpb-map > *{ height: 100%; object-fit: cover; }

/* Images block */
.wpb-block--images .wpb-label{ --mh: 5rem; position: absolute; top: 0; left: 0; right: 0; margin: auto; z-index: 2; font-style: normal; font-weight: 600; }
.wpb-block--images .wpb-images { --gc: 1; display: grid; grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr)); }
.wpb-block--images .wpb-images .wpb-image { position: relative; }  
/* .wpb-block--images .wpb-images .wpb-image::before { content: ''; display: block; width: 100%; padding-top: 30%; } */
.wpb-block--images .wpb-images:has(.wpb-image + .wpb-image) .wpb-image::before { content: ''; display: block; width: 100%; padding-top: 75%; }
.wpb-block--images .wpb-images:has(.wpb-image + .wpb-image) .wpb-image img { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }

@media (min-width: 992px) {
    .wpb-block--images .wpb-images{ --gc: 3; }
}

/* Global styles */
.wpb-text p:has(em){ margin-top: 0 !important; }
.wpb-text p:has(+ :is(h1,h2,h3)) em{ --fs: 1.5rem; font-size: var(--fs); color: var(--clr-gold); font-family: var(--font-secondary-text); font-style: normal; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; }
.wpb-text p:has(em) + :is(h1, h2, h3, h4){ --mt: 1rem !important; }
.wpb-text :is(ul, ol){ position: relative; padding-left: 2.5rem !important; margin-top: 0 !important; }
.wpb-text :is(ul, ol) li{ --fs: 1.6rem; font-size: var(--fs); list-style-type: none; }
.wpb-text :is(ul, ol) li::before{ 
    --size: 1rem; --br: 50%; content: ''; position: absolute; left: 0; background-color: var(--clr-secondary); 
    width: var(--size); height: var(--size); border-radius: var(--br); margin-top: .75rem; 
}

.wpb-text.wpb-text--featured{ text-align: center; }
.wpb-text.wpb-text--featured::before{ content: ''; display: block; background-image: var(--MW-src); background-size: contain; background-repeat: no-repeat; width: 7.5rem; height: 4rem; margin: auto; margin-bottom: 4rem; filter: brightness(.7); }

.wpb-text .wpb-text__toolbar{ --gap: .8rem; display: flex; align-items: center; gap: var(--gap); }
.wpb-text .wpb-text__toolbar span{ display: flex; align-items: center; }
.wpb-text .wpb-text__toolbar span + span::before{ content: ''; display: block; margin-right: var(--gap); width: 8px; border-bottom: 2px solid #fff; }

.wpb-bg-clr--transparent .wpb-text.wpb-text--featured :is(h2, h3){ color: var(--clr-gold); }

/* --- Filters ---  */
.wpb-header__filters{ display: flex; align-items: center; gap: 1.6rem; font-family: var(--font-heading);}
.wpb-header__filters .form-check { padding: 0; }  
.wpb-header__filters .form-check label{ --bg: var(--clr-tertiary); position: relative; display: flex; justify-content: center; min-width: 17.7rem; padding: 1rem 2rem; background-color: var(--bg); }
.wpb-header__filters .form-check:hover{ cursor: pointer; }
.wpb-header__filters .form-check input{ display: none; }
.wpb-header__filters .form-check input:checked + label{ color: #fff; z-index: 2; }
.wpb-header__filters .form-check input:checked + label::before{ content: ''; position: absolute; inset: 0; --bg: var(--clr-gold); background-color: var(--bg); z-index: -1; }
.wpb-header__filters .form-check label{ --fs: clamp(1.9rem, 3vw, 2.3rem); font-size: var(--fs); font-weight: 700; }
.wpb-header__filters .form-check label:hover{ cursor: pointer; }
.wpb-header__filters .filter--pre-text{ --fs: clamp(1.9rem, 3vw, 2.3rem); font-size: var(--fs); color: var(--clr-gold); font-weight: lighter; }


/* Form styles */
.gform_wrapper.gravity-theme .gfield_label{ --fs: clamp(1.6rem, 1.5vw, 2rem); font-size: var(--fs) !important; font-family: var(--font-heading); }
.gform_wrapper .gfield :is(input:not([type=checkbox], [type=radio]), textarea, select){ --border: 1px solid var(--clr-dark); --focus-border: 1px solid #0004; --br: 0; font-size: 1.8rem; }


.gform_wrapper.gravity-theme{ --col-1: 20rem; }
.gform_wrapper.gravity-theme .gfield{ display: grid; gap: 1.2rem; }

.gform_wrapper.gravity-theme .gfield.gfield--type-radio{ margin-top: 4rem; }
.gform_wrapper.gravity-theme .gform-footer{ margin-top: 4rem; }
.gform_wrapper .gfield .gchoice + .gchoice { margin-top: .6rem; }
.gform_wrapper .gfield .gchoice input{ --size: 3.2rem; width: var(--size); height: var(--size); min-width: var(--size); min-height: var(--size); border-radius: 0px; border: 1px solid var(--clr-dark); background-size: 0px; transition: background var(--ts-25) ease, border var(--ts-25) ease, background-size var(--ts-15) ease, transform var(--ts-25) ease; }
.gform_wrapper .gfield .gchoice input[type="radio"]{  --size: 3.4rem; border-radius: 50%; padding-right: .5rem; line-height: 1; }
.gform_wrapper .gfield .gchoice:has(input[type="radio"]) label{ padding-top: .2rem; }
.gform_wrapper .gfield .gchoice label{ font-size: clamp(1.4rem, 2vw, 1.8rem); font-weight: 300; padding-left: 1.2rem; }
.gform_wrapper .gfield .gchoice input:checked{ background-color: var(--clr-gold); border: 1px solid var(--clr-gold); background-size: 24px; }

.gform_wrapper .gfield_radio{ display: flex; align-items: center; gap: 2.4rem; flex-wrap: wrap; }

@media (min-width: 576px) {
    /* .gform_wrapper.gravity-theme .gfield{ grid-template-columns: var(--col-1) 1fr; } */

    .gform_wrapper.gravity-theme fieldset.gfield .gfield_label{ width: var(--col-1); float: left; }
    /* .gform_wrapper.gravity-theme fieldset.gfield .ginput_container{ float: left; } */
}

@media (min-width: 992px) {
    .gform_wrapper.gravity-theme{ --col-1: 30rem; }

}


:is(.wpb-archive, .wpb-related--posts) .wpb-card .wpb-card__header img{ transition: transform var(--ts-25) ease-in-out; object-fit: cover; }
:is(.wpb-archive, .wpb-related--posts) .wpb-card .wpb-card__header{ height: 32.2rem; }
:is(.wpb-archive, .wpb-related--posts) .wpb-card .wpb-card__footer{ padding-top: 3.2rem; }


.wpb-label{ --bg-clr: var(--clr-gold); --p: 0 2.4rem; --mh: 4.8rem; background-color: var(--bg-clr); color: #fff; min-height: var(--mh); padding: var(--p); width: fit-content; display: flex; align-items: center; font-style: italic; line-height: 1.2; font-size: 1.7rem; }

@media (min-width: 992px) {
    .wpb-label{ --bg-clr: var(--clr-gold); --p: 0 3.2rem; --mh: 8rem; }
}


.wpb-quote{ --p: 1.2rem; max-width: 48rem; padding: var(--p); padding-top: 3.2rem; background-color: rgb(var(--clr-gold-rgb), .7); margin: auto; position: relative; }
.wpb-quote .wpb-text{ text-align: center; color: #fff; }
.wpb-quote .wpb-text h2{ --fs: clamp(2.4rem, 3vw, 4.5rem); }
.wpb-quote::before{ content: ''; background-image: var(--MW-src); background-size: contain; background-repeat: no-repeat; background-position: center; width: 8rem; height: 3.6rem; position: absolute; top: -1.8rem; left: 0; right: 0; margin: auto; }

@media (min-width: 768px) {
    .wpb-quote{ --p: 2.4rem; max-width: 64rem; }
}
@media (min-width: 992px) {
    .wpb-quote::before{ content: ''; width: 11rem; height: 5.7rem; top: -2.85rem; }
    .wpb-quote{ --p: 4.8rem; padding-top: var(--p); }
}


/* Location: Pop-up */
.wpb-popup{ 
    --offset: 5rem; --p: 2.4rem; position: absolute; bottom: var(--offset); right: var(--offset); height: 47.5rem; width: 36rem; padding: var(--p); z-index: 10; opacity: 0; pointer-events: none; 
    transform: translateX(20rem); overflow: auto; transition: opacity var(--ts-25) ease, color var(--ts-25) ease, transform var(--ts-25) cubic-bezier(0.25, 0.1, 0.25, 1), filter var(--ts-25) ease; 
}
.wpb-popup *{ color: #fff; }
.wpb-popup .wpb-popup__header{ padding-bottom: 2.4rem; }
.wpb-popup .wpb-popup__close{ position: absolute; top: 2.4rem; right: 2.4rem; cursor: pointer; }
.wpb-popup .wpb-popup__close .wpb-icon{ --clr: #fff; --w: 2.4rem; --h: 2.4rem; }
.wpb-popup .wpb-popup__close:hover .wpb-icon{ --clr: #fff5; }
.wpb-popup .wpb-popup__body h3{ font-size: clamp(2.8rem, 3vw, 3.2rem); font-weight: 500; }

.wpb-popup.active{ opacity: 1; pointer-events: all; transform: translateX(0); }
.wpb-popup.active.changing{ filter: blur(3px); }

@media (max-width: 992px) {
    .wpb-popup { position: fixed; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 1200; }
}

@media (min-width: 576px) {
    .wpb-popup{ --p: 4rem; }
}
@media (min-width: 992px) {
    .wpb-popup{ width: 56rem; max-height: 85%; }
}

/*** ---------- Inner colors ---------- ***/
.wpb-inner-clr--dark       { background-color: var(--clr-dark); }
.wpb-inner-clr--darkgreen  { background-color: var(--clr-darkgreen); }
.wpb-inner-clr--light      { background-color: var(--clr-light); }
.wpb-inner-clr--grey       { background-color: var(--clr-grey); }
.wpb-inner-clr--darkgrey   { background-color: var(--clr-darkgrey); }
.wpb-inner-clr--darkgrey-120 { background-color: var(--clr-darkgrey-120); --label-clr: var(--clr-darkgreen-80) !important; }
.wpb-inner-clr--gold       { background-color: var(--clr-gold); }
.wpb-inner-clr--red        { background-color: var(--clr-red); }
.wpb-inner-clr--light-130  { background-color: var(--clr-light-130); }
.wpb-inner-clr--gold-120   { background-color: var(--clr-gold-120); }
.wpb-inner-clr--light-80   { background-color: var(--clr-light-80); }
.wpb-inner-clr--light-110   { background-color: var(--clr-light-110); }

.wpb-inner-clr--dark *:not(.btn), .wpb-inner-clr--darkgreen *:not(.btn), .wpb-inner-clr--darkgrey *:not(.btn), .wpb-inner-clr--darkgrey-120 *:not(.btn), .wpb-inner-clr--gold *:not(.btn), .wpb-inner-clr--red *:not(.btn), .wpb-inner-clr--gold-120 *:not(.btn), .wpb-inner-clr--light-130 *:not(.btn) { color: #FFF !important; }
.wpb-inner-clr--light-110 *:not(.btn), .wpb-inner-clr--light *:not(.btn), .wpb-inner-clr--grey *:not(.btn), .wpb-inner-clr--light-80 *:not(.btn) { color: var(--clr-dark) !important; }

/*** ---------- Schuytgraaf popup ---------- ***/
.wpb-schuytgraaf { cursor: pointer; position: fixed; top: 50%; right: 0; width: 3.2rem; height: 8.5rem; z-index: 1023; transition: 200ms ease-in-out;}
.wpb-schuytgraaf:hover { opacity: 0.9; }

@media(min-width: 992px) {
    .wpb-schuytgraaf { cursor: pointer; position: fixed; top: 50%; right: 0; width: 5.6rem; height: 23.7rem; z-index: 1023; }
}