/* navigatie balk */
.navbar {
    display: flex;
    align-items: center;
    height: var(--navbar-height, 60px); /* Standaardhoogte is 60px, maar kan worden aangepast */
    position: fixed;
    z-index: 100;
    right: 0;
    left: 0;
    top: 0;
}

/* globale parameters navbar */
.logo-container, .menu-container, .socialmedia-container {
    display: flex;
    min-height: 60px;
    align-items: center;
}

/* Navbar container Links */
.logo-container {
    /*flex: 0 0 20%;*/
    /* display: flex; */
    align-items: center;
    background-color: rgb(2, 48, 2);
    justify-content: flex-start;
    min-height: 60px;
    padding-left: 10px;
    width: var(--logo-container-width, 180px);
}

.logo {
    width: 50px; /* Aanpasbaar */
    height: 50px; /* Aanpasbaar */
}

/* Navbar container Midden */
.menu-container {
    flex: 1;
    /*width: 50%; /* Een helft van de totale lengte */
    justify-content: left; /* Menu items positie */
    background-color: rgb(68, 243, 68);
    min-height: 60px;
    padding-left: 50px;
}

.menu {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    font-weight: bold;
}

.menu li {
    margin-right: 20px;
}

.menu a {
    color: rgb(19, 18, 18);
    text-decoration: none;
    transition: color 0.3s ease;
}

.menu a:hover {
    color: yellow; /* Kleur veranderen bij hover */
}

/* Navbar container Rechts */


/* Tekst blokken */
.logotext-content {
    display: flex;
    flex-direction: column;
    color: white;
    padding: 10px;
}

.logotext-line {
    margin: 0;
    padding: 0;
    font-size: 16px; /* Aanpasbaar */
}