main {
    margin-top: 4rem; /* abstand für header-height */
}

header {
    display: flex;
    flex-direction: row;
    align-items: center;
    height: 4rem;
    width: 100%;
    position: fixed;
    top: 0;
    /*background-color: rgb(44, 22, 1);*/
    background-color: rgb(44, 15, 1);
    z-index: 50;
}

.header-logo-container {
    width: 100%;
}

.header-logo-container a {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    text-align: left;
}

.header-logo {
    width: 4rem;
    height: auto;
}

/* Tablet (ab 601px) */
@media (min-width: 601px) and (max-width: 1024px) {
    main {
        margin-top: 5rem; /* abstand für header-height */
    }

    header {
        height: 5rem;
    }

    .header-logo {
        width: 5rem;
        height: auto;
    }
}

/* Desktop (ab 1025px) */
@media (min-width: 1025px) {
    header {
        height: 5rem;
    }

    .header-logo-container {
        margin-left: 20%;
    }

    .header-logo {
        width: 5rem;
        height: auto;
    }
}