hover on image to show caption

Hi there,

i am not sure we can provide CSS that would have the exact same effect as that. If you want to add the Links to your images so all the necessary HTML is there, then i can take a look.

Thanks David.

The links have been added.

Try this CSS:

.gb-grid-wrapper .wp-block-image.our-product-categories-img {
    margin-bottom: 1em;
    position: relative;
    overflow: hidden;
}
.our-product-categories-img img {
    width: 100%;
    opacity: 1;
    transition: opacity 0.3s ease-in-out;
}
.our-product-categories-img figcaption {
    position: absolute;
    display:  block;
    bottom: 0;
    left:0;
    right: 0;
    margin: 0;
    padding: 20px;
    background-color: #fff;
    color:#000;
    opacity: 1;
    transform: translatey(0);
    transition: all 0.3s ease-in-out;
}
@media(pointer: fine) {
    .our-product-categories-img:not(:hover) figcaption {
        opacity: 0;
        transform: translatey(100%);
    }
    .our-product-categories-img:not(:hover) img {
        opacity: 0.8;
    }
}

Wow you are so good.

Thank you :)

Glad to be of help!