:root {
    --width-max: 800px;
    --height-header: 3rem;
}

header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-width: 100%;
    top: 0;
    background-color: var(--color-fichkes);
    border-bottom: 1px solid var(--color-text);
    padding: 0 var(--gap-small);
}

header>div {
    display: inline-flex;
    align-items: center;
    width: auto;
}

header>div>a {
    padding: 0 var(--gap-small);
}

a {
    font-family: var(--font2);
}

a.actief {
    text-decoration: none;
    pointer-events: none;
}

main {
    max-width: 100%;
    height: calc(100svh - var(--height-header));
    overflow-y: auto;
}

form {
    width: var(--width-max);
    margin: 0 auto;
}

table {
    width: 100%;
}

table thead {
    text-align: left;
}

table tbody  td {
    border-bottom: 1px solid var(--color-text)
}

tbody tr:hover {
    background-color: var(--color-green);
}

section {
    max-width: 100%;
}

section.inloggen {
    height: 100%;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

section.text {
    padding: var(--gap-small);
}

ul {
    list-style-position: inside;
}

.inloggen img {
    max-width: 600px;
}

i {
    font-size: 0.9rem;
}