header
{
    /* zorgt ervoor dat de witte rand weg is */
    margin-top: -19px;
    margin-left: -8px;
    margin-right: -8px;
}

.navbar
{
    /* zorgt ervoor dat alles naast elkaar staat */
    display: flex;
    /* haalt de list cijfers weg */
    list-style-type: none;
}

#waardenburg-wapen
{
    /* geeft de achtergrond van het logo een kleur */
    background-color: #99daff;
    /* zorgt ervoor dat het goed gepositioneerd is */
    margin-left: -42px;
    margin-bottom: -5px;
    /* zorgt ervoor dat het dezelfde hoogte heeft als de rest van de header */
    height: 152px;
}

.navlinks
{
    /* zorgt ervoor dat het volgende stukje code werkt */
    display: flex;
    /* zet de tekst horizontaal in het midden */
    justify-content: center;
    /* zet de tekst verticaal in het midden */
    align-items: center;
    /* maakt de tekstkleur zwart */
    color: black;
    /* haalt het lijntje onder de tekst weg */
    text-decoration: none;
    /* veranderd de hoogte */
    height: 150px;
    /* veranderd de breedte */
    width: 354px;
    /* zet er een border omheen*/
    border-style: solid;
    /* zorgt ervoor dat de border 1 pixel breed is behalve aan de rechterkant */
    border-left-width: 1px;
    border-right-width: 0px;
    border-bottom-width: 1px;
    border-top-width: 1px;
}

.navlinks:hover
{
    /* zorgt ervoor dat de tekst groter wordt als je er overheen gaat */
    font-size: x-large;
}

#home
{
    /* maakt de achtergrond van de home knop rood */
    background-color: #cc0000;
}

#lunch
{
    /* maakt de achtergrond van de lunch knop oranje */
    background-color: #cc4e00;
}

#tourists
{
    /* maakt de achtergrond van de toerists knop geel */
    background-color: #cca300;
}

#sport
{
    /* maakt de achtergrond van de sport knop groen */
    background-color: #74cc00;
}

#ict
{
    /* maakt de achtergrond van de ICT knop blauw */
    background-color: #0097b2;
}

h1
{
    /* zet de tekst in het midden */
    display: flex;
    justify-content: center;
    /* maakt de tekst groter */
    font-size: 70px;
}

body
{
    /* geeft de body een achtergrondkleur */
    background-color: #c2e9ff;
    /* maakt de tekst groter */
    font-size: larger;
}

.pagina
{
    /* zet de zijbalk en de hoodtekst naast elkaar */
    display: flex;
    flex-direction: row;
}

.hoofdtekst
{
    /* zet de hoofdtekst onder elkaar */
    display: flex;
    flex-direction: column;
    /* geeft de tekst een breedte */
    width: 1000px;
    /* zet de tekst in het midden */
    margin-left: 300px;
}

.zijbalk
{
    /* geeft de zijbalk een kleur */
    background-color: #99daff;
    /* geeft de zijbalk een breedte */
    width: 300px;
    /* haalt de lege ruimtes aan de bovenkant en de linkerkant weg */
    margin-left: -8px;
    margin-top: -19px;
    /* zet de tekst een beetje naar beneden */
    padding-top: 10px;
    /* zorgt ervoor dat de zijbalk de hele linkerkant opneemt */
    padding-bottom: 718px;
    /* als de zijbalk aan de top komt, blijft die daar */
    position: sticky;
    top: 0;
}

.zijlinks
{
    /* zet de links onder elkaar */
    display: flex;
    flex-direction: column;
    /* haalt de lijntjes onder de links weg */
    text-decoration: none;
    /* zet ruimte tussen de tekst */
    margin: 10px;
}

footer
{
    /* geeft de footer een achtergrondkleur */
    background-color: #004e7a;
    /* zorgt ervoor dat er geen lege ruinmtes om de footer heen zitten */
    margin-top: -19px;
    margin-bottom: -19px;
    margin-left: -8px;
    margin-right: -8px;
    /* zet meer ruimte boven de tekst */
    padding-top: 10px;
    /* zet meer ruimte onder de tekst */
    padding-bottom: 40px;
    /* zet de tekst in een rij */
    display: flex;
    flex-direction: row;
    /* zet ruimte tussen de containers */
    justify-content: space-around;
}

.footer-container
{
    /* zet de tekst onder elkaar */
    flex-direction: column;
}

.footer-titels
{
    /* geeft de tekst een andere kleur */
    color: #84d2ff;
}

.footer-tekst
{
    /* geeft de tekst een andere kleur */
    color: #cbecff;
}

.footer-images
{
    /* zet de images op een rij */
    display: flex;
    align-content: center;
    /* zet de images naar beneden */
    margin-top: 30px;
}

#facebook
{
    /* geeft de images de juiste grootte */
    width: 68px;
    height: 68px;
    /* maakt de hoeken rond */
    border-radius: 20px;
    /* zet de images op de juiste hoogte */
    padding: 5px;
}

#twitter
{
    /* geeft de images de juiste grootte */
    width: 68px;
    height: 68px;
    /* maakt de hoeken rond */
    border-radius: 20px;
    /* zet de images op de juiste hoogte */
    padding: 5px;
}

#wikipedia
{
    /* geeft de images de juiste grootte */
    width: 60px;
    height: 60px;
    /* maakt de hoeken rond */
    border-radius: 20px;
    /* zet de images op de juiste hoogte */
    padding: 5px;
    margin-top: 5px;
}