
/* 1. Change Background Color */
body {
    background-color: #d1d9e0 !important;
    font-family: Arial, sans-serif;
}

/* 2. Style the Main Heading */
h1 {
    text-align: center;
    color: #2c3e50;
    text-transform: uppercase;
}

/* 3. Add Border/Shadow to Images */
img {
    border: 3px solid #ffffff;
    border-radius: 10px;
    box-shadow: 5px 5px 10px rgba(0,0,0,0.2);
}

/* 4. Navigation Hover Effect */
.menuicon a:hover {
    background-color: #f1c40f;
    border-radius: 5px;
}

/* 5. Center the Menu Table */
.menu {
    background-color: #ffffff;
    padding: 10px;
    border-radius: 8px;
    margin-bottom: 20px;
}
/* 5. Navigation Table: Added a background color and padding to the menu bar */
.menu {
    background-color: #ffffff;
    padding: 15px;
    border-radius: 10px;
    border: 2px solid #545859 !important;
}

/* --- RE-IMPLEMENTING YOUR ORIGINAL FUNCTIONAL STYLES --- */

table {
    width: 65%;
    margin-left: auto;
    margin-right: auto;
    border-color: #545859;
    border-style: ridge;
    border-width: 10px;
}

.menuicon { width: 23%; text-align: center; }
.menupipe { width: 1%; text-align: center; }

th {
    color: white;
    background-color: #757775;
}

tr.stripe { background-color: #d8d8ce; }
td.bolder { font-weight: bold; }

caption {
    caption-side: bottom;
    font-style: italic;
}