* {
margin: 0;
padding: 0;
}
.magnify {
width: 275px;
margin: 50px auto;
position: relative;
}
/*Lets create the magnifying glass*/
.large {
width: 150px;
height: 150px;
position: absolute;
border-radius: 100%;
/*Multiple box shadows to achieve the glass effect*/
box-shadow: 0 0 0 7px rgba(255, 255, 255, 0.85),  0 0 7px 7px rgba(0, 0, 0, 0.25),  inset 0 0 40px 2px rgba(0, 0, 0, 0.25);
/*Lets load up the large image first*/
background: url('p5.jpg') no-repeat;
/*hide the glass by default*/
display: none;
}
/*To solve overlap bug at the edges during magnification */
.small {
display: block;
}
#col1, #col2, #col3, #col4 {
float: left;
width: 25%;
}