.widget_media_gallery .gallery { display: grid; grid-column-gap: 10px; grid-row-gap: 10px; } .gallery-item { transition: opacity 0.12s cubic-bezier(0.455, 0.03, 0.515, 0.955); a { display: flex; position: relative; padding-bottom: 100%; img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: center center; } } &:hover { opacity: 0.8; } } .gallery-columns-2 { grid-template-columns: repeat(2, 1fr); } .gallery-columns-3 { grid-template-columns: repeat(3, 1fr); } .gallery-columns-4 { grid-template-columns: repeat(4, 1fr); } .gallery-columns-5 { grid-template-columns: repeat(5, 1fr); } .gallery-columns-6 { grid-template-columns: repeat(6, 1fr); } .gallery-columns-7 { grid-template-columns: repeat(7, 1fr); } .gallery-columns-8 { grid-template-columns: repeat(8, 1fr); } .gallery-columns-9 { grid-template-columns: repeat(9, 1fr); }