.ova-gallery-filter .filter-btn-wrapper {
list-style-type: none;
text-align: center;
margin: 0 0 50px 0;
padding: 0;
}
.ova-gallery-filter .filter-btn-wrapper li.filter-btn {
transition: all 0.3s ease;
font-size: 18px;
font-weight: 700;
line-height: 23px;
text-transform: capitalize;
cursor: pointer;
display: inline-block;
border-radius: 5px;
padding: 11px 21px;
}
.ova-gallery-filter .filter-btn-wrapper li.filter-btn.active-category, .ova-gallery-filter .filter-btn-wrapper li.filter-btn:hover {
transition: all 0.3s ease;
color: #fff;
background: var(--primary);
}
.ova-gallery-filter .gallery-column.three_column .gallery-item {
width: calc(33.33% - 20px);
}
@media (max-width: 991px) {
.ova-gallery-filter .gallery-column.three_column .gallery-item {
width: calc(50% - 15px);
}
}
@media (max-width: 767px) {
.ova-gallery-filter .gallery-column.three_column .gallery-item {
width: 100%;
}
}
.ova-gallery-filter .gallery-column.four_column .gallery-item {
width: calc(25% - 25px);
}
@media (max-width: 1024px) {
.ova-gallery-filter .gallery-column.four_column .gallery-item {
width: calc(33.33% - 20px);
}
}
@media (max-width: 991px) {
.ova-gallery-filter .gallery-column.four_column .gallery-item {
width: calc(50% - 15px);
}
}
@media (max-width: 767px) {
.ova-gallery-filter .gallery-column.four_column .gallery-item {
width: 100%;
}
}
.ova-gallery-filter .gallery-item {
margin-bottom: 50px;
}
.ova-gallery-filter .gallery-item:hover .gallery-img img {
-webkit-transition: 0.6s;
transition: 0.6s;
transform: scale(1.05);
}
.ova-gallery-filter .gallery-item:hover .gallery-img .icon {
-webkit-transition: 0.7s;
transition: 0.7s;
transform: translate(-50%, -50%);
opacity: 1;
visibility: visible;
}
.ova-gallery-filter .gallery-item:hover .gallery-img .mask {
-webkit-transition: 0.6s;
transition: 0.6s;
-webkit-transform: perspective(400px) rotateX(0deg) scale(1);
transform: perspective(400px) rotateX(0deg) scale(1);
opacity: 0.4;
}
.ova-gallery-filter .gallery-item .gallery-img {
position: relative;
overflow: hidden;
}
.ova-gallery-filter .gallery-item .gallery-img img {
-webkit-transition: 0.6s;
transition: 0.6s;
display: block;
width: 100%;
height: 300px;
object-fit: cover;
transform: scale(1.001);
}
.ova-gallery-filter .gallery-item .gallery-img .icon {
-webkit-transition: 0.7s;
transition: 0.7s;
position: absolute;
z-index: 1;
left: 50%;
top: 50%;
background-color: var(--primary);
width: 50px;
height: 50px;
border-radius: 50%;
opacity: 0;
visibility: hidden;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
}
.ova-gallery-filter .gallery-item .gallery-img .icon:hover i {
transition: all 0.3s ease;
transform: rotate(-90deg);
}
.ova-gallery-filter .gallery-item .gallery-img .icon i {
transition: all 0.3s ease;
display: inline-flex;
color: #fff;
}
.ova-gallery-filter .gallery-item .gallery-img .mask {
-webkit-transition: 0.6s;
transition: 0.6s;
position: absolute;
content: "";
top: 0;
left: 0;
right: 0;
width: 100%;
height: 100%;
background: rgba(26, 26, 61, 0.8);
mix-blend-mode: normal;
opacity: 0;
-webkit-transform: perspective(400px) rotateX(-90deg) scale(0.2);
transform: perspective(400px) rotateX(-90deg) scale(0.2);
-webkit-transform-origin: top;
transform-origin: top;
}
.ova-gallery-filter .gallery-item .title {
margin: 20px 0 0px 0;
font-size: 20px;
font-weight: 800;
line-height: 31px;
}
.ova-gallery-filter .gallery-item .description {
font-weight: 600;
margin: 0;
line-height: 21px;
text-transform: uppercase;
font-size: 13px;
}