.container {
    display: grid;
    max-width: 860px;
    grid-template-columns: 1fr 1fr 1fr;
    margin: 0 auto;
    grid-template-areas: "main main main" "associacoes associacoes associacoes" "jogo jogo jogo" "fundo fundo fundo" "footer footer footer";
}

@media (max-width: 770px) {
    .container {
        grid-template-columns: 1fr;
        grid-gap: 1rem;
    }
}

.fundo {
    width: 100%;
}

.logo {
    max-width: 17rem;
    width: 100%;
}

.main {
    grid-area: main;
}

.game {
    grid-area: jogo;
    z-index: 1;
    bottom: -5px;
}

.fundo {
    grid-area: fundo;
    z-index: 10;
}

.fundo img {
    width: inherit;
    margin: 0 auto;
    margin-top: -4rem;
}

iframe {
    width: 100%;
    min-height: 500px;
    max-height: 700px;
}