/* reset */
 
	html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
	a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp,
	small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset,
	form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
		margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent;
	}
	body { line-height: 1; }
	ol, ul { list-style: none; }
	blockquote, q { quotes: none; }
	blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
	ins { text-decoration: none; }
	del { text-decoration: line-through; }
	table { border-collapse: collapse; border-spacing: 0; }


/* global elements */

	html, body, #bodywrap {
		height: 100%;
	}
	body > #bodywrap {
		height: auto;
		min-height: 100%;
	}
	body {
		text-align: center;
		font: 88%/180% Tahoma, Verdana, "Lucida Sans Unicode", Helvetica, Arial, sans-serif;
		background-color: #E5DED6;
		color: #000;
	}

	#bodywrap {
		background: url(../img/camera.png) 3% 100% no-repeat;
	}

	#header {
		background: #604A39 url(../img/header_pattern.png) top center repeat-x; 
	}
	#header .inner {
		height: 10.8em;
		background: url(../img/header_bg.jpg) top center no-repeat; 
	}
	#header h1 {
		text-indent: -9999px;
	}
	#wrapper {
		margin: 0 auto;
		background: url(../img/shadow.jpg) top center no-repeat;
	}
	#content {
		margin: 0 auto;
		padding: 2em 0 5em 0;
		width: 57em;
		color: #494949;
	}
	#content h2, #content h3, #content h4, #content p, #content div {
		margin: 0 3em;
		text-align: left;
	}
	#content p {
		margin-top: 1em;
		margin-bottom: 1em;
	}
	#content #lines {
		margin: 2em 0 0 0;
		padding: 1em 3em;
		background: url(../img/player_frame.jpg) top center no-repeat;
	}

/* navigation elements */

	#navigation {
		height: 3.1em;
		background: #EBE8E6 url(../img/nav_bg.png) top left repeat-x;
		text-align: center;
	}
	#navigation ul {
		margin: 0 auto;
		width: 31.6em;
		overflow: auto;
	}
	#navigation li {
		float: left;
	}
	#navigation li a {
		display: block;
		height: 3.1em;
		text-indent: -9999px;
	}
	#navhome { width: 4.6em; background: url(../img/nav_home.jpg) top left no-repeat; }
	#navhome:hover, li.active #navhome { background: url(../img/nav_home_hover.jpg) top left no-repeat; }
	#navphilo { width: 7.8em; background: url(../img/nav_philosophy.jpg) top left no-repeat; }
	#navphilo:hover, li.active #navphilo { background: url(../img/nav_philosophy_hover.jpg) top left no-repeat; }
	#navheroes { width: 5.4em; background: url(../img/nav_heroes.jpg) top left no-repeat; }
	#navheroes:hover, li.active #navheroes { background: url(../img/nav_heroes_hover.jpg) top left no-repeat; }
	#navprojects { width: 6.8em; background: url(../img/nav_projects.jpg) top left no-repeat; }
	#navprojects:hover, li.active #navprojects { background: url(../img/nav_projects_hover.jpg) top left no-repeat; }
	#navcontact { width: 6.5em; background: url(../img/nav_contact.jpg) top left no-repeat; }
	#navcontact:hover, li.active #navcontact { background: url(../img/nav_contact_hover.jpg) top left no-repeat; }


/* footer elements */
	
	#footer {
		position: relative;
		margin-top: -3em;
		height: 3em;
		clear: both;
		color: #A7968C;
		background: url(../img/footer_bg.png) repeat-x;
	}
	#footer .inner {
		width: 51em;
		margin: 0 auto;
		text-align: right;
	}
	#footer span {
		display: block;
		padding-top: .8em;
		font-size: .9em;
	}
	#footer a {
		text-decoration: none;
		color: #A7968C;
	}
	#footer a:hover {
		color: #ccb7ab;
	}


/* general elements */

	img#player {
		margin: 2em 0 5em 0;
	}
	#home #content h2,
	#contact #content h2 {
		margin-bottom: 1em;
	}
	#philosophy h2 {
		margin-bottom: 1.8em;
	}


/* projects elements */

	#projects .project {
		margin: 0 0 5em 0;
		height: 1%;
		overflow: auto;
	}
	#projects .project div {
		margin: 0;
	}
	#projects .project .meta {
		float: left;
	}
	#projects .meta .box {
		width: 18em;
		margin-left: 3em;
		padding: .4em .6em .6em .6em;
		background-color: #775944;
	}
	#projects .meta .box h3 {
		margin: 0;
		color: #ede9e6;
		font-weight: normal;
		font-size: .9em;
		line-height: 1.5em;
	}
	#projects .meta .box h4 {
		margin: 0;
		color: #c0bebb;
		font-weight: normal;
		font-size: .8em;
		line-height: 1em;
	}
	#projects .meta p {
		width: 24em;
		margin-left: 3.3em;
		color: #604a39;
		font-size: .9em;
		line-height: 1.5em;
	}
	#projects .project .player {
		float: right;
	}


/* legal elements */

	#legal h2 {
		font-size: 1.3em;
		margin-left: 2.3em;
	}

	#legal h3 {
		font-size: 1.1em;
		margin-left: 2.7em;
	}
	
	#legal h4 {
		font-size: 1em;
		margin-left: 3em;
	}


/* heroes elements */

	div.hero {
		padding: 2.4em 0;
		overflow: auto;
		height: 1%;
		background: url(../img/sepline.jpg) top center no-repeat;
	}
	div.hero:first-child {
		background: none;
	}
	div.hero img {
		float: left;
		width: 150px;
		height: 100px;
		border: 1px solid #6d6d6d;
	}
	#heroes div.hero div.name {
		float: left;
		margin: 0;
	}
	#heroes div.hero .name h3 {
		margin: 0 0 0 2.6em;
		color: #604a39;
		font-weight: normal;
		letter-spacing: .14em;
	}
	#heroes div.hero .name h4 {
		margin: 0 0 0 2.9em;
		color: #6d6d6d;
		font-weight: normal;
		font-size: .9em;
		line-height: 1.2em;
	}
	#heroes div.hero div.handcraft {
		float: right;
		margin: 0;
		width: 28em;
		color: #604a39;
		font-size: .9em;
	}


/* contact elements */

	#contact form {
		overflow: hidden;
		height: 29em;
		margin: 2em 0;
	}
	#contact fieldset {
		padding: 1em 1.6em;
		margin-bottom: .8em;
		text-align: left;
		background-color: #EEECE6;
	}
	#contact fieldset h3 {
		margin: 0;
		font-size: 1.4em;
		letter-spacing: .1em;
		font-weight: normal;
		color: #706350;
		text-transform: uppercase;
	}
	#contact label {
		display: block;
		margin-top: 1em;
		color: #775944;
		line-height: 1em;
	}
	#contact label span {
		color: #424242;
	}
	#contact input, #contact textarea {
		width: 100%;
		border: 1px solid #d6d6d6;
		background-color: #FFF;
	}
	#contact textarea {
		margin-top: .4em;
		height: 16.6em;
	}
	#contact button {
		float: right;
		padding: 0 1em;
		color: #FFF;
		background-color: #604a39;
		border: none;
		cursor: pointer;
	}