body, html {height:100%;}
body {
	background: #eaedef url('../images/bkgd.gif') repeat-x;
	padding:0;
	margin:0;
	text-align:center;
	font: 90%/155% Verdana,arial,sans-serif;
	color: #000;
}

a {
	text-decoration:none;
	-moz-outline-style:none;
	outline-style:none;
	color:#900;
}

a:hover {text-decoration:underline;}

#container {
	width: 814px;
	margin: 0 auto;
	text-align: center;
	position:relative;
} 

/*-----------------------(header)-------------------------------*/
#header
{
	background: #fff url('../images/logo.gif') no-repeat;
	width:800px;
	height:77px;
	margin-left:7px;
}

#header a.returnHome
{
	display:block;
	width:295px;
	height:42px;
	position:absolute;
	top:18px; 
	left:0;
	text-decoration:none;
}

#header a.returnHome span, #header span {visibility:hidden;}
/*-----------------------(Nav)-------------------------------*/
ul.nav {
	background:	url('../images/navbar.gif') no-repeat;
	margin:0;
	padding:0;
	list-style-type:none;
	width:424px;
	height:14px;
	position: relative; 
	top:48px;
	left:373px;
}

ul.nav li {
	position: absolute;
	top:0; 
	height:14px;
	overflow:hidden;
	display: block; 
}	
	
ul.nav a {
	display: block; 
	text-indent: -9999px; 
	text-decoration: none; 
	height:14px;
}	

#projects {left: 0; width: 68px;}
#about {left: 173px; width: 68px;}
#contact {left: 339px; width: 85px;}   /* border:1px solid red;*/

#projects a:hover, #projects a.on {
	background: url('../images/navbar.gif') 0 -14px no-repeat; 
	width: 68px;
}

#about a:hover, #about a.on {
	background: url('../images/navbar.gif') -173px -14px no-repeat; 
	width: 68px;
}

#contact a:hover, #contact a.on {
	background: url('../images/navbar.gif') -339px -14px no-repeat; 
	width: 85px;
}

#projects a:hover, #about a:hover, #contact a:hover {
	z-index:40;
	border:none;
}
/*-----------------------(Content)-------------------------------*/
.pics {
	border-bottom:7px solid #fff;
	border-right:7px solid #fff;
	border-left:7px solid #fff;
}

#contentWrapper {
	padding:0 7px 28px 7px;
	background-color:#fff;
	overflow:hidden;
}

#contentArea {
	border-top:2px solid #900;
	width:800px;
	padding-top:28px;
	text-align:left;
	font-size:80%;
}

.float {float:left;}
.textArea {width:340px;padding-left:18px;}
p span {color:#900;}
p.contact {padding-left:300px;}
.height {height:170px;}

.moreProjects {
	text-transform:uppercase;
	border-bottom:1px solid #000;
	fonts-size:75%;
	width:100%;
	text-align:left;
	margin-top:20px;
}

table#moreList {
	border-collapse:collapse;
	padding:0;
	width:100%;
	margin-bottom:12px;
}

table#moreList td {
	border-bottom:1px dashed #ccc;
	font-size:95%;
	line-height:170%;
	padding: 9px 0;
	vertical-align:top;
}

table#moreList td h2.trigger {
	margin:5px 0;
	padding:0 0 0 16px;
	font-weight:normal;
	background: url(../images/arrows.gif) 0% 0% no-repeat;
	height: 12px;
	line-height: 12px;
}

table#moreList td h2.trigger a {
	font-size:65%;
}

table#moreList td h2.active {background-position: 0% 100%;}

table#moreList td.sq {
	/* background: #fff url('../images/sq.gif') 0% 50% no-repeat;
	padding-left:10px;*/
	padding-left:2px;
	padding-right:20px;
	width:230px;
} 

table#moreList td.mid {
	width:375px;
	padding-right:25px;
}

table#moreList tr.over td {background-color: #eaedef;} /*imperative that the 'over' color is listed last, after td.alt. If list before, the hover color will not show.*/

div.toggle_container {padding-left:16px;padding-top:10px;}
/*-----------------------(Footer)-------------------------------*/
#footer {
	width:814px;
	padding-top:73px;
	color:#848282;
	font-size:70%;
}

.ie6 ul.nav, .ie7 ul.nav {
	left:180px;
}

.ie7 .moreProjects {margin-top:0;}
.ie7 table#moreList td h2.trigger, .ie7 table#moreList td h2.trigger a {font-size:100%;}
.ie6 table#moreList td h2.trigger {font-size:140%;}

.ie7 table#moreList td h2.trigger a {
	font-size:100%;
}