/*

 Theme Name:   GeneratePress Child

 Theme URI:    https://generatepress.com

 Description:  Default GeneratePress child theme

 Author:       Tom Usborne

 Author URI:   https://tomusborne.com

 Template:     generatepress

 Version:      0.1

*/


/* Globals */

:root {
    --sitewidth: 1320px;
    --narrow-content: 78ch;
    --border-radius: .25rem;
    --max-text-width: 85ch;
}


@media (prefers-reduced-motion: no-preference) {
    html {
        scroll-behavior: smooth;
    }
}

body {
    overflow-x: hidden;
}

p,
li,
figcaption {
    text-wrap: pretty;
    /*max-width: 85ch;*/
}

a {
    text-underline-offset: .25em;
}

a:is(:hover,:focus-visible) {
    text-decoration: none;
}

h1, h2, h3, h4, h5, h6 {
    word-wrap: anywhere;
    text-wrap: balance;
}

:is(h1,h2,h3,h4,h5,h6) a {
    text-decoration: none;
}

:is(h1,h2,h3,h4,h5,h6) a:hover {
    text-decoration: underline;
}

ul, ol {
	margin-left: 1.5em;
}

input[type="checkbox"],
input[type="radio"] {
	accent-color: var(--accent);
}

a:not([href]) {
    cursor: pointer;
}

blockquote {
    padding: 1rem 0;
    border: none;
    margin: 0;
    quotes: "“" "”";
}

blockquote p::before,
blockquote p::after {
    position: relative;
    top: 0.5em;
    font-family: 'Libre Baskerville';
    font-size: 3em;
    font-weight: 400;
    line-height: 0;
}

blockquote p::before {
    content: open-quote;
    margin-right: 1.5rem;
}

blockquote p::after {
    content: close-quote;
    margin-left: .5rem;
}

.sitewidth-container {
	max-width: var(--sitewidth);
	margin-left: auto;
	margin-right: auto;
}

.container-padding {
    padding-inline: 1.5rem;
}

@media (min-width: 769px) {

    .container-padding {
        padding-inline: 2.5rem;
    }

}

.page .entry-header {
    padding: 1rem;
    background-color: var(--canvas-medium);
}

.entry-content p+:is(h2,h3,h4),
.taxonomy-extra-text p+:is(h2,h3,h4) {
    margin-top: 1em;
}

.entry-content > figure:not(.wp-block-gallery) img {
    border-radius: var(--border-radius);
    margin-bottom: 1.5rem;
}

.entry-content > .gb-grid-wrapper {
    margin-block: 3em;
}

.wp-block-gallery img {
    transition: opacity 250ms ease-in-out;
}

.wp-block-gallery img:hover {
    opacity: .8;
}

.entry-content p > a,
.entry-content p > em > a,
.entry-content li > a {
	font-weight: 600;
	text-decoration: underline;
}

.entry-content p > a:hover,
.entry-content p > em > a:hover,
.entry-content li > a:hover {
	text-decoration: none;
}

.entry-content ol li::marker {
    font-weight: 600;
}

.entry-content .wp-block-embed {
    margin-block: 1.5em;
}

.entry-content .wp-block-embed iframe {
    border-radius: var(--border-radius);
}

.gb-container p:last-child:last-of-type {
    margin-bottom: 0;
}

figcaption {
	margin-top: .375rem;
	font-weight: 500;
    text-align: center;
}

.list-nostyle {
	list-style-type: '';
	margin: 0;
}

.list-footer li {
    margin-bottom: .5rem;
}

.list-inline {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem 1.25rem;
}

.list-custom-marker li {
    display: flex;
    align-items: baseline;
    gap: .5rem;
}

.list-custom-marker li::before {
    content: '';
    flex-shrink: 0;
    display: block;
    background-color: var(--text-contrast);
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3C!--!Font Awesome Pro 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2024 Fonticons, Inc.--%3E%3Cpath class='fa-secondary' opacity='.4' d=''/%3E%3Cpath class='fa-primary' d='M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z'/%3E%3C/svg%3E") no-repeat 50% 50% / .75em;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3C!--!Font Awesome Pro 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2024 Fonticons, Inc.--%3E%3Cpath class='fa-secondary' opacity='.4' d=''/%3E%3Cpath class='fa-primary' d='M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z'/%3E%3C/svg%3E") no-repeat 50% 50% / .75em;
    width: .75em;
    height: .75em;
}

.list-custom-marker.dark-marker li::before {
    background-color: var(--text-base);
}

.list-custom-marker.arrow-marker li {
    gap: 1rem;
    margin-bottom: 1.75rem;
    word-wrap: anywhere;
}

.list-custom-marker.arrow-marker li::before {
    position: relative;
    top: .2em;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3C!--!Font Awesome Pro 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2024 Fonticons, Inc.--%3E%3Cpath d='M440.6 273.4c4.7-4.5 7.4-10.8 7.4-17.4s-2.7-12.8-7.4-17.4l-176-168c-9.6-9.2-24.8-8.8-33.9 .8s-8.8 24.8 .8 33.9L364.1 232 24 232c-13.3 0-24 10.7-24 24s10.7 24 24 24l340.1 0L231.4 406.6c-9.6 9.2-9.9 24.3-.8 33.9s24.3 9.9 33.9 .8l176-168z'/%3E%3C/svg%3E") no-repeat 50% 50% / 1.25rem;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3C!--!Font Awesome Pro 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2024 Fonticons, Inc.--%3E%3Cpath d='M440.6 273.4c4.7-4.5 7.4-10.8 7.4-17.4s-2.7-12.8-7.4-17.4l-176-168c-9.6-9.2-24.8-8.8-33.9 .8s-8.8 24.8 .8 33.9L364.1 232 24 232c-13.3 0-24 10.7-24 24s10.7 24 24 24l340.1 0L231.4 406.6c-9.6 9.2-9.9 24.3-.8 33.9s24.3 9.9 33.9 .8l176-168z'/%3E%3C/svg%3E") no-repeat 50% 50% / 1.25rem;
    width: 1.25rem;
    height: 1.25rem;
}

.scroll-offset,
[id] {
    scroll-margin-top: 2rem;
}

.square-image {
    aspect-ratio: 1/1;
}

.search-modal-form, 
.gp-search-modal .search-field {
    border-radius: .5rem;
}

.search-modal-form .search-field, 
.search-modal-form .search-field:focus {
    color: var(--contrast-2);
}

.gp-search-modal .search-field {
    background-color: var(--contrast-3) !important;
}

/* Piecalendar */
.piecal-controls__view-chooser {
    display:none;
}

#main .piecal-controls.fc {
    flex-wrap: nowrap;
}

/* Menu */

.main-navigation ul ul {
    box-shadow: none;
    border-radius: .25rem;
    transition: 0.7s;
    padding: .25rem;
}

.inside-header .main-navigation .menu-toggle {
    background-color: transparent;
}

@media only screen and (max-width:767px) {
    #menu-hoofdmenu li a {
        background-color: var(--contrast);
    }

    #menu-hoofdmenu .sub-menu a {
        background-color: var(--contrast-3);
    }

    .site-header .header-image {
        max-width:200px;
    }
}

/* Footer */

.site-footer a {
    text-decoration: none;
}

.site-footer a:hover {
    text-decoration: underline;
}


/* Home */

.gb-container .home-second-button {
    float: right;
}

.uitgelicht-small-header {
    margin-bottom: 0rem;
}

.uitgelicht-content {
    max-width: 27rem;
}

.uitgelicht-button::after {
    content: '\f061';
    font-family: "Font Awesome 6 Pro";
    font-size: 1.25rem;
    font-weight: 400;
    padding-left: 0.5rem;
}

.home-contact-button::after {
    content: '\f061';
    font-family: "Font Awesome 6 Pro";
    font-size: 1.25rem;
    font-weight: 400;
}

.home-4raster-content {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    height: 88%;
    width: 100%;
    padding: 0.9rem 0.55rem;
}

.home-3raster-content {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    height: 70%;
    width: 100%;
    padding: 0.9rem 0.55rem;
}

.home-before-raster-content {
    margin-bottom: 0;
}

.aankomende-diensten {
    background: url('/wp-content/uploads/2023/10/d0e3d4b2c0148b1220112d159fd386d4.png');
    background-blend-mode: overlay, normal;
}

.home-raster-with-image-content {
    margin-bottom: 1rem;
}

.home-second-raster-with-image {
    background: url('/wp-content/uploads/2023/10/d0e3d4b2c0148b1220112d159fd386d4.png');
    background-blend-mode: overlay, normal;
}

.home-contact-header strong {
    font-weight: 600;
}


.aankomende-diensten a, .aankomende-diensten span {
    font-size: 1rem;
}

.ktn-more {
    display: none;
}

.diensten {
    background-color: rgba(255, 255, 255, 0.5);
    border-radius: 0.2rem;
    padding: 1rem;
    margin-block: 1rem;
}

.diensten h3 {
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5;
    margin-bottom: 0;
}

.diensten h3 strong {
    font-size: 1.125em;
}

.ktn-gatherings .ktn-dienst {
    display: none;
}

.ktn-gatherings .ktn-voorganger {
    margin-left: 0;
}

#contact-block h2,#contact-block p {
    color:var(--contrast-3);
    max-width:500px;
}

.kerktijden-link::after {
    content: '\f08e';
    font-family: "Font Awesome 6 Pro";
    font-size: 0.5rem;
    font-weight: 900;
    color: var(--accent);
    bottom: 0.5rem;
    position: relative;
    margin-left: 0.25rem;
}

.kerktijden-link a{
    font-size: 0.7rem;
}

.eerdere-diensten::before {
    content: '\f1da';
    font-family: "Font Awesome 6 Pro";
    font-size: 0.8rem;
    font-weight: 900;
    margin-right: 0.25rem;
}

.meer-diensten-button::after {
    content: '\f061';
    font-family: "Font Awesome 6 Pro";
    font-size: 0.8rem;
    font-weight: 400;
    margin-left: 0.4rem;
}

.home-activity-location::before {
    content: '\f5a0';
    font-family: "Font Awesome 6 Pro";
    font-size: 0.7rem;
    font-weight: 400;
    padding-right: 0.4rem;
}

.home-activity-date::before {
    content: '\f274';
    font-family: "Font Awesome 6 Pro";
    font-size: 0.7rem;
    font-weight: 400;
    padding-right: 0.4rem;
}

.waar-staan-wij-voor-button:after {
    content: '\f061';
    font-family: "Font Awesome 6 Pro";
    font-size: 0.8rem;
    font-weight: 400;
    padding-left: 0.4rem;
}

.activity-church::before {
    content: '\f51d';
    font-family: "Font Awesome 6 Pro";
    font-size: 0.7rem;
    font-weight: 400;
    padding-right: 0.4rem;
}

.ktn-time::before {
    content: '\e345';
    font-family: "Font Awesome 6 Pro";
    font-size: 0.8rem;
    font-weight: 400;
}

.jeugdwerk-lees-meer::after {
    content: '\f061';
    font-family: "Font Awesome 6 Pro";
    font-size: 0.8rem;
    margin-left: 0.25rem;
}

.ktn-date {
    font-weight: 600;
    flex-shrink: 0;
}

.ktn-gatherings .ktn-time {
    display: inline-flex;
    gap: .5rem;
    width: auto;
}


.diensten .ktn-gatherings {
    padding: 0;
    margin: 0;
}

.diensten .ktn-gatherings li {
    display: flex;
    gap: .5rem 1rem;

}

@media (width < 769px) {

    .diensten .ktn-gatherings li {
        flex-wrap: wrap;
        margin-bottom: 0;
    }

    .diensten .ktn-gatherings .ktn-date {
        flex-basis: 100%;
    }

}

/* Wijkgemeenten overzicht */

.meer-over-deze-wijkgemeente:after {
    content: '\f061';
    font-family: "Font Awesome 6 Pro";
    font-size: 0.8rem;
    font-weight: 400;
    margin-left: 0.4rem;
}

.wijkgemeenten-overzicht-container {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    height: 100%;
}

/* Single kerk pagina */

.nieuws .bericht {
    padding: 0;
}

.bericht .berichtdatum {
    margin-bottom: 0.6rem;
}

.bericht .berichttitel a {
    text-decoration: none;
}


.download::before {
    content: '\f019';
    font-family: "Font Awesome 6 Pro";
    color: var(--accent);
    font-size: 0.9rem;
    font-weight: 900;
    margin-right: 0.4rem;
}

.site-content .single-kerk-content {
    max-width: 45rem !important;
    margin-inline: auto !important;
}

.image-raster-container {
    position: relative;
}

.image-raster-container::after {
    content: '\f06e';
    font-family: "Font Awesome 6 Pro";
    color: var(--contrast-3);
    font-size: 0.9rem;
    font-weight: 900;
    background-color: var(--base);
    position: absolute;
    top: 0;
    left: 0;
    padding: 1rem;
    border-radius: .25rem 0 .25rem 0;
}

.image-raster-container img {
    border-radius: .25rem;
}
#baguetteBox-overlay .full-image img {
    width: 40%;
}

.inside-article .kerk-galerij-container .kerk-galerij {
    gap: 0rem;
}

#gform_1 input,#gform_fields_1 textarea, #gform_2 input,#gform_fields_2 textarea, #gform_3 input,#gform_fields_3 textarea {
    border-radius: 0.3rem;
    font-size: 1rem;
}

.gform_button {

    font-weight: 700;
}

@media only screen and (max-width:600px) {
    .wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) {
        width: calc(100% - var(--wp--style--unstable-gallery-gap, 0.8rem)/2)
    }

    #baguetteBox-overlay .full-image img {
        width: 90%;
    }
}

.gb-accordion__item-open button {
    border-radius: 0.3rem 0.3rem 0rem 0rem;
}

.gb-accordion__item-open div {
    border-radius: 0rem 0rem 0.3rem 0.3rem;
}

.gb-accordion__toggle {
    border-radius: 0.3rem;
}

.gb-accordion__toggle .gb-block-is-current {
    border-radius: 0rem;
}
 
.ktn-gatherings li a {
    font-weight: 600;
}

#white-text p, #white-text h2 {
    color: var(--contrast-3);
}

/* Single bericht */

.single-post .entry-meta, .single-post .comments-area {
    display: none;
}

.single-post .inside-article {
    padding-top: 0px;
}

.kerk-contact, .adres-contact {
    font-size: 1.125rem;
    font-weight: 600;
}

.kerk-contact p, .adres-contact p {
    margin-bottom: .5em;
    font-size: clamp(1rem, 1rem + 0vw, 1rem);
}

.single-post-locatie::before,
.single-post-datum:before,
.adres-naam::before,
.adres-telefoon::before,
.adres-email::before,
.adres-straat::before,
.adres-website::before,
.adres-linkedin::before {
    content: '\f5a0';
    font-family: "Font Awesome 6 Pro";
    font-size: 1.125em;
    font-weight: 400;
    margin-right: .75rem;
    color:var(--accent);
}

.single-post-datum:before {
    content: '\f073';
}

.adres-naam::before {
    content: '\f2bd';
}

.adres-telefoon::before {
    content: '\f8d3';
}

.adres-email::before {
    content: '\f0e0';
}

.adres-straat::before {
    content: '\f5a0';
}

.adres-website::before {
    content: '\f0ac';
}

.adres-linkedin::before {
    content: '\f0e1';
}



/* lijst met kerkdiensten */

h3 {
    margin-bottom: 2px; /* minder witruimte onder datum */
}

/* hoofdletter op de dag */
.kerkdienst-datum {
	text-transform: capitalize;
	margin-top: 0;
}

.wijkgemeente {
    font-size: 0.9em;
    font-weight: 700;
    margin-top: 5px;
    margin-bottom: 0px;
}



/* Regel met aanvang, locatie en voorganger inspringen */
.dienst-meta {
    margin-left: 20px;  /* meer inspringing dan locatie */
    font-size: 16px; 
	color: #222;
    margin-top: 1px;
    margin-bottom: 1px;
    font-weight: 500;
    line-height: 1.5;
	margin-left: 1rem;
}

.dag-vak {
    background: #fff;
    padding: 1.5rem;
    margin-bottom: 2rem;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
}


/* Locatie onder datum, ingesprongen, oranje, geen underline */
.locatie {
    /* margin-left: 20px;  inspringing onder datum */
    font-size: 16px;    /* kleiner */
    margin-top: 2px;
    margin-bottom: 1px;
}

.locatie-link {
    text-decoration: none; 
    font-weight: 500;
}

.locatie-link,
.locatie-link:link,
.locatie-link:visited,
.locatie-link:hover,
.locatie-link:active {
    text-decoration: none !important; /* geen underline */
    font-weight: 500;
}

/* Responsive mobiel */
@media (max-width: 480px) {
  .dienst-meta {
    font-size: 15px;
    gap: 6px;
  }
}

.wp-block-buttons .alle-kerkdiensten-link {
  margin-left: auto;
}

.alle-kerkdiensten-link {
    margin-top: 20px;
    text-align: right;
	margin-left: auto;
}

.alle-kerkdiensten-link:after {
    content: '\f061';
    font-family: "Font Awesome 6 Pro";
    font-size: 0.8rem;
    font-weight: 400;
    padding-left: 0.4rem;
}

.alle-kerkdiensten-link a {
    display: inline-block;
    background-color: #f5efe9;
    color: #000;
    padding: 12px 20px;
    text-decoration: none;
    border: 1px solid #000;
    border-radius: 6px;
    font-weight: 500;
    transition: all 0.2s ease-in-out;
}

.alle-kerkdiensten-link a:hover {
    color: #eb902a;
    border-color: #eb902a;
    background-color: #f5efe9; /* explicitly locked */
}



/* kalender items homepage */

/* UL wrapper */
ul.kalender-listing.homepage-listing {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* LI: elk item als wit blok */
.kalender-item-meta {
    background: #fff !important;
    border-radius: 6px !important;
    margin-bottom: 12px !important;
    padding: 0 !important;
}

/* volledige klikbare link */
.kalender-item-full-link {
    display: flex !important;
    flex-direction: row !important;       /* titel + datum kolom + pijl */
    justify-content: flex-start !important;
    align-items: flex-start !important;
    width: 100%;
    padding: 14px 16px !important;
    text-decoration: none !important;
    color: #000 !important;
    gap: 12px;
    transition: background 0.2s ease, box-shadow 0.2s ease;
}

/* rechter content: titel + datum */
.kalender-right-content {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;           /* neemt beschikbare breedte */
    gap: 2px !important;                  /* kleine tussenruimte tussen titel en datum */
}

/* container voor titel + eventueel opmerking */
.kalender-titel-container {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

/* titel */
.kalender-titel {
    font-weight: 700 !important;
    font-size: 1rem !important;
    color: #000 !important;
    line-height: 1.2;
	
	
	
}

/* datumregel onder titel */
.kalender-datum--sub {
    display: block;
    margin-left: 0.2em;                   /* subtiel ingesprongen */
    margin-top: 0 !important;             /* geen extra witruimte */
    line-height: 1.3;
    font-size: 16px;
    opacity: 0.85;
    font-weight: 500;      
}

/* opmerking achter datum indien aanwezig */
.kalender-opmerking {
    font-size: 16px !important;
    color: #666 !important;
}

/* Oranje cirkel met pijl */
.kalender-arrow.gb-button {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 24px !important;
    height: 24px !important;
    background-color: #eb981a !important;
    border-radius: 50% !important;
    transition: transform 0.2s ease, background-color 0.2s ease;
    padding: 0 !important;
    flex-shrink: 0 !important;           /* niet krimpen */
    margin-left: auto !important;         /* altijd rechts */
}

.kalender-arrow.gb-button svg {
    width: 14px;
    height: 14px;
    fill: #fff;
    display: block;
}

.kalender-arrow.gb-button:hover {
    transform: scale(1.1);
    background-color: #ffb84d;
}

/* hover effect hele card */
.kalender-item-meta.is-link:hover {
    background: #f7f7f7 !important;
    box-shadow: 0 2px 6px rgba(0,0,0,0.08) !important;
    cursor: pointer !important;
}

.kalender-item-meta.is-link:hover .kalender-arrow {
    transform: translateX(4px) !important;
}

/* keyboard focus */
.kalender-item-full-link:focus-visible {
    outline: 3px solid #005fcc !important;
    outline-offset: 3px !important;
}

/* items zonder link subtiel */
.kalender-item-meta:not(.is-link) {
    opacity: 0.7 !important;
}

@media (max-width: 768px) {

    /* link blijft flex row */
    .kalender-item-full-link {
        flex-direction: row !important;
        justify-content: flex-start !important;
        align-items: flex-start !important;
        gap: 8px;
    }

    /* rechter content blijft kolom: titel boven datum */
    .kalender-right-content {
        flex-direction: column !important;
        gap: 0 !important; /* geen extra witruimte tussen titel en datum */
    }

    /* titel + datum container */
    .kalender-titel-container {
        flex-direction: column;
        justify-content: flex-start !important;
    }

    /* pijl altijd rechts */
    .kalender-arrow {
        flex-shrink: 0 !important;
        margin-left: auto !important;
        margin-top: 0 !important;
    }

    /* datum subtiel ingesprongen en compact */
    .kalender-datum--sub {
        margin-left: 0.2em;
        margin-top: 0 !important;
        line-height: 1.2; /* compact */
    }
}



/* facet wp specifics */

/* Style the hover behavior in tegeltjespagina of each post block*/
.facetwp-template .fwpl-result:hover {
  cursor: pointer;
}


/* facetwp counters verbergen */
.facetwp-counter {
    display: none !important;
}


/* contactpersoon kaart */

.contactpersoon-kaart {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 12px 14px;
    background: #fff;
    box-shadow: 0 2px 6px rgba(0,0,0,.04);
    max-width: 520px;
}
.contactpersoon-kaart__header {
    font-weight: 600;
    font-size: 1.1rem;
    color: #334155;
    margin-bottom: 8px;
}

.contactpersoon-kaart__email a {
    color: #0ea5e9;
    text-decoration: none;
}
.contactpersoon-kaart__email a:hover {
    text-decoration: underline;
}




.contactpersoon-kaart__email::before,
.contactpersoon-kaart__telefoon::before,
.contactpersoon-kaart__naam::before {
    content: '\f5a0';
    font-family: "Font Awesome 6 Pro";
    font-size: 1.125em;
    font-weight: 400;
    margin-right: .75rem;
    color:var(--accent);
}

.contactpersoon-kaart__naam::before {
    content: '\f2bd';
}

.contactpersoon-kaart__telefoon::before {
    content: '\f8d3';
}

.contactpersoon-kaart__email::before {
    content: '\f0e0';