@charset "UTF-8";.blueimp-gallery,.blueimp-gallery>.slides>.slide>.slide-content{position:absolute;top:0;right:0;bottom:0;left:0;-moz-backface-visibility:hidden}.blueimp-gallery>.slides>.slide>.slide-content{margin:auto;width:auto;height:auto;max-width:100%;max-height:100%;opacity:1}.blueimp-gallery{position:fixed;z-index:999999;overflow:hidden;background:#000;background:rgba(0,0,0,.9);opacity:0;display:none;direction:ltr;-ms-touch-action:none;touch-action:none}.blueimp-gallery-carousel{position:relative;z-index:auto;margin:1em auto;padding-bottom:56.25%;box-shadow:0 0 10px #000;-ms-touch-action:pan-y;touch-action:pan-y}.blueimp-gallery-display{display:block;opacity:1}.blueimp-gallery>.slides{position:relative;height:100%;overflow:hidden}.blueimp-gallery-carousel>.slides{position:absolute}.blueimp-gallery>.slides>.slide{position:relative;float:left;height:100%;text-align:center;-webkit-transition-timing-function:cubic-bezier(.645,.045,.355,1);-moz-transition-timing-function:cubic-bezier(.645,.045,.355,1);-ms-transition-timing-function:cubic-bezier(.645,.045,.355,1);-o-transition-timing-function:cubic-bezier(.645,.045,.355,1);transition-timing-function:cubic-bezier(.645,.045,.355,1)}.blueimp-gallery,.blueimp-gallery>.slides>.slide>.slide-content{-webkit-transition:opacity .2s linear;-moz-transition:opacity .2s linear;-ms-transition:opacity .2s linear;-o-transition:opacity .2s linear;transition:opacity .2s linear}.blueimp-gallery>.slides>.slide-loading{background:url(../img/loading.gif) center no-repeat;background-size:64px 64px}.blueimp-gallery>.slides>.slide-loading>.slide-content{opacity:0}.blueimp-gallery>.slides>.slide-error{background:url(../img/error.png) center no-repeat}.blueimp-gallery>.slides>.slide-error>.slide-content{display:none}.blueimp-gallery>.next,.blueimp-gallery>.prev{position:absolute;top:50%;left:15px;width:40px;height:40px;margin-top:-23px;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:60px;font-weight:100;line-height:30px;color:#fff;text-decoration:none;text-shadow:0 0 2px #000;text-align:center;background:#222;background:rgba(0,0,0,.5);-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;border:3px solid #fff;-webkit-border-radius:23px;-moz-border-radius:23px;border-radius:23px;opacity:.5;cursor:pointer;display:none}.blueimp-gallery>.next{left:auto;right:15px}.blueimp-gallery>.close,.blueimp-gallery>.title{position:absolute;top:15px;left:15px;margin:0 40px 0 0;font-size:20px;line-height:30px;color:#fff;text-shadow:0 0 2px #000;opacity:.8;display:none}.blueimp-gallery>.close{padding:15px;right:15px;left:auto;margin:-15px;font-size:30px;text-decoration:none;cursor:pointer}.blueimp-gallery>.play-pause{position:absolute;right:15px;bottom:15px;width:15px;height:15px;background:url(../img/play-pause.png) 0 0 no-repeat;cursor:pointer;opacity:.5;display:none}.blueimp-gallery-playing>.play-pause{background-position:-15px 0}.blueimp-gallery>.close:hover,.blueimp-gallery>.next:hover,.blueimp-gallery>.play-pause:hover,.blueimp-gallery>.prev:hover,.blueimp-gallery>.title:hover{color:#fff;opacity:1}.blueimp-gallery-controls>.close,.blueimp-gallery-controls>.next,.blueimp-gallery-controls>.play-pause,.blueimp-gallery-controls>.prev,.blueimp-gallery-controls>.title{display:block;-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0);transform:translateZ(0)}.blueimp-gallery-left>.prev,.blueimp-gallery-right>.next,.blueimp-gallery-single>.next,.blueimp-gallery-single>.play-pause,.blueimp-gallery-single>.prev{display:none}.blueimp-gallery>.close,.blueimp-gallery>.next,.blueimp-gallery>.play-pause,.blueimp-gallery>.prev,.blueimp-gallery>.slides>.slide>.slide-content{-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}body:last-child .blueimp-gallery>.slides>.slide-error{background-image:url(../img/error.svg)}body:last-child .blueimp-gallery>.play-pause{width:20px;height:20px;background-size:40px 20px;background-image:url(../img/play-pause.svg)}body:last-child .blueimp-gallery-playing>.play-pause{background-position:-20px 0}.blueimp-gallery>.indicator{position:absolute;top:auto;right:15px;bottom:15px;left:15px;margin:0 40px;padding:0;list-style:none;text-align:center;line-height:10px;display:none}.blueimp-gallery>.indicator>li{display:inline-block;width:9px;height:9px;margin:6px 3px 0 3px;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;border:1px solid transparent;background:#ccc;background:rgba(255,255,255,.25) center no-repeat;border-radius:5px;box-shadow:0 0 2px #000;opacity:.5;cursor:pointer}.blueimp-gallery>.indicator>.active,.blueimp-gallery>.indicator>li:hover{background-color:#fff;border-color:#fff;opacity:1}.blueimp-gallery-controls>.indicator{display:block;-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0);transform:translateZ(0)}.blueimp-gallery-single>.indicator{display:none}.blueimp-gallery>.indicator{-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.blueimp-gallery>.slides>.slide>.video-content>img{position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:auto;height:auto;max-width:100%;max-height:100%;-moz-backface-visibility:hidden}.blueimp-gallery>.slides>.slide>.video-content>video{position:absolute;top:0;left:0;width:100%;height:100%}.blueimp-gallery>.slides>.slide>.video-content>iframe{position:absolute;top:100%;left:0;width:100%;height:100%;border:none}.blueimp-gallery>.slides>.slide>.video-playing>iframe{top:0}.blueimp-gallery>.slides>.slide>.video-content>a{position:absolute;top:50%;right:0;left:0;margin:-64px auto 0;width:128px;height:128px;background:url(../img/video-play.png) center no-repeat;opacity:.8;cursor:pointer}.blueimp-gallery>.slides>.slide>.video-content>a:hover{opacity:1}.blueimp-gallery>.slides>.slide>.video-playing>a,.blueimp-gallery>.slides>.slide>.video-playing>img{display:none}.blueimp-gallery>.slides>.slide>.video-content>video{display:none}.blueimp-gallery>.slides>.slide>.video-playing>video{display:block}.blueimp-gallery>.slides>.slide>.video-loading>a{background:url(../img/loading.gif) center no-repeat;background-size:64px 64px}body:last-child .blueimp-gallery>.slides>.slide>.video-content:not(.video-loading)>a{background-image:url(../img/video-play.svg)}.vk-video-link {
    display: block; /* Или inline-block */
    position: relative;
}
.vk-video-play-icon::before {
    content: '\25B6'; /* Unicode символ Play */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 3em; /* Размер иконки */
    color: rgba(255, 255, 255, 0.8); /* Белый полупрозрачный */
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.5); /* Тень для контраста */
    pointer-events: none; /* Чтобы не мешала клику по ссылке */
    opacity: 0.8;
    transition: opacity 0.2s ease;
}
.vk-video-link:hover .vk-video-play-icon::before {
    opacity: 1;
}
/* Стили для card-columns (если нужны) */
.card-columns {
  column-gap: 1rem;
}
.card-columns .card {
  margin-bottom: 1rem;
  display: inline-block; /* Важно для card-columns */
  width: 100%;
}/*# sourceMappingURL=blueimp-gallery.min.css.map */
/* Контейнер для альбомов */
.vgallery-albums-grid {
    display: flex; /* Активируем Flexbox */
    flex-wrap: wrap; /* Позволяет элементам переноситься на следующую строку */
    gap: 15px; /* Расстояние между карточками (можете настроить) */
    justify-content: flex-start; /* Выравнивание элементов по началу строки */
    align-items: stretch; /* Важно: Делает все Flex-элементы равной высоты */
}

/* Карточка альбома */
.vgallery-album-card-flex {
    flex: 1 1 calc(33.333% - 15px); /* Для трех колонок (33.333%) минус gap. Настройте для желаемого количества колонок. */
    max-width: calc(33.333% - 15px); /* То же самое для максимальной ширины */
    display: flex; /* Включаем Flexbox внутри карточки для её содержимого */
    flex-direction: column; /* Элементы внутри карточки располагаются вертикально */
    border: 1px solid #ddd; /* Добавляем рамку для наглядности */
    border-radius: 5px; /* Скругление углов */
    overflow: hidden; /* Обрезает содержимое, если оно выходит за рамки */
    box-shadow: 0 2px 5px rgba(0,0,0,0.1); /* Легкая тень */
}

@media (max-width: 992px) { /* Для планшетов */
    .vgallery-album-card-flex {
        flex: 1 1 calc(50% - 15px);
        max-width: calc(50% - 15px);
    }
}

@media (max-width: 576px) { /* Для мобильных устройств */
    .vgallery-album-card-flex {
        flex: 1 1 100%;
        max-width: 100%;
    }
}

/* Обложка альбома */
.vgallery-album-cover {
    width: 100%;
    height: 200px; /* Фиксированная высота для обложки, или используйте object-fit */
    object-fit: cover; /* Обрезает изображение, чтобы оно заполнило контейнер без искажений */
    display: block; /* Убираем лишние пробелы под изображением */
}

/* Детали альбома (заголовок, количество фото) */
.vgallery-album-details-flex {
    padding: 10px;
    flex-grow: 1; /* Позволяет этому блоку растягиваться, заполняя оставшееся пространство */
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* Если нужно выровнять по вертикали, например, название и счетчик */
}

.vgallery-album-title-container-flex {
    /* Если хотите, чтобы заголовок не переносился или имел определенный размер */
    font-weight: bold;
    font-size: 1.1em;
    margin-bottom: 5px;
}

.vgallery-album-count {
    float: right; /* Размещение счетчика справа */
    background-color: #a94442;
    padding: 2px 8px;
    border-radius: 3px;
    font-size: 0.9em;
}

/* Стили для галереи фотографий */
.vgallery-photos-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 10px; /* Расстояние между фото */
    justify-content: flex-start;
    align-items: stretch; /* Для равной высоты фотокарточек */
}

.vgallery-photo-item-flex {
    flex: 1 1 calc(25% - 10px); /* Например, 4 колонки */
    max-width: calc(25% - 10px);
    display: flex;
    flex-direction: column;
    border: 1px solid #eee;
    border-radius: 3px;
    overflow: hidden;
    position: relative; /* Для позиционирования лайков или подписей */
}

@media (max-width: 992px) {
    .vgallery-photo-item-flex {
        flex: 1 1 calc(33.333% - 10px);
        max-width: calc(33.333% - 10px);
    }
}

@media (max-width: 768px) {
    .vgallery-photo-item-flex {
        flex: 1 1 calc(50% - 10px);
        max-width: calc(50% - 10px);
    }
}

@media (max-width: 576px) {
    .vgallery-photo-item-flex {
        flex: 1 1 100%;
        max-width: 100%;
    }
}

.vgallery-photo-img-flex {
    width: 100%;
    height: 180px; /* Фиксированная высота для превью фото */
    object-fit: cover;
    display: block;
}

/* Дополнительные стили для кнопок и заголовков, чтобы они выглядели хорошо с новыми стилями */
.vgallery-back-button {
    margin-bottom: 20px;
}

.vgallery-album-header {
    margin-top: 0;
    margin-bottom: 20px;
    text-align: center; /* Центрировать заголовок альбома */
}