html,body
{
    width       : 100%;
    height      : 100%;
    min-height  : 100%;
}

body
{
    height             : 100%;
    margin             : 0em;
    padding            : 0em;
    word-break         : break-all;
    color              : var(--text-color);
    background-color   : var(--background-color);
    display            : grid;
    grid-template-rows : 5em 1fr 3em;
}

article
{
    padding : 1em;
}

footer
{
    padding          : 1em;

    text-align : center;
    display    : grid;
    grid-template-columns : 200px 1fr;
}

/* others -------------------------- */

h1
{
    font-size : xx-large;
    margin    : 0em;
    color     : var(--header-color);
}

h2
{
    font-size : x-large;
    margin    : 0em;
}

h3
{
    font-size : large;
    margin    : 0em;
}

ol
{
    margin-top    : 2em;
    margin-bottom : 2em;
}

ul
{
    margin-top    : 2em;
    margin-bottom : 2em;
}