body {
    font-family: 'Garamond', 'Times New Roman', Times, serif;
    margin: 0;
    padding: 0;
    background-color: #ffffff;
}

header {
    background-color: #ffffff;
    color: #333;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0.5rem 1.5rem;
}

.header-left {
    display: flex;
    flex-direction: column;
    align-items: center; /* Align items in the center */
}

header h1 {
    font-size: 2.5rem;
    margin: 0;
    color: #333;
}

header .bio p {
    font-size: 0.9rem;
    margin: 0;
    color: #333;
}

/* Center all images globally */
img {
    display: block;
    margin: 0 auto; /* Center all images by default */
}

/* Project Introduction Section */
.introduction {
    text-align: center; /* Center text and images within the section */
}

/* Limit text-only sections to 800px and increase margins */
.text-limited {
    max-width: 800px;
    margin: 60px auto; /* Increase top and bottom margin */
    text-align: left; /* Align text to the left */
    line-height: 1.6; /* Improve readability */
}

/* Vormen Images */
.Vormen {
    display: flex;                   /* Use flexbox to align items in a row */
    justify-content: center;         /* Center horizontally */
    align-items: center;             /* Center vertically */
    margin: 20px 0;                  /* Increased space above and below */
}

.Vormen img {
    width: 200px;                    /* Set a specific small width */
    height: auto;                    /* Maintain aspect ratio */
    margin: 0 5px;                   /* Space between images */
}

/* Contact Section */
.contact p, footer p {
    font-size: 0.8rem;
    align-items: center;
    margin: 30px 0; /* Add space above and below contact text */
}

footer {
    text-align: center;
    padding: 20px;
    color: #333;
}

/* Image Grid Styling */
.image-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);  /* 2 columns */
    grid-template-rows: repeat(2, 1fr);     /* 2 rows */
    gap: 10px;                              /* Spacing between images */
}

.image-grid img {
    max-width: 200px;
    width: 100%;      /* Make images fill their container */
    height: auto;     /* Maintain aspect ratio */
}

/* Adjust margin between sections */
section {
    margin: 40px 0;  /* Increased spacing between sections */
}

section.introduction + section {
    margin-top: 0;                   /* Remove top margin from adjacent sections */
}

/* Image Rows */
.imagerow {
    display: flex;   /* Ensure flexbox layout */
    justify-content: center;
    align-items: center;
    margin: 20px 0;  /* Increased space around image rows */
}

.imagerow img {
    width: 250px;
    height: 150px;
    margin: 10px;  /* Add spacing between images */
    border: 1px solid #ddd;
}

.imagerow1 {
    display: flex;   /* Ensure flexbox layout */
    justify-content: center;
    align-items: center;
    margin: 20px 0;  /* Increased space around image rows */
}

.imagerow1 img {
    width: 250px;
    margin: 10px;  /* Add spacing between images */
    border: 1px solid #ddd;
}