Masonry Gallery Images Opacity

Hi, i am trying to add opacity to the images on Masonry Gallery. I found some solutions you gave, but only a part of it worked.

What i want is to make the Masonry Gallery images have opacity, and a title (centered on the whole image, not at the bottom). When mouse over or hovered, the opacity to fully disappear as well as the title.

The title issue i did worked it out. Also the opacity. However, the hover part is giving me trouble.

I tried this code which is the one that worked

.avia_desktop.avia_transform3d .av-masonry-image-container { 
filter: opacity(50%) !important;
-webkit-filter: opacity(50%) !important;
-moz-filter: opacity(50%) !important;
-o-filter: opacity(50%) !important;
filter: opacity(50%) !important;
}
.avia_desktop.avia_transform3d .av-masonry-image-container:hover {
filter: opacity(100%) !important;
-webkit-filter: opacity(100%) !important;
-moz-filter: opacity(100%) !important;
-o-filter: opacity(100%) !important;
filter: opacity(100%) !important;
}

This other code didnt work at all.

.avia_desktop .av-hover-overlay-active .av-masonry-image-container {
    opacity: 1;
}
.avia_desktop .av-hover-overlay-active .av-masonry-image-container:hover {
    opacity: 0.7!important;
}

Thank you¡
Link to website: http://www.cm-arq.com

• This topic was modified 7 years, 7 months ago by cm-arq.