body,
form select,
form input,
form button,
form textarea,
form button
{
	font-family: 'Segoe UI', 'Helvetica Neue Thin', Arial, Helvetica, Clean, sans-serif;
}

html,
body
{
	-height: 100%;
	-width: 100%;
}

.clear-floats
{
	clear: both;
	height: 0;
}

table.valign-hack
{
	border-collapse: collapse;
	height: 100%;
	width: 100%;
}

td.valign-hack
{
	text-align: left;
	vertical-align: middle;
}

div.page
{
	margin-left: auto;
	margin-right: auto;
	padding: 20px;
	padding-top: 30px;
	width: 950px;
}

div.page .header
{
	border-bottom: 2px solid;
	padding-left: 10px;
	padding-right: 10px;
}

div.page .header .logo
{
	float: left;
	padding-bottom: 8px;
	padding-left: 10px;
	width: 235px;
}

div.page .header .logo,
div.page .header .logo h1,
div.page .header .logo h1 a,
div.page .header .logo h1 a img
{
	display: block;
}

div.page .header .navigation
{
	float: right;
	width: 460px;
}

div.page .header .navigation ul
{
	float: right;
}

div.page .header .navigation ul li
{
	float: left;
	display: block;
	padding-bottom: 20px;
	padding-left: 10px;
	padding-right: 10px;
}

div.page .header .navigation ul li.current-section
{
	background-image: url('../images/navigation/marker.gif');
	background-position: bottom center;
	background-repeat: no-repeat;
}

div.page .header .navigation ul li a
{
	display: block;
	float: left;
	height: 38px;
	overflow: hidden;
}

div.page .header .navigation ul li a img
{
	display: block;
}

div.page .header .navigation ul li a:hover img,
div.page .header .navigation ul li a:active img,
div.page .header .navigation ul li a:focus img
{
	margin-top: -38px;
}

div.page .content
{
	min-height: 360px;
	padding: 20px;
}

div.page .content dl dt,
div.page .content dl dd,
div.page .content p,
div.page .content ul li,
div.page .footer p,
div.page .footer ul li
{
	font-size: 1.14em;
	line-height: 1.4em;
}

div.page .content dl dt
{
	font-weight: bold;
}

div.page .content form dd input,
div.page .content form dd textarea
{
	border: 2px solid;
	padding: 5px;
	width: 242px;
}

div.page .content form dt label
{
	cursor: pointer;
}

div.page .content h2,
div.page .content h3,
div.page .content dl,
div.page .content p,
div.page .content ul,
div.page .footer p
{
	margin-bottom: 20px;
}

div.page .content h2
{
	font-size: 2em;
	font-weight: bold;
	letter-spacing: -1px;
}

div.page .content h2 a:link,
div.page .content h2 a:visited
{
	text-decoration: none;
}

div.page .content h2 a:hover,
div.page .content h2 a:active
{
	text-decoration: underline;
}

div.page .content h3
{
	border-bottom: 2px solid;
	font-size: 1.5em;
	font-weight: bold;
	letter-spacing: -1px;
}

div.page .content .message
{
	border: 2px solid;
	margin-bottom: 20px;
	padding: 10px;
	padding-bottom: 0;
}

div.page .content .message p
{
	margin-bottom: 10px;
}

div.page .footer
{
	border-top: 2px solid;
	padding-left: 20px;
	padding-right: 20px;
	padding-top: 20px;
}

div.page .footer .debug ul,
div.page .footer .debug ul li
{
	float: left;
}

div.page .footer .debug ul li
{
	margin-right: 20px;
}

div.page .footer .credits
{
	float: left;
}

div.page .footer .copyright-notice
{
	float: right;
}

/* Biography */

#biography .info
{
	float: left;
	width: 450px;
}

#biography .contact
{
	border: 2px solid;
	float: right;
	padding: 10px;
	width: 418px;
}

#biography form dt,
#biography form dd
{
	float: left;
	margin-bottom: 10px;
}

#biography form dt
{
	clear: left;
	padding: 5px;
	text-align: right;
	width: 142px;
}

#biography form dd
{
	margin-left: 10px;
}

#biography form dd input,
#biography form dd textarea
{
	width: 242px;
}

#biography form div
{
	clear: left;
	margin-left: 162px;
}

#biography form div input
{
	cursor: pointer;
	padding: 5px;
	width: 115px;
}

#biography #contactFormError
{
	display: none;
	margin-left: 0;
}

#biography #contactFormError,
#biography #contactFormError p
{
	margin-bottom: 10px;
}

#biography #contactFormError ul
{
	padding-left: 25px;
}

#biography #contactFormError ul li
{
	color: #f00;
	font-weight: bold;
	list-style-type: disc;
	padding-left: 5px;
}

/* Portfolio Index */

#portfolio-index div.page .content
{
	padding: 10px;
}

#portfolio-index div.page .content h2,
#portfolio-index div.page .content h3
{
	margin: 10px;
}

#portfolio-index div.page .content h2
{
	margin-bottom: 20px;
}

#portfolio-index div.page .content h3
{
	margin-bottom: 0;
}

#portfolio-index div.page .content .thumbnails ul
{
	margin-bottom: 10px;
}

#portfolio-index div.page .content .thumbnails ul li
{
	display: block;
	float: left;
	padding: 10px;
	text-align: center;
}

#portfolio-index div.page .content .thumbnails ul li a,
#portfolio-index div.page .content .thumbnails ul li a img,
#portfolio-index div.page .content .thumbnails ul li a span
{
	display: block;
}

#portfolio-index div.page .content .thumbnails ul li a
{
	border: 2px solid yellow;
	padding: 10px;
	text-decoration: none;
	width: 266px;
}

#portfolio-index div.page .content .thumbnails ul li a img
{
	border: 2px solid;
	height: 147px;
	margin-left: auto;
	margin-right: auto;
	width: 262px;
}

#portfolio-index div.page .content .thumbnails ul li a span
{
	padding-top: 5px;
}

#portfolio-index div.page .content .thumbnails ul li a:hover span,
#portfolio-index div.page .content .thumbnails ul li a:active span
{
	text-decoration: underline;
}

/* Portfolio Detail */

#portfolio-detail div.page .content .overview
{
	border: 2px solid;
	float: left;
	padding: 10px;
	width: 266px;
}

#portfolio-detail div.page .content .overview .thumbnail img
{
	border: 2px solid;
	height: 147px;
	width: 262px;
}

#portfolio-detail div.page .content .story
{
	float: left;
	margin-left: 20px;
	padding-top: 12px;
	width: 400px;
}

#portfolio-detail div.page .content .gallery
{
	float: left;
	margin-left: 20px;
	padding-top: 12px;
	width: 180px;
}

#portfolio-detail div.page .content .gallery ul li
{
	margin-bottom: 20px;
}

#portfolio-detail div.page .content .gallery ul li a,
#portfolio-detail div.page .content .gallery ul li a img
{
	display: block;
}

#portfolio-detail div.page .content .gallery ul li a img
{
	border: 2px solid;
	width: 176px;
}