 html, body{height:100%;} 
 body	{
 	margin: 0; padding:0; text-align:center;
	font:11px/15px verdana, arial, helvetica,  sans-serif;
	color: #C8C8C8;
	background: #000000;
	}
/* Centers the design in the middle of the page regardless of screen resolution */	
#wrap  {
position: absolute;
width:720px;
height:238px;
left: 50%;
/*hide from ie-Mac\*/

top: 50%;
margin-top: -295px; /* make this half your image/element height */
margin-left: -360px; /* make this half your image/element width */
/*end hide*/
}
/* Styles for main header with logo */
#header {
	text-align:left;
	width:720px;
	height:50px;
	margin:0;
	padding:0;
	vertical-align: bottom;
}

#logo a {
	display: block;
	overflow: hidden;
	height: 50px;
	padding:0;
	margin:90px 0 0 0px;
	width:720px;
	height:50px;
	background-image: url(../images/lgBack.gif);
	background-repeat: no-repeat;
}

/* Styles for main content areas */
#main {width:720px; height:238px; text-align:left; margin:0; padding:0;  }

#main_left {
	float:left;
	width: 273px;
	height:220px;
	margin:0px;
	padding:10px 10px 0px;
	text-align: left;
	vertical-align: middle;
	line-height: 1.2em;
}

#main_right {
	float:left;
	width:426px;
	height:238px;
	border-left:1px solid #939597;
	margin:0;
	padding:10 0 0;
	text-align: left;
}

#main_right h2 , #main_left h2{
	margin:15px 0 15px 0px;
	padding:0;
	color:#FFF;
	font:bold 1.2em arial, tahoma, verdana, sans-serif;
}
#main_right h3 , #main_left h3{
	margin:15px 0 15px 15px;
	padding:0;
	color:#FFF;
	font:bold 1.2em arial, tahoma, verdana, sans-serif;
}
#main_left p {
	margin:15px 0 15px 0px;
	line-height: 1.2em;
}
#main_right p {
	color:#FFF;
	margin:0 15px;
	padding:0px;
	line-height: 1.2em;
}
#main_right a {color:#FFF; text-decoration:underline;}
#main_right a:hover {color:#B0B6BB; text-decoration:underline;}

#newsletter {
	float:right;
	padding:0px 8px;
	color:#FFF;
	margin:0px 20px;
	width:170px;
	height:264px;
}
#newsletter p {margin:40px 0 10px 0; padding:0px; color: #FFF;}
#l65176-65176 {margin:0; width:120px;}

/* 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; }



/* Styles for bottom area */
#bottom {
	margin:0;
	padding:0;
	width:720px;
	background-color: #000;
	height: 60px;
	clear: both;
}

#left {float:left; margin:14px 0 0 0px; padding-left:42px; width:270px;}



#nav {
	float:right;
	margin:0;
	padding:0;
	list-style-type: none;
	width:431px;
}
#nav li {
	display: inline;
	margin: 0px;
	padding: 0px;
}
#nav ul {padding:0; margin:3px 0 0 0px;}
#nav li a, #nav li div {
	float: left;
	margin: 0px;
	padding: 0px;
	height: 15px;
	color: #000000;
}


#nav .about {width: 85px; background: url(../images/buttons/about.gif) no-repeat;}
#nav .process {width: 85px; background: url(../images/buttons/process.gif) no-repeat;}
#nav .services {width: 85px; background: url(../images/buttons/services.gif) no-repeat;}
#nav .gallery {width: 85px; background: url(../images/buttons/gallery.gif) no-repeat;}
#nav .contact {width: 85px; background: url(../images/buttons/contact.gif) no-repeat;}

#nav .about:hover {width: 85px; background: url(../images/buttons/about_over.gif) no-repeat;}
#nav .process:hover {width: 85px; background: url(../images/buttons/process_over.gif) no-repeat;}
#nav .services:hover {width: 85px; background: url(../images/buttons/services_over.gif) no-repeat;}
#nav .gallery:hover {width: 85px; background: url(../images/buttons/gallery_over.gif) no-repeat;}
#nav .contact:hover {width: 85px; background: url(../images/buttons/contact_over.gif) no-repeat;}



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

#title_contact, #title_about, #title_kudos, #title_gallery, #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;}

/* Styles for text boxes at bottom
-------------------------------------------*/

#gastown, #coal-harbour, #point-grey, #shaughnessy, #false-creek, #south-granville, #text_kudos, #text_kudos2, #yaletown, #mills-joy, #laurel {width:262px; height:65px; padding:0; margin:0;}

#gastown {background: url(../images/text/gastown.gif) top no-repeat;}
#coal-harbour {background: url(../images/text/coal-harbour.gif) top no-repeat;}
#point-grey {background: url(../images/text/point-grey.gif) top no-repeat;}
#shaughnessy {background: url(../images/text/shaughnessy.gif) top no-repeat;}
#false-creek {background: url(../images/text/false-creek.gif) top no-repeat;}
#south-granville {background: url(../images/text/south-granville.gif) top no-repeat;}
#mills-joy {background: url(../images/text/mills-joy.gif) top no-repeat;}
#yaletown {background: url(../images/text/yaletown.gif) top no-repeat;}
#laurel {background: url(../images/text/laurel.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_kudos {margin-left:20px; color:#FFF;}
.noBorder {
	border: none;
}
#main td {
}
.padTop {
	padding-top: 38px;
	padding-left: 65px;
}
table {
}
#main a {
	font-weight: bold;
	color: #666666;
}
#main a:hover {
	color: #CCCCCC;
	text-decoration: underline;
}
.formfields {
	text-align : left;
	border : 1px solid #666666;
	color : #CCCCCC;
	width : 275px;
	margin-bottom: 2px;
	font-family: Arial, Helvetica, sans-serif;
	background-color: #000000;
} 
.formlabels {
	text-align : right;
	padding-right: 3px;
	vertical-align: top;
} 

.buttons {
	color: #FFFFFF;
	border: 1px solid #333333;
	text-align: center;
	margin-top: 5px;
	background-image: url(../images/smGrad.gif);
	background-repeat: repeat;
	background-color: #000000;
}
.fieldNameCSS {
	font-weight : bold; 
} 
.fieldValueCSS {
	font-style : italic; 
} 
#contactInfo {
	margin: 0px;
	float: right;
	padding-top: 0px;
	padding-right: 75px;
	padding-bottom: 0px;
	padding-left: 10px;
}
textarea {
	font-size: small;
}.emph {
	font-weight: bold;
	font-size: 105%;
}
.padAround {
	text-align: center;
	padding-top: 20px;
}
.center {
	text-align: center;
}
