.component-gallery { }

/*====================================*/
/* MONDRIAN STYLES                    */
/*====================================*/

/* DISABLED EFFECTS -  effects should only be applied at the theme level. - DS */
/*
.component-gallery.layout-mondrian .card-img-overlay { transition: .15s; }

.component-gallery.layout-mondrian .card-img-overlay:focus-within,
.component-gallery.layout-mondrian .card-img-overlay:focus,
.component-gallery.layout-mondrian .card-img-overlay:active,
.component-gallery.layout-mondrian .card-img-overlay:hover{
    padding-bottom:1.25rem;
}
*/


/*====================================*/
/* FLEX STYLES                    */
/*====================================*/

.component-gallery.layout-flex .layout-wrapper .box-large .card-img-overlay {
    transform: translateY(100%);
    transition: all ease .3s;
}

.component-gallery.layout-flex .layout-wrapper .box-large .card:hover  .card-img-overlay {
    transform: translateY(0);
}
.component-gallery.layout-flex .layout-wrapper .box-large {
    width: 33%;
}

/*====================================*/
/* MultiGallery STYLES                    */
/*====================================*/

.component-gallery.layout-multiGallery .layout-wrapper .box-large { position:relative }
.component-gallery.layout-multiGallery .layout-wrapper .box-large .card-img-overlay { padding:1.5rem; color:#fff; text-align:center; opacity:0; transition:opacity ease .4s }
.component-gallery.layout-multiGallery .layout-wrapper .box-large:hover .card-img-overlay { opacity:1; background:rgba(var(--bs-secondary-rgb), 0.9) }
.component-gallery.layout-multiGallery .layout-wrapper .box-large { width:32%; display: flex;flex-wrap: wrap;justify-content: space-between; }
.component-gallery.layout-multiGallery .layout-wrapper .box-large .card:nth-child(1){ flex:0 0 100%; margin-top:0 }
.component-gallery.layout-multiGallery .layout-wrapper .box-large .card { flex:0 0 49.5%; margin-top:1% }
.component-gallery.layout-multiGallery .layout-wrapper .box-large .card-img-overlay .card-title { text-transform:uppercase; margin:0 }
.component-gallery.layout-multiGallery .layout-wrapper .box-large .card-img-overlay .card-text { margin-top:10px; line-height:1 }
.component-gallery.layout-multiGallery .macro-archive-link a.btn.btn-link { text-transform:uppercase }

/*=====================================================
SLIDER
======================================================*/
.component-gallery .slick-slider { flex-direction: column; }
.component-gallery.layout-slider .slick-track { min-width:100% }
.component-gallery.layout-slider .slick-slide { flex:1 }
.component-gallery.layout-slider .item { width: 33%; padding: 0 1rem; }
.component-gallery.layout-slider .video-btn-overlay { font-size: 2rem; width: auto; height: auto; padding: 5px; line-height:1; left: auto; bottom: auto; z-index: 2; }
.component-gallery.layout-slider .slick-list { width:100%; margin: 0 -0.5rem; }
.component-gallery.layout-slider .slick-dots { position: static; display: flex; gap: 0.5rem; justify-content: center; max-width: 440px; margin: 0 auto; }
.component-gallery.layout-slider .slick-dots li { height: auto;  padding: 1rem 0; margin: 0;flex: 1; }
.component-gallery.layout-slider .slick-dots button {padding: 0;width: 100%;height: 4px;background: #ccc; }
.component-gallery.layout-slider li.slick-active button { background-color: rgb(var(--bs-primary-rgb)); }
.component-gallery.layout-slider .slick-dots button:before { content: none; }
.component-gallery.layout-slider .card-img-overlay{ -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    top:100%; background-color: rgba(0,0,0,0.375); background: linear-gradient(180deg, rgba(0,0,0,0) 25%, rgba(0,0,0,0.85) 100%); }
.component-gallery.layout-slider .item:hover .card-img-overlay,
.component-gallery.layout-slider .item:active .card-img-overlay,
.component-gallery.layout-slider .item:focus .card-img-overlay,
.component-gallery.layout-slider .item:focus-within .card-img-overlay { top:0; }

/*=====================================================
RESPONSIVE
======================================================*/
@media (max-width: 991px) {
.component-gallery.layout-multiGallery .layout-wrapper .box-large{width:100%;}
}
@media only screen and (min-width:992px) {

}
@media screen and (max-width:575px){

}

@media only screen and (min-width:768px) {

}
@media only screen and (min-width:992px) {

}
@media only screen and (min-width:1200px) {

}

/*====================================*/
/* STACKED   STYLES                    */
/*====================================*/

.component-gallery.layout-stacked .items { display:flex; flex-wrap:wrap; justify-content:space-between; align-self:stretch }
.component-gallery.layout-stacked .right-col { display:flex; flex-direction:column }
.component-gallery.layout-stacked .card-text { display:none !important }
