@charset "utf-8";

/* Gallery and Playback Controls */
#galleries {margin:0 auto 20px auto; }
#galleries label { padding-bottom: 2px; }

#gallerySelect { width: 180px; }
#galleryLinks a {color: white;	text-decoration: none;}

#controls {	margin:0 auto 10px auto; }

#transport {margin: 0;padding: 0;list-style: none;}
#transport li {float: left;margin: 0;padding: 0;text-align: center;}
#transport a {text-decoration: none; text-transform: uppercase; font-size: 85%; letter-spacing: 0.1em; font-weight:bold; 
	margin: 0 1px 0 0;padding: 4px 8px;	width: 64px;float: left;display: block;
	-moz-user-select: none;	-khtml-user-select: none;}
#transport a:link {background: #666 url('../img/bg_grad_gray1.gif') repeat-x;	color: #fff;
	border-top: solid 1px #999;	border-right:solid 1px #404040;border-bottom: solid 1px #3a3a3a;border-left: solid 1px #404040;}
#transport a:visited {background: #666 url('../img/bg_grad_gray1.gif') repeat-x;	color: #fff;
	border-top: solid 1px #999;	border-right:solid 1px #404040;border-bottom: solid 1px #3a3a3a;border-left: solid 1px #404040;}
#transport a:hover {background: #666 url('../img/bg_grad_gray2.gif') repeat-x;	color: #000;
	border-top: solid 1px #999;border-right: solid 1px #404040;border-bottom: solid 1px #3a3a3a;border-left: solid 1px #404040;}
#transport a:focus {-moz-user-select: none;-khtml-user-select: none;}

#transport .playBtn .pauseLabel, #transport .pauseBtn .playLabel {display: none;}

#previews {width: auto;padding: 5px;margin: -5px 5px 5px 410px;
	border-top: solid 1px #404040;}
	
#thumbnails {margin: 10px auto;}
#thumbnails div {position: relative;width: 60px;height: 50px;float: left;margin: 8px;padding: 0;float: left;display:inline;}
#thumbnails img {position: absolute;width: 60px;height: 50px; border: solid 2px #eed;}

#picture {padding: 0px;width: 400px;float: left;text-align:center}
#picture img {border: 1px solid #999; }

#mainImage {width: 100%;height: 100%;}
#mainImageOutline {margin: 0 auto;padding: 0;background-color: #eee; border: solid 1px #bbb; padding: 12px;overflow: hidden; width: 0px;height: 0px;}

.selectedThumbnail { width: 58px !important;height: 48px !important; border: solid 3px #f60 !important; }
.inFocus {  border: solid 1px #f60 !important; }

/* Utility IDs, classes, and HTML selectors */
.clear    {clear: both;height: 0;visibility: hidden;display: block;margin: 0;padding: 0;}
.ClearAll {clear: both;height: 0;font-size: 0;line-height: 0;}

code {color: #000; }
pre {color: #000;font-size: small;}

.highlightedcode {background-color: #ff9;}

.sample {background: #eee;	padding: 20px;	border: 2px solid #666;	margin-top: 20px;overflow: scroll;}