﻿/* Basisinstellingen en achtergrondkleur */
body {
    font-family: Arial, sans-serif;
    background-color: #EFEDE9; /* dezelfde achtergrondkleur als het inline voorbeeld */
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100vh;
    color: white; /* tekstkleur wit zoals in je originele ontwerp */
    position: relative; /* nodig voor absolute positionering van knop en footer */
}

/* Container voor logo en titel */
.branding {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 20px;
}

.logo {
    max-width: 300px;
    margin-bottom: 30px;
}

.branding h1 {
    margin: 0;
    font-size: 2.5em;
}

/* Hoofdgedeelte voor de LinkedIn‑link */
.main-content {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 20px;
}

/* Plaats de LinkedIn-knop links onderin en verklein het icoon */
.linkedin-link {
    position: absolute;
    bottom: 10px;
    left: 10px;
}

    .linkedin-link img {
        width: 24px;
        height: 24px;
        transition: transform 0.2s ease;
    }

        .linkedin-link img:hover {
            transform: scale(1.1);
        }

/* Footer rechts onderin */
footer {
    position: absolute;
    bottom: 10px;
    right: 10px;
}

    footer p {
        font-size: 0.7em;
        margin: 0;
        /* max-width kun je weglaten of aanpassen naar wens */
    }
