body {height: 100vh; margin: 0px;}
#container {
    display: flex; flex-flow: column nowrap;
    height: 100%;
}

#headline {
    flex: 0 0 min(25vw, 150px);
    background-color: cornflowerblue; color: black;
    display: flex; flex-flow: row nowrap;
    align-items: center;
}
#headline>img {height: 135px; margin: 10px;}
#headline>div {font-size: min(25vw, 150px);}
#gallery {
    flex: 1 1 auto; overflow: hidden; display: flex;
    flex-flow: row nowrap;
}
#nav {
    flex: 0 0 auto; background-color: white;
    align-items: center; display: flex;
    flex-flow: column nowrap; gap: 5px; overflow: auto;
}
#nav>a>img {max-width: 120px; max-height: 120px;}
#picture {flex: 1 1 auto; background-color: cadetblue;}
#picture>img {max-height: 100%; max-width: 100%;}
@media screen and (max-width: 800px) {
    #gallery {flex-flow: column nowrap;}
    #nav {flex-flow: row nowrap;}
    #picture {overflow: hidden;}
}