
.atswins-soccer-container {
    margin: 7px;
    padding: 20px;
    border-radius: 10px;
    background-color: var(--darkened-bg);
    box-shadow: 0px 1px 1px 1px var(--body-bg-hover);

    .atswins-soccer-games-container {
        display: grid;
        row-gap: 10px;
        column-gap: 10px;
        grid-template-columns: repeat(2, 1fr);
        background-color: var(--darkened-bg);

        .atswins-soccer-game {
            padding: 10px;
            border-radius: 10px;
            color: var(--body-fg);
            background-color: var(--body-bg);
            border: 1px solid var(--body-bg-hover);

            .atswins-soccer-game-teams {
                display: grid;
                grid-template-columns: 1fr;
                row-gap: 10px;
                font-weight: 600;
                color: var(--body-fg);
                font-size: 17px;
                margin-top: 10px;
                padding-bottom: 10px;
            }
        }

        .atswins-soccer-game:hover {
            cursor: pointer;
            background-color: var(--body-bg-hover);
        }
    }
    
    .atswins-soccer-game-odds {
        display: flex;
        flex-direction: column;
        row-gap: 10px;
        padding: 10px 0;
        border-top: 1px solid var(--border-color);
    }

    .faded {
        color: var(--body-quiet-color);
    }

    @media only screen and (max-width: 576px) {
        .atswins-soccer-games-container {
            grid-template-columns: repeat(1, 1fr);
        }
    }

    @media only screen and (max-width: 768px) {
        .atswins-soccer-container {
            padding: 10px;
        }
    }
}