Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
  • #809115

    I would like to have the Enfold porfolio grid images appear as black and white and then become color on hover. I followed instructions on another thread ( but it is not working. The custom css I’m using is shown below. What am I missing? Thanks for your help.

    .image-overlay .image-overlay-inside::before {
    background: none!important;} /*removes arrow on hover*/

    img.attachment-portfolio.size-portfolio.wp-post-image {
    -webkit-filter: greyscale(100%);
    img.attachment-portfolio.size-portfolio.wp-post-image:hover {
    -webkit-filter: none !important;
    .grid-image img {
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: gray;
    -webkit-transition: all .6s ease;
    transition: all .6s ease;
    -moz-transition: all .6s ease;
    -o-transition: all .6s ease;
    .active_portfolio_item .grid-image img, .grid-image img:hover {
    filter: grayscale(0%);
    -webkit-filter: grayscale(0%);
    -moz-filter: grayscale(0%);
    -o-filter: grayscale(0%);
    filter: none;


    Hey Gallop_Web,

    Can you try to add this css code in Quick CSS (located in Enfold > General Styling):

    .avia_transform a .image-overlay {
        display: none !important;

    Hope this helps :)

    Best regards,


    That did the trick. Thank you!



    We’re glad that Nikko was able to help!

    For your information, you can take a look at Enfold documentation here –

    And if there are features that you wish Enfold had, you can request them and vote the requested ones here –

    For any other questions or issues, feel free to post them here on the forum and we will gladly try to help you.

    Thank you for using Enfold.

Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘Change porfolio grid hover overlay to color on black/white images’ is closed to new replies.