* {
	margin: 0;
	padding: 0;
}

.analog {
	position: relative;
	width: 68px;
  margin: auto;
	background: #f6d930;
    border-radius: 50%;
	list-style: none;
}
.active .analog {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAADG0lEQVRYw8XYa2jNcRzH8XPOdmYuMZdhmwmLmGYTppYt4gFSksgjuTTZgyXkEnlMRrk8WC7FE3PXSDQkl2Qrl1xmzdyZyWWIrIjj/a3Pv461Y+d+Hrz6t9PZ9vn//t/f7/f9/V0/GgtcEUpGGrqH8/s+n+8fof4Bt65JmIg12Ibt2KXrJixEIfrquzEJ1Ae52Iz7qEcdHqNR1wY81M/3UIUlGBjtQMWoxFs8wx7MxxQM10j0RjbGYQF24ha+4ypK0SXSQN1Qhtd4h0XorwDB3IjV1XTchQ+nMCrcQINwCM04i7wIi3+xbqxBIYMOZIU7GmfQih3oEYXZ6NVEqNNNjg02kBXuFdXK8nCn838UoAm1NlE6C2QjUYEWlOuuXDFQgi84CE+gQB4s1aw4gfQYhXGsUKEv6yiQ1U0OzmkdKY5xGGcALuG5lUn7QF4tYB+wV9uBKw5s8nzUyu72D9RLW8ADzIxTGOfJHMBFpPoHytNqWhnHMCYVq/AeRf6BSrUtlMU5kLMt2d640T+Q7dptVvEJCDQGt3HMlh3nOa7Tbp2dgEBdcRknkeV8YIX1BuMTEMh2gsO4gGEudXtb8SQRI2R1w/U4apDpVPoW7S8lCRihLNzEHdvbnA9XKtCsBATKUGdR7RS1masGrDwBgWaoXCr8p326Vun9WrXjFSZZC+Mre0rtd/vdeIkhfqeLWLNW+Ih6o0n+gTzq4F5gThxHKFfrn51k0tqPUCauqbgz4hDGq6dSr/XP01HHOFtN077ODngRSlKj36zjkjdQC+vR8P3RhhurQPnqLqx2hnbW5PfUqtmqKRntMIVqkZt0oHQHcy7L0S88xVSdOD1RCDNNO3ubNvSUUA6Kk9Vff8PaKJzNylUzj9Qup4RzlLZe5ahqqkbn+YwQmng7io/UWvNVbcaESF82eNS4WUf5C9exWsM/Qv/U+e4ATWF7CTEPp/V4rJFfj8HRfB1jd7pBu/JP/MZnvXqxk+55HZPrVXufcEOPpyjQoTOSQG6NRr7qoUrhWqRWLyWqdYIp0eh6Y/kGLZB+mpnZoW7O7QP9Bf41DL4ze4GtAAAAAElFTkSuQmCC);
}

.analog,.analog .hour,.analog .min,.analog .sec {
	height: 68px;
    background-size: contain;
}

.analog .hour,.analog .min,.analog .sec {
	position: absolute;
	width: 68px;
	top: 0;
	left: 0;
    padding: 0;
}

.analog .sec {
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEQAAABECAYAAAA4E5OyAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDJGNkZGOUJDNUJFMTFFN0E0MkJGOTNBRjA5RjlENjgiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDJGNkZGOUNDNUJFMTFFN0E0MkJGOTNBRjA5RjlENjgiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo5MDEwM0YzNkM1QkQxMUU3QTQyQkY5M0FGMDlGOUQ2OCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo0MkY2RkY5QUM1QkUxMUU3QTQyQkY5M0FGMDlGOUQ2OCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PqPn/IsAAACPSURBVHja7NqxDYAgEEBREcZwB/cfgx1Yg5yNwc5QXvF+RXl54agoEXHo60QA5LeWYYher3W+53BD3sLKeEOAAAECBAgQIAICBAgQIECAAAECBAgQIECAAAEiIECAAAECBAgQIECA7FVSDOEns5UBAgQIECBAgAABAgQIECBAgAARECBAgAABAgRIgh4BBgBzWAqD+0CKDQAAAABJRU5ErkJggg==);
	z-index: 3;
}
.active .analog .sec {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAAbElEQVRYw2P6//8/A6X4200DdhCmhllMDNQBfFBMMRh1ED0dxD8aQkPJQfyjIURECI0m6tFsP+qg0XJo1EFI4DgQnxhMDmoE4oZB4yBOtfMHQHgwhRDVwKiDRh006qBRB406aNRBow4a7g4CALSRcd23UH9EAAAAAElFTkSuQmCC);
}

.analog .min {
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEQAAABECAYAAAA4E5OyAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6OTAxMDNGMkNDNUJEMTFFN0E0MkJGOTNBRjA5RjlENjgiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6OTAxMDNGMkRDNUJEMTFFN0E0MkJGOTNBRjA5RjlENjgiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo1NzZBOTI3RkM1QTQxMUU3QTQyQkY5M0FGMDlGOUQ2OCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo1NzZBOTI4MEM1QTQxMUU3QTQyQkY5M0FGMDlGOUQ2OCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PjrQkCIAAAEASURBVHja7NpBSsNAFAbgTnGr5BKiR2gv6HFygNK90BPkGIru07cYsQ1JdfdC53vwb2YCLR9vXgrTMo7jRv3WFsF1PWR+eClldj2za3XImjrkpyGmjWOGGKpAgAABAgQIEAUECBAgQIAAAQIECBAgQIAAuf9KuahausKc7mdcaWZ3yPM/15oAeYmcZtZPda85kLdIN7Pe1b2UKhnntM6Iz8jTwiPfkccWZ4jX7kUdb+wdWjwyr5H3mTnyEdlHhtaOzBDZRfrIV01f14YWO+TPyvhuKb9U1/xXUG8ZIECAAAECBAgQIECAAAECBAgQIAoIECBAgAABAgQIkPXXWYABAGT0LrGNyPM/AAAAAElFTkSuQmCC);
	z-index: 2;
}
.active .analog .min {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAAgUlEQVRYw+3UIQ6AMAwF0GWKqY0TAAbPEbg5EjfPRZCjJRWYuZIV8n/y08qXivpSirNU74xFBXQeS+SaAVFGKUCfAU1SXKiWAaBa6P90NHoq/6Jg4ULpsUdroAQQQAC9ANorextQmPNGY+XK3vxCN0oDowbSDEAAAQQQQAAB9HfQBU+rf90ZiaL5AAAAAElFTkSuQmCC);
}

.analog .hour {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEQAAABECAYAAAA4E5OyAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6OTAxMDNGMzBDNUJEMTFFN0E0MkJGOTNBRjA5RjlENjgiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6OTAxMDNGMzFDNUJEMTFFN0E0MkJGOTNBRjA5RjlENjgiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo5MDEwM0YyRUM1QkQxMUU3QTQyQkY5M0FGMDlGOUQ2OCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo5MDEwM0YyRkM1QkQxMUU3QTQyQkY5M0FGMDlGOUQ2OCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PsLBjVoAAAD3SURBVHja7NrNCcIwGAZgI14VlxAdQRd0HAcQ70In6BiK3ut3CChSfy4SS54X3ksiqI9NiqGp67qR3DNGAAQIECBAgAABAgTIEDIp+eYppd7xkv+vJn/wozx/+2TJ2EOAAAECBAgQIAIECBAgQID8MEXOQ14dDD3PlzgoKn2FLL4cqwJkGW16xps8Vx3INjrvGZ/nuSJJJdZp3iPO0dmLl1yj0xr3ELfdhxzezO1rXDKr6LFnHzlFN9G2tiXTRtfRXfSSu8tjbY1XyMcU+Wwey3SXAQIECBAgQIAAAQIECBAgQIAAESBAgAABAgQIECBAgAwtNwEGAKDkLq6Wqy69AAAAAElFTkSuQmCC);
	z-index: 1;
}
.active .analog .hour {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAAfUlEQVRYw+3WMQ6AIAyFYcLmAbiCQ2HxhvUSXsvdizhWSToRmftMHsmfMH5pGchmlpDKCewQRFA46L62XvFgJiQeFKgigRoaCG5CFekNlaFwkAyTCgfVCQ4C1NBWJlzZxzkm9zCQvu2ehoOW9eypx/8QQQQRRBBBBBH0N9ADfVN/3cx9ecYAAAAASUVORK5CYII=);
}

.title {
	font-size: 11px;
	font-weight: bold;
	color: #333;
}

.analog .meridiem {
	margin-top: 90px;
	font-size: 11px;
	font-weight: bold;
	color: #333333;
  display: inline-block;
}