/*
 * Minimal styling to center an image on the page.
 * Uses flexbox for robust centering.
 */

body {
    /* Remove default margin and padding from the body */
    margin: 0;
    padding: 0;

    /* Make the body take up the full height of the viewport */
    height: 100vh;

    /* Enable flexbox for easy centering */
    display: flex;

    /* Center content horizontally */
    justify-content: center;

    /* Center content vertically */
    align-items: center;
}

img {
    /* Ensure the image is responsive and doesn't overflow its container */
    max-width: 100%;

    /* Maintain the aspect ratio of the image */
    height: auto;

    /* Display as a block element to remove any extra space below it */
    display: block;
}