هاور عکس با حرکت موس

من این رو در کلاس CSS تصویر تعریف کردم ولی اتفاقی نیوفتاد

سلام بفرمایید
https://b2n.ir/j64233
به عنوان مثال تیم مجله ارز دیجیتال وسط صفحه
یک کد css پیدا کردم ولی مثلکه مشکل کد نویسی داره

<!-- start Simple Custom CSS and JS -->
<style type="text/css">
img {
  -webkit-filter: grayscale(100%); /* For Webkit browsers */
  -webkit-transition: .5s ease-in-out; /* For Webkit browsers */
  -moz-filter: grayscale(100%); /* For Firefox */
  -moz-transition: .5s ease-in-out; /* For FireFox */
  -o-filter: grayscale(100%);
  -o-transition: .5s ease-in-out;
} 
 
img:hover {
  -webkit-filter: grayscale(0%); /* For Webkit browsers */
  -webkit-transition: .5s ease-in-out; /* For Webkit browsers */
  -moz-filter: grayscale(0%); /* For Firefox */
  -moz-transition: .5s ease-in-out; /* For Firefox */
  -o-filter: grayscale(0%); 
  -o-transition: .5s ease-in-out;
}</style>
<!-- end Simple Custom CSS and JS -->