.grid.grid-4 {
    display: grid;
    grid-template-columns: repeat( 4, 1fr );
    column-gap: 20px;
    row-gap: 20px;
}

.grid.grid-3 {
    display: grid;
    grid-template-columns: repeat( 3, 1fr );
    column-gap: 20px;
    row-gap: 20px;
}

.grid.grid-2 {
    display: grid;
    grid-template-columns: repeat( 2, 1fr );
    column-gap: 20px;
    row-gap: 20px;
}

img {
    object-fit: cover;
}

.hentry {
    margin: 0px;
}

@media only screen and (max-width: 1000px) {
    .grid.grid-2 {
        grid-template-columns: repeat( 2, 1fr ) !important;
    }
    .grid.grid-3 {
        grid-template-columns: repeat( 2, 1fr ) !important;
    }
    .grid.grid-4 {
        grid-template-columns: repeat( 2, 1fr ) !important;
    }
}

@media only screen and (max-width: 640px) {
    .grid.grid-2 {
        grid-template-columns: repeat( 1, 1fr ) !important;
    }
    .grid.grid-3 {
        grid-template-columns: repeat( 1, 1fr ) !important;
    }
    .grid.grid-4 {
        grid-template-columns: repeat( 1, 1fr ) !important;
    }
}