* {
    padding: 0%;
    margin: 0%;
    box-sizing: border-box;
}

body {
    background-color: cornflowerblue;
    display: flex;
    flex-direction: column;
    /* Stack elements vertically */
    align-items: center;
    /* Center elements horizontally */
    margin: 0;
    padding-top: 30px;
    /* Add space from the top of the page */
    height: 100vh
    /* Full viewport height */
}

/* Style the links and h1 at the same time */
a, h1 {
    color: antiquewhite;
    font-family: Arial, Helvetica, sans-serif;
    letter-spacing: 2px;
    word-spacing: 2px;
    text-shadow: 2px 2px 5px rgb(18, 52, 115);
}

/* Add space between the first link and h1 */
a:first-of-type {
    margin-top: 20px;
}
a {
    margin-bottom: 10px;
    /* Adds space between the links */
    display: inline-block;
    /* Allows the margin to work correctly */
}


/* It changes the color of the link when you hover on it */
a:hover {
    color: rgb(18, 52, 115);
}

/* This centers the image horizontally and vertically */
.image-container {
    display: flex;
    justify-content: center;
    /* Centers horizontally */
    align-items: center;
    /* Centers vertically */
    height: 100vh;
}

img {
    max-width: 100%;
    /* Ensures the image doesn't overflow */
    height: auto;
    /* Maintains aspect ratio */
    width: 600px;
}