body {
    margin: 0;
    font-family: Georgia, serif;
    background-size: cover;
    background-position: center;
    color: white;
}
.home-page {
    background-image: url("images/home-bg.jpg");
}

.zeus-page {
    background-image: url("images/zeus-throne.jpg");
}

.hera-page {
    background-image: url("images/hera-throne.jpg");
}
.apollo-page {
    background-image: url("images/apollo-throne.jpg");
}

.artemis-page {
    background-image: url("images/artemis-throne.jpg");
}

.hades-page {
    background-image: url("images/hades-throne.jpg");
}
.hestia-page {
    background-image: url("images/hestia-throne.jpg");
}

.hephaestus-page {
    background-image: url("images/hephaestus-throne.jpg");
}

.athena-page {
    background-image: url("images/athena-throne.jpg");
}
.poseidon-page {
    background-image: url("images/poseidon-throne.jpg");
}

.dionysus-page {
    background-image: url("images/dionysus-throne.jpg");
}

.hermes-page {
    background-image: url("images/hermes-throne.jpg");
}
.demeter-page {
    background-image: url("images/demeter-throne.jpg");
}

.aphrodite-page {
    background-image: url("images/aphrodite-throne.jpg");
}

.ares-page {
    background-image: url("images/ares-throne.jpg");
}
#header {
    text-align: center;
    padding: 2rem;
}
.god-card {
    background-color: rgba(0, 0, 0, 0.6);
    border: 2px solid gold;
    border-radius: 12px;
    padding: 1.5rem;
    margin: 1rem;
    text-align: center;
}
#origin, #first-victory, #last-victory {
    background-color: rgba(0, 0, 0, 0.6);
    padding: 1.5rem;
    margin: 1.5rem auto;
    max-width: 800px;
    border-radius: 12px;
}
#footer {
    text-align: center;
    padding: 2rem;
}

#footer a {
    color: gold;
    font-size: 1.2rem;
    text-decoration: none;
}
#god-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    padding: 2rem;
}