Поворот изображения за курсором js

const maxWidth = document.body.offsetWidth; 
const goldenRatio = maxWidth/2; 
const maxRotate = 40; 
document.body.addEventListener('mousemove', function(event) { 
  var position = event.screenX; 
  const allImages = document.querySelectorAll('img');  
    for(let i = 0; i < allImages.length; i++) { 
      allImages[i].style.transform = `rotateY(${(goldenRatio - position) *  maxRotate / goldenRatio}deg)`  
    } 
})

.gerb-blocks { 
		display: flex; 
		flex-wrap: wrap; 
		align-items: center; 
		justify-content: center; 
		width: 100%; 
    margin: 0 auto; 
	} 
	.gerb-blocks-img { 
		width: 33%; 
		padding: 10px; 
		box-sizing: border-box; 
	} 
	.gerb-blocks-img img { 
		max-width: 100%; 
	}

<div class="gerb-blocks"> 
		<div class="gerb-blocks-img"> 
			<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/9/95/Lesser_Coat_of_Arms_of_Ukraine.svg/2000px-Lesser_Coat_of_Arms_of_Ukraine.svg.png" alt=""> 
		</div> 
		<div class="gerb-blocks-img"> 
			<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/9/95/Lesser_Coat_of_Arms_of_Ukraine.svg/2000px-Lesser_Coat_of_Arms_of_Ukraine.svg.png" alt=""> 
		</div> 
		<div class="gerb-blocks-img"> 
			<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/9/95/Lesser_Coat_of_Arms_of_Ukraine.svg/2000px-Lesser_Coat_of_Arms_of_Ukraine.svg.png" alt=""> 
		</div> 
		<div class="gerb-blocks-img"> 
			<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/9/95/Lesser_Coat_of_Arms_of_Ukraine.svg/2000px-Lesser_Coat_of_Arms_of_Ukraine.svg.png" alt=""> 
		</div> 
		<div class="gerb-blocks-img"> 
			<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/9/95/Lesser_Coat_of_Arms_of_Ukraine.svg/2000px-Lesser_Coat_of_Arms_of_Ukraine.svg.png" alt=""> 
		</div> 
		<div class="gerb-blocks-img"> 
			<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/9/95/Lesser_Coat_of_Arms_of_Ukraine.svg/2000px-Lesser_Coat_of_Arms_of_Ukraine.svg.png" alt=""> 
		</div> 
	</div>