/*
	Custom CSS
	Please make sure your CSS rules are 
	more particular / have higher priority
	then other page styles
*/
 #events h3   {/* Icoontjes in het Hugo-thema dezelfde kleur als de tekst */
.contact-block .fa,
.contact-block .sb-icon,
.contact-block i {
color: inherit !important;
filter: none !important;
}
{ /* Extra fallback voor het Hugo-thema */
.footer .fa,
.footer .sb-icon,
.footer i {
color: #F9FBFF!important;
}
/* Subtiele hover */
.contact-block i:hover,
.footer i:hover {
opacity: 0.8;
}
	/* add your css rule here */
}
@import url('https://fonts.googleapis.com/css2?family=Publicotext:wght@300;400&family=Publicotext+Display:wght@400;500&display=swap');

 #events p.duration, #events div.duration   {
	/* add your css rule here */
}
 { /* Tekstkleur van contactgegevens gelijkmaken met gewone tekst */
.contact-block a,
.footer a {
color: 2C2C2C !important;
text-decoration: none !important; /* haalt de blauwe onderstreping weg */
}
/* Optioneel: subtiel hover-effect */
.contact-block a:hover,
.footer a:hover {
opacity: 0.9;
}
 /* Tekstkleur van contactgegevens gelijkmaken met gewone tekst */
.contact-block a,
.footer a {
color: 2C2C2C!important;
text-decoration: none !important; /* haalt de blauwe onderstreping weg */
}

/* Optioneel: subtiel hover-effect */
.contact-block a:hover,
.footer a:hover {
opacity: 0.9;
}
 #events p.description, #events div.description   {
	/* add your css rule here */
}


 #events .selectedEvent   {
	/* add your css rule here */
}


 #events input.reserve_time_btn   {
	/* add your css rule here */
}


 #events input.select_another_btn   {
	/* add your css rule here */
}


 #eventForm #start_date-block-container h3, #eventForm #timeline-container h3   {
	/* add your css rule here */
}


 #eventForm #save_button   {
	/* add your css rule here */
}


 div.ui-widget-content   {
	/* add your css rule here */
}


 div.ui-widget-header   {
	/* add your css rule here */
}


 #timeline-container table.timeline   {
	/* add your css rule here */
}


 .timeline td.not_worked_time   {
	/* add your css rule here */
}


 .timeline td.free_time   {
	/* add your css rule here */
}


 .timeline td.selected_time   {
	/* add your css rule here */
}


 .timeline td.reserved_time   {
	/* add your css rule here */
}


 div#loading   {
	/* add your css rule here */
}


 #start_date-block-container .zend_form dt, start_date-block-container .zend_form dt b, start_date-block-container .zend_form dd label   {
	/* add your css rule here */
}@import url('https://fonts.googleapis.com/css2?family=Publicotext:wght@300;400&family=Publico text+Display:wght@400;500&display=swap');
<div style="min-height:78vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;font-family:'Publicotext',serif;">
<h1 style="margin:0 0 .4em 0;line-height:1.2;">JOUW PLEK...</h1>
<h2 style="margin:0 0 1em 0;line-height:1.2;">...IN EEN ANDERE WERELD</h2>

<p style="max-width:720px;margin:0 0 1.2em 0;line-height:1.7;">
De meeste mensen voelen het pas<br>
als ze weer buiten staan.<br><br>
Alles ziet er nog hetzelfde uit,<br>
maar vanbinnen is iets wat schuurde<br>
weer zacht beginnen stromen.
</p>

<a href="https://cuevadis.be/v2/#page/ook-voor-jou"
style="display:inline-block;background:#C2A56D;color:#ffffff;text-decoration:none;padding:.7em 1.4em;border-radius:4px;font-weight:700;font-family:'Publicotext',serif;">
Ook voor jou?
</a>
</div>
De meeste mensen voelen het pas
als ze weer buiten staan
Alles ziet er nog hetzelfde uit
maar vanbinnen is iets wat schuurde 
weer zacht beginnen stromen.
/* Verberg standaard-widgets op de booking site (/v2) */
.sb-booking, /* kalender */
.sb-widget-reviews,
.sb-widget-reviews-list,
.sb-widget-reviews-add, /* beoordelingen */
.sb-widget-contacts, /* contactgegevens */
.sb-widget-contact-form, /* contactformulier */
.sb-widget-map, /* kaart */
.sb-widget-business-hours { /* openingstijden */
display: none !important;
}
/* Verwijder de blauwe verticale streep / timeline */
.sb-timeline,
.sb-timeline:before,
.sb-timeline:after {
display: none !important;
border: none !important;
}
/* Links rustig donker i.p.v. felblauw (binnen widgets & content) */
.sb-widget a,
.sb-widget a:link,
.sb-widget a:visited,
a, a:link, a:visited {
color: #2C2C2C!important;
text-decoration: none !important;
}
.sb-widget a:hover,
a:hover { color: #2C2C2C!important; }

/* Vervelende achtergrondjes uit de editor weg */
p, p *, em, strong {
background: transparent !important;
}
/* Rustig letterbeeld overal */
body, p, .sb-widget, .sb-widget * {
font-family: Publico text, serif !important;
color: #2C2C2C !important;
}
p { font-size: 18px !important; line-height: 1.6 !important; text-align: center; }
em { font-size: 18px !important; color: #333652 !important; line-height: 1.8 !important; display: block; max-width: 700px; margin: 20px auto; }
h1, h2, h3, h4, h5, h6 {
font-family: 'Publicotext', serif !important;
font-weight: 700 !important;
}/* Google Fonts laden (1x bovenaan laten staan) */
@import url('https://fonts.googleapis.com/css2?family=Publicotext:wght@300;400&family=Playfair+Display:wght@400;500&display=swap');
/* ===== HOOFDINHOUD: alleen typografie aanpassen, kleuren ongemoeid ===== */
body[class*="hugo"] h1,
body[class*="hugo"] h2,
body[class*="hugo"] h3 {
font-family: 'Publico text', serif !important;
font-weight: 500 !important;
letter-spacing: 0.08em !important;
text-transform: none !important; /* haalt CAPS weg (bv. WERELD) */
}
body[class*="hugo"] p,
body[class*="hugo"] .content p,
body[class*="hugo"] .sb-content p {
font-family: 'Publico text', serif !important;
font-weight: 300 !important;
line-height: 1.8 !important;
}
/* ===== ZIJBALK / LINKER MENU LICHTER EN RUSTIGER ===== */
body[class*="hugo"] .sidebar,
body[class*="hugo"] .sidebar a,
body[class*="hugo"] .left-menu,
body[class*="hugo"] .left-menu a,
body[class*="hugo"] nav.sidebar a {
color: #E8E8E8 !important; /* lichter */
font-family: 'Publico text', serif !important;
letter-spacing: 0.03em !important;
text-transform: none !important;
}
/* optioneel: actieve/hover staat iets zachter */
body[class*="hugo"] .sidebar a:hover,
body[class*="hugo"] .left-menu a:hover {
opacity: 0.0;
}
/* ===== CONTACTTEKST / FOOTER RECHTSONDER LICHTER ===== */
body[class*="hugo"] .footer,
body[class*="hugo"] .footer a,
body[class*="hugo"] .contact-block,
body[class*="hugo"] .contacts,
body[class*="hugo"] .sb-footer {
color: #E8E8E8!important;
font-family: 'Publico text', serif !important;
}
/* ===== KNOPPEN: alleen typografie zachter houden (kleuren blijven) ===== */
body[class*="hugo"] .btn,
body[class*="hugo"] .button,
body[class*="hugo"] .sb-button,
body[class*="hugo"] button {
font-family: 'Publico text', serif !important;
font-weight: 400 !important;
letter-spacing: 0.05em !important;
text-transform: none !important;
}/* ===== BRUTE-FORCE HUGO OVERRIDE ===== */

/* TITELS (bv. WERELD) */
html body .sb-page-title,
html body h1.sb-page-title,
html body .sb-title {
font-family: 'Publico text', serif !important;
font-weight: 500 !important;
letter-spacing: 0.08em !important;
text-transform: none !important; /* geen CAPS */
}

/* LOPENDE TEKST IN CONTENT */
html body .sb-content-description,
html body .sb-page-description,
html body .sb-text,
html body .sb-service-text,
html body .sb-content p,
html body .sb-page p {
font-family: 'Publico text', serif !important;
font-weight: 300 !important;
line-height: 1.8 !important;
}

/* LINKER MENU LICHTER */
html body .sb-left-menu,
html body .sb-left-menu a,
html body nav.sb-left-menu a {
color: #E8E8E8 !important;
font-family: 'Publico text', serif !important;
text-transform: none !important;
letter-spacing: 0.03em !important;
}

{ /* CONTACT/FOOTER RECHTSONDER LICHTER */
html body .sb-footer,
html body .sb-footer a,
html body .contacts,
html body .contacts a {
color: #2C2C2C !important;
font-family: 'Publico text', serif !important;
}

/* KNOP ‘AFSPRAAK MAKEN’ – alleen typografie, kleuren blijven */
html body .sb-button,
html body .btn,
html body button {
font-family: 'Publico text', serif !important;
font-weight: 400 !important;
letter-spacing: 0.05em !important;
text-transform: none !important;
}
{background:rgba(0,0,0,0.0)!important;}
/* Tekstkleur van contactgegevens gelijkmaken met gewone tekst */
.contact-block a,
.footer a {
color: 2C2C2C !important;
text-decoration: none !important; /* haalt de blauwe onderstreping weg */
}
{/* Optioneel: subtiel hover-effect */
.contact-block a:hover,
.footer a:hover 
opacity: 0.0;
}
/* Achtergrond specifiek voor de pagina "over-cuevadis" */
.page-over-cuevadis .content {
background-image: url("https://cuevadis.be/uploads/e63fe9ca3385425cb9e0e1458183c0a1.jpg");
background-size: cover;
background-position: center;
background-repeat: no-repeat;
color: #fff; /* witte tekst voor contrast */
position: relative;
z-index: 1;
}
{/* Universeel: geen gloed meer op achtergronden */
.content::before,
.page-home .content::before,
[class^="page-"] .content::before {
background: none !important;
content: none !important;
}
{ /* Fijne, nauwelijks zichtbare gloed over de hele site */
.content::before,
.page-home .content::before,
[class^="page-"] .content::before {
content: "";
position: absolute;
inset: 0;
background: rgba(0, 0, 0, 0.08); /* ← pas dit getal aan (0.05–0.12) voor meer of minder gloed */
z-index: 0;
}
/* Zorg dat tekst boven de gloed ligt */
.content > * {
position: relative;
z-index: 1;
}
{ /* Contactgegevens in eigen huisstijlkleur (#0B4452) */
.footer a,
.footer .contact-info a,
.footer .contact-info span,
.footer .contact-info {
color: #0B4452 !important;
}
.footer a:hover {
color: #0B4452 !important; /* zelfde tint bij hover, voor rustiger effect */
}
/* CONTACTGEGEVENS IN FOOTER – HUGO THEMA */
html body .footer .contact-info,
html body .footer .contact-info span,
html body .footer .contact-info a,
html body .footer .contacts,
html body .footer .contacts span,
html body .footer .contacts a,
html body .sb-footer .contact-info,
html body .sb-footer .contact-info span,
html body .sb-footer .contact-info a,
html body .sb-footer .contacts,
html body .sb-footer .contacts span,
html body .sb-footer .contacts a,
html body .footer a[href^="mailto:"],
html body .footer a[href^="tel:"],
html body .sb-footer a[href^="mailto:"],
html body .sb-footer a[href^="tel:"],
html body .footer .address,
html body .sb-footer .address {
color: #0B4452 !important;
}
/* Als het thema een 'link color' variabele gebruikt, zet die ook mee: */
html body .footer,
html body .sb-footer {
--link-color: #0B4452;
}
/* Hover bewust gelijk houden (rustig effect) */
html body .footer a:hover,
html body .sb-footer a:hover {
color: #0B4452 !important;
}/* FORCEER CONTACTLINKS IN DE FOOTER NAAR #0B4452 (HUGO) */
footer a,
footer a:link,
footer a:visited,
footer a:active,
footer a:hover,
#footer a,
#footer a:link,
#footer a:visited,
#footer a:active,
#footer a:hover,
.footer a,
.footer a:link,
.footer a:visited,
.footer a:active,
.footer a:hover,
.sb-footer a,
.sb-footer a:link,
.sb-footer a:visited,
.sb-footer a:active,
.sb-footer a:hover,
footer .contact-info a,
footer .contacts a,
#footer .contact-info a,
#footer .contacts a,
.footer .contact-info a,
.footer .contacts a,
.sb-footer .contact-info a,
.sb-footer .contacts a,
footer a[href^="mailto:"],
footer a[href^="tel:"],
#footer a[href^="mailto:"],
#footer a[href^="tel:"],
.footer a[href^="mailto:"],
.footer a[href^="tel:"],
.sb-footer a[href^="mailto:"],
.sb-footer a[href^="tel:"]
{
color: #0B4452 !important;
text-decoration-color: #0B4452 !important; /* onderlijning in dezelfde tint */
}
/* FORCEER STANDAARDKLEUR CONTACTGEGEVENS (#0B4452) */
footer a:link,
footer a:visited,
footer a:active,
footer .contact-info a,
footer .contacts a,
footer .address a {
color: #0B4452 !important;
text-decoration: none !important;
}

/* Hoverkleur mag hetzelfde blijven */
footer a:hover {
color: #0B4452 !important;
}

/* Specifiek voor Hugo-theme variabele */
:root {
--link-color: #0B4452 !important;
--link-hover-color: #0B4452 !important;
}/* --- FOOTER CONTACTEN NAAR #0B4452, ICONS MET RUST LATEN --- */

/* 1) Overschrijf de link-variabelen die het Hugo/SimplyBook-thema gebruikt */
footer,
#footer,
.footer,
.sb-footer {
--link-color: #0B4452 !important;
--link-hover-color: #0B4452 !important;
--sb-link: #0B4452 !important;
--sb-link-hover: #0B4452 !important;
--primary: #0B4452 !important;
--brand-color: #0B4452 !important; /* sommige skins gebruiken deze */
}

/* 2) Forceer de kleur op de relevante containers in de footer */
footer .contact-info,
footer .contacts,
#footer .contact-info,
#footer .contacts,
.footer .contact-info,
.footer .contacts,
.sb-footer .contact-info,
.sb-footer .contacts {
color: #0B4452 !important;
}

/* 3) En specifiek de links (alle toestanden) in die blokken */
footer .contact-info a,
footer .contacts a,
#footer .contact-info a,
#footer .contacts a,
.footer .contact-info a,
.footer .contacts a,
.sb-footer .contact-info a,
.sb-footer .contacts a,
footer a[href^="mailto:"],
footer a[href^="tel:"] {
color: #0B4452 !important;
text-decoration-color: #0B4452 !important;
}

/* 4) Hou hover identiek, zodat er geen lichtere tint verschijnt */
footer a:hover,
#footer a:hover,
.footer a:hover,
.sb-footer a:hover {
color: #0B4452 !important;
text-decoration-color: #0B4452 !important;
}

/* 5) Sommige skins zetten linkkleur via 'a:not(.btn)' o.i.d. → vang dat af maar
beperk tot de footer zodat de rest van de site ongemoeid blijft. */
footer a:not(.btn):not(.button):not([role="button"]),
#footer a:not(.btn):not(.button):not([role="button"]),
.footer a:not(.btn):not(.button):not([role="button"]),
.sb-footer a:not(.btn):not(.button):not([role="button"]) {
color: #0B4452 !important;
} {.sb__btn.sb__book-btn {
    display: none !important;
}
.sb-header__booking-btn {
    display: none !important;
}
.sb__book-btn, .sb-header__booking-btn {
    display: none !important;
}
/* Verberg alle mogelijke 'Afspraak maken' of 'Boek nu'-knoppen */
.sb-header__booking-btn,
.sb__book-btn,
button.sb__book-btn,
a.sb__book-btn,
a[data-open-booking-popup],
button[data-open-booking-popup],
.sb_header_booking_btn,
.sb-header__button,
.sb-header__btn {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}
/* ----------------------------------
CUEVADIS kleuren
---------------------------------- */
:root {
--cueva-sand-light: ##F9FBFF; /* lichte variant voor achtergronden */
--cueva-sand: #F9FBFF; /* jouw zandkleur */
--cueva-sand-dark: #8d8464; /* donkerdere toon */
--cueva-ink: #2b2621; /* warme diepe inktkleur */
--cueva-accent: #0B4452; /* jouw groene kleur */
}
/* ----------------------------------
1. Verwijder standaard-bel-iconen
---------------------------------- */
.service-item .service-photo,
.service-item .service-icon,
.sb-booking-service__icon {
display: none !important;
}
/* ----------------------------------
2. Kaarten in CUEVADIS-stijl
---------------------------------- */
.service-item,
.sb-booking-service {
background: var(--cueva-sand-light) !important;
border: 1px solid rgba(0,0,0,0.05) !important;
box-shadow: 0 4px 16px rgba(0,0,0,0.08) !important;
border-radius: 10px !important;
padding: 24px 26px 22px 26px !important;
color: var(--cueva-ink) !important;
}
/* ruimte tussen de kaarten */
.sb-booking-services-list,
.sb-service-list {
gap: 24px !important;
}
/* ----------------------------------
3. Titels & tekst
---------------------------------- */
.service-item .service-name,
.sb-booking-service__name {
font-weight: 500 !important;
font-size: 1.07rem !important;
letter-spacing: 0.03em;
color: var(--cueva-ink) !important;
margin-bottom: 6px !important;
}
.service-item .service-description,
.sb-booking-service__description {
font-size: 0.92rem !important;
line-height: 1.45 !important;
color: rgba(43,38,33,0.92) !important;
}
/* prijs/duur subtiel */
.service-item .service-price,
.sb-booking-service__price,
.sb-booking-service__duration {
font-size: 0.9rem !important;
color: rgba(43,38,33,0.85) !important;
}
/* ----------------------------------
4. Buttons – CUEVADIS zacht groen
---------------------------------- */
.service-item .btn,
.sb-booking-service__button button,
.sb-booking-service__button .btn {
background: transparent !important;
border-radius: 999px !important;
border: 1px solid var(--cueva-accent) !important;
color: var(--cueva-accent) !important;
text-transform: none !important;
letter-spacing: 0.04em;
font-size: 0.9rem !important;
padding: 9px 20px !important;
box-shadow: none !important;
}
/* Hover – diep, warm groen */
.service-item .btn:hover,
.sb-booking-service__button button:hover,
.sb-booking-service__button .btn:hover {
background: var(--cueva-accent) !important;
color: var(--cueva-sand-light) !important;
border-color: var(--cueva-accent) !important;
}
/* ----------------------------------
5. Subtiele visuele details
---------------------------------- */
/* zachte divider */
.sb-content .divider,
.sb-main .divider {
background: linear-gradient(
to right,
transparent,
rgba(0,0,0,0.18),
transparent
) !important;
height: 1px !important;
}
/* ademruimte */
.sb-booking-page,
.sb-content {
padding-top: 20px !important;
}
/* --- CUEVADIS: alle service-iconen hard verwijderen --- */
/* Als het een apart blok is (div, span, etc.) */
.service-item .service-photo,
.service-item .service-icon,
.sb-booking-service__icon {
display: none !important;
background: none !important;
border: none !important;
}
/* Als het een afbeelding of SVG is */
.service-item svg,
.service-item img,
.sb-booking-service svg,
.sb-booking-service img {
display: none !important;
}
/* Als de bel als achtergrond op de kaart zelf staat */
.service-item,
.sb-booking-service {
background-image: none !important;
}
/* Als ze met een pseudo-element werken */
.service-item::before,
.service-item::after,
.sb-booking-service::before,
.sb-booking-service::after {
content: none !important;
background: none !important;
/* --- CUEVADIS: bovenste icoonblok volledig weg --- */
/* eerste blok in de kaart verbergen (icooncontainer) */
.service-item > div:first-child,
.sb-booking-service > div:first-child {
display: none !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
opacity: 0 !important;
/* beetje extra ruimte boven de titel zodat het mooi oogt */
.service-item .service-name,
.sb-booking-service__name {
margin-top: 4px !important;
}