/*

	-- -- -- -- -- -- --
	bright creative
	default.css
	main site foundation layout
	-- -- -- -- -- -- --
	
	
*/

@import url("reset.css");


																		/* -- base html -- */
body {
	font: 62.5% "Lucida Grande", "Lucida Sans Unicode", arial, sans-serif;
	color: #28221d;
	background: #b3aa9b url(../i/ui/bg.jpg) 50% 0;
}


																		/* -- core typography -- */
abbr, .small-caps {
	letter-spacing: 0.1em;
}
	p abbr, p .small-caps {
		font-size: 0.9167em; /* 11px */
	}
.amp {
	font-family: Palatino, Georgia, serif;
	font-style: italic;
}
a:link {
	color: #dbe6ec;
	text-shadow: #766b5c 1px 1px 1px;
	font-weight: bold;
	text-decoration: none;
}
a:visited {
	color: #e3e6e6;
	font-weight: normal;
	text-decoration: none;
}
a:hover {
	color: #fff;
	text-shadow: #5d5347 1px 1px 1px;
}
.disclaimer {
	color: #584b43;
	font: italic 1em Candara, georgia, serif;
	display: block;
	margin: 1em 0;
	text-indent: 0;
	text-align: right;
}
dd {
	/* 11px / 12px */
	font-size: 1.1em;
	line-height: 1.091;
	color: #a0783e;
}
dt {
	/* 12px / 12px */
	font-size: 1.2em;
	line-height: 1;
}
em {
	color: #584b43;
}
label {
	/* 11px / 19px */
	font-size: 1.1em;
	line-height: 1.7272;
	text-transform: uppercase;
}
h2 {
	/* 37.5px / 19px */
	font: 3.75em Candara, georgia, serif;
	letter-spacing: -0.03em;
	color: #614e41;
	text-transform: lowercase;
	text-shadow: #c4beb5 2px 2px 1px;
}
h3 {
	/* 15px / 19px */
	font: 1.5em Candara, georgia, serif;
	line-height: 1.2667;
	color: #793829;
	text-transform: lowercase;
	text-shadow: #b8b2a5 2px 2px 1px;
}
	h3.work-title {
		/* 11px / 19px */
		font-size: 1.1em;
		line-height: 1.7272;
		font-family: inherit;
		text-transform: uppercase;
		color: inherit;
	}
h4 {
	/* 12px / 19px */
	font-size: 1.2em;
	line-height: 1.5833;
}
input, textarea {
	font: 1.3em "Lucida Grande", "Lucida Sans Unicode", arial, sans-serif;
	color: #291e18;
}
ul {
	margin-bottom: 0.5em;
}
ul li {
	/* 13px / 22px */
	font-size: 1.3em;
	line-height: 1.6923;
	margin-left: 1.5em;
	list-style: square;
}
ol li {
	/* 13px / 22px */
	font-size: 1.3em;
	line-height: 1.6923;
	margin-left: 24px;
	list-style: lower-roman;
}
	ul li h4, ol li h4,
	ul li p, ol li p {
		font-size: 1em;
	}
p {
	/* 12px / 19px */
	font-size: 1.2em;
	line-height: 1.5833;
	margin: 0 0 0.5em 0;
}
	p .accent {
		padding-bottom: 3px;
		border: none;
		background: url(../i/ui/border-low.png) repeat-x left bottom;	
	}
#footer p {
	color: #84786b;
	text-transform: uppercase;
	margin: 0;
}
	#footer p a:link {
		color: #8d9ca5;
		font-weight: normal;
	}
	#footer p a:hover {
		color: #dbe6ec;
	}
	#footer .sep {
		color: #3a2e25;
		padding: 0 0.4em;
	}




																		/* -- to force a 100% height page -- */
body, html {
	height: 100%;
}
#container {
	width: 100%;
	min-height: 100%;
	position: relative;
	opacity: 0.99999;
}
#container .wrap {
	padding-top: 24px;
	padding-bottom: 110px;
	width: 100%;
	overflow: hidden;
}
#container .wrap2 {
	min-height: 478px;
}
#footer {
	width: 100%;
	position: absolute;
	bottom: 0;
	height: 68px;
}


																		/* -- base layout -- */
#container {
	background: url(../i/ui/header-brown.gif) repeat-x 50% 0;
}
#container .wrap {
	background: url(../i/ui/bg-top.gif) repeat-x 50% 143px;
}
#container .wrap2 {
	background: url(../i/ui/bg-seed.png) repeat-x 50% 119px;
}
																		/* -- header -- */
#header {
	background: #421c16 url(../i/ui/header-red.gif) repeat-x 50% 0;
	height: 118px;
}
#header .wrapper1 {
	background: url(../i/ui/header-red2.gif) no-repeat 50% 0;
	height: 118px;
}
#header .wrapper2 {
	width: 780px;
	margin: 0 auto;
	height: 118px;
	position: relative;
}
#header h1 {
	width: 220px;
	height: 97px;
	background: url(../i/ui/logo.gif) no-repeat 1px 1px;
	position: relative;
}
	#header h1 a:link, #header h1 a:visited {
		display: block;
		width: 220px;
		height: 97px;
		text-indent: -9000px;
		overflow: hidden;
		position: relative;
		z-index: 5;
	}
	/* -- script-generated span for hover -- */
	#header h1 span {
		display: block;
		width: 220px;
		height: 97px;
		position: absolute;
		top: 0;
		left: 0;
		background: url(../i/ui/logo-hover.gif) no-repeat 1px 1px;
		z-index: 1;
	}
																		/* -- content area -- */
#stage {
	width: 750px;
	margin: 0 auto;
	padding: 20px 0;
	overflow: hidden;
	position: relative;
}
.column-1 {
	width: 470px;
	padding: 0 15px;
	float: left;
}
.column-2 {
	width: 215px;
	padding: 0 15px 0 10px;
	float: left;
}

																		/* -- footer -- */
#footer {
	padding-top: 52px;
	background: url(../i/ui/bg-bottom.png) repeat-x 0 -1px;
}
#footer .wrapper1 {
	background: #291f18 url(../i/ui/footer.jpg);
}
#footer .wrapper2 {
	width: 750px;
	margin: 0 auto;
	position: relative;
	height: 68px;
}
#footer p {
	position: absolute;
	right: 0;
	bottom: 10px;
}

																		/* -- gratuitous decoration -- */
#container .wrap i {
	display: block;
	width: 362px;
	height: 13px;
	background: url(../i/ui/colour-bars-top.gif) no-repeat 0 0;
	position: absolute;
	top: 11px;
	left: 50%;
	margin-left: 14px;
}
#container #stage i {
	display: block;
	width: 750px;
	height: 24px;
	background: url(../i/ui/h2-overhang.png) no-repeat 0 0;
	position: absolute;
	top: 26px;
	left: 0;
	margin: 0;
}
#container .wrap i.deco1 {
	background-position: -362px 0;
}
#container .wrap i.deco2 {
	background-position: -724px 0;
}
#container .wrap i.deco3 {
	background-position: -1086px 0;
}
#container #footer i {
	top: 0;
	left: 0;
	background-position: 0 -1px;
	border-bottom: solid 1px #241b18;
	height: 12px;
}



																		/* -- header nav -- */
#primary-nav {
	position: absolute;
	top: 0;
	right: 13px;
	width: 362px;
	height: 118px;
	background: url(../i/ui/nav.gif) no-repeat 0 0;
}
#primary-nav ul {
	margin: 0;
}
#primary-nav li {
	width: 120px;
	height: 118px;
	position: absolute;
	top: 0;
	cursor: pointer;
	list-style: none;
	margin: 0;
}
	li.portfolio {
		left: 0;
	}
	li.services {
		left: 119px;
	}
	li.about {
		left: 239px;
	}
#primary-nav li a:link, #primary-nav li a:visited, #primary-nav div {
	display: block;
	width: 121px;
	height: 118px;
	overflow: hidden;
	text-indent: -9000px;
	cursor: pointer;
}
	/* Primary nav default hover states */
	li.portfolio a:hover, div.nav-portfolio {
		background: url(../i/ui/nav.gif) no-repeat 0 -118px;
	}
	li.services a:hover, div.nav-services {
		background: url(../i/ui/nav.gif) no-repeat -119px -118px;
	}
	li.about a:hover, div.nav-about {
		background: url(../i/ui/nav.gif) no-repeat -239px -118px;
	}
	/* Primary nav scripted hover states */
	div.nav-services {
		position: absolute;
		top: 0;
		left: 119px;
	}
	div.nav-about {
		position: absolute;
		top: 0;
		left: 239px;
	}


																		/* -- accessibility tweaks -- */
#accessibility {
	position: absolute;
	top: -9999px;
	font-size: 1px;
}
.hide {
	display: none;
}