html, body{height:100%;} 
 body	{
 	margin: 0; padding:0; text-align:center;
	font:11px/15px verdana, arial, helvetica,  sans-serif;
	color: #221E1F;
	background: #FFF;
	}
/* 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 */
/*end hide*/
}
/* Styles for main header with logo */

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

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




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

#press {
	height: 264px;
	width:800px;
	margin:0; padding:0;
	position:relative;
}
.page1 {background: url(../images/press1.jpg) no-repeat;}
.page2 {background: url(../images/press2.jpg) no-repeat;}
.page3 {background: url(../images/press3.jpg) no-repeat;}
.page4 {background: url(../images/press4.jpg) no-repeat;}
.page5 {background: url(../images/press5.jpg) no-repeat;}
.page6 {background: url(../images/press6.jpg) no-repeat;}
.page7 {background: url(../images/press7.jpg) no-repeat;}


#press li {
	position: absolute;
	margin: 30px 0 0 0; padding: 0;
	list-style: none;
	top: 0; 
}
#press a {
	display: block;
	text-indent: -9999px;
	text-decoration: none;
	outline: 0;
	}
	
#thumb1	{left: 30px; width: 178px;}
#thumb1_big {left:30px; width:225px;}

#thumb2	{left: 210px; width: 178px;}
#thumb2_small {left:270px; width:120px;}
#thumb3	{left: 400px;  width: 178px;}
#thumb3_top {left:430px; width:50px;}
#thumb3_bottom {left:500px; width:50px;}

#previous	{left: 580px; width: 18px;}
#next	{left: 602px; width: 18px;}


#thumb1 a, #thumb2 a, #thumb3 a, #thumb1_big a, #thumb2_small a  {height:200px;}
#thumb3_top a {height:15px; margin-top:165px;}
#thumb3_bottom a {height:15px; margin-top:165px;}

#previous a, #next a {height:16px; margin-top:212px;}

#main_left {
	float:left;
	width: 298px; 
	height:244px;
	background:#FFF;
	margin:0px;
	padding:10px;
}

#main_right {
	float:left;
	background:#6A737B;
	width:481px;
	height:264px;
	border-left:1px solid #939597;
	margin:0; padding:0;
}

#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; margin:0 20px; padding:0px;}
#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 {float:left; margin:0; padding:0; width:800px; height:207px; 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 {
	float:right;
	margin:0;
	padding:0;
	list-style-type: none;
	width:470px;
}
#nav li {display: inline;}
#nav ul {padding:0; margin:10px 0 0 0px;}
#nav li a, #nav li div {float: left; margin: 0px; padding: 0px; height: 15px;}

#nav .profile {width: 74px; background: url(../images/buttons/profile.gif) no-repeat;}
#nav .projects {width: 132px; background: url(../images/buttons/projects.gif) no-repeat;}
#nav .kudos {width: 58px; background: url(../images/buttons/kudos.gif) no-repeat;}
#nav .press {width: 57px; background: url(../images/buttons/press.gif) no-repeat;}
#nav .blog {width: 52px; background: url(../images/buttons/blog.gif) no-repeat;}
#nav .contact {width: 79px; background: url(../images/buttons/contact.gif) no-repeat;}

#nav .profile:hover {width: 74px; background: url(../images/buttons/profile_over.gif) no-repeat;}
#nav .projects:hover {width: 132px; background: url(../images/buttons/projects_over.gif) no-repeat;}
#nav .kudos:hover {width: 58px; background: url(../images/buttons/kudos_over.gif) no-repeat;}
#nav .press:hover {width: 57px; background: url(../images/buttons/press_over.gif) no-repeat;}
#nav .blog:hover {width: 52px; background: url(../images/buttons/blog_over.gif) no-repeat;}
#nav .contact:hover {width: 79px; background: url(../images/buttons/contact_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;}

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