html, body {
	padding:0; margin:0;
	height: auto;
	background: #FFFFFF;
}
body {
	color: #9C9C9C;
	font: normal 11px/20px Helvetica, Arial, sans-serif;
	letter-spacing:0.5px;
}

h1, h2, h3 { 
	color:#768778; 
	font: normal 11px/23px Helvetica, Arial, sans-serif;
	margin: 0.75em 0;
}
h3 { font-weight:normal; }

p { margin: 0 0 1em 0; }

a { color:#9C9C9C; text-decoration:underline; }
a:hover, a.current, a.section { color:#768778; }

strong { font-weight:bold; color:#768778; }
em { font-style:italic; }

form .field { padding:2px 0; overflow:hidden; }
form .field textarea,
form .field label { float:left; width:100px; }
form .field .middleColumn { float:left; width:400px; padding-left:5px; }
form .field input.text,
form .field input.email,
form .field input.password { border:1px solid #555; background:#fff; width:298px }
form .field textarea { border:1px solid #555; background:#fff; width:398px }
form .field .middleColumn label {
	float: none;
	clear: both;
	width: 389px;
	display: block;
	color: #FF0000;
}
form input.action { 
	color: #768778;
	border: 1px solid #768778;
	text-transform:uppercase; 
	cursor:pointer; 
	padding: 2px 3px;
	background: #FFF;
}
form input.action:hover { color:#fff; background:#768778; }

.clear { clear:both; }

#wrapper {
	width: 970px;
	margin: 0 auto;
	padding: 10px 0;
}

#header {
	overflow:hidden;
}
	#header #logo {
		display: block;
		float: left;
		width: 325px;
		margin: 0 0 0 7px;
		color: #768778;
		font: normal 24px/32px Helvetica;
		text-transform: uppercase;
	}
		#header #logo a { border:0; }

#footer {
}

#main {
	clear: both;
	overflow: hidden;
	padding: 30px 0 0 0;
}

#navigation {
	width: 300px;
	clear: both;
	float: left;
}
	#navigation ul { padding: 0 0 40px 0; }
	#navigation li {
	}
	#navigation a {
		display: block;
		padding: 2px 0 0 20px;
		font: normal 11px/23px Helvetica;
		text-decoration: none;
		text-transform: lowercase;
	}
	#navigation a:hover,
	#navigation a.section,
	#navigation a.current {
	}
	#navigation a.current:after,
	#navigation a.section:after { content: " --->"; }
/* #navigation */

#content {
	width: 606px;
	float: right;
}
	.content-left { width:240px; float:left; }
	.content-right { width:350px; float:right; }
/* #content */

.pagination { text-transform:lowercase; }
.pagination a { text-decoration:none; padding:0 1px; }

ul.thumbs { width:606px; overflow:hidden; }
ul.thumbs li { float:left; margin: 0 2px 2px 0; }
ul.thumbs li a { position:relative; display:block; width:200px; height:100px; }
ul.thumbs li a span { border:4px solid #768778; display:block; position:absolute; top:0; left:0; width:192px; height:92px; display:none; }
ul.thumbs li a:hover span { display:none; }

.pageheader { 
	overflow: hidden;
	height: 20px;
	margin-bottom: 4px;
	border-bottom: 1px solid #cfcfcf; 
}
.pageheader h1,
.pageheader-title { 
	float: left;
	margin: 0;
	display: block;
	text-transform: lowercase; 
}
.pageheader .pagination { float:right; }


.Page,
.ContentPage {}
	.Page #content .pageheader,
	.ContentPage #content .pageheader,
	.ContactPage #content .pageheader { margin-bottom:10px; }
/* .Basic pages */

.HomePage {}
	.HomePage #content { }
		.HomePage #content .pageheader { border-bottom:0; }
	.HomePage ul.thumbs { padding-bottom:10px; }
	.HomePage #newsfeed {
		color: #768778;
	}
/* .HomePage */

.ProjectsHome .pageheader,
.ProjectHolder .pageheader,
.ProjectPage .pageheader,
.PressHolder .pageheader,
.PressPage .pageheader {
	border-bottom:0;
}

.PressPage .wordstop,
.ProjectPage .wordstop { border-top:1px solid #cfcfcf; }

.PressPage #imageholder,
.ProjectPage #imageholder  { position:relative; }
	.PressPage #imageholder img,
	.ProjectPage #imageholder img { display:block; }
.PressPage #words,
.ProjectPage #words {
	position: absolute;
	top: 0;
	left: 0;
	width: 263px;
	height: 100%;
	padding: 18px 20px 0;
	color: #777;
	font-size:10px;
	line-height:14px;
	letter-spacing: 0;
	background: #FFF;
	background: rgba(255,255,255,0.85);
}
.PressPage #credits,
.ProjectPage #credits {
	padding-top: 2px;
	text-transform: lowercase;
}


.BlogHome,
.BlogArticle {}
	.BlogHome .content-left,
	.BlogArticle .content-left,
	.BlogHome .pageheader,
	.BlogArticle .pageheader { clear:both; }
	
	.BlogArticle .content-left h1,
	.BlogHome .content-left h2 { margin-top:0; }
	.BlogHome .content-left h2 a { color:#768778; text-decoration:none; }
	.BlogHome .content-left h2 a:hover { text-decoration:underline; }
	
	.BlogHome .pagination { clear:both; border-top:1px solid #cfcfcf; }
/* .BlogHome, .BlogArticle */

