body { main { #gallery { .gallery { list-style-type: none; display: flex; flex-wrap: wrap; margin: -1rem -1rem; padding-bottom: 3rem; .gallery-item { position: relative; flex: 1 0 22rem; margin: 1rem; color: $off-white; box-shadow: 1px 1px 1px 2px rgba(200, 200, 200,.5); cursor: pointer; border-radius: 5%; .gallery-image { cursor: pointer; border-radius: 5%; width: 100%; height: 100%; object-fit: cover; } } } .gallery-item, .gallery { width: auto; margin: 0; } img, video { display: block; } @supports (display: grid) { .gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); } } } } }