/*
TITLE:	Photo Stylesheet
AUTHOR:	Khaled Maiwand, HighCo Technology
CREATED:	Oct. 2007
Inspired:	www.danshalaby.com
*/
* {margin: 0; padding: 0; border: 0; }
body {
	font: 85% Helvetica, Verdana, sans-serif;
	color: #666; background: #000;
	}

#wrapper{
	position: absolute;
	top: 50%; left: 50%;
	margin: -330px 0 0 -400px;	/* content: 800px by 600px */
	}

#header{
	width: 800px;
	text-align: right;
	font: normal 26px Verdana, Helvetica, sans-serif;
	color: #999;
	}
	#header p.sub{ font-size: 50%;}

#main{ 
	width: 800px; height: 560px;
	border: thin dotted #333;
	background: #888;
	}

#menu{ 
	width: 800px; 
	text-align: center;
	margin-left: 40px;
	font: normal bold 90%/25px Helvetica, Verdana, sans-serif; }
	#menu a{
		float: left;
		display: block;
		width: 100px;
		text-decoration: none;
		color:  #666;
		}
		#menu a:hover, #menu a#active{ color: #fff; }

#footer{
	clear: both;
	margin-top: 20px;
	text-align: center;
	font-size: 80%;
	}
	#footer a{ color: #666; }
#thumbs {	/*-------------------------------------- container for the thumbnails ----------------------------------------*/
	position: absolute;
	top: 52px; left: 8px;
    width: 240px;	/* two thumbnails per row */
	}
	#thumbs a img{ 
		float: left;
		width: 102px; height: 102px;
		margin: 2px 2px;
		opacity: .3; filter: alpha( opacity=30); 
		}
	#thumbs a:hover{ background-color: transparent; } /* important for IE6!  */
	#thumbs a:hover img, #thumbs a img.selected{ opacity: 1; filter: alpha( opacity=100); }
#thumbs a span{ /*-------------------------------------- Enlarged image ----------------------------------------*/ 
	display: none;	/* hidden until hovered */
 	position: absolute;
	top: 2px; left: 235px; 
	text-decoration: none;
	}
	#thumbs a:hover span{ display: block;}	/* make visible */ 
	#thumbs a:hover span img{ 
		width: 550px; height: 550px; 
		margin: 0; 
		}
#image{
	float: right;
	width: 550px; height: 550px;
	margin: 4px 9px 0 0;
	}
	#image>img{ height: 550px; }
img{
	border: 2px solid #333;	/* top and left darker */
	border-right: 2px solid #ccc;
	border-bottom: 2px solid #ccc;
	}