footer {
    background-color: white;
    /* Make the footer background white */

    padding: 10px 0 4px 0;
    /* Add space inside the footer (top, right, bottom, left) */

    text-align: center;
    /* Center all text and links in the footer */

    width: 100%;
    /* Make the footer stretch across the whole page */
}

footer a {
    color: black;
    /* Make the link text black */

    display: inline-block;
    /* Allow padding while keeping links on the same line */

    padding: 8px;
    /* Add space around each link */

    text-decoration: none;
    /* I set the colour of the text to black and text-decoration: none; removes the hyperlink underline */
}

footer a:hover,
footer a:focus {
    background-color: black;
    /* Change the background to black when the link is selected */

    color: white;
    /* Change the text colour to white */

    outline: none;
    /* Remove the default focus outline */

    /* I invert the colours when interacting with a link using the mouse */
}

footer img {
    height: 22px;
    /* Make all footer images 22 pixels tall */

    margin-left: 3px;
    /* Add a small gap to the left of each image */

    vertical-align: text-bottom;
    /* Line the image up neatly with the surrounding text */
}