:root {
    /* gold */
    --hover-bg: #ff6600;
    /* grey */
    --body-bg: #f0f4f8;
    /* very dark grey */
    --body-txt-colour: #222;
    /* slate grey */
    --menu-color-slate-grey:#2c3e50;
    /* brown */
    --menu-color-brown: brown;
    /* red */
    --menu-color-red: red;
    /* MENU BACKGROUND COLOUR */
    --menu-button-background: var(--menu-color-brown);
    /* email user */
    --email-user: "phi_mo";
    /* email site */
    --email-site: "icloud.com";
}

html {
    scroll-behavior: smooth;
}


body {
    margin-top: 0;
    margin-left: 10%;
    margin-right: 10%;
    font-family: Arial, Helvetica, sans-serif;
    text-align: left;
    background-color: var(--body-bg);
    /*background-image: url("/images/garlic.jpg");*/
    color: var(--body-txt-colour);
    overflow-y: auto;
    overflow-x: auto;
}

.site-title {
    font-size: 3em;
    font-weight: normal;
    margin: 0 0 0.5rem 0;
    /* Just a little bottom space */
}

/* CSS FOR UNION FLAG IN HEADER */
.header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.union-flag {
    height: 2em;
    width: auto;
    margin-left: 1em;
}