/*********************************************************************************************

Description: 03 - 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) Container
	b) Navigation
	c) Header
	d) Main Content
	e) Slider Bar
	f) Sidebar
	g) Bottom Nav
	h) Footer
	i) Form
4. Clear Floated Elements


**********************************************************************************************/




/* 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;font-size:14px;}
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: url(../images/wood-bg.jpg) no-repeat top center fixed;
	width: auto;
	height: auto;
	font-family: "Times New Roman",Times,serif;
	font-size: 12px;
	line-height: 18px;
	color: #5b5b5b;
}

p {
	padding: 5px;
	font-size: 14px;
	line-height: 20px;
}

a {
	color: #000;
}

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) Container */

#container {
	width: 960px;
	margin: 0 auto;
	position: relative;
	z-index: 2;
	background: #fff url(../images/container-bg.png) repeat-x top center;
	margin-bottom: 20px;
	border: 1px solid #000;
	border-top: none;
	
	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 20px #000;
	-khtml-box-shadow: 0px 1px 20px #000;
	-webkit-box-shadow: 0px 1px 20px #000;
}


/* b) Navigation */

nav {
	width: 960px;
	height: 40px;
	position: relative;
	z-index: 10;
	background: url(../images/nav-bg-black.png) repeat-x top center;
	border-bottom: 1px solid #2b2b2b;
	
	-moz-box-shadow: 0px 1px 4px #000;
	-khtml-box-shadow: 0px 1px 4px #000;
	-webkit-box-shadow: 0px 1px 4px #000;
}


/* c) Header */

header {
	width: 940px;
	margin-left: 10px;
	margin-right: 10px;
	position: relative;
	background: none;
}

#logo {
	width: 440px;
	position: relative;
	margin-right: 10px;
	margin-left: 10px;
	display: inline;
	float: left;
}

#logo img {
	padding-top: 20px;
}


/* d) 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;
}

article .column h3 {
	font-size: 18px;
	line-height: 24px;
}

.full-article {
	width: 940px;
}


/* e) Slider Bar */

#slider-bar {
	width: 960px;
	height: 70px;
	background: url(../images/family-banner.png) no-repeat top center;
	margin-bottom: 10px;
}

#slider-bar h3 {
	font-size: 16px;
	padding: 10px;
	color: #fff;
}

#slider-bar h4.button > a {
	background: #ccc;
	padding: 10px;
	float:right;
	font-size: 23px;
	position: relative;
	margin: 0;
	color: #2d2d2d;
	font-weight: 900;
}

#slider-bar h4.button > a:hover {
	background: #d8d8d8;
	color: #000;
}


/* f) Sidebar */

aside {
	width: 240px;
	position: relative;
	margin-right: 10px;
	margin-left: 10px;
	display: inline;
	float: left;
}

aside img {
	margin-top: 10px;
}


/* e) Bottom Nav */

#bottom-nav {
	width: 960px;
	height: 30px;
	margin: 0 auto;
	margin-top: 10px;
	position: relative;
	background: url(../images/nav-bg-black.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;
}


/* f) Footer */

footer {
	width: 960px;
	margin: 0 auto;
	padding: 10px 0;
	margin-top: 5px;
}

.footer-links {
	list-style: none;
	padding: 0 10px;
	text-align: center;
	margin-left: 0px;
}

.footer-links li {
	display: inline;
	text-align: center;
}

.footer-links li > a:hover {
	text-decoration: underline;
}

.service-dropdown {
	position: absolute;
	left: 290px;
}


/* g) 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;}