html, body{height:100%;} 

 body	{
	padding:0;
	text-align:center;
	font:11px/15px verdana, arial, helvetica,  sans-serif;
	color: #221E1F;
	background: #FFF;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 0px;
	margin-left: 0;
	}
/* Centres the design in the middle of the page regardless of screen resolution */	
#wrap  {
	position: absolute;
	width:800px;
	height:616px;
	left: 50%;
	/*hide from ie-Mac\*/

top: 50%;
	margin-top: -308px; /* make this half your image/element height */
	margin-left: -400px; /* make this half your image/element width */
	background-color: #fff;
}
/* Styles for main header with logo */

#header {
	text-align:left;
	width:800px;
	height:145px;
	margin:0;
	padding:0;
	background-color: #FFF;
	background-repeat: no-repeat;
	background-image: url(../images/logo.png);
	border-top-width: 1px;
	border-right-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-left-style: solid;
	border-top-color: #FFF;
	border-right-color: #FFF;
	border-left-color: #FFF;
}
#headersplash {
	text-align:left;
	width:800px;
	height:145px;
	margin:0;
	padding:0;
	background-color: #FFF;
	background-repeat: no-repeat;
	background-image: url(../images/logo_splash.gif);
	border-top-width: 1px;
	border-right-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-left-style: solid;
	border-top-color: #FFF;
	border-right-color: #FFF;
	border-left-color: #FFF;
}

#logo a {display: block; overflow: hidden; font-size: 1px; height: 0px; padding:0; margin:70px 0 0 66px; width:180px; height:40px;}


/* Styles for navigation and bottom area */


/* Styles for main content areas */
#main {
	float:left;
	width:798px;
	height:350px;
	text-align:left;
	margin:0;
	padding:0;
	border:1px solid #6A737B;
	background-color: #ecede0;
}

#main_left {
	float:left;
	width: 318px;
	height:350px;
	background:#FFF;
	margin:0px;
}
#mainpress_left {
	float:left;
	width: 318px;
	height:350px;
	margin:0px;
	background-color: #FFF;
	background-image: url(../images/press_left.jpg);
	background-repeat: no-repeat;
	background-position: 0px 60px;
}

#main_right {
	float:left;
	width:479px;
	height:350px;
	border-left:1px solid #929DA3;
	margin:0;
	background-color: #9D9D94;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 0px;
}

#main_right h2 {
	margin:20px 0 5px 20px;
	padding:0;
	color:#FFF;
	font:bold 1.6em arial, tahoma, verdana, sans-serif;
}
#main_right p {
	color:#FFF;
	padding:0px;
	margin-right: 20px;
	margin-left: 20px;
	margin-top: 10px;
	margin-bottom: 10px;
}
#contactform {
	float:right;
	color:#FFF;
	width:170px;
	height:264px;
	margin-top: 0px;
	margin-right: 20px;
	margin-bottom: 0px;
	margin-left: 40px;
	padding-top: 0px;
	padding-right: 8px;
	padding-bottom: 0px;
	padding-left: 8px;
}
#contactform p {
	margin:60px 0 10px 0;
	padding:0px;
	color: #FFF;
}

/* Styles for sub navigation on featured projects pages */

#navlist {
padding: 0 0 0 38px;
margin: 20px;
width: 160px;
}

#navlist li {
list-style: none;
margin: 0;
padding: 5px;
}
#navlist li.title {font-weight:bold; text-transform:uppercase; color: #221E1F;}
#navlist li a { padding-left: 8px; font:bold 1em arial, verdana, tahoma sans-serif; text-decoration: none; color:#B0B6BB; }
#navlist li a:hover, #navlist li a.here { font:bold 1em arial, verdana, tahoma sans-serif; text-decoration: none; color:#6A737B; }
#bottomsplash {
	float:left;
	margin:0;
	padding:0;
	width:800px;
	height:100px;
	border:1px solid #FFF;
	border-top:none;
	background-color: #FFF;
	background-image: url(../images/bottom_splashbg.gif);
	background-repeat: no-repeat;
	background-position: top;
}


/* Styles for bottom area */
#bottom {
	float:left;
	margin:0;
	padding:0;
	width:800px;
	height:100px;
	border:1px solid #FFF;
	border-top:none;
	background:#FFF url(../images/bottom_bg.gif) top no-repeat;
}

#left {
	float:left;
	margin:14px 0 0 0px;
	padding-left:42px;
	width:270px;
}
#nav , #navsplash{
	float:right;
	margin:0;
	padding:0;
	list-style-type: none;
	width:476px;
}
#nav ul   {
	padding:0;
	margin:10px 0 0 0px;
}
#navsplash ul {
	padding:0;
	margin:55px 0 0 0px;
}
#nav li , #navsplash li{display: inline;}
#nav li a    , #navsplash li a{float: left; margin: 0px; padding: 0px; height: 15px;}

#navsplash .welcome{
	width: 77px;
	background: url(../images/buttons/welcome.gif) no-repeat;
}
#navsplash .bienvenue{
	width: 74px;
	background: url(../images/buttons/bienvenue.gif) no-repeat;
}


#nav .profile , #navsplash .profile{
	width: 66px;
	background: url(../images/buttons/profile.gif) no-repeat;
}
#nav .portfolio , #navsplash .portfolio{
	width: 119px;
	background: url(../images/buttons/portfolio.gif) no-repeat;
}
#nav .press , #navsplash .press{
	width: 139px;
	background: url(../images/buttons/feedback.gif) no-repeat;
}
#nav .contact , #navsplash .contact{
	width: 71px;
	background: url(../images/buttons/contact.gif) no-repeat;
}
#nav .francais , #navsplash .francais{
	width: 68px;
	background: url(../images/buttons/francais.gif) no-repeat;
}

#navsplash .welcome:hover{
	width: 77px;
	background: url(../images/buttons/welcome_over.gif) no-repeat;
}
#navsplash .bienvenue:hover{
	width: 74px;
	background: url(../images/buttons/bienvenue_over.gif) no-repeat;
}

#nav .profile:hover , #navsplash .profile:hover{
	width: 66px;
	background: url(../images/buttons/profile_over.gif) no-repeat;
}
#nav .portfolio:hover , #navsplash .portfolio:hover{
	width: 119px;
	background: url(../images/buttons/portfolio_over.gif) no-repeat;
}
#nav .press:hover , #navsplash .press:hover{
	width: 139px;
	background: url(../images/buttons/feedback_over.gif) no-repeat;
}
#nav .contact:hover , #navsplash .contact:hover{
	width: 71px;
	background: url(../images/buttons/contact_over.gif) no-repeat;
}
#nav .francais:hover , #navsplash .francais:hover{
	width: 68px;
	background: url(../images/buttons/francais_over.gif) no-repeat;
}

#nav .profileactive {
	width: 66px;
	background: url(../images/buttons/profile_over.gif) no-repeat;
}
#nav .portfolioactive {
	width: 119px;
	background: url(../images/buttons/portfolio_over.gif) no-repeat;
}
#nav .pressactive {
	width: 139px;
	background: url(../images/buttons/feedback_over.gif) no-repeat;
}
#nav .contactactive {
	width: 71px;
	background: url(../images/buttons/contact_over.gif) no-repeat;
}
#nav .francaisactive {
	width: 68px;
	background: url(../images/buttons/francais_over.gif) no-repeat;
}


/* Styles for titles 
---------------------------------------*/

#title_contact, #title_about, #title_kudos, #title_press, #title_thanks  {width:158px; height:18px; margin:0; padding:0; }
#title_about { background: url(../images/titles/about.gif) top no-repeat;}
#title_kudos { background: url(../images/titles/kudos.gif) top no-repeat;}
#title_press { background: url(../images/titles/press.gif) top no-repeat;}
#title_thanks { background: url(../images/titles/thanks.gif) top no-repeat;}
#text_kudos {background: url(../images/text/kudos.gif) top no-repeat;}
#text_kudos2 {background: url(../images/text/kudos2.gif) top no-repeat;}


/* General Styles */
.hide {display:none;}

.padRight {float:left; padding-right:5px;}
.table_testimonials {
	margin-left:20px;
	color:#FFF;
}
.table_testimonials img {
	margin-right: 12px;
	margin-bottom: 9px;
	border: 1px solid #E2E6DE;
}
.table_testimonials div.client {
	padding-top:3px;
	padding-bottom:12px;
	font-style: italic;
}
#main_right h1 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 20px;
	font-weight: normal;
	padding-top: 0px;
	margin-top: 30px;
	padding-left: 20px;
	color: #F1FFFC;
	margin-bottom: 10px;
	padding-right: 30px;
}
#worklist h1{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 20px;
	font-weight: normal;
	padding-top: 0px;
	margin-top: 30px;
	padding-left: 0px;
	color: #6D6E6A;
	margin-bottom: 10px;
}	
#main_left h1 , #mainpress_left h1{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 20px;
	color: #898983;
	font-weight: normal;
	padding-top: 0px;
	margin-top: 30px;
	padding-left: 20px;
}

#main_right a:link {
	text-decoration: none;
	color: #FFF;
}
#main_right a:visited {
	text-decoration: none;
	color: #FFF;
}
#main_right a:hover {
	text-decoration: none;
	color: #E6E3FF;
}
#main_right a:active {
	text-decoration: none;
	color: #E6E3FF;
}

.inputbox {
	margin-bottom: 4px;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 11px;
	color: #666;
}
.sendbut {
	font-size: 11px;
	margin-top: 3px;
	padding: 1px;
}
#worklist {
	width: 250px;
	float: left;
	padding-left: 20px;
	color: #8C8E89;
}
#worklist p {
	margin-top: 12px;
	margin-bottom: 12px;
}
#worklist p.active {
	margin-top: 12px;
	margin-bottom: 2px;
}
#worklist a:link{
	color: #8C8E89;
	text-decoration:none
}
#worklist a:visited{
	color: #8C8E89;
	text-decoration:none
}
#worklist a:hover{
	color: #BF96BA;
	text-decoration:none
}
#worklist a:active{
	color: #BF96BA;
	text-decoration:none
}#worklist p.active a{
	color: #BF96BA;
	text-decoration:none
}
#main_right p.quote {
	color:#FFF;
	margin-right: 40px;
	margin-left: 40px;
	margin-top: 15px;
	margin-bottom: 10px;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #FFF;
	padding-top: 5px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
#main_right ul {
	color:#FFF;
	padding:0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 40px;
}
#main_right ul li {
	color:#FFF;
	margin: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 2px;
	padding-left: 0px;
}
#worklist div {
	color: #8C8E89;
	padding: 0px;
	font-size: 10px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 10px;
	line-height: 14px;
}
.testPic {
	margin-top: 3px;
}
.portPic {
	padding:0;
	margin-top: 15px;
	margin-bottom: 0;
	margin-left: 333px;
}
.goPort {
	padding-top: 10px;
	padding-left: 10px;
}