.sideNavigation {
    width: 18%;
    min-width: 240px;              
    flex-shrink: 0;           
    background-color: rgba(255, 255, 255, 0.7);
    border-radius: 5px;
}

.navigationList {
    list-style: none;
    margin: 1rem;
    padding: 0rem;
}

.navigationListLink {
    color: #000;
    text-decoration: none;
}

.navigationListLink:hover {
    text-decoration: underline #fff;
}

.navigationPos {
   padding: 0.75rem 0.5rem 0.75rem 0.5rem;
   margin-bottom: 0.5rem;
   border-radius: 5px;
}

.navigationPos:hover {
    background-color: #4480b8;
    color: #fff;
}
/* max-width Muss immer gleich sein mit media-quarri in general.css für ".main"*/
@media (max-width: 1300px) {
    .navigationList {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        flex: 1; 
        justify-content:space-around
    }
    .sideNavigation {
        width: 100%;
    }
}
