Greyscale on gallery Grid

Hi everyone !

I’d like to know if there is a way using a CSS Code to have a greyscale effect on my gallery and to show the images with the colors when hover.

I have this CSS code right now but it’s actually not working (works but the color effect when hover only last if the mouse doesn’t move)

.grid-gallery-photos img {
filter: grayscale(80%);
-webkit-filter: grayscale(80%);
-moz-filter: grayscale(80%);
-o-filter: grayscale(80%);
filter: gray
-webkit-transition: all 0s ease;
transition: all 0s ease;
-moz-transition: all 0s ease;
-o-transition: all 0s ease;;

}

.grid-gallery-photos img:hover {
filter: grayscale(0%);
-webkit-filter: grayscale(0%);
filter: none;

}

Any suggestions ?
Thanks !