html { font-size: min(1.2vw, 10px);}

body { margin: 0px; background-color: bisque;}

a { text-decoration: none; color:midnightblue; }

* { box-sizing: border-box; color:darkviolet}

#container { 
    height: 100vh;
    overflow: auto;
    font-size: 2.5rem;
    background-color:lightcoral;
    display: grid;
    gap: 0.4rem 0.4rem;
    grid-template-columns: 1fr;
    grid-template-rows: 12rem 6rem 1fr;
    grid-template-areas:
        "header"
        "menu"
        "main";
}

#header { grid-area: header; 
    display: grid; justify-content: center; align-content: center;
    font-size: 10rem; 
    background-color: lightpink;
}

#main { grid-area: main; background-color:azure; 
    height: 100%;  overflow: auto; padding: 3rem;}

#note { font-size: small; text-align: right;}
#main.wings { max-width: 1200px; margin: auto;}
#main>div { padding: 1rem; }