/* ID that centers the validation text */
#validation {
    text-align: center;
    font-weight: bold;
}

/* centers content within the header */
header {
    text-align: center;
}

/* Sets the image for the background and sets the main font color to black */
body {
    background: url("images/leaves.jpg") no-repeat center center;
    background-size: cover;
    color: black;
}

/* Sets the contrast color for the table as well as it's spacing on the page */
table {
    background-color: #f0efe7;
    color: black;
    margin: auto;
    width: 90%;
    border-spacing: 0;
}

/* Aligns the text inside all <td> to center, sets the font size to 20px, and makes the table gridlines grey */
td {
    text-align: center;
    border: 1px solid grey;
    font-size: 20px;
}

/* Formats the hyperlinks to adjust the color for both standard and visited links as well as their font size */
a:link {
    color: darkred;
    font-size: 20px;
}

a:visited {
    color: #b5338a;
}

div {
    border: 1px solid grey ;
    border-collapse: collapse;
    text-align: center;
}

/* Display */
.grid-display {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 3fr));
    margin: 0% 8% 0% 8%;
    background-color: #f0efe7;
    text-align: center;    
    font-size: 20px;
}