/* Achtergrondkleur van de volledige pagina */
body  { 
    background-color: beige;
} 

/* Opmaak van de header */
header  {
    background-color: white;	
    margin-bottom: 15px;
    text-align: center;
}

/* Opmaak van alle H1 titels */
H1   {
    text-align: center;
    margin: 0;			
}

/* Opmaak van het aside-element (zijbalk) */
aside {  
    background: white;
    color: saddlebrown;
    float: right;                 /* Plaatst aside rechts */
    text-align: center;
    width: 240px;                 /* Breedte van de zijbalk */
    padding: 20px;                /* Binnenruimte */
    border-radius: 10px;          /* Afgeronde hoeken */
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);  /* Schaduw-effect */
}

/* Element met id "kop" */
#kop  {  
    background: white;
    color: saddlebrown;
    text-align: center;          	       
}

/* Opmaak van de footer */
footer {  
    background: peru;
    color: black;
    clear: both;                  /* Komt onder zwevende elementen */
    text-align: center;
}

/* Navigatiebalk */
nav {
    background-color: peru;	      
    text-align: center;
}	

/* Links in de navigatie */
nav a {  
    text-decoration: none;
    color: white;
    background-color: saddlebrown;
    padding: 10px;
    display: inline-block;
    text-align: center;		    
}

/* Hover-effect voor navigatielinks */
nav a:hover {
    background-color: chocolate;
}

/* Afbeeldingen */
img{
    height: 150px;
    width: 150px;
    border: 1px solid #ddd;
    border-radius: 50%;      /* Maakt afbeelding rond */
    padding: 5px;
    float: left;             /* Laat tekst ernaast lopen */
    margin-right: 10px;      /* Ruimte rechts van afbeelding */
}

/* Hover-effect voor afbeeldingen */
img:hover {
    box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
}

/* Klasse voor titels */
.titel {
    text-align: center;
}

/* Container die inhoud centreert */
#container { 
    width: 70%;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}