/*********************************************************************************************

Description: 01 - Template
Version: 1.1
Author: Bradley Taunt
Author URI: http://netvatise.com

**********************************************************************************************

Designed and Built by Netvatise Inc. - netvatise.com

HTML5, CSS3 and Design Files are all Copyright 2008-2011 Netvatise

**********************************************************************************************/


/* Table of Contents


1. CSS Reset
2. Basic Setup
3. Elements
	a) Header
	b) Navigation
	c) Wrapper
	d) Container
	e) Main Content
	f) Sidebar
	g) Bottom Nav
	h) Footer
	i) Form
4. Clear Floated Elements


**********************************************************************************************/

a.more {
	background: #000;
	padding: 5px 10px;
	color: #fff;
}

a.more:hover {
	background: #ccc;
	color: #000;
}


/* 1. CSS Reset
**********************************************************************************************/

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
	margin: 0;
	padding: 0;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

pre {
	background: #ccc;
	padding: 10px;
}

fieldset, img {border: 0;}

address, caption, cite, code, dfn, em, strong, th, var {
	font-style: normal;
	font-weight: normal;
}

ol, ul {list-style: circle;}
li {margin-left: 15px;}
caption, th {text-align: left;}

h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	font-weight: normal;
	color: #2d2d2d;
}

hr {
	border-top: 1px solid #b3b3b3;
	border-right: none;
	border-left: none;
	border-bottom: none;
	background: none;
	color: none;
	margin-bottom: 20px;
}

q:before, q:after {content: '';}
abbr, acronym {border: 0;}

::selection {
        background: #70e7b6;
}
::-moz-selection {
        background: #70e7b6;
}



/* 2. Basic Setup
**********************************************************************************************/

html, body {
	background: #8c8c8c;
	width: auto;
	height: auto;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 12px;
	line-height: 18px;
	color: #5b5b5b;
}

p {
	padding: 5px;
}

a {
	color: #000;
	outline: none;
}

a:link, a:visited {
	text-decoration: none;
}

a:hover {
	color: #2d2d2d;
}

img.fltRight {
	float: right;
	padding: 5px 0 10px 10px;
}

img.fltLeft {
	float: left;
	padding: 5px 10px 10px 0;
}

a.button {
	background: #ececec;
	background: -moz-linear-gradient(top, #ececec 0%, #dadada 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ececec), color-stop(100%,#dadada));
	background: -webkit-linear-gradient(top, #ececec 0%,#dadada 100%);
	background: -o-linear-gradient(top, #ececec 0%,#dadada 100%);
	background: -ms-linear-gradient(top, #ececec 0%,#dadada 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ececec', endColorstr='#dadada',GradientType=0 );
	background: linear-gradient(top, #ececec 0%,#dadada 100%);
	border: 1px solid #ababab;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .1), 0 1px 1px rgba(255, 255, 255, .8) inset;
	-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .1), 0 1px 1px rgba(255, 255, 255, .8) inset;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .1), 0 1px 1px rgba(255, 255, 255, .8) inset;
	color: #707070;
	font-family: 'Helvetica Neue', Helvetica, Arial, Geneva, sans-serif;
	font-size: 12px;
	font-weight: bold;
	-webkit-font-smoothing: antialiased;
	margin: 0;
	outline: none;
	padding: 5px 10px;
	float: left;
	text-align: center;
}

a.button:hover {
	background: #f6f6f6;
	background: -moz-linear-gradient(top, #f6f6f6 0%, #eeeeee 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f6f6f6), color-stop(100%,#eeeeee));
	background: -webkit-linear-gradient(top, #f6f6f6 0%,#eeeeee 100%);
	background: -o-linear-gradient(top, #f6f6f6 0%,#eeeeee 100%);
	background: -ms-linear-gradient(top, #f6f6f6 0%,#eeeeee 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f6f6', endColorstr='#eeeeee',GradientType=0 );
	background: linear-gradient(top, #f6f6f6 0%,#eeeeee 100%);
	cursor: pointer;
}

h1 {
	font-size: 27px;
	font-weight: 800;
	margin: 0 0 2px 0;
}

h2, h3 {
	font-size: 20px;
	margin: 0 0 10px 0;
}

strong {font-weight: bold;}

section, article, header, nav, footer, aside, hgroup {
	display: block;
}




/* 3. Elements
**********************************************************************************************/


/* a) Header */

header {
	width: 100%;
	margin: 0 auto;
	position: relative;
	background: #555555;
}

#header-container {
	width: 960px;
	height: 130px;
	margin: 0 auto;
	position: relative;
	background: none;
}

#logo {
	width: 500px;
	position: relative;
	margin-right: 10px;
	margin-left: 10px;
	display: inline;
	float: left;
}

#logo img {
	padding-top: 20px;
}

#contact {
	width: 420px;
	position: relative;
	margin-right: 10px;
	margin-left: 10px;
	display: inline;
	float: left;
}

#contact p {
	text-align: right;
	font-size: 26px;
	line-height: 26px;
	padding-top: 20px;
	color: #fff;
}


/* b) Navigation */

nav {
	width: 100%;
	height: 50px;
	position: relative;
	z-index: 10;
	background: url(../images/nav-bg.png) repeat-x top center;
	
	-moz-box-shadow: 1px 1px 5px #000;
	-khtml-box-shadow: 1px 1px 5px #000;
	-webkit-box-shadow: 1px 1px 5px #000;
}

nav ul {
	width: 960px;
	margin: 0 auto;
	padding: 16px 0 0 0;
	list-style: none;
}

nav ul > li {
	float: left;
	position: relative;
	font-size: 16px;
	margin: 0;
	padding: 0;
}

nav ul > li > a {
	padding: 16px 30px;
	margin: 0;
	background: none;
	position: relative;
	border-right: 1px solid #000;
	border-left: 1px solid #3a3a3a;
	color: #ccc;
}

nav ul > li > a:hover, nav ul > li > a.selected {
	background: url(../images/nav-bg-hover.png) repeat-x top center;
	color: #fff;
}


/* c) Wrapper */

#wrapper {
	width: 100%;
	margin: 0 auto;
	position: relative;
	background: none;
}


/* d) Container */

#container {
	width: 960px;
	margin: 0 auto;
	position: relative;
	z-index: 2;
	background: #fff;
	margin-bottom: 20px;
	
	border-bottom-right-radius: 10px;
	-webkit-border-radius-bottomright: 10px;
	-moz-border-radius-bottomright: 10px;
	-khtml-border-radius-bottomright: 10px;
	
	border-bottom-left-radius: 10px;
	-webkit-border-radius-bottomleft: 10px;
	-moz-border-radius-bottomleft: 10px;
	-khtml-border-radius-bottomleft: 10px;
	
	-moz-box-shadow: 0px 1px 5px #000;
	-khtml-box-shadow: 0px 1px 5px #000;
	-webkit-box-shadow: 0px 1px 5px #000;
}


/* e) Main Content */

article {
	width: 680px;
	position: relative;
	margin-right: 10px;
	margin-left: 10px;
	display: inline;
	float: left;
}

article #columns {
	background: url(../images/columns-bg.png) repeat-x top center;
	padding: 10px 0;
	
	border-top-right-radius: 10px;
	-webkit-border-radius-topright: 10px;
	-moz-border-radius-topright: 10px;
	-khtml-border-radius-topright: 10px;
	
	border-top-left-radius: 10px;
	-webkit-border-radius-topleft: 10px;
	-moz-border-radius-topleft: 10px;
	-khtml-border-radius-topleft: 10px;
}

article .column {
	width: 206px;
	position: relative;
	margin-left: 10px;
	margin-right: 10px;
	display: inline;
	float: left;
}


/* f) Sidebar */

aside {
	width: 240px;
	position: relative;
	margin-right: 10px;
	margin-left: 10px;
	display: inline;
	float: left;
}

aside img {
	margin-top: 10px;
}


/* g) Bottom Nav */

#bottom-nav {
	width: 960px;
	height: 30px;
	margin-top: 10px;
	position: relative;
	background: url(../images/nav-bg.png) repeat-x top center;
}

#bottom-nav ul {
	list-style: none;
	float: right;
	padding: 6px 15px 0 0;
}

#bottom-nav ul > li {
	display: inline;
}

#bottom-nav ul > li > a {
	padding-right: 10px;
	padding-left: 10px;
	color: #ccc;
}

#bottom-nav ul > li > a:hover {
	color: #fff;
}


/* h) Footer */

footer {
	width: 960px;
	margin: 0 auto;
	padding: 10px 0;
	margin-top: 5px;
}


/* i) Form */


form {
	margin-top: 30px;
}


label {
	float: left;
	width: 120px;
	font-weight: bold;
}

input, textarea {
	width: 380px;
	margin-bottom: 10px;
	padding: 7px;
	background: #9a9a9a;
	border: 1px solid #fff;
	-moz-border-radius: 8px;
	-khtml-border-radius: 8px;
	-webkit-border-radius: 8px;
	outline: none;
}

input:focus, textarea:focus {
	background: #ccc;
	border: 1px solid #868484
}

textarea {
	width: 380px;
	height: 150px;
	overflow: auto;
}

.submitButton {
	margin-top: 5px;
	width: 90px;
	cursor: pointer;
}

.submitButton:hover {
	background: #ccc;
}



/* 4. Clear Floated Elements
**********************************************************************************************/

.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}

.clearfix:after {
	clear: both;
	content: ' ';
	display: block;
	font-size: 0;
	line-height: 0;
	visibility: hidden;
	width: 0;
	height: 0;
}

/*
	The following zoom:1 rule is specifically for IE6 + IE7.
	Move to separate stylesheet if invalid CSS is a problem.
*/

        #image{border:4px #666 solid;height:480px;width:640px;}
        .thumb{float:left;margin-right:10px;margin-top:10px;}