*{ margin:0; padding:0; } /* === Achtergrondafbeelding voor pagina's met === */ /* Plaats dit in: assets/ccss/style.css (pas evt. het pad/naam van de afbeelding aan) */ html, body { height: 100%; } /* Kleine schermen (xs + sm): géén achtergrondafbeelding */ body.bg_cover { /* Fallback-kleur wanneer geen afbeelding wordt getoond */ background: none; background-color: white; /* #eee8e4; pas aan naar eigen huisstijl */ } /* Vanaf md (≥ 768px): wél achtergrondafbeelding */ @media (min-width: 768px) { body.bg_cover { background-image: url('/assets/img/background.jpg'); /* pas bestandsnaam aan indien nodig */ background-repeat: no-repeat; background-position: center center; background-size: cover; /* Optioneel (kan haperen op iOS): background-attachment: fixed; */ } } /* Optioneel: gebruikers met dataspaarstand -> nooit grote achtergrond laden */ @media (prefers-reduced-data: reduce) { body.bg_cover { background-image: none !important; } } #showcase{ background-image: url('../img/koffie.jpg'); /* let op enkele of dubbele directory */ background-size:cover; background-position: center; height: 100vh; display:flex; flex-direction:column; justify-content: top; align-items:center; } .chart-box { width: 100%; max-width: 200px; /* <= maak kleiner/groter naar wens */ height: 200px; /* <= vaste, compacte hoogte */ margin-inline: auto; /* centreren */ } .chart-box > canvas { width: 100% !important; height: 100% !important; }