/************************************
* JSani - JavaScript Animator
* http://www.ssec.wisc.edu/~billb/jsani/
*
* Copyright 2010, Bill Bellon
* Licensed under the GPL Version 3 licenses.
* http://www.ssec.wisc.edu/~billb/jsani/license
*
* Includes jQuery.js 
* http://jquery.com/
* Copyright 2010, John Resig
* Dual licensed under the MIT or GPL Version 2 licenses.
* http://jquery.org/license
*
* Includes Sizzle.js
* http://sizzlejs.com/
* Copyright 2010, The Dojo Foundation
* Released under the MIT, BSD, and GPL Licenses.
************************************/
@charset "utf-8";
#jsani {
	margin: 0 auto;
	border: solid 0px #000;
	background-color: #EEE;
	display: none; /* will be made visible by jsani.js code */
}
#controlsContainer {
	width: 100%;
	min-height: 30px; /* height will be readjusted via JavaScript if overlays or other optional controls are present */
	position: absolute;
	top: 0px;
	color: #FFFFFF;	
	border: none;
	border-bottom: solid 1px #333;
	display: table;
}
#controlsContainer .controlSet {
	width: 100%;
	height: auto;
}
#controlsContainer .controlSet label {
	white-space: nowrap;
	float: left; /* done to make IE9 wrap labels to next line when needed */
	margin-left: 10px;
}
#controlsContainer .controlSet label:hover span {
	text-decoration: underline;
}
#controlsContainer #controlSet_1 {
	/****
	CSS code generated via
	http://gradients.glrzad.com/
	*****/
	background-color: rgb(99, 99, 120);	
	background-image:  -webkit-gradient( linear, left bottom, left top, color-stop(0.12, rgb(156,156,156)), color-stop(0.57, rgb(99,99,120)) );
	background-image: -moz-linear-gradient( center bottom, rgb(156,156,156) 12%, rgb(99,99,120) 57% );
	border-bottom: solid 1px rgb(66,66,99);
	/**************
	background-color: rgb(0, 0, 102);	
	background-image:  -webkit-gradient( linear, left bottom, left top, color-stop(0.12, rgb(0,0,156)), color-stop(0.57, rgb(0,0,99)) );
	background-image: -moz-linear-gradient( center bottom, rgb(0,0,156) 12%, rgb(0,0,99) 57% );	
	*******************/
	height: 30px; /* height is NOT readjusted by JavaScript*/
}
/** #controlsContainer #controlSet_2 td { **/
#controlsContainer #controlSet_2 {
	padding: 3px;
	background-color: rgb(99,99,120);	
	display: table;
}

#controlSet_1 #controlSet_2 {
	margin-bottom: 15px;
}

.button, .button_disabled {
	height: 100%;
	min-width: 2.5em;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	vertical-align: middle;
	text-align: center;
	cursor: pointer;
}
.button_disabled {
	color: #333 !important;
}

/* turn off text highlighting on buttons: begin */
.button::-moz-selection, .button_disabled::-moz-selection {
	background: none;
}
/* IMRPOVE - merge this code with the above .button::-moz-selection code */
.unselectable {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}


.button::selection, .button_disabled::selection {
	background: none;
}
/* turn off text highlighting on buttons: end */
#previousButton, #nextButton {
	width: 3em;
}
#controlsContainer #controlSet_1 td {
	vertical-align: middle;
	padding: 0 !important;
	/*border-left: solid 1px #7272dd;*/
	border-left: solid 1px #aaa;	
	border-right: solid 2px #333;
}
#slowFastContainer input[type='button'] {
}
#speedContainer {
	vertical-align: middle;
	text-align: right;
}
#speedBarContainer {
	font-size: 15px;
	font-family: arial, sans-serif;
	font-weight: bold;
	color: white;
	margin-left: auto;
	margin-right: auto;
	white-space: nowrap;
	width: 125px;
}
#speedBar {
	float: left;
	cursor: pointer;
	width: 100px;
	border-width: 0px; /* needed for IE bug fix */
	height: 15px;
	overflow: visible;
	margin: 3px;
	position: relative;
}
#speedLine {
	height: 1px;
	background-color: #999;
	position: relative;
	top: 7px;
}
#speedButton {
	width: 8px;
	height: 7px;
	background-color: rgb(238, 238, 238);
	position: absolute;
	top: -3px;
	left: 88px;
}
#speedMinus {
	float: left;
	cursor: pointer;
	position: relative;
	top: 1px;
}
#speedPlus {
	float: left;
	cursor: pointer;
	position: relative;
	top: 3px;
}
.speedPlusMinus {
}
#previousContainer {
	vertical-align: middle;
	text-align: center;
}
#stopContainer {
	vertical-align: middle;
	text-align: center;
}
#nextContainer {
	vertical-align: middle;
	text-align: center;
}
#jsani {
	overflow: hidden;
	position: relative;
}
#jsaniContainer {
	background-color: #EEE;
	text-align: center;
	margin-top: 15px;
}
#jsaniImg {
}
#countDownTimerContainer {
	display: block;
	width: 33%;
	height: 44px;
	position: absolute;
	background-color: rgb(204, 204, 204);
	z-index: 101;		/* other elements besides image frames and overlays should be above 100*/
	top: 30%;
	left: 33%;
	right: 33%;
	border: 1px solid rgb(51, 51, 51);
}
#countDownTimerBarContainer {
	width: 80%;
	height: 18px;
	position: absolute;
	background-color: #3366FF;
	z-index: 102; /* other elements besides image frames and overlays should be above 100*/
	top: 13px;
	bottom: 13px;
	left: 10%;
	right: 10%;
	border: 1px solid rgb(51, 51, 51);
}
#countDownTimerBar {
	width: 100%;
	height: 18px;
	position: absolute;
	background-color: rgb(255, 255, 255);
	z-index: 103;		/* other elements besides image frames and overlays should be above 100*/
	right: 0px;
	text-align: center;
	vertical-align: middle;
}
#loadingText {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	z-index: 201;		/* other elements besides image frames and overlays should be above 100*/
	font-weight: bold;
	display: block;
	position: absolute;
	top: 1px;
	left: 50%;
	margin-left: -2em;
}
#loadingGIF {
	position: relative;
	top: 2px;
	left: 2px;
}
#jsani_debug {
	border: solid 1px #ccc;
	background-color: #efefef;
	width: 100%;
	height: 20em;
	overflow: scroll;
}
#zoomButton {
	min-width: 4.6em;
}
