.collage{display:grid;gap:16px;height:500px;overflow:hidden;border-radius:12px}.over{overflow:hidden;border-radius:12px;transition:all .4s}.collage img{width:100%;height:100%;object-fit:cover;border-radius:12px;display:block;cursor:pointer;transition:all .4s}.collage img:hover{transform:scale(1.2)}.masonry-1{grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr;grid-template-areas:"a b" "a c"}.masonry-1 img:nth-child(1){grid-area:a}.masonry-1 img:nth-child(2){grid-area:b}.masonry-1 img:nth-child(3){grid-area:c}.masonry-2{grid-template-columns:1fr 1.2fr 1fr;grid-template-rows:1fr 1fr;grid-template-areas:"a b c" "d b e"}.masonry-2 img:nth-child(1){grid-area:a}.masonry-2 img:nth-child(2){grid-area:b}.masonry-2 img:nth-child(3){grid-area:c}.masonry-2 img:nth-child(4){grid-area:d}.masonry-2 img:nth-child(5){grid-area:e}.masonry-3{grid-template-columns:repeat(3,1fr);grid-template-rows:1fr}.masonry-3 img:nth-child(1){grid-area:a}.masonry-3 img:nth-child(2){grid-area:b}.masonry-3 img:nth-child(3){grid-area:c}.masonry-3 img:nth-child(4){grid-area:d}.masonry-3 img:nth-child(5){grid-area:e}.collage.masonry-5{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(3,1fr);gap:16px;height:500px}.collage.masonry-5 img{width:100%;height:100%;object-fit:cover;border-radius:12px;display:block}.masonry-5 .over:nth-child(1){grid-column:1/2;grid-row:1/3}.masonry-5 .over:nth-child(2){grid-column:2/4;grid-row:1/3}.masonry-5 .over:nth-child(3){grid-column:4/5;grid-row:1/3}.masonry-5 .over:nth-child(4){grid-column:1/2;grid-row:3/4}.masonry-5 .over:nth-child(5){grid-column:2/5;grid-row:3/4}.collage.masonry-4{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(3,1fr);gap:16px;height:500px}.collage.masonry-4 img{width:100%;height:100%;object-fit:cover;border-radius:12px;display:block}.masonry-4 .over:nth-child(1){grid-column:1/4;grid-row:1/2}.masonry-4 .over:nth-child(2){grid-column:1/2;grid-row:2/4}.masonry-4 .over:nth-child(3){grid-column:2/4;grid-row:2/4}.masonry-4 .over:nth-child(4){grid-column:4/5;grid-row:1/4}.collage.masonry-6{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:220px;gap:16px}.collage.masonry-6 img{width:100%;object-fit:cover;border-radius:12px;display:block}.masonry-6 .over:nth-child(1){grid-column:1/2;grid-row:1/2}.masonry-6 .over:nth-child(2){grid-column:2/3;grid-row:1/3}.masonry-6 .over:nth-child(3){grid-column:3/5;grid-row:1/2}.masonry-6 .over:nth-child(4){grid-column:1/2;grid-row:2/3}.masonry-6 .over:nth-child(5){grid-column:3/4;grid-row:2/3}.masonry-6 .over:nth-child(6){grid-column:4/5;grid-row:2/3}.collage.masonry-7{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,1fr);gap:16px;height:500px}.collage.masonry-7 img{width:100%;height:100%;object-fit:cover;border-radius:12px;display:block}.masonry-7 .over:nth-child(1){grid-column:1/2;grid-row:1/3}.masonry-7 .over:nth-child(2){grid-column:2/3;grid-row:1/2}.masonry-7 .over:nth-child(3){grid-column:3/4;grid-row:1/2}.masonry-7 .over:nth-child(4){grid-column:4/5;grid-row:1/3}.masonry-7 .over:nth-child(5){grid-column:1/2;grid-row:3/5}.masonry-7 .over:nth-child(6){grid-column:2/4;grid-row:2/5}.masonry-7 .over:nth-child(7){grid-column:4/5;grid-row:3/5}.collage.masonry-8{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(3,1fr);gap:16px;height:500px}.collage.masonry-8 img{width:100%;height:100%;object-fit:cover;object-position:top;border-radius:12px;display:block}.masonry-8 .over:nth-child(1){grid-column:1/2;grid-row:1/3}.masonry-8 .over:nth-child(2){grid-column:2/3;grid-row:1/2}.masonry-8 .over:nth-child(3){grid-column:3/4;grid-row:1/3}.masonry-8 .over:nth-child(4){grid-column:4/5;grid-row:1/2}.masonry-8 .over:nth-child(5){grid-column:1/2;grid-row:3/4}.masonry-8 .over:nth-child(6){grid-column:2/3;grid-row:2/4}.masonry-8 .over:nth-child(7){grid-column:3/4;grid-row:3/4}.masonry-8 .over:nth-child(8){grid-column:4/5;grid-row:2/4}@media (max-width: 768px){.collage.masonry-8{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(4,1fr)}.collage.masonry-8 .over:nth-child(1){grid-column:1/2;grid-row:1/2}.collage.masonry-8 .over:nth-child(2){grid-column:2/4;grid-row:1/2}.collage.masonry-8 .over:nth-child(3){grid-column:1/3;grid-row:2/3}.collage.masonry-8 .over:nth-child(4){grid-column:3/4;grid-row:2/3}.collage.masonry-8 .over:nth-child(5){grid-column:1/2;grid-row:3/4}.collage.masonry-8 .over:nth-child(6){grid-column:2/4;grid-row:3/4}.collage.masonry-8 .over:nth-child(7){grid-column:1/3;grid-row:4/5}.collage.masonry-8 .over:nth-child(8){grid-column:3/4;grid-row:4/5}}@media (max-width: 768px){.collage.masonry-7{grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,1fr)}.collage.masonry-7 .over:nth-child(1){grid-column:1/3;grid-row:1/2}.collage.masonry-7 .over:nth-child(2){grid-column:3/5;grid-row:1/2}.collage.masonry-7 .over:nth-child(3){grid-column:1/2;grid-row:2/3}.collage.masonry-7 .over:nth-child(4){grid-column:1/2;grid-row:3/4}.collage.masonry-7 .over:nth-child(5){grid-column:2/5;grid-row:2/4}.collage.masonry-7 .over:nth-child(6){grid-column:1/3;grid-row:4/5}.collage.masonry-7 .over:nth-child(7){grid-column:3/5;grid-row:4/5}}@media (max-width: 768px){.collage.masonry-6{grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,1fr)}.collage.masonry-6 .over:nth-child(1){grid-column:1/3;grid-row:1/3}.collage.masonry-6 .over:nth-child(2){grid-column:3/5;grid-row:1/2}.collage.masonry-6 .over:nth-child(3){grid-column:3/5;grid-row:2/3}.collage.masonry-6 .over:nth-child(4){grid-column:1/5;grid-row:3/4}.collage.masonry-6 .over:nth-child(5){grid-column:1/3;grid-row:4/5}.collage.masonry-6 .over:nth-child(6){grid-column:3/5;grid-row:4/5}}@media (max-width: 768px){.collage.masonry-5{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(4,1fr)}.collage.masonry-5 .over:nth-child(1){grid-column:1/3;grid-row:1/2}.collage.masonry-5 .over:nth-child(2){grid-column:1/3;grid-row:2/4}.collage.masonry-5 .over:nth-child(3){grid-column:3/4;grid-row:1/4}.collage.masonry-5 .over:nth-child(4){grid-column:1/3;grid-row:4/5}.collage.masonry-5 .over:nth-child(5){grid-column:3/4;grid-row:4/5}}@media (max-width: 768px){.collage.masonry-4{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(4,1fr)}.collage.masonry-4 .over:nth-child(1){grid-column:1/4;grid-row:1/2}.collage.masonry-4 .over:nth-child(2){grid-column:1/2;grid-row:2/5}.collage.masonry-4 .over:nth-child(3){grid-column:2/4;grid-row:2/4}.collage.masonry-4 .over:nth-child(4){grid-column:2/4;grid-row:4/5}}
