/* GENERAL STYLES */

* { 
	margin: 0; padding: 0; 
	font: 100%/150% Verdana,sans-serif; 
}

html { height: 100%; }

body 
{  
	background: black url('../images/leftbackground.jpg') repeat-y top left;
	height: 100%;
}

a { text-decoration: none; }

ul { list-style-type: none; }

img { border: none; }

hr { height: 3px; color: rgb(33%,33%,33%); width: 80%; margin: 10px auto; }

/* MAIN PAGE STYLES */

#wrap1 
{ 
	background: url('../images/leftbackground.jpg') repeat-y top left;
	min-width: 900px; padding-left: 20px;
	height: 100%;
}

#wrap2 
{ 
	background: url('../images/rightbackground.jpg') repeat-y top right;
	min-width: 900px; padding-right: 20px;
	min-height: 100%;
}

#header
{ 
	width: 900px; margin: 0 auto 20px auto; padding-top: 20px;
	background-color: transparent;
}

	#header img
	{
		width: 900px; height: 140px; display: block;
	}

	h1
	{
		font: 200%/250% Verdana,sans-serif; padding: 0 20px;
	}

#middle
{ 
	width: 900px; margin: 0 auto;
	font-size: 90%;
	color: rgb(75%,75%,75%);
	
}

	#middle h2
	{
		font: 120%/100% Verdana, sans-serif;
		color: white;
		padding-bottom: 10px;
	}
	
	#middle h3 { color: white; padding: 5px 0; }
	
	#middle p { margin-bottom: 10px; }
	
	#middle em { font-style: italic; }

#leftlinks
{ 
	float: left; 
	width: 340px; margin-right: 10px;
}
	
	#leftlinks li
	{
		width: 100%; height: 65px; margin-bottom: 15px;
	}
	
	#leftlinks a { display: block; }
	
	#leftlinks img
	{
		width: 340px; height: 65px;
		float: left;
	}

#rightcontent
{ 
	float: right; 
	width: 540px; margin-left: 10px;
}

	#recentpics
	{
		background: transparent;
		margin-bottom: 20px;
		height: 60px;
	}
	
	/* 540px / 7 pics = 77.14 px per pic, or 65px + 12 px margin */
	.recentpic
	{
		float: left;
		width: 65px; height: 65px; margin: 0 6px;
	}
	
	#rightcontent a, #footer a { color: white; }
	
	#rightcontent a:hover, #footer a:hover { text-decoration: underline; }
	
	#rightcontent ul 
	{ 
		margin-bottom: 10px; 
		list-style-type: square; 
		padding-left: 20px; 
	}
	
#footer
{
	width: 900px; padding: 10px 0; margin: 0 auto; 
	clear: both;
	text-align: center;
	font-size: 75%;
	color: rgb(75%,75%,75%);
	
}

/* ABOUT PAGE STYLES */

#rightcontent #contactheader:hover { text-decoration: none; }

#contactform
{
	width: 498px;
	margin: 0 10px 20px 10px;
	padding: 20px 0 10px 0;
}

	#contactform fieldset { margin: 0; }

	#contactform label { width: 100px; }

	#contactform .formbox { width: 300px; }
	
	#contactform .invisible { display: none; }
	
	#contactlink { text-decoration: underline; }

/* PORTFOLIO STYLES */

#rightcontent #pfheading /* needs #rightcontent so that cascade overwrites earlier h2 padding */
{
	height: 30px; padding: 0px;
	text-align: center;
}
	
#rightcontent #portfoliocats
{
	height: 35px; margin: 0 auto 15px auto;
	text-align: center;
}
	
#portfoliocats li
{
	display: inline; 
}
	
#portfoliocats a
{
	color: rgb(75%,75%,75%);
}
	
#portfoliocats a:hover
{
	color: white;
}

#thumbnails
{

}

	.thumbnail
	{
		float: left;
		width: 65px; height: 65px; margin: 0 6px 15px 6px;
	}
	
#picturediv
{
	
}

	#picturediv h2 { text-align: center; }

	#picturediv img
	{
		float: left;
		width: 534px;
		border: 3px rgb(30%,40%,30%) solid;
	}
	
	#picdescription { clear: both; padding-top: 10px; }

/* ADMIN STYLES */

.center { text-align: center; }
h3.center { font-weight: bold; margin-bottom: 10px; }

	fieldset
	{
		background: rgb(25%,25%,25%);
		border: 1px rgb(75%,75%,75%) solid;
	}
	
	legend
	{
		font-size: 120%; padding: 5px; margin-left: 10px;
		color: white;
	}
	
	input, textarea, select
	{
		margin: 0 0 10px 10px;
		border: 1px rgb(75%,75%,75%) solid;
		padding: 3px;
	}
	
	label
	{
		float: left;
		width: 120px; padding-left: 10px;
		font-size: 80%;
		text-align: right;
	}
	
	table
	{
		width: 500px; margin: 0 auto;
		border-collapse: collapse;
		border: 1px rgb(75%,75%,75%) solid;
		background-color: rgb(25%,25%,25%);
		
	}
	
	th 
	{ 
		font-weight: bold; 
		padding: 5px; 
		background-color: rgb(75%,75%,75%);
		color: black;
	}
	
	td 
	{ 
		padding: 5px 5px; 
		text-align: center; 
	}
	
	.admindiv
	{
		border: 1px rgb(75%,75%,75%) solid;
		margin: 10px; padding: 10px;
	}
	
	.admindiv .formbox { width: 200px; }
	
	.admindiv p { text-align: center; }
	
	.admindiv a { color: white; }
	
	.admindiv a:hover { text-decoration: underline; }

	.adminform
	{
		width: 500px; margin: 10px auto;
	}
	
#loginform 
{
	width: 50%; margin: 0 auto; padding: 10px;
}

#adminupdateform
{
	width: 500px; margin: 10px auto;
}