/* -------------------------------------------------------

	This CSS Stylesheet only needs to be altered
	in the 6 places indicated below when the clock
	image sizes have been changed.

------------------------------------------------------- */


body {
	margin: 0;
	padding: 0;
	text-align: center;
	background: black; /* Transparent page background*/
	font-family: 'Open Sans', Arial, sans-serif;
	font-weight: 400;
}

#container {
	width: 600px; /*Alter this value to clock images width*/
	height: 600px; /*Alter this value to clock images width*/
	position: relative;
	top: 0px;
	left: 0px;
}

.rotatingHands {
	position: absolute;
	width: 600px; /*Alter this value to clock images width*/
	height: 600px; /*Alter this value to clock images width*/
	top: 0px;
	left: 0px;
}

.rotatingSeconds {
	position: absolute;
	width: 100px; /*Alter this value to clock images width*/
	height: 100px; /*Alter this value to clock images width*/
	top: 359px;
	left: 0px;
}

#hours, #minutes, #seconds {
	position: absolute;
	display: block;
}

.glass {
	position: absolute;
	width: 600px; /*Alter this value to clock images width*/
	height: 600px; /*Alter this value to clock images width*/
	top: 0px;
	left: 0px;
}