body {
	font-family:"Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", "HelveticaNeue", "Helvetica", "Arial", sans-serif;
	margin:0;
	padding:0;
	background:#d9f7ff url(images/bg_fog.jpg) repeat-x;
	text-align:center
}
#wrapper {
	margin:0;
	padding:0;
}
.page {
	width:870px;
	text-align:center;
	margin:auto;
	padding:0;
}
.header {
	height:300px;
	background:transparent url(images/sutro.png) no-repeat 460px 35px;
	padding:0;
	z-index:0;
}
.logo {
	width:377px;
	float:left;
	margin:54px 26px 0 -15px;
}
.content {
	width:870px;
	float:inherit;
	min-height:700px;
	margin:-125px 0 0 0;
	padding:0;
	z-index:1000;
}
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix {
	display: block;
}
/* Hide from IE-mac \*/
* html .clearfix {
	height: 1%;
}
.clearfix {
	display: block;
}
/* End hide from IE-mac */
.nav {
	width:284px;
	float:left;
	margin:58px 0 0 -150px;
	padding:0;
}
.nav ul {
	list-style-type:none;
	margin:0;
	padding:0
}
.nav ul li {
	width:138px;
	float:left;
	text-align:left;
	margin:0 4px 0 0;
}
.nav ul li a:link, .nav ul li a:visited {
	text-decoration:none;
}
.nav ul li a:hover {
	text-decoration:underline;
}
.nav:after {
	content:'.';
	display:block;
	clear:both;
	visibility:hidden;
	height:0;
}
.blur {
	clear:both;
	display:block;
	font-family:"Helvetica Neue Light","HelveticaNeue-Light","Helvetica Neue","HelveticaNeue","Helvetica","Arial",sans-serif;
	font-size:13px;
	line-height:1.4em;
	color:#fff;
	text-align:left;
	margin:0 0 0 8px;
	padding:25px 0 0 0;
	width:470px;
}
.subnav {
	font-family:"Helvetica Neue","HelveticaNeue","Helvetica","Arial",sans-serif;
	font-size:14px;
	margin:0 0 0 8px;
	padding:35px 0 10px 0;
}
.subnav p {
	font-size:12px;
	text-align: left;
	color:#fff; 
	margin:-3px 0 0 235px;
	padding:0;
	font-weight:normal;
}
.subnav ul {
	list-style-type:none;
	margin:0;
	padding:0;
}
.subnav ul li {
	width:30px;
	float:left;
	text-align:left;
	font-weight:normal;
	color:#333;
	margin-right:25px;
}
.subnav a:link, .subnav a:visited, .subnav a:active {
	font-style:normal;
	color:#3790B8;
	text-decoration:none;
	
}
.subnav a:hover {
	font-style:normal;
	color:#0D7196;
	text-decoration:none;
}
.subnav:after {
	content:'.';
	display:block;
	clear:both;
	visibility:hidden;
	height:0;
}
.project {
	background:transparent url(images/pv_bg.png) no-repeat scroll left top;
	width:785px;
	height:222px;
	margin:0 0 22px 0;
}
.project img {
	float:left;
	margin:13px 0 0 13px;
	border:0;
	width:458px;
	height:196px;
}
.preview {
	clear:both;
	margin:0 0px 0px 0;
	width:458px;	
	height:196px;
}
.preview:after {
	content:'.';
	display:block;
	clear:both;
	visibility:hidden;
	height:0;
}
.featured {
	width:484px;
	height:222px;
	float:left;
	margin:0;
}
.hide {
	visibility:hidden;
}
.info {
	font-family:"Helvetica Neue Light","HelveticaNeue-Light","Helvetica Neue","HelveticaNeue","Helvetica","Arial",sans-serif;
	float:right;
	width:274px;
	min-height:190px;
	text-align:left;
	padding:18px 0 0 0;
	position:relative;
}
.info h3 {
	font-family:"Helvetica Neue","HelveticaNeue","Helvetica","Arial",sans-serif;
	font-style:normal;
	font-weight:normal;
	font-size:15px;
	color:#333;
	padding:0px;
	margin:0px;
}
.info p {
	font-size:13px;
	color:#666;
	line-height:1.4em;
	padding:7px 0 0 0;
	margin:0px;
}
.info p a:link, p a:visited, p a:active {
	font-size:13px;
	color:#3790B8;
	text-decoration: none;
	line-height:1.4em;
	padding:0;
	margin:0;
}
.info p a:hover {
	font-size:13px;
	color:#0D7196;
	line-height:1.4em;
	padding:0;
	margin:0;
}
.info p.viewsite {
	position:absolute;
	font-size:12px;
	bottom:0px;
	margin-left:0px;
}
.viewsite a:link, .viewsite a:visited, viewsite a:active {
	display:block;
	width:100px;
	height:24px;
	/*background:url(images/bt_viewsite.gif) no-repeat;
	text-indent:-999em;*/
}
.info p.top:focus, .viewsite a:focus {
	outline:none;
}
.info .viewsite p.top {
	display:block;
}
.info p.top {
	position:absolute;
	font-size:12px;
	bottom:0px;
	margin-left:165px;
}
.top a:link, .top a:visited, .top a:active {
	display:block;
	text-align:right;
	width:100px;
	height:24px;
	/*background:url(images/top.png) no-repeat;
	text-indent:-999em;*/
}

/* about page */
.aboutme_wrapper {
	float:left; 
	font-family:"Helvetica Neue Light","HelveticaNeue-Light","Helvetica Neue","HelveticaNeue","Helvetica","Arial",sans-serif;
	text-align:left;
	background-color:#fff; 
	margin:-40px 12px 0 0; 
	width:474px;
	height:750px;
	position:relative;
}
.aboutme {
	padding:8px; 
	text-align:left;
	font-size:12px;
	font-weight:normal;
}
.aboutme h2 {
	color:#000; 
	margin:0px;
	padding:40px 18px 0 18px; 
	font-size:18px;
	font-weight:bold; 
}
.aboutme p {
	color:#666; 
	padding:0 18px 30px 18px; 
	line-height:22px; 
	font-weight:normal;
}
.aboutme a {
	padding:0 8px 0 0; 
}
.at_wrapper {
	float:left;
	font-family:"Helvetica Neue Light","HelveticaNeue-Light","Helvetica Neue","HelveticaNeue","Helvetica","Arial",sans-serif;
	font-weight:normal;
	text-align:left;
	background-color:#095973; 
	opacity:.90;
	margin:-40px 0 0 0; 
	width:274px; 
	height:750px;
	position:relative;
}
.at {
	text-align:left;
	margin:0px;
	padding:0 0 5px 0;
}
.at h2 {
	color:#fff; 
	margin:0px;
	padding:30px 25px 0 25px;
	font-size:18px; 
	font-weight:bold;
}
.at img {
	padding:0;
	margin:0 15px -8px 8px; 
	width:44px;
	height:28px;
}
.at a:link, .at a:visited, .at a:active {
	color:#a8e6ff; 
	text-decoration:none;
	font-size:14px;
}
.at a:hover {
	color:#DEF4FF;
	text-decoration:none;
}
.at ul {
	list-style-type:none;
	padding:20px 22px 0 22px;
	margin:0px;
}
.at ul li {
	padding:0px 12px 0 0;
	margin:5px 0 -5px 0;
}
.at p {
	font-weight:normal;
}
/*
Images are wrapped in divs classed "flickr_badge_image" with ids "flickr_badge_imageX" where "X" is an integer specifying ordinal position. Below are some styles to get you started!
*/
#flickr_badge_uber_wrapper {float: right; position:relative; width:274px; height:465px; text-align:left; margin:25px 0 0 0; padding:0;}
#flickr_badge_wrapper {width:225px; padding:12px 0 0 25px;}
.flickr_icon {width:62px; height:20px; margin-left:27px; padding:0;}
.flickr_badge_image {display: inline-block; margin:2px 2px;}
.flickr_badge_image img {width:64px; height:64px; border: 3px solid #002433;}

#skyline {
	background:transparent url(images/skyline.gif) no-repeat top center;
	width:765px;
	height:197px;
	margin:0;
	padding:0px;
	position:relative;
	z-index:100;
}
.skyft {
	text-align:center;
	padding:0;
	margin:0;
	float:left;
	z-index:30;
}
.skyft h2 {
	color:#3790B8; 
	font-size:20px; 
	font-weight:normal;
	text-align:left;
	float:left;
	width:200px;
	margin:0 0 15px 0;
	padding:10px 0 0 0;
}
.skyft a:link, .skyft a:visited, .skyft a:active {
	font-size:12px;
	color:#6BC4ED;
	text-decoration:none;
}
.skyft a:hover {
	font-size:12px;
	color:#D9F3FF;
	text-decoration:none;
}
.skyft p {
	color:#3790B8; 
	font-size:12px;
	text-align:left;
	width:200px;
	padding:0;
	margin:8px 0 0 1px;
}
.sky1 {
	float:left;
	text-align:left;
	position:absolute;
	padding:0;
	margin:0;
	width:300px;
}
.sky2 {
	float:left;
	text-align:left;
	position:absolute;
	padding:0;
	margin:0 0 0 300px;
	width:150px;
}
.sky3 {
	float:left;
	text-align:left;
	position:absolute;
	padding:0;
	margin:0 0 0 450px;
	width:150px;
}
.sky4 {
	float:left;
	text-align:left;
	position:absolute;
	padding:0;
	margin:0 0 0 600px;
	width:150px;
}
#ft {
	background:#0D7094 url(images/bg_bay.gif) repeat-x;
	padding:0;
	width:100%;
	margin:-37px 0 0 0;
	height:327px;
}
.ft {
	font-family:"Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", "HelveticaNeue", "Helvetica", "Arial", sans-serif;
	position:absolute;
	z-index:300;
	margin:260px 0 0 0;
	font-size:10px;
	color:#3790B8;
	text-align:left;
}
.ft a:link, .ft a:visited, .ft a:active {
	color:#6BC4ED;
	text-decoration:none;
}
.ft a:hover {
	text-decoration:none;
	color:#D9F3FF;
}
.lt {
	float:left;
	font-family:"Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", "HelveticaNeue", "Helvetica", "Arial", sans-serif;
	font-size:10px;
	text-align:left;
	position:absolute;
	padding:0;
	margin:0;
	width:800px;
}
.lt a:link, .lt a:visited, .lt a:active {
	font-size:10px;
	color:#6BC4ED;
	text-decoration:none;
}
.lt a:hover {
	font-size:10px;
	text-decoration:none;
	color:#D9F3FF;
}
.rt {
	float:left;
	font-family:"Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", "HelveticaNeue", "Helvetica", "Arial", sans-serif;
	font-size:10px;
	text-align:right;
	position:absolute;
	padding:0;
	margin:0 0 0 280px;
	width:100px;
}
.rt a:link, .rt a:visited, .rt a:active {
	font-size:10px;
	color:#6BC4ED;
	text-decoration:none;
}
.rt a:hover {
	font-size:10px;
	text-decoration:none;
	color:#D9F3FF;
}
.ft ul {
	list-style-type:none;
}
.ft ul li {
	float:left;
	width:435px;
	color:#3790B8;
}