/* ------------------------------------------------------------ */
/* ----------------------- >> RESET << ------------------------ */
/* ------------------------------------------------------------ */

html, body, div, span, object, a, img,
h1, h2, h3, h4, h5, h6, p, blockquote, pre, q, ol, ul, li, ins, del,
cite, code, dfn, em, kbd, samp, strong, var,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, td {
	padding: 0px;
	margin: 0px;
	border: 0;
	outline: 0;
	background: transparent;
	vertical-align: baseline;
	font-size: 100.01%; }


/* ------------------------------------------------------------ */
/* ---------------------- >> DEFAULTS << ---------------------- */
/* ------------------------------------------------------------ */

.wrapper { width: 980px; margin: 0px auto; min-height: 100%; position: relative; }
.left { float: left; }
.right { float: right; }
.clear { clear: both; }
.col-first { margin-left: 0px !important; }

html, body { height: 100%; }
body { font: 75%/18px Arial, Helvetica, sans-serif; }
h1, h2, h3, h4, h5, h6 { font-weight: normal; }
h1 { font-size: 3em; line-height: 1em; color: #DDD; margin: 20px 10px 50px; }
h2 { font-size: 2em; line-height: 1.4em; }
h3 { font-size: 1.6em; line-height: 1.2em; margin-bottom: .75em; }
p { margin: 0 0 1.5em; }


/* ------------------------------------------------------------ */
/* ----------------------- >> LAYOUT << ----------------------- */
/* ------------------------------------------------------------ */

body { background: url(../images/body-back.png) no-repeat top center; }

#header {
	position: relative; 
	height: 120px;
	padding: 0px 10px;
	background: #000; }
	
	#logo {
		position: absolute; 
		left: 40px; 
		bottom: 0px; }
	
	#nav {
		position: absolute;
		right: 24px;
		bottom: 20px;
		list-style: none; }

#content {
	color: #333;
	padding: 0px 10px; }
	
	#feature {
		color: #DDD;
		height: 270px;
		padding: 10px;
		margin: 50px 0px 70px; }
		
		#focus {
			float: left;
			width: 540px;
			height: 270px;
			margin-right: 20px;
			border-left: 1px solid #666;
			border-right: 1px solid #666; }

	.vgrid {
		float: left;
		width: 960px;
		margin: 0px 10px 10px; }

	.col-1of2 {
		float: left;
		width: 460px;
		margin: 10px; }
	
	.col-1of3 {
		float: left;
		width: 300px;
		margin: 10px; }
	
	.col-1of4 {
		float: left;
		width: 220px;
		margin: 10px; }
	
	.col-1of6 {
		float: left;
		width: 140px;
		margin: 10px; }

	.social-list {
		list-style: none; }

#footer {
	margin: 40px 20px 0px;
	text-align: center; }

/* ------------------------------------------------------------ */
/* ----------------------- >> FORMAT << ----------------------- */
/* ------------------------------------------------------------ */

#nav li {
	float: left; 
	margin-right: 12px; }

	#nav li a {
		display: block;
		color: #777;
		text-decoration: none; 
		font-size: 16px;
		padding: 90px 6px 6px; }

		#nav li a:hover, 
		#nav li a.current {
			background: #2e9454;
			color: #FFF; }

		#nav li a:active {
			color: #DDD; }

#focus img {
	margin-left: 30px; }

.social-list li {
	position: relative;
	float: left;
	width: 140px; }
	
	.social-list li a {
		color: #000; }
	
		.social-list li a img {
			display: inline; }
	
		.social-list li a strong {
			line-height: 30px;
			height: 30px;
			display: block;
			position: absolute;
			left: 0;
			top: 0;
			padding: 0 0 0 40px; }

.vgrid a {
	float: left;
	margin: 10px; }

	.vgrid a img {
		border: 5px solid #DDD; }

	.vgrid a img:hover {
		border: 5px solid #CCC; }