.magnify { width:800px; height=730px; position:relative; margin:0 auto; overflow:hidden; cursor:pointer; }

/* Create the magnifying glass */
.glass {
	width:250px; height:250px; /* Size of the magnifying glass */
	position:absolute;
	border-radius:100%;
    box-shadow: 0px 0px 0px 4px rgba(255, 255, 255, 0.33);

	/* Load the large image first */
	background: url('HUDF_large.jpg') no-repeat;
	
	/* Hide the magnifying glass by default */
	display: none;

    /* Display the magnified image on top of the demagnified image */
    z-index: 1;
}

/* To solve overlap bug at the edges during magnification */
.small { position:relative; display:block; }

/* Need display:block; in order for text-align:center; to work */
#line1 { position:relative; display:block; text-align:center; color:rgb(250,250,250); font-size:22px; z-index:1; }
#line2 { position:relative; display:block; text-align:center; color:rgb(250,250,250); font-size:22px; z-index:1; }