@media only screen and (min-width: 1024px) {
    .cards {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(50px, 4fr));
        align-items: center;
        justify-content: center;
        flex-direction: row;
        column-gap: 40px;
        padding: 100px 0;
        max-width: 1280px;
        width: 95%;
    }
    
    .card {
        row-gap: 20px;
        width: auto;
        height: 300px;
    }
}