position an image over another image on hover

Hi, Nimrod,

If you create a selector for your link then add the pseudo-class hover to that selector. For example, if the selector on the link was:
.my-div-class a
add the hover:
.my-div-class a:hover
Then just add a background image to that selector.

** This is just a general answer. If you can provide a link for the site then the information can be more accurate.

For the first image try this:

#ma-osim .text-center {
background-image: url(http://miha.lizman.info/wp-content/uploads/2016/06/150miha_elements-04-250.png);
background-position: center center;
}
#ma-osim .text-center:hover img {
visibility: hidden;
}

What that does is add the image you want to show on hover as a background. The nice thing is it’s loaded so there will be no delay on hover.
When you hover over the div the existing image goes hidden, but keeps the dimensions of the div intact, and the background image shows instead.

Your first image div has a unique id, #ma-osim, so the other two images will also need unique id’s to target them specifically.