@charset "utf-8";

/* - general styles - */
body  {
	margin: 0;
	margin-top: -30px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 12px;
	background: BLACK url(../assets/mainback.gif) repeat-x 0px -30px;
	padding: 0;
	text-align: center;
	color: #ffffff;
	overflow: auto;
}

#container{
	height: 600px;
	width: 800px;
	margin: auto;
}

/*----------------------- logo --------------------------------------------------*/

#logoSpan{visibility:hidden;}

.logo{	
    width:397px;
	height:91px;	
	background: url(../assets/logo.gif) no-repeat;
	margin: 0px;
	margin-top: 102px;
	padding: 0px;
}

/*----------------------- content area --------------------------------------------------*/

.contentArea{
	width:800px;
	height:352px;
	margin: 0px;
	padding: 0px;
	text-align: left;
}

/*----------------------- navigation --------------------------------------------------*/

ul li span{visibility:hidden;}
	
 #nav2{
 	font-size:18px;
    width:682px;
	height:44px;
	z-index: 1;	
	margin: 0px;
	margin-top: 15px;
	margin-left: 110px;
	padding: 0px;
}


 #nav2 ul {
 	width: 690px;
	height: 50px;
 	margin:0;
	padding:0;
    list-style:none;
 	text-align:center;
}
  
 #nav2 li {
  	float:left;
    margin-left: auto;
	margin-right: auto;
    padding:0;
}
	

#nav2 ul li.home a {
    display:block;
	width:100px;
	height:44px;
	border: none;
	outline: none;
	text-decoration: none;
	background: url(../assets/navSheet.gif) 0px 0px;}
#nav2 ul li.portfolio a {
    display:block;
	width:150px;
	height:44px;
	border: none;
	outline: none;
	text-decoration: none;
	background: url(../assets/navSheet.gif) -100px 0px;}
#nav2 ul li.statement a {
    display:block;
	width:300px;
	height:44px;
	border: none;
	outline: none;
	text-decoration: none;
	background: url(../assets/navSheet.gif) -250px 0px;}
#nav2 ul li.contact a {
    display:block;
	width:130px;
	height:44px;
	border: none;
	outline: none;
	text-decoration: none;
	background: url(../assets/navSheet.gif) -550px 0px;}	
	
#nav2 ul li.home#linkOn a {
	background: url(../assets/navSheet.gif) 0px -130px;}
#nav2 ul li.portfolio#linkOn a {
	background: url(../assets/navSheet.gif) -100px -130px;}
#nav2 ul li.statement#linkOn  a {
	background: url(../assets/navSheet.gif) -250px -130px;}
#nav2 ul li.contact#linkOn  a {
	background: url(../assets/navSheet.gif) -550px -130px;}	

#nav2 ul li.home a:hover{
	background: url(../assets/navSheet.gif) 0px -44px;}
#nav2 ul li.portfolio a:hover{
	background: url(../assets/navSheet.gif) -100px -44px;}
#nav2 ul li.statement a:hover{
	background: url(../assets/navSheet.gif) -250px -44px;}
#nav2 ul li.contact a:hover{
	background: url(../assets/navSheet.gif) -550px -44px;}
	
#nav2 ul li.home a:active{
	background: url(../assets/navSheet.gif) 0px -87px;}
#nav2 ul li.portfolio a:active{
	background: url(../assets/navSheet.gif) -100px -87px;}
#nav2 ul li.statement a:active{
	background: url(../assets/navSheet.gif) -250px -87px;}
#nav2 ul li.contact a:active{
	background: url(../assets/navSheet.gif) -550px -87px;}