.catalog{
position: relative;
z-index: 0;
}

.catalog:hover{
background-color: transparent;
z-index: 100;
}

.catalog span{ /*CSS for enlarged image*/
position: absolute;
background-color: white;
padding: 5px;
left: 150px;
border: 1px dashed gray;
visibility: hidden;
color: black;
width: 16em;
text-decoration: none;
}

.catalog span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.catalog:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: -250px;
left: 140px; /*position where enlarged image should offset horizontally */

}



.article{
position: relative;
z-index: 0;
}

.article:hover{
background-color: transparent;
z-index: 100;
}

.article span{ /*CSS for enlarged image*/
position: absolute;
background-color: white;
padding: 2px;
left: 150px;
border: 1px dashed gray;
visibility: hidden;
color: black;
width: 40em;
text-decoration: none;
}

.article span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.article:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: -550px;
left: -600px; /*position where enlarged image should offset horizontally */

}