/* Table of Contents

	- Global Reset
	- Basic Structural Rules
	- Specific Structural Rules
	- Common Rules
	- Form Rules
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/


/* Global Reset

	This is an easy way to make sure that all browsers will default all element rules to the same settings.
	
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/


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;
	border : none;
	font-size : inherit;
	line-height : inherit;
}
fieldset,img { border : 0; }
address,caption,cite,code,dfn,em,strong,th,var { font-style : normal; font-weight : normal; }
ol,ul { list-style : none; }
h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight : normal; }
q:before,q:after { content:''; }
abbr,acronym { border : 0; }

/* Basic Structural Rules

	These ids and classes create the most basic building blocks for the website.
	(html) sets the default font type, color and size for the entire site.
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/


html {
	width : 100%;
	color : #666;
	font-size : 62.5%;
	font-family: Arial, Geneva, Helvetica, sans-serif;
	text-align : center;
}

body {
	margin : 0;
	width : 100%;
	text-align : center;
	background : url(../images/template/headerBackground.gif) top left repeat-x;
}

body.interior { background : url(../images/template/interiorPageBackground.gif) top left repeat; }

#wrapper {
	width : 100%;
	font-size : 1.1em;
	line-height : 1.1em;
	display : block;
	float : left;
}

body.interior #wrapper { padding : 120px 0 0 0; background : url(../images/template/content_top.jpg) top left no-repeat; }

#header {
	margin : 0;
	padding : 0;
	height : 140px;
	width : 100%;
	text-align : left;
	display : block;
	clear : both;
}

#printHeader { display : none; }

/* NOTE! navigationBar is a class, this is so that you can have more than one on a page. */

.navigation {
	margin : 0;
	padding : 0;
	width : 1004px;
	display : block;
	float : left;
	clear : both;
}

#contentFrame {
	margin : 0 auto 0 auto;
	padding : 0;
	height : 650px;
	width : 100%;
	text-align : left;
	border : none;
	display : block;
	clear : both;
	overflow : auto;
}

#content {
	margin : 0 auto 0 auto;
	padding : 0;
	width : 659px;
	text-align : left;
	display : block;
	float : left;
	clear : right;
}

#footer {
	margin : 0 auto 0 auto;
	width : 100%;
	text-align : left;
	display : block;
	clear : both;
}

/* Specific Structural Rules

	Use this area to define rules for specific content/pages/design elements.
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/

#header { height : 140px; background : url(../images/template/headerBackground.gif) top left repeat-x; }

#headerContent {
	padding : 0;
	height : 140px;
	width : 338px;
	text-align : left;
	background : url(../images/template/headerContentBackground.gif) top left no-repeat;
	display : block;
	clear : none;
	overflow : hidden;
}

#headerContent p {
	height : 70px;
	width : 121px;
	font-size : 90%;
	text-align : left;
	display : block;
	float : left;
	clear : none;
	overflow : hidden;
}

#headerContent p.buy { padding : 52px 26px 0 21px; }
#headerContent p.sell { padding : 52px 23px 0 26px; }

/* Rules for flash areas */

#headerFlash { height : 140px; width : 666px; display : block; float : left; clear : none; }
#homepageFlash { padding : 20px; height : 243px; width : 466px; display : block; float : right; }

/* Rules for footer */

#footer { padding : 4px 0 0 0; background : url(../images/template/footerBackground.gif) top left repeat-x #fff; }
#footer p { padding : 1.1em 1.4em 2em 1.4em; text-align : center; }
#footer p.nav { padding : .7em 1.4em 1.1em 1.4em; }

#footer a { color: #666; }
#footer p.nav a { padding : 0 1.4em 0 1.4em; }
#footer a:hover { color: #369; }

/* Rules for meet the team page */

div.meetOurTeam p { padding : .5em 1.4em .5em 1.4em; clear : both; }

div.meetOurTeam strong {
	font-size : 1.6em;
	font-weight : bold;
}

/* Rules for creating text "Call Out" sections */

.callOut {
	padding : 5px 7px 15px 7px;
	margin : 13px 15px 13px 15px;
	width : 615px;
	border-top : 2px #fff solid;
	border-bottom : 2px #fff solid;
	background : url(../images/template/contentBackground.gif) top left repeat-y;
	display : block;
	float : left;
	clear : both;
}

.callOut div {
	margin : 0;
	padding : 13px 15px 13px 15px;
	width : 277px;
	display : block;
	float : left;
}


.callOut div h2 {
	padding : .9em .25em .6em .25em;
	width : auto;
	color : #903;
	font-size : 1.2em;
	font-weight : bold;
	line-height : 100%;
	letter-spacing : 0px;
	text-align : left;
	text-transform : uppercase;
	background : none;
	display : block;
}

/* Common Rules
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/

a { color : #903; text-decoration : none; outline : none; }
a:hover { color : #603; }

#content div {
	display : block;
}

#content ul {
	padding : 1em 1.4em 0 .8em;
	width : auto;
	list-style : none;
	display : block;
}

#content ul li {
	padding : .1em 0 1em 2.2em;
	width : auto;
	background : url(../images/template/bullet.gif) top left no-repeat;
	display : block;
	clear : both;
}

/* COLUMNS
	You can use this class to make a div into a column
	The width here defaults to 50% but can be controlled through the class name in the html which is applied by the autowidth.js file
	
	To set a div column width by percent you would specify the class like this ( class="column percent_#" ) where # is the desired value.
	
	To set a div column width to a specific pixel size you would specify the class like this ( class="column pixels_#" ) where # is the desired value.
*/

.column { margin : 0; padding : 0; width : 50%; float : left; }

h1 {
	padding : .67em .25em .1em 1.3em;
	width : auto;
	color : #7c7c7c;
	font-family: Verdana, Tahoma, Arial, Geneva, Helvetica, sans-serif;
	font-size : 2.2em;
	font-weight : bold;
	line-height : 100%;
	letter-spacing : 0px;
	text-align : left;
	background : url(../images/template/h1Background.gif) top left no-repeat;
	display : block;
	clear : both;
}

h2 {
	padding : .9em .25em .6em 1.5em;
	width : auto;
	color : #903;
	font-size : 1.45em;
	font-weight : bold;
	line-height : 100%;
	letter-spacing : 0px;
	text-align : left;
	text-transform : uppercase;
	background : url(../images/template/h2Background.gif) left no-repeat;
	display : block;
	clear : both;
}

h3 {
	padding : .5em 1em 0 1em;
	width : auto;
	color : #330;
	font-size : 1.4em;
	font-weight : bold;
	display : block;
	clear : both;
}

h4 {
	padding : .5em 1.4em 0 1.4em;
	width : auto;
	font-weight : bold;
	display : block;
	clear : both;
}

p {
	padding : .5em 1.4em .5em 1.4em;
	line-height : 1.4em;
	width : auto;
	display : block;
}

ul {
	padding : .5em 1.4em 0 3em;
	width : auto;
	list-style : none;
	display : block;
}

ol {
	padding : .5em 1em 0 3em;
	width : auto;
	display : block;
}

ul li, ol li {
	padding : 0 0 .5em 0;
	width : inherit;
}

hr {
	margin : .5em 1.4em .5em 1.4em;
	display : block;
}

object, embed, img { display : block; }


sup { font-size : 55%; }

/* apply this class to ad a divider between content sections */

.divider { border-bottom : 1px #d9d9d9 solid; }

/* apply this class to properly format images within content */

.photo {
	margin : .1em .8em .8em .8em;
	display : block;
}

.homePhoto {
	margin : 0;
	display : block;
}

/* Apply these classes to float stuff left or right */

.left { float : left; }

.right { float : right; }

.clear { clear : both; float : none; }

/* Apply this to hide anything */

.hide { display : none; }

/* Form Rules
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/

.form { margin : 5px 0 10px 0; padding : 5px 0 10px 0; }

fieldset {
	margin : 0;
	padding : 5px 10px 5px 10px;
	font-size : inherit;
	line-height : inherit;
	border : none;
	display : block;
	clear : both;
}

label { margin : 0; padding : 0 1em 0 0; text-align : left; width : auto; display : block; float : left; }

input { margin : .2em 0 0 0; height : 1.4em; border : 1px #333 solid; display : block; outline : none; }

textarea { border : 1px #333 solid; display : block; }

input.radio { margin : 0 .5em 0 0; border : none; display : block; float : left; }
input.checkbox { margin : 0 .5em 0 0; border : none; display : block; float : left; }

select { border : 1px #333 solid; display : block; outline : none; }

option { height : 1.3em; }

input.button {
	margin : 0 1em 0 0;
	padding : .2em 1em .2em 1em;
	height : auto;
	border : 1px #333 solid;
	background : url(../images/template/footerBackground.jpg) top left no-repeat;
	float : left;
}