body {font-family: 'Open Sans', sans-serif; margin:0; padding: 0;}
#myclock2 {
	width: 200px; 
	margin: 0 auto; 
	position: relative;
	z-index: -1;
}

#myclock3 {
	width: 300px; 
	margin: 0 auto; 
	position: relative; 
	text-align: center
	}
	
#myclock3 small {
	font-size: 12px; 
	color: #999; 
	font-weight: normal;
	}
	
#myclock3 small a {
	font-size: 12px; 
	color: #999; 
	font-weight: normal;
	}
	
.outer_face {
	height: 200px;
	border-radius: 200px; 
	background: white;
	border: 2px solid #999;
	}

.outer_face::before, .outer_face::after, .outer_face .marker {
    content: "";
	position: absolute; 
	width: 8px; 
	height: 100%;
	background: black;
	z-index: 0;
	left: 50%;
	margin-left: -4px;
	top: 0
	}

.outer_face::after {
	-moz-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
	transform: rotate(90deg)
	}
	
.outer_face .marker {
	background: gray;
	width: 6px;
	margin-left: -3px;
	}

.outer_face .marker.oneseven {
	-moz-transform: rotate(30deg);
	-ms-transform: rotate(30deg);
	-webkit-transform: rotate(30deg);
	transform: rotate(30deg);
	}
	
.outer_face .marker.twoeight {
	-moz-transform: rotate(60deg);
	-ms-transform: rotate(60deg);
	-webkit-transform: rotate(60deg);
	transform: rotate(60deg);
	}
	
.outer_face .marker.fourten {
	-moz-transform: rotate(120deg);
	-ms-transform: rotate(120deg);
	-webkit-transform: rotate(120deg);
	transform: rotate(120deg);
	}
	
.outer_face .marker.fiveeleven {
	-moz-transform: rotate(150deg);
	-ms-transform: rotate(150deg);
	-webkit-transform: rotate(150deg);
	transform: rotate(150deg);
	}

.inner_face {
	position: relative;
	width: 88%;
	height: 88%;
	background: white;
	-moz-border-radius: 1000px;
	-webkit-border-radius: 1000px;
    border-radius: 1000px;
	z-index: 1000;
	left: 6%;
	top: 6%;
	}
	
.inner_face::before { 
	content: "";
	width: 18px;
	height: 18px;
	border-radius: 18px;
	margin-left: -9px;
	margin-top: -9px;
    background: black;
	position: absolute;
	top: 50%;
	left: 50%;
	}
	
.inner_face span {
	position: absolute;
	top: 78%;
	font-size: 13px;
	left: 23%;
	color: #999;
	}

.hand, .hand.hour {
	position: absolute;
	width: 4px;
	height: 30%;
	top: 20%;
	left: 50%;
	margin-left: -2px;
	background: black;
    -moz-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
    -moz-transform-origin: bottom;
	-ms-transform-origin: bottom;
	-webkit-transform-origin: bottom;
	transform-origin: bottom;
    z-index: -1;
	}

.hand.minute {
	height: 45%;
	top: 5%;
	width: 5px;
	margin-left: -2.5px;
	}
	
.hand.second {
	height: 50%;
	width: 2px; 
	margin-left: -1px; 
	top: 0;
	background: red;
	}