	#animator {
		font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
		position: relative;
		margin: 0 auto;
		display: block;
		background-color: black;
		width: 100%; /* free to set */
		overflow: auto;
		max-width: 1600px; /* free to set */
		max-height: calc( 900px + 25px ); /* maybe dont set this???? */
		
	}
	#animator #rateChange {
		position: absolute;
		top: calc( 50% - 36px );
		left: calc( 50% - 100px );
		z-index: 100;
		width: 200px;
		height: 72px;
		color: white;
		text-align: center;
		font-size: 72px;
		line-height: 72px;
		-webkit-text-stroke: 5px black;
		text-stroke: 5px black;
		font-weight: 900;
		-webkit-text-stroke: 3px black;
		text-stroke: 5px black;
		box-sizing: border-box;
		user-select: none;
		white-space: nowrap;
		display: none;
	}
	#animator canvas#canvas {
		display: block;
		width: 100%;
		height: 100%;
	}
	#animator canvas#enhance {
		display: none;
	}
	
	#animator #controls {
		font-size: 12px;
		width: 100%;
		height: 25px;
		margin: 0 auto;
		user-select: none;
	}

	#animator #timerBar {
		background: rgb(66,127,66);
		background: -moz-linear-gradient(top, rgb(66,127,66) 0%, rgb(171,204,171) 100%);
		background: -webkit-linear-gradient(top, rgb(66,127,66) 0%,rgb(171,204,171) 100%);
		background: linear-gradient(to bottom, rgb(66,127,66) 0%,rgb(171,204,171) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#427f42', endColorstr='#abccab',GradientType=0 );
		text-align: center;
		float: left;
		line-height: 25px;
		text-shadow: white 1px 1px 1px;
		height: 100%;
		width: 82%;
		overflow: hidden;
		position: relative;
	}
	#animator #slider {
		position: absolute;
		background: #e2e2e2;
		background: -moz-linear-gradient(-45deg,  #e2e2e2 0%, #dbdbdb 50%, #d1d1d1 51%, #fefefe 100%);
		background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#e2e2e2), color-stop(50%,#dbdbdb), color-stop(51%,#d1d1d1), color-stop(100%,#fefefe));
		background: -webkit-linear-gradient(-45deg,  #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%);
		background: -o-linear-gradient(-45deg,  #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%);
		background: -ms-linear-gradient(-45deg,  #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%);
		background: linear-gradient(135deg,  #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2', endColorstr='#fefefe',GradientType=1 );
		color: black;
		width: 40px;
		height: 25px;
		line-height: 23px;
		border: 1px solid #000;
		border-radius: 12px;
		z-index: 100;
		top: 0; /* keeps the marker from breaking to new line due to text in rollover region */
		left: 0;
		cursor: pointer;
		box-sizing: border-box;
	}
	#animator #controls button {
		width: 6%;
		height: 100%;
		color: white;
		float: left;
		display: block;
		box-sizing: border-box;
		font-size: 12px;
		border: none;
		cursor: pointer;
		user-select: none;
		background: rgb(204,204,204);
		background: linear-gradient(to bottom, rgb(204,204,204) 0%,rgb(127,127,127) 100%);
		outline: none;
	}
	#animator #controls button[name="rate"]:active {
		background: rgb(171,204,171);
		background-image: url(../images/common/ani/speed.png), linear-gradient(to bottom, rgb(171,204,171) 0%,rgb(66,127,66) 100%);
		background-position: center;
		background-repeat: no-repeat;
		background-size: contain;
	}
	#animator #controls button[name="rate"] {
		background: rgb(204,204,204);
		background-image: url(../images/common/ani/speed.png), linear-gradient(to bottom, rgb(204,204,204) 0%,rgb(127,127,127) 100%);
		background-position: center;
		background-repeat: no-repeat;
		background-size: contain;
	}
	#animator #controls button[name="rate"][value="-"] {
		transform: scaleX(-1);
	}
	#animator #controls button[name="loopToggle"][value="stopped"] {
		background: rgb(171,204,171);
		background-image: url(../images/common/ani/play.png),linear-gradient(to bottom, rgb(171,204,171) 0%,rgb(66,127,66) 100%);
		background-position: center;
		background-repeat: no-repeat;
		background-size: contain;
	}
	#animator #controls button[name="loopToggle"][value="started"] {
		background: rgb(204,204,204);
		background-image: url(../images/common/ani/stop.png),linear-gradient(to bottom, rgb(204,204,204) 0%,rgb(127,127,127) 100%);
		background-position: center;
		background-repeat: no-repeat;
		background-size: contain;

	}