Unexpected hover effect on images

We are encountering a very unexpected issue on a page which we are building using Elementor. There are three images on the page which has a white overlay on hover. We are not sure where it comes from. We’d like to know where it comes from within Elementor. Please advice.

  • Nastia
    • Support Rock Star

    Hello Giorgio

    Hope you’re doing well!

    The overlay comes from this CSS code:

    .avia_transform a:hover .image-overlay {
        opacity: .7 !important;
    }

    Optimization is enabled on your site, that gather all CSS code into one custom file, so it is not possible to say from what CSS file this code is loading from. It most likely coming from the Elementor plugin, because it gives an option to adjust the hover in the builder.

    Please edit the page with the Elementor plugin. Click on the pencil icon to edit the image, open Style tab and click on Hover. Please see attached screenshot:

    Adjust the Opacity as you wish for each image.

    Please let us know how it went!

    Kind regards,
    Nastia

    • Giorgio
      • Flash Drive

      I honestly have no idea where that code is. It’s nowhere to be found. But i’ll keep looking!

      Elementor does not add custom css, and I don’t have Elementor Pro so I can’t add that inside the builder. It’s not inside “adding css” (under “settings”:wink:, nor in the customizer.

      So… no idea. But i’ll keep searching, thank you for the heads up!

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.