html {
    /*border: 2px solid red;*/

    display: flex;
    /*flex-direction: column;*/
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    min-height: 100%;
    min-width: 100%;
}

body {
    /*border: 2px solid green;*/

    display: flex;
    flex-direction: column;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    flex-grow: 1;
    align-items: stretch;
}

.header {
    /*border: 2px solid black;*/

    display: flex;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;

    padding: 1vh 0 1vh 0;
    height: 8vh;
    /*background-color: rgb(220, 220, 220);*/
    background-color: rgb(204, 201, 192);

    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
}

.header > a {
    /*border: 2px solid black;*/

    margin: 0 0.8vh 0 0.8vh;
    height: 100%;
}

.header > a > img {
    object-fit: contain;
    width: 100%;
    height: 100%;
}

.menu {
    /*border: 2px solid black;*/
    flex-grow: 1;
}

body > .content {
    /*border: 2px solid red;*/

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: stretch;

    margin-top: 8vh;
    padding: 0 0 0 0;
    flex-grow: 1;
}

.footer {
    /*border: 2px solid black;*/

    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;

    /*font-size: 2vh;*/
    font-size: 1em;

    /*height: 50px;*/
    min-height: 8vh;
    padding: 1vh 0 1vh 0;
    /*background-color: rgb(220, 220, 220);*/
    background-color: rgb(204, 201, 192);
}

.footer > .break {
    /*border: 2px solid black;*/
    width: 100%;
}

.footer > p, .footer > a {
    /*border: 2px solid black;*/

    color: black;
    /*text-decoration: none;*/

    margin: 0 0.5vh 0 0.5vh;
    padding: 0;
}

.footer > .copyright {
    color: black;
    text-align: center;
}

.footer > .copyright > span {
    white-space: nowrap;
}