.clock{
	/* The .clock div. Created dynamically by jQuery */
	background-color:#000;
	height:100px;
	width:200px;
	position:relative;
	overflow:hidden;
	float:left;
}

.clock .rotate{
	/* There are two .rotate divs - one for each half of the background */
	position:absolute;
	width:200px;
	height:100px;
	top:0;
	left:0;
}

.rotate.right{
	display:none;
	z-index:11;
}

.clock .bg, .clock .front{
	width:100px;
	height:100px;
	background-color:#000;
	position:absolute;
	top:0;
}

.clock .display{
	/* Holds the number of seconds, minutes or hours respectfully */
	position:absolute;
	width:200px;
	font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
	z-index:20;
	color:#dd9d14;
	font-size:60px;
	text-align:center;
	top:20px;
	left:0;
	line-height:65px;
	
	/* CSS3 text shadow: */
	text-shadow:4px 4px 5px #333333;
}

/* The left part of the background: */

.clock .bg.left{ left:0; }



.clock .front.left{
	left:0;
	z-index:10;
}