.gridcontainer {
    display: grid;
    grid-template-columns: auto;
    grid-template-rows: auto;
    grid-template-areas:
    "header"
    "main"
    "footer";

    grid-gap: 5px;
}

.gheader {
    grid-area: header;
}

.gmain {
    grid-area: main;
}

.gfooter {
    grid-area: footer;
}

.panel {

    border-radius: 5px;
    border: var(--Brunswick_Green) 1px;
    padding: 10px;
}

h1 {
    font-size: 4em;
    text-align: center;
}

h2 {
    font-size: 3em;
    text-align: center;
}

h3 {
    font-size: 2em;
    text-align: center;
}

body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: calc(100vh - 50px);
    background-image: url('Home_Background.jpg'); /* Vervang met de naam van je afbeelding */
    background-size: cover; /* Zorgt dat de foto de hele achtergrond bedekt */
    background-position: center; /* Centreert de foto */
    background-repeat: no-repeat; /* Zorgt dat de foto niet herhaalt */
}

.content {
    text-align: center;
    color: var(--Timberwolf);
    padding-top: 0px; /* Voegt ruimte toe bovenaan */
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7); /* Maakt de tekst leesbaarder */
}

.content_footer {
    text-align: center;
    color: var(--Timberwolf);
    padding-top: 10px; /* Voegt ruimte toe bovenaan */
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7); /* Maakt de tekst leesbaarder */
}