body {
    font-family: Arial, sans-serif;
    background-color: #0a2c54; /* Donkerblauwe achtergrond */
    color: #ffffff; /* Witte tekst */
    width: 100%; /* Breedte aanpassen voor responsiviteit */
    height: auto; /* Hoogte aanpassen voor responsiviteit */
    margin: 0 auto; /* Center de inhoud */
    padding: 20px; /* Voeg padding toe voor mobiele apparaten */
    box-sizing: border-box; /* Inclusief padding en border in de breedte en hoogte */
}

.container {
    background: #0a2c54; /*body kleur herhaalt */
    padding: 15px;
    margin: 0 auto; /* Center de container */
    max-width: 1200px; /* Maximale breedte voor grotere schermen */
}

h1, h2, h3 {
    color: #ffffff;
    margin-bottom: 5px;
}

p, li {
    color: #ffffff;
    margin-bottom: 2px;
}

ul {
    list-style: none; /* Verwijder de standaard bullet */
    padding-left: 0; /* Verwijder de standaard padding */
}

ul li::before {
    content: ">"; /* Voeg de gewenste bullet toe */
    color: #f20b0b; /* Kleur van de bullet */
    padding-right: 8px; /* Ruimte tussen bullet en tekst */
}

.waarschuwing {
    font-weight: bold;
    color: #ffcc00; /* Geel voor waarschuwingen */
}

h1 {
    border-bottom: 2px solid #ffffff;
    padding-bottom: 5px;
    margin-top: 20px;
}

/* Media query voor mobiele apparaten */
@media (max-width: 768px) {
    body {
        width: 100%; /* Breedte aanpassen voor mobiele apparaten */
        height: auto; /* Hoogte aanpassen voor mobiele apparaten */
        margin: 0; /* Verwijder marge voor mobiele apparaten */
        padding: 10px; /* Voeg padding toe voor mobiele apparaten */
    }

    .container {
        padding: 10px; /* Voeg padding toe voor mobiele apparaten */
    }

    h1, h2, h3 {
        font-size: 1.5em; /* Pas de lettergrootte aan voor mobiele apparaten */
    }

    p, li {
        font-size: 1em; /* Pas de lettergrootte aan voor mobiele apparaten */
    }
}