.gallery {
display: grid;
gap: clamp(10px, 3vw, 20px);
}
.gallery figure {
margin: 0;
}
.gallery .has_video, .fc_split_content .has_video {
position: relative;
display: grid;
grid-template-columns: 1fr;
grid-template-rows: 1fr;
}
.gallery .has_video img {
grid-row-start: 1;
grid-column-start: 1;
}
.gallery .has_video::after, .fc_split_content .has_video::after {
display: block;
content: '';
background: center / 40px 40px no-repeat url("data:image/svg+xml,%3csvg width='40' height='40' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='m16 27 12-7-12-7v14Zm4-27a20 20 0 1 0 0 40 20 20 0 0 0 0-40Zm0 36a16 16 0 1 1 0-32 16 16 0 0 1 0 32Z' fill='white'/%3e%3c/svg%3e");
opacity: 0.5;
transition: .3s;
grid-row-start: 1;
grid-column-start: 1;
width: 100%;
height: 100%;
}
.gallery .has_video:hover::after, .fc_split_content .has_video:hover::after {
opacity: 1;
}
.gallery a , .gallery img {
display: block;
width: 100%;
}
.gallery-caption {
display: none;
}
.columns_1 {
grid-template-columns: repeat(1, 1fr);
}
.columns_2 {
grid-template-columns: repeat(2, 1fr);
}
.columns_3 {
grid-template-columns: repeat(3, 1fr);
}
.columns_4 {
grid-template-columns: repeat(4, 1fr);
}
.columns_5 {
grid-template-columns: repeat(5, 1fr);
}
.columns_6 {
grid-template-columns: repeat(6, 1fr);
}
.columns_7 {
grid-template-columns: repeat(7, 1fr);
}
.columns_8 {
grid-template-columns: repeat(8, 1fr);
}
.columns_9 {
grid-template-columns: repeat(9, 1fr);
}
.gallery.columned_gallery_item {
display: block;
columns: 4;
column-gap: clamp(10px, 3vw, 20px);
}
.columned_gallery_item.columns_3 {
columns: 3;
}
.columned_gallery_item.columns_4 {
columns: 4;
}
.columned_gallery_item.columns_5 {
columns: 5;
}
.columned_gallery_item.columns_6 {
columns: 6;
}
.gallery.columned_gallery_item > figure {
display: inline-block;
}
.gallery.columned_gallery_item > figure {
display: block;
margin: 0 0 clamp(10px, 3vw, 20px) 0;
}
.gallery.row_gallery_item {
display: flex;
flex-wrap: wrap;
}
.gallery.row_gallery_item > figure {
--ratio: calc(var(--width)/var(--height));
--row-height:  clamp(100px, 15vw, 250px);;
flex-basis: calc(var(--ratio)*var(--row-height));
flex-grow: calc(var(--ratio)*100);
}
@media (max-width: 1100px) {
.columned_gallery_item.columns_6 {
columns: 5;
}
.columns_9 , .columns_8 , .columns_7 , .columns_6 {
grid-template-columns: repeat(5, 1fr);
}
}
@media (max-width: 1024px) {
.columned_gallery_item.columns_6,
.columned_gallery_item.columns_5 {
columns: 4;
}
.columns_9 , .columns_8 , .columns_7 , .columns_6 , .columns_5 {
grid-template-columns: repeat(4, 1fr);
}
}
@media (max-width: 750px) {
.columned_gallery_item.columns_6,
.columned_gallery_item.columns_5,
.columned_gallery_item.columns_4 {
columns: 3;
}
}
@media (max-width: 750px) {
.columns_9 , .columns_8 , .columns_7 , .columns_6 , .columns_5 , .columns_4 {
grid-template-columns: repeat(3, 1fr);
}
}
@media (max-width: 450px) {
.columned_gallery_item.columns_6,
.columned_gallery_item.columns_5,
.columned_gallery_item.columns_4,
.columned_gallery_item.columns_3 {
columns: 2;
}
}