@import url("/lib/css/popPage.css");

body { background-color: #611; }
#main_content { max-width: 100%; }
#page_content { background: #232323; color: #444; }
.eof { clear: both; }

h3 { 
	text-align: left; margin: 0 0 1ex; 
	font-size: 140%; font-weight: bold; letter-spacing: .4em; color: #666; width: 528px; margin: auto; }
h3 strong { color: #999; font-size: 190%; font-weight: normal; letter-spacing: .1em; margin: -.4ex 0; display: block; text-align: right; }


ul.thumbnails { padding: 0; position: relative; text-align: center; }
ul.thumbnails li { list-style: none; display: inline-block; }
ul.thumbnails li { float: left; margin: 4px; }
ul.thumbnails li a { 
	display: block;
	padding: 8px; margin: 0px; 
	width: 64px; height: 64px; line-height: 62px; }
ul.thumbnails li a img { vertical-align: middle; margin: 0 auto; border: 0; }


/* experimental: force horizontal scrolling */ /*
div.thumbnails { width: 100%; overflow: hidden; }
ul.thumbnails { white-space: nowrap; overflow: scroll; margin-right: -15px }
body { overflow: hidden; }
*/

/* ** special duo tone border... ** */
ul.thumbnails li { border: 1px solid #000; }
ul.thumbnails li a { margin: -1px; }
/* ** standard border... ** */
ul.thumbnails li a { border: 1px dotted #666; }
ul.thumbnails li a:hover { border: 1px solid #999; }


div#photo_display-frame { border: 1px solid #555; text-align: center; }
/* ** various picture sizes [only one at a time!]... ** */
/*/ /* *
div#photo_display-frame { height: 320px; width: 320px; padding: 8px; margin: auto }
div#photo_display-frame img { height: 320px; }
/*/ /* */
div#photo_display-frame { height: 512px; width: 512px; line-height: 512px; padding: 8px; margin: auto }
div#photo_display-frame img { max-height: 512px; max-width: 512px; vertical-align: middle; }
/*/ /* *
div#photo_display-frame { height: 640px; width: 640px; padding: 8px; margin: auto }
div#photo_display-frame img { max-height: 640px; max-width: 640px; }
*/ /* *
div#photo_display-frame { height: 768px; width: 768px; padding: 8px; margin: auto }
div#photo_display-frame img { max-height: 768px; max-width: 768px; }
*/


#controls, #controls * { margin: 0; padding: 0; }
#controls { margin-top: 1em; }
#controls { 
	list-style: none; position: relative; overflow: hidden;
	width: 100%; height: 3em; 
	border: 1px solid #333; 
	letter-spacing: -.6ex; white-space: nowrap; }
#controls li { list-style: none; display: inline-block; width: 20%; text-align: center; letter-spacing: .2ex; float: left; }
#controls li a { 
	display: block; width: 100%; height: 3em;
	line-height: 1.5em; 
	background: #191919; color: #282828 !important; 
	text-decoration: none; font-weight: bold; -moz-opacity: .7 }
#controls:hover li a { background: #191919; color: #444 !important; opacity: 1;}
#controls li a:hover { color: #666 !important; }
#controls span.text { display: block; font-family: "Lucida Grande", sans-serif; font-size: 80% }
/* #controls li#pause { display: none; } */