/* Вместо #rec123456 указывается ID блока галереи */
#rec123456 {
--gallery-radius: 20px;
--gallery-gap: 16px;
--page-width: 1600px;
--page-padding: 40px;
}
/* Совпадение с внешними полями сайта */
#rec123456 .t-container {
width: min(
var(--page-width),
calc(100% - var(--page-padding) * 2)
);
max-width: none;
margin-inline: auto;
}
/* Скругление изображения вместе с затемнением */
#rec123456 .gallery-item {
border-radius: var(--gallery-radius);
overflow: hidden;
}
#rec123456 .gallery-item img,
#rec123456 .gallery-item::before,
#rec123456 .gallery-item::after {
border-radius: inherit;
}
/* Отдельная строка для кнопки */
#rec123456 .gallery-button-row {
display: grid;
grid-template-columns: repeat(5, minmax(0, 1fr));
gap: var(--gallery-gap);
margin-top: 32px;
}
#rec123456 .gallery-button {
grid-column: 5;
width: 100%;
}
@media (max-width: 980px) {
#rec123456 .gallery-button-row {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
#rec123456 .gallery-button {
grid-column: 2;
}
}
@media (max-width: 640px) {
#rec123456 {
--page-padding: 20px;
}
#rec123456 .gallery-button-row {
display: block;
}
#rec123456 .gallery-button {
width: 100%;
}
}
