/* CSS Document */

/* Navigation */

#nav {
margin: 0;
margin-top: -5px;
padding: 0;
}

#nav li {
list-style: none;
float: left;
clear: left;
margin: 0;
padding: 0;
}

#nav li a {
	display: block;
	width: 219px;
	height: 16px;
	padding: 0;
	margin: 0;
	}

#nav li a span {
	display: none;
	}
	
	/* non selected */
	
#nav #home {
background: url('../images/navigation/home_roll.jpg') no-repeat 0 0px;
}

#nav #home:hover {
	background: url('../images/navigation/home_roll.jpg') no-repeat 0 -16px;
}

#nav #profile {
background: url('../images/navigation/profile_roll.jpg') no-repeat 0 0px;
}

#nav #profile:hover {
	background: url('../images/navigation/profile_roll.jpg') no-repeat 0 -16px;
}

#nav #services {
background: url('../images/navigation/services_roll.png') no-repeat 0 0px;
}

#nav #services:hover {
	background: url('../images/navigation/services_roll.png') no-repeat 0 -18px;
}

#nav #portfolio {
background: url('../images/navigation/portfolio_roll.jpg') no-repeat 0 0px;
}

#nav #portfolio:hover {
	background: url('../images/navigation/portfolio_roll.jpg') no-repeat 0 -16px;
}

#nav #contact {
background: url('../images/navigation/contact_roll.png') no-repeat 0 0px;
}

#nav #contact:hover {
	background: url('../images/navigation/contact_roll.png') no-repeat 0 -17px;
}

/* selected */

#nav .selected #home {
background: url('../images/navigation/home_roll.jpg') no-repeat 0 -16px;
}

#nav .selected #profile {
	background: url('../images/navigation/profile_roll.jpg') no-repeat 0 -16px;
}

#nav .selected #services {
	background: url('../images/navigation/services_roll.png') no-repeat 0 -18px;
}

#nav .selected #portfolio {
	background: url('../images/navigation/portfolio_roll.jpg') no-repeat 0 -16px;
}

#nav .selected #contact {
	background: url('../images/navigation/contact_roll.png') no-repeat 0 -17px;
}
	
	/* end Navigation */
	
	/* Sub Navigation */
	
	#subnav {
margin: 0;
padding: 0;
}

#subnav li {
list-style: none;
float: left;
clear: left;
}

#subnav li a {
	display: block;
	width: 215px;
	height: 16px;
	}

#subnav li a span {
	display: none;
	}
	
	/* non selected */
	
#subnav #architectural {
background: url('../images/navigation/architectural_roll.png') no-repeat 0 0px;
}

#subnav #architectural:hover {
	background: url('../images/navigation/architectural_roll.png') no-repeat 0 -18px;
}

#subnav #visualisation {
background: url('../images/navigation/visualisation_roll.png') no-repeat 0 0px;
}

#subnav #visualisation:hover {
	background: url('../images/navigation/visualisation_roll.png') no-repeat 0 -18px;
}

#subnav #three_d {
background: url('../images/navigation/3d_roll.png') no-repeat 0 0px;
}

#subnav #three_d:hover {
	background: url('../images/navigation/3d_roll.png') no-repeat 0 -18px;
}


	/* selected */
	
#subnav .selected #architectural {
	background: url('../images/navigation/architectural_roll.png') no-repeat 0 -18px;
}

#subnav .selected #visualisation {
	background: url('../images/navigation/visualisation_roll.png') no-repeat 0 -18px;
}

#subnav .selected #three_d {
	background: url('../images/navigation/3d_roll.png') no-repeat 0 -18px;
}

/* end Sub Navigation */


body{
	margin: 0;
	font-family: "Trebuchet MS";
}

p{
	font-size: 12px;
	line-height: 17px;
	color: #333;
	padding: 0px 20px;
	}
	
	.bottom p{
	font-size: 12px;
	line-height: 17px;
	color: #fff;
	}
	

h1{
	font-family: "Trebuchet MS";
	font-size:22px;
	color: #24425E;
	text-transform: uppercase;
	line-height: 0px;
	padding-left: 20px;
	padding-top: 17px;
	margin-top: 0px;
	}
	
h2{
	font-family: "Trebuchet MS";
	font-size: 13px;
	color: #24425E;
	padding: 0px 20px;
	line-height: 18px;
	}
	
.container{
	margin: auto;
	width: 984px;
	height: 750px;
}

.leftedge{
	float: left;
	width: 12px;
	height: 750px;
}

.rightedge{
	float: left;
	width: 13px;
	height: 750px;
}

.main{
	float: left;
	width: 959px;
	height: 750px;
	}
	
.top{
	width: 959px;
	height: 339px;
	background-image: url(../images/top_all.jpg);
}

.topfolio{
	width: 959px;
	height: 339px;
	background-image: url(../images/top_folio.jpg);
}

.topcontact{
	width: 959px;
	height: 339px;
	background-image: url(../images/top_contact.jpg);
}

	.topleftfolio{
		float: left;
		width: 434px;
		height: 339px;
	}
	.topleft{
		float: left;
		width: 370px;
		height: 339px;
	}
	
		.navigation{
			float: left;
			width: 219px;
		}
		
		.subnavigation{
			margin-top: 46px;
			float: left;
			width: 215px;
		}
		
	.topright{
		float: left;
		padding: 0px 0px 30px 0px;
		width: 589px;
		height: 174px;
		background-image: url(../images/evdas_web_04.jpg);
		background-position: right top;
		background-repeat: no-repeat;
	}
	
	.toprightfolio{
		float: left;
		padding: 0px 0px 30px 40px;
		width: 485px;
		height: 174px;
		background-image: url(../images/evdas_web_04.jpg);
		background-position: right top;
		background-repeat: no-repeat;
	}
	
.bottom{
	width: 959px;
	height: 351px;
	background-image: url(../images/background_bottom.jpg);
	padding: 40px 0px 20px 0px 
}

.bottomleft{
	float: left;
	width: 320px;
	height: 351px;
}

.bottomright{
	float: left;
	width: 319px;
	height: 351px}
.bottomcentre {
	float: left;
	width: 320px;
	height: 351px;
}

.portfoliobottom{
	padding-top: 19px;
	width: 959px;
	height: 392px;
	background-image: url(../images/background_bottom.jpg);
}

.contactbottom{
	width: 959px;
	height: 351px;
	background-image: url(../images/bottom_contact.jpg);
	padding: 40px 0px 20px 0px 
}
	.folioheader{
	margin: 0;
	width: 354px;
	float: left;
	margin-bottom: 10px;
	padding-left: 3px;
	background-image: url(../images/white.png);
	}
	.foliotitle{
	line-height: 0px;
	margin: 0;
	width: 70px;
	float: left;
	margin-bottom: 10px;
	padding-left: 3px;
	background-image: url(../images/white.png);
	}
	.foliosubject{
	line-height: 0px;
	margin: 0;
	width: 350px;
	float: left;
	margin-bottom: 10px;
	padding-left: 5px;
	}
	
	.folioheadertext{
	font-family: "Trebuchet MS";
	font-size: 17px;
	line-height: 20px;
	color: #4486A8;
	}
	.foliotitletext{
	font-size: 12px;
	line-height: 14px;
	color: #4486A8;
	font-weight: bold;
	text-transform: uppercase;
	}
	.foliosubjecttext{
	font-size: 12px;
	line-height: 14px;
	color: #333;
	}
	.layerborder{
	border: 2px solid #FFF;
	}