/* ===== CUSTOM-BLOK: lettertypes Den Ham (26-09-2026, url hersteld 28-09-2026: SOFT-as had geen waarde, Google gaf een fout) ===== */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght,SOFT@9..144,400..600,0..100&family=Nunito+Sans:opsz,wght@6..12,400..700&display=swap');
/* ===== EINDE CUSTOM-BLOK ===== */
html {
overflow-y: scroll;
}
body {
color: #555;
font-size:1.7em;
margin: 0;
padding: 80px  0 0 0;
padding-right: 0!important;
background: #fff;
}
img {
max-width: 100%;
height: auto!important;
}
a,
a:visited,
a:focus,
a:active,
a:hover {
    outline:0 none !important;
text-decoration:none;
}
*:focus, *:visited, *:active, *:hover  {
outline:0 !important;
}
*::-moz-focus-inner {
border:0;
}
button::-moz-focus-inner {
border: 0;
}
.container-fluid {
overflow: hidden;
}
.nopadding {
padding: 0;
}
/*menu*/
.navbar-default {
    background-color: #fff;
    border-color: transparent;
}
.navbar {
    min-height: 70px;
border: 15px solid #fff;
}
.navbar-nav > li > a {
    padding-top: 25px;
    padding-bottom: 25px;
}
.navbar-toggle {
    margin-top: 18px;
border-radius:0;
}
.navbar-collapse { 
    max-height: 100% !important; 
}
/*einde menu*/
/*flex tabel*/
.buiten {
    display: flex;
    max-width: 800px;
    margin: 0;
}
.binnen {
flex-grow: 1;
padding: 5px;
border: 1px solid #444750;
width: 33%;
margin: 1px;
font-size: 0.9em;
}
.binnen p {
margin: 0;
}
@media (max-width: 1199px) {
	.buiten {
		flex-wrap: wrap;
	}
	.binnen {
		flex: 1 0 95%;
	}
}
/*einde flex tabel*/
/*fixed*/  
.site {
display: flex;
min-height: 100vh;
flex-direction: column;
}
.wrapper {
flex: 1;
}
footer {
    left: 0;
    bottom: 0;
padding: 15px;
    height: calc(100% - 200px);
    width: 100%;
background: #2d3f44;
color: #c1c1c1;
}
footer a {
-webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
color: #c1c1c1;
}
footer a:hover {
color: #909090;
}
footer hr {
    width:25%;
    margin:30px auto;
border-top: 1px solid #cc3399;
}
.credit {
text-align:center;
font-size:85%;
}
#return-to-top {
    position: fixed;
    bottom: 100px;
right:0;
    display: block; 
display: none;
transition: all 0.3s ease;
background: rgba(0,0,0,.5);
padding: 15px;
border-radius: 4px 0 0 4px;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
a#return-to-top {
color:#fff!important;
}

/* ===== CUSTOM-BLOK: ontwerp Den Ham, basis (26-09-2026) ===== */
:root {
	--kleur-achtergrond: #FAFAF6;
	--kleur-mist: #EEF2EA;
	--kleur-lucht-vlak: #E8F0F2;
	--kleur-display: #2E3B2C;
	--kleur-tekst: #4A5347;
	--kleur-gedempt: #7A8475;
	--kleur-groen: #5F7F45;
	--kleur-salie: #A9BF8E;
	--kleur-lucht: #B9D3DF;
	--kleur-zand: #EADFC8;
	--kleur-baksteen: #A8604A;
	--kleur-baksteen-vlak: #F6ECE6;
	--kleur-lijn: #E1E6DC;
	--kleur-footer: #34462F;
	--kop: 'Fraunces', Georgia, serif;
	--tekst: 'Nunito Sans', 'Segoe UI', system-ui, sans-serif;
	--golf-1: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath d='M0,70 C220,130 420,10 720,48 C1000,84 1220,120 1440,52 L1440,120 L0,120 Z'/%3E%3C/svg%3E");
	--golf-2: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath d='M0,60 C260,120 520,0 780,44 C1040,88 1240,110 1440,64 L1440,120 L0,120 Z'/%3E%3C/svg%3E");
	--golf-3: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath d='M0,40 C300,110 560,20 820,56 C1080,92 1260,40 1440,72 L1440,120 L0,120 Z'/%3E%3C/svg%3E");
	--golf-hoogte: clamp(20px, 7vw, 96px);
}
body {
	font-family: var(--tekst);
	font-size: 18px;
	line-height: 1.65;
	color: var(--kleur-tekst);
	background: var(--kleur-achtergrond);
	padding-top: 76px;
}
.wrapper {
	position: relative;
	isolation: isolate;
	overflow-x: clip;
}
h1, h2, h3, h4 {
	font-family: var(--kop);
	font-variation-settings: "SOFT" 100;
	font-weight: 500;
	color: var(--kleur-display);
	line-height: 1.1;
	text-wrap: balance;
}
h1 { font-size: clamp(42px, 5.4vw, 66px); }
h2 { font-size: clamp(30px, 3.2vw, 40px); margin: 1.4em 0 .5em; }
h3 { font-size: 22px; margin: 1.2em 0 .4em; }
p { margin: 0 0 1em; }
.section > h2:first-child { margin-top: 0; }
.wrapper a {
	color: var(--kleur-groen);
	text-decoration: underline;
	text-decoration-color: var(--kleur-salie);
	text-decoration-thickness: 2px;
	text-underline-offset: 4px;
	transition: color .2s ease, text-decoration-color .2s ease;
}
.wrapper a:hover,
.wrapper a:focus {
	color: var(--kleur-display);
	text-decoration-color: var(--kleur-groen);
}
.wrapper a:focus-visible,
.navbar a:focus-visible {
	outline: 2px solid var(--kleur-groen) !important;
	outline-offset: 3px;
}
blockquote {
	border: 0;
	margin: 0 0 1.2em;
	padding: 0;
	font-family: var(--kop);
	font-variation-settings: "SOFT" 100;
	font-size: 22px;
	line-height: 1.4;
	color: var(--kleur-display);
}
blockquote p { margin: 0; }
.lead,
.section > p:first-of-type strong:only-child {
	font-family: var(--kop);
	font-variation-settings: "SOFT" 100;
	font-weight: 500;
	font-size: 22px;
	line-height: 1.4;
	color: var(--kleur-display);
}
/* knoppen */
.btn,
.wrapper a.btn {
	display: inline-block;
	font-family: var(--tekst);
	font-weight: 700;
	font-size: 16px;
	line-height: 1.3;
	padding: 12px 26px;
	border: 0;
	border-radius: 999px;
	background: var(--kleur-groen);
	color: #fff;
	text-decoration: none;
	box-shadow: 0 10px 22px -14px rgba(95,127,69,.9);
	transition: transform .25s ease, background .25s ease;
}
.btn:hover,
.wrapper a.btn:hover {
	background: var(--kleur-display);
	color: #fff;
	transform: translateY(-2px);
}/* ===== EINDE CUSTOM-BLOK ===== */

/* ===== CUSTOM-BLOK: menu Den Ham (26-09-2026) ===== */
.navbar-default.navbar-fixed-top {
	background: rgba(250,250,246,.94);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	border: 0;
	min-height: 76px;
	box-shadow: 0 10px 30px -26px rgba(46,59,44,.6);
}
.navbar-default .navbar-brand {
	height: 76px;
	padding: 20px 15px;
}
.navbar-default .navbar-brand img {
	height: 36px !important; /* wint van img height:auto!important in de basis */
	width: auto;
	mix-blend-mode: multiply;
}
.navbar-default .navbar-nav > li > a {
	font-family: var(--tekst);
	font-weight: 600;
	font-size: 15px;
	color: var(--kleur-display);
	padding: 7px 8px;
	margin: 20px 0;
	border-radius: 999px;
	transition: background .2s ease, color .2s ease;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
	background: var(--kleur-mist);
	color: var(--kleur-groen);
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
	background: var(--kleur-mist);
	color: var(--kleur-groen);
}
.navbar-default .navbar-toggle {
	border: 0;
	border-radius: 999px;
	margin-top: 21px;
	background: var(--kleur-mist);
}
.navbar-default .navbar-toggle .icon-bar { background: var(--kleur-display); }
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus { background: var(--kleur-salie); }
.navbar-default .navbar-collapse { border: 0; box-shadow: none; }
@media (min-width: 1200px) {
	.navbar-default .navbar-nav { float: right; }
}
@media (min-width: 768px) and (max-width: 1199px) {
	body { padding-top: 124px; }
	.navbar-default .navbar-header { float: none; text-align: center; }
	.navbar-default .navbar-brand { float: none; display: inline-block; height: 56px; padding: 14px 15px 6px; }
	.navbar-default .navbar-nav { float: none; text-align: center; font-size: 0; }
	.navbar-default .navbar-nav > li { float: none; display: inline-block; }
	.navbar-default .navbar-nav > li > a { margin: 4px 0 12px; padding: 6px 9px; font-size: 14.5px; }
}
@media (max-width: 767px) {
	.navbar-default .navbar-nav > li > a { margin: 2px 0; }
	.navbar-default .navbar-collapse { max-height: calc(100vh - 76px) !important; }
}
/* ===== EINDE CUSTOM-BLOK ===== */

/* ===== CUSTOM-BLOK: golven, orbs en kiezel Den Ham (26-09-2026) ===== */
/* hero bovenaan (blok 7) loopt met een golf over in de pagina */
.wrapper > .container-fluid:first-child {
	position: relative;
	padding: 0;
}
.wrapper > .container-fluid:first-child > .row { margin: 0; }
.wrapper > .container-fluid:first-child > .row > div { padding: 0; }
.wrapper > .container-fluid:first-child::after {
	content: "";
	display: block; /* Bootstrap clearfix zet hier display:table, dan wordt de breedte 0 */
	clear: none;
	position: absolute;
	left: 0; right: 0; bottom: -1px;
	height: var(--golf-hoogte);
	background: var(--kleur-achtergrond);
	-webkit-mask: var(--golf-1) center / 100% 100% no-repeat;
	mask: var(--golf-1) center / 100% 100% no-repeat;
	z-index: 2;
	pointer-events: none;
}
/* zachte kleurvlekken achter de inhoud */
.wrapper::before,
.wrapper::after {
	content: "";
	position: absolute;
	z-index: -1;
	border-radius: 50%;
	filter: blur(44px);
	opacity: .55;
	pointer-events: none;
	animation: dh-drijf 18s ease-in-out infinite alternate;
}
.wrapper::before {
	width: 380px; height: 380px;
	left: 4%; top: 120px;
	background: radial-gradient(circle at 40% 40%, var(--kleur-salie), transparent 70%);
}
.wrapper::after {
	width: 340px; height: 340px;
	right: 6%; top: 360px;
	background: radial-gradient(circle, var(--kleur-lucht), transparent 70%);
	animation-delay: -7s;
}
@keyframes dh-drijf {
	to { transform: translate(30px, -24px) scale(1.08); }
}
@media (prefers-reduced-motion: reduce) {
	.wrapper::before, .wrapper::after { animation: none; }
	.btn, .wrapper a.btn { transition: none; }
}
/* foto in kiezelvorm, klasse kiezel op de img in de wysiwyg */
img.kiezel {
	display: block;
	width: 100%;
	aspect-ratio: 1 / 1;
	height: auto !important;
	object-fit: cover;
	border-radius: 62% 38% 54% 46% / 47% 58% 42% 53%;
	box-shadow: 0 30px 60px -34px rgba(46,59,44,.55);
}
.kiezel-rand {
	position: relative;
	isolation: isolate;
	max-width: 480px;
	margin: 0 auto;
}
.kiezel-rand::before {
	content: "";
	position: absolute;
	right: -14px; top: -18px;
	width: 46%;
	aspect-ratio: 1;
	border-radius: 50%;
	background: var(--kleur-zand);
	z-index: -1;
}
/* ===== EINDE CUSTOM-BLOK ===== */

/* ===== CUSTOM-BLOK: paginakop en kruimelpad Den Ham (26-09-2026) ===== */
.breadcrumb {
	background: none;
	max-width: 750px;
	margin: 24px auto 0;
	padding: 0 15px;
	font-size: 14px;
	color: var(--kleur-gedempt);
}
.breadcrumb a { color: var(--kleur-gedempt); text-decoration: none; }
@media (max-width: 767px) {
	.breadcrumb { padding: 0 30px; } /* gelijk met de tekstkolom */
}
/* lange url's als linktekst niet buiten beeld laten lopen */
.section a { overflow-wrap: anywhere; }
.page-header {
	border: 0;
	margin: 8px 0 18px;
	padding: 0;
}
.page-header h1 { margin: 0; }
/* tekstkolom op binnenpagina's */
.breadcrumb + .container > .row,
.wrapper > .container:first-child > .row {
	max-width: 750px;
	margin-left: auto;
	margin-right: auto;
}
.breadcrumb + .container {
	padding-bottom: 72px;
}
/* Nieuws (page-4): het blogs-overzicht krijgt de volle containerbreedte */
.page-4 .breadcrumb,
.page-4 .breadcrumb + .container > .row { max-width: 1170px; }
/* ===== EINDE CUSTOM-BLOK ===== */

/* ===== CUSTOM-BLOK: tekst en foto naast elkaar, blok 8 en 9 (26-09-2026) ===== */
.container-fluid.lr { overflow: clip; }
.container-fluid.lr > .row.wrap:has(.halfway) {
	max-width: 1200px;
	margin: 0 auto;
	padding: 56px 25px 72px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}
.container-fluid.lr .halfway { padding: 0 20px; }
@media (max-width: 767px) {
	.container-fluid.lr > .row.wrap:has(.halfway) { padding: 32px 0 48px; }
	.container-fluid.lr .halfway { padding: 0; }
	.container-fluid.lr .right .halfway { padding-top: 40px; }
}
/* ===== EINDE CUSTOM-BLOK ===== */

/* ===== CUSTOM-BLOK: mistvlak onderaan, blok 6 (26-09-2026) ===== */
.lr + .container {
	position: relative;
	margin-top: var(--golf-hoogte);
	margin-bottom: var(--golf-hoogte);
	padding-top: 40px;
	padding-bottom: 48px;
	background: var(--kleur-mist);
	box-shadow: 0 0 0 100vmax var(--kleur-mist);
	clip-path: inset(calc(var(--golf-hoogte) * -1) -100vmax);
}
.lr + .container::before,
.lr + .container::after {
	content: "";
	display: block; /* idem clearfix */
	clear: none;
	position: absolute;
	left: 50%;
	width: 100vw;
	height: var(--golf-hoogte);
	transform: translateX(-50%);
	background: var(--kleur-achtergrond);
	pointer-events: none;
}
.lr + .container::before {
	top: calc(var(--golf-hoogte) * -1);
	-webkit-mask: var(--golf-2) center / 100% 100% no-repeat;
	mask: var(--golf-2) center / 100% 100% no-repeat;
	transform: translateX(-50%) scaleY(-1);
}
.lr + .container::after {
	bottom: calc(var(--golf-hoogte) * -1);
	-webkit-mask: var(--golf-3) center / 100% 100% no-repeat;
	mask: var(--golf-3) center / 100% 100% no-repeat;
}
.lr + .container .section { max-width: 900px; margin: 0 auto; }
/* ===== EINDE CUSTOM-BLOK ===== */

/* ===== CUSTOM-BLOK: nieuwskaarten, bovenop blogs/frontend.css (26-09-2026) ===== */
/* Geldt voor het blogs-overzicht (Nieuws) en voor oneforall_anyitems (Home).
   blogs/frontend.css laadt na custom.css, dus hier steeds .wrapper ervoor. */
.wrapper .vak {
	padding: 0 0 92px; /* ruimte voor de knop, die blogs/frontend.css absoluut onderaan zet */
	margin: 0;
	border: 0;
	border-radius: 26px;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	box-shadow: 0 18px 40px -30px rgba(46,59,44,.45);
	transition: transform .3s ease;
}
.wrapper .vak:hover { transform: translateY(-4px); }
.wrapper .vak .thumb { order: -1; margin: 0; }
.wrapper .vak .mod_blogs_main_thumb_f { height: 240px !important; display: block; }
.wrapper .vak h3 { margin: 20px 24px 12px; font-size: 21px; }
.wrapper .vak h3 a { color: var(--kleur-display); text-decoration: none; }
.wrapper .vak h3 a:hover { color: var(--kleur-groen); }
.wrapper .vak small {
	display: block;
	float: none;
	align-self: flex-start;
	margin: 0 24px 16px;
	padding: 6px 14px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--kleur-baksteen);
	background: var(--kleur-baksteen-vlak);
	border-radius: 999px;
}
.wrapper .vak .tekst { padding: 0 24px 20px; font-size: 15.5px; line-height: 1.55; }
.wrapper .vak .tekst p { margin: 0 0 .4em; }
.wrapper .vak a.knop1 {
	right: 24px;
	bottom: 24px;
	margin: 0;
	padding: 11px 24px;
	border-radius: 999px;
	background: var(--kleur-groen);
	color: #fff;
	font-weight: 700;
	font-size: 15px;
	text-decoration: none;
	transition: background .25s ease;
}
.wrapper .vak a.knop1:hover { background: var(--kleur-display); color: #fff; }
@media (prefers-reduced-motion: reduce) { .wrapper .vak, .wrapper .vak a.knop1 { transition: none; } }
/* ===== EINDE CUSTOM-BLOK ===== */

/* ===== CUSTOM-BLOK: hero mobiel en sponsoren (27-09-2026) ===== */
/* minihero zet de hoogte (380px) inline; op mobiel lager, daarom hier !important (akkoord John 27-09) */
@media (max-width: 767px) {
	.m_minihero .minihero { height: 220px !important; }
}
.sponsoren {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 16px;
}
.sponsoren img {
	width: auto;
	max-width: 44%;
	height: 64px !important; /* wint van img height:auto!important in de basis */
	object-fit: contain;
	background: #fff;
	padding: 12px 22px;
	border-radius: 999px;
	box-shadow: 0 10px 26px -20px rgba(46,59,44,.5);
	box-sizing: content-box;
}
/* ===== EINDE CUSTOM-BLOK ===== */

/* ===== CUSTOM-BLOK: contactformulier, bovenop miniform (27-09-2026) ===== */
.wrapper .m_miniform input[type="text"],
.wrapper .m_miniform input[type="email"],
.wrapper .m_miniform input[type="tel"],
.wrapper .m_miniform textarea {
	border: 1px solid var(--kleur-lijn);
	border-radius: 14px;
	background: #fff;
	padding: 10px 14px;
	font-family: var(--tekst);
	font-size: 16px;
	color: var(--kleur-tekst);
}
.wrapper .m_miniform input:focus,
.wrapper .m_miniform textarea:focus {
	border-color: var(--kleur-salie);
	outline: 2px solid var(--kleur-mist) !important;
}
.wrapper .m_miniform button.submit {
	display: inline-block;
	width: auto;
	margin-top: 8px;
	padding: 12px 30px;
	border: 0;
	border-radius: 999px;
	background: var(--kleur-groen);
	color: #fff;
	font-family: var(--tekst);
	font-weight: 700;
	font-size: 16px;
	box-shadow: 0 10px 22px -14px rgba(95,127,69,.9);
	transition: background .25s ease;
}
.wrapper .m_miniform button.submit:hover { background: var(--kleur-display); }
/* ===== EINDE CUSTOM-BLOK ===== */

/* ===== CUSTOM-BLOK: footer Den Ham (26-09-2026) ===== */
footer {
	position: relative;
	margin-top: var(--golf-hoogte);
	padding: 24px 15px;
	height: auto;
	background: var(--kleur-footer);
	color: #D5DECB;
	font-size: 16px;
}
footer::before {
	content: "";
	position: absolute;
	left: 0; right: 0;
	top: calc(var(--golf-hoogte) * -1 + 1px);
	height: var(--golf-hoogte);
	background: var(--kleur-footer);
	-webkit-mask: var(--golf-2) center / 100% 100% no-repeat;
	mask: var(--golf-2) center / 100% 100% no-repeat;
}
footer a { color: #fff; }
footer a:hover { color: var(--kleur-salie); }
footer .credit {
	max-width: 1170px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 8px;
	font-size: 14px;
	color: #A8B59C;
	text-align: left;
}
footer .credit hr { display: none; }
#return-to-top {
	background: var(--kleur-groen);
	border-radius: 999px 0 0 999px;
}
/* ===== EINDE CUSTOM-BLOK ===== */

/* ===== CUSTOM-BLOK: startpagina Den Ham, page-3 (26-09-2026) ===== */
.page-3 .breadcrumb,
.page-3 .page-header { display: none; }
.page-3 .breadcrumb + .container,
.page-3 .wrapper > .container:first-child {
	padding-top: 16px;
	padding-bottom: 8px;
}
.page-3 .breadcrumb + .container > .row {
	max-width: 820px;
	text-align: center;
}
.page-3 #Sec3 h1 { margin: 0 0 12px; }
.page-3 #Sec3 p { font-size: 20px; color: var(--kleur-gedempt); }
/* ===== EINDE CUSTOM-BLOK ===== */

/* ===== CUSTOM-BLOK: youtube-droplet [[youtube?v=...]] (28-09-2026) ===== */
/* Standaard-css van de droplet (John), padding-top op 0. De droplet zet height:360px inline op de iframe;
   met !important volgt de iframe de hoogte van het vak, anders valt hij op mobiel weg. */
.vid {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 0; /* was 30px: gaf zwarte balken boven en onder de video */
    height: 0;
    overflow: hidden;
}
.vid iframe,
.vid object,
.vid embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100% !important;
}
/* titel onder een video (div.video) dicht tegen de video aan */
.video + h3 { margin: 10px 0 28px; }
/* ===== EINDE CUSTOM-BLOK ===== */

/* ===== CUSTOM-BLOK: footerblokken uit btcolumns (28-09-2026) ===== */
/* Class footerkolom staat bij elke kolom onder "Toegevoegde classes" (pagina Overig). */
.footerkolom { padding-top: 12px; }
.footerkolom .btcolumn-title {
	text-align: left;
	background: none;
	padding: 0 0 10px;
	font-family: 'Fraunces', Georgia, serif;
	font-weight: 500;
	font-size: 21px;
	color: #fff;
}
.footerkolom .btcolumn-content { padding: 0 0 18px; font-size: 15px; line-height: 1.6; }
.footerkolom ul { list-style: none; margin: 0; padding: 0; }
.footerkolom p { margin: 0 0 .6em; }
/* ===== EINDE CUSTOM-BLOK ===== */

/* ===== CUSTOM-BLOK: Den Ham, agendakaarten met datumvak (28-09-2026) ===== */
/* Verhuisd uit concert/frontend.css (28-09-2026): frontend-bestanden blijven origineel.
   .wrapper ervoor omdat de module-css na custom.css komt.
   Hoort bij de Loop in de module-instellingen (agenda-kaart) en de
   extra variabelen [DAY] [MONTH] [WEEKDAY] uit view.php. Kleuren komen uit custom.css. */
.wrapper div#concert-calendar { width: 100%; }
.wrapper div#concert-calendar .header_data h2 { margin: 0 0 18px; }
.wrapper div#concert-calendar .concertborder { margin-bottom: 30px; }
.wrapper div#concert-calendar .concertheading { display: none; }
.wrapper div#concert-calendar .concert {
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 24px;
	color: var(--kleur-gedempt, #7A8475);
}
.wrapper div#concert-calendar .agenda-kaart {
	display: flex;
	align-items: flex-start;
	gap: 20px;
	padding: 20px;
	background: #fff;
	border-radius: 26px;
	box-shadow: 0 18px 40px -30px rgba(46,59,44,.45);
	transition: transform .3s ease;
	color: var(--kleur-tekst, #4A5347);
}
.wrapper div#concert-calendar .agenda-kaart:hover { transform: translateY(-4px); }
.wrapper div#concert-calendar .agenda-datum {
	flex: none;
	width: 84px;
	display: grid;
	text-align: center;
	padding: 10px 6px 12px;
	background: var(--kleur-mist, #EEF2EA);
	border-radius: 20px;
}
.wrapper div#concert-calendar .agenda-datum .dag {
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--kleur-baksteen, #A8604A);
}
.wrapper div#concert-calendar .agenda-datum .nr {
	font-family: 'Fraunces', Georgia, serif;
	font-variation-settings: "SOFT" 100;
	font-weight: 500;
	font-size: 40px;
	line-height: 1;
	color: var(--kleur-display, #2E3B2C);
}
.wrapper div#concert-calendar .agenda-datum .mnd {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--kleur-gedempt, #7A8475);
}
.wrapper div#concert-calendar .agenda-in { flex: 1; min-width: 0; }
.wrapper div#concert-calendar .agenda-in h3 { margin: 4px 0 8px; font-size: 21px; }
.wrapper div#concert-calendar .agenda-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 16px;
	margin-bottom: 8px;
	font-size: 14.5px;
	font-weight: 600;
	color: var(--kleur-groen, #5F7F45);
}
.wrapper div#concert-calendar .agenda-meta span:empty { display: none; }
.wrapper div#concert-calendar .agenda-tekst { font-size: 15.5px; line-height: 1.55; }
.wrapper div#concert-calendar .agenda-tekst p { margin: 0 0 .4em; }
.wrapper div#concert-calendar .agenda-tekst p:last-child { margin-bottom: 0; }
@media (max-width: 480px) {
	.wrapper div#concert-calendar .concert { grid-template-columns: 1fr; }
	.wrapper div#concert-calendar .agenda-kaart { gap: 14px; padding: 16px; }
	.wrapper div#concert-calendar .agenda-datum { width: 70px; border-radius: 16px; }
	.wrapper div#concert-calendar .agenda-datum .nr { font-size: 32px; }
	.wrapper div#concert-calendar .agenda-in h3 { font-size: 19px; }
}
@media (prefers-reduced-motion: reduce) { .wrapper div#concert-calendar .agenda-kaart { transition: none; } }
/* Geweest: tweede blok (vorige agendapunten). Kop van de module met archieflink
   verborgen, eigen kop ervoor; kaarten lichter. */
.wrapper div#concert-calendar .concertborder + .concertborder .concertheading {
	display: block;
	font-size: 0;
	line-height: 0;
	padding: 0;
	margin: 0 0 18px;
	background: none;
	border: 0;
}
.wrapper div#concert-calendar .concertborder + .concertborder .concertheading::before {
	content: "Geweest";
	display: block;
	font-family: 'Fraunces', Georgia, serif;
	font-size: 24px;
	line-height: 1.3;
	font-weight: 500;
	color: var(--kleur-display, #2E3B2C);
}
.wrapper div#concert-calendar .concertborder + .concertborder .agenda-kaart { opacity: .62; }
.wrapper div#concert-calendar .concertborder + .concertborder .agenda-datum .dag { color: var(--kleur-gedempt, #7A8475); }
.wrapper div#concert-calendar .agenda-datum .jaar {
	margin-top: 2px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .08em;
	color: var(--kleur-gedempt, #7A8475);
}
/* ===== EINDE CUSTOM-BLOK ===== */

/* ===== CUSTOM-BLOK: Den Ham, ondernemers onder Activiteiten (28-09-2026) ===== */
/* Hoort bij de Loop van blogs-sectie 35 (class bedrijf). Lege velden worden verborgen.
   Verhuisd uit blogs/frontend.css (28-09-2026): frontend-bestanden blijven origineel. */
.bedrijven .coll { margin-bottom: 24px; }
.bedrijven .bedrijf {
	height: 100%;
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 22px 24px;
	background: #fff;
	border-radius: 26px;
	box-shadow: 0 18px 40px -30px rgba(46,59,44,.45);
}
.bedrijven .bedrijf .logo:empty,
.bedrijven .bedrijf .omschrijving:empty,
.bedrijven .bedrijf .contact li:empty { display: none; }
.bedrijven .bedrijf .logo img { max-height: 70px; width: auto !important; }
.bedrijven .bedrijf h3 { margin: 0; font-size: 20px; }
.bedrijven .bedrijf .contact { list-style: none; margin: 0; padding: 0; font-size: 15px; }
.bedrijven .bedrijf .contact li { position: relative; padding-left: 26px; margin: 4px 0; overflow-wrap: anywhere; }
.bedrijven .bedrijf .contact li::before {
	position: absolute;
	left: 0;
	top: 1px;
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	color: var(--kleur-groen, #5F7F45);
}
.bedrijven .bedrijf .contact .adres::before { content: "\f3c5"; }
.bedrijven .bedrijf .contact .tel::before { content: "\f095"; }
.bedrijven .bedrijf .contact .mail::before { content: "\f0e0"; }
.bedrijven .bedrijf .contact .web::before { content: "\f0ac"; }
/* ===== EINDE CUSTOM-BLOK ===== */