html {
	width: 100%;
	height: 100%;
}

body {
	width: 100%;
	height: 100%;
	background: #000 url('../img/safe-small.jpg') center center no-repeat;
	background-size: 1681px auto;
}

#safe {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 800px;
	height: 649px;
	margin: -300px 0 0 -400px;
}
	.kn-dial {
		display: block;
		width: 158px;
		height: 158px;
		position: absolute;
		left: 311px;
		top: 266px;
	}
		.kn-dial .ui-knob {
			background: url('../img/safe_dial.png') center center no-repeat;
			background-size: 100% auto;
			width: 100%;
			height: 100%;
		}
	.kn-dial:hover {
		cursor: pointer;
	}

	#number-display {
		position: absolute;
		top: 228px;
		left: 291px;
		width: 200px;
		text-align: center;
		color: rgba(239, 247, 246, 0.34);
		font-size: 26px;
		opacity: 0;
		transition: all 1s;
	}
		#number-display.active {
			opacity: 1;
			top: 210px;
			transition: all 0.3s;
		}