.image-grid {
    display: flex;
    flex-wrap: wrap;
}
.image-grid figure.first, .image-grid figure.last {
    flex:2;
}
.image-grid figure {
    flex:1;
    margin: calc(.125em + .125vw)
}

.image-grid figure.first, .image-grid:last-child figure:first-child {
    margin-left: 0;}
.image-grid:first-child figure:last-child, .image-grid figure.last {margin-right: 0;}


.image-grid:first-child {margin-top: calc(.125em + .125vw);}
.image-grid:last-child {margin-bottom: calc(.125em + .125vw);}


.image-grid img {
    width:100%;
}

@media only screen and (max-width: 40rem) {
    .image-grid figure.first, .image-grid figure.last {
        flex-basis: 100%;
    }
    .image-grid:first-child figure:nth-child(2), .image-grid figure.last {margin-left: 0;}
    .image-grid figure.first, .image-grid:last-child figure:nth-child(2) {margin-right: 0;}
}