*
{
	margin:				0;
	padding:			0;
	box-sizing: 		content-box;
	-moz-box-sizing:	content-box;
}

html 
{ 
	font-size: 		100.01%; /* IE hack */ 
	height:			100%;
}

/*	LAYOUT TAGS	*/

body
{
	font:			normal 70% Verdana, Helvetica, Arial, sans-serif;
	color:			#000000;
	background-color:	#eff6e8;
	border:			0;
	margin-top:		40px;
		
	min-height:			101%;
}



/*	defaults 
these prevent cascading and dodgy sizing, specifically in IE5.x
*/

table, input, select, th, td { font-size: 100.01%; }

/*	STANDARD TAGS */

table
{
	/*border-collapse:	collapse;*/
}

a
{
	color:			#095C71;	/* darkest blue */
	font-weight:		bold;
	text-decoration:	none;
}

a:hover
{
	color:				#168DAB;	/* dark blue */
}

/* 
	standard formatting
	
	sizes and margins declared in EM units so that user can
	increase the text size and still preserve the structure
*/
h1
{
	text-transform: 	lowercase;
	font-weight:		bold;
	font-size:		1.33em;
	margin-bottom:		0.75em;
}


h2
{
 	text-transform: 	lowercase;
	font-weight:  bold;
 	font-size:  1.6em;
 	margin-bottom:  0.2em;
 	color:   #034e94;  
}



h3
{
	text-transform: 	lowercase;
	font-weight:		bold;
	font-size:		1.2em;
	margin-bottom:		0.66em;
	color:			#4d8ac4;	/* nice blue text */
}

h4
{
	text-transform: 	lowercase;
	font-weight:		bold;
	font-size:		1.0em;
	margin-bottom:		1.0em;
}

h5
{
	text-transform: 	lowercase;
	font-weight:		bold;
	font-size:		1.0em;
	margin-bottom:		1.0em;
}

h6
{
 	text-transform: 	lowercase;
	font-weight:  bold;
 	font-size:  1.9em;
 	margin-bottom:  0.2em;
 	color:   #034e94;  
}

s1
{
	font:			normal 50% Verdana, Helvetica, Arial, sans-serif;
	color:			#000000;
	background-color:	#eff6e8;
	border:			0;
		
	min-height:			101%;
}

p
{
	font-size:		1.0em;
	margin-bottom:		1.0em;
}

b
{
	color:			#4d8ac4;	/* nice blue text */
}

img
{
	border:			none;
}

ul, ol
{
	font-size:		1.0em;
	/*margin-bottom:	1.0em;*/
	padding-left:		2.0em;
}

ul li, ol li
{
}

ul
{
	margin-bottom:		1.0em;
}

.nocss
{
	display:	none;
}

/*
	INPUTS / FORMS
*/

select.select
{
	width:				150px;
	border:				1px solid #666;
}

select.select option
{
	margin-right:		1em;
}

input.button
{
	width:				75px;
}

input.text,
input.textnormal,
input.textsmall,
input.textwide,
input.textthin,
textarea
{
	border:				1px solid #666;
	background-color:	#FFFFFF;	/* white */
	height:				1.5em;
}

input.text,
input.textnormal
{
	width:				150px;
}

input.texttiny
{
	width:				37px;
}

input.textsmall
{
	width:				75px;
}

input.textwide
{
	width:				300px;
}

.admin textarea
{
	width:				400px;
	height:				500px;
}

textarea
{
	width:				300px;
	height:				150px;
}



/*
	table where th's are down the left and input boxes and such are in td's along the right
*/
table.formtable
{
	margin:			0 auto;
}

table.formtable th, table.formtable td
{
	padding:		5px;
	vertical-align: top;
	text-align:		left;
}


table.listtable
{
	border-top:			1px solid #CCCCCC;
	border-left:		1px solid #CCCCCC;
}

table.listtable td,
table.listtable th
{
	vertical-align: top;
	border-right:		1px solid #CCCCCC;
	border-bottom:		1px solid #CCCCCC;
	padding: 			5px;
	text-align:			left;
}






table.listtable
{
	border-top:		1px solid #CCCCCC;
	border-left:		1px solid #CCCCCC;
}

table.listtable td,
table.listtable th
{
	vertical-align: 	top;
	border-right:		1px solid #CCCCCC;
	border-bottom:		1px solid #CCCCCC;
	padding: 		5px;
	text-align:		left;
}


div.clear
{
	font-size:		0;
	height:			50px;
	width:			0;
	overflow:		hidden;
	clear:			both;
}


foo
{
	background-color:	#FFFFFF;	/* white */
	background-color:	#000000;	/* black */
	
	background-color:	#eff6e8;	/* light pale green outer background */

	background-color:	#;	/*  */
	background-color:	#;	/*  */
	background-color:	#;	/*  */
	background-color:	#;	/*  */
	
	background-color:	#086cb5;	/* generic light blue background */
	color:			#9fcc67;	/* green text on blue background */
	color:			#fbdd00;	/* cheesy yellow on blue background */
	
	color:			#999999;	/* grey text - white background */

	
}

/*

	outer and inner serve only to align background images and preserve the
	scrollbar for mozilla-based browsers. 

*/

div#outer
{
	text-align:		left;
	margin:			0 auto;
	width:			766px;
	min-height:		100.01%;
	position:		relative;	/* for abs pos'ing the furniture spans */
	background-image:	url(../img/outer-back.gif);
}

span#outer_left
{
	display:	block;
	position:	absolute;
	width:		8px;
	height:		150px;
	top:		0px;
	left:		0px;
	background-image:	url(../img/grad-top-left.gif);
}

span#outer_right
{
	display:	block;
	position:	absolute;
	width:		8px;
	height:		150px;
	top:		0px;
	right:		0px;
	background-image:	url(../img/grad-top-right.gif);
}

span#outer_bottom
{
	clear:		both;
	display:	block;
	width:		766px;
	height:		32px;
	background-image:	url(../img/grad-bottom.gif);
}

div#inner
{
	margin-left:		8px;
	position:		relative;
	min-height:		100.01%;
	width:			750px;
}




/*

body >
outer >
inner >

|---------------|
|head           |
|---------------|
|menu | main    |
|     |         |
|     |         |
|     |         |
|---------------|

*/


div#head
{
	width:			750px;
	height:			128px;
	background-image:	url(../img/head.png);

}

/*
	testimonial quote within header block
*/
div#tagline
{
	color:			#FFF;
	width:			250px;
	padding-top:		25px;
	margin-left:		270px;
	font-style:		italic;
	font-size:		1.1em;
	line-height:		1.4em;
	color:			#f6e9d4;		/*salmon!*/
}

/*
	icon image to right of header block, e.g. easy as "pie"
*/
div#icon
{
	float:			right;
	margin-top:		15px;
}


div#foot
{
	clear:			both;
	text-align:		right;
	padding-right:		8px;
	padding-top:		16px;		/* plenty o room */
	
	font-size:		0.833em;
	color:			#999999;
}

div#foot a
{
	font-weight:		normal;
	color:			#999999;
}

div#foot a:hover
{
	color:			#666666;
}




div#main
{
	width:			640px;
	float:			left;
	margin-left:		110px;
	
	background-image:	url(../img/content-top.gif);
	background-repeat:	no-repeat;
	background-position:	top left;
}

/*

 main >
 
|---------------|
|content |boxes |
|        |      |
|        |      |
|        |      |
|---------------|
|foot           |
|---------------|

*/

/*
	main -> content
*/
div.content
{
	margin-top:		24px;
	padding-left:		24px;
	
	
	min-height:		440px;
	
}

div.content p
{
	font-size:		0.9em;
	color:			#666666;
}


/*
		MENU
*/

div#menus
{
	position:		absolute;
	top:			128px;
	left:			0px;
}

div#menu
{
	width:			150px;
	background-image:	url(../img/menu-back.gif);
	margin-left:		-8px;		/*to align borders from background images */
}

/*
	border image placement
*/
span#menu_top
{
	display:		block;
	width:			150px;
	height:			24px;
	background-image:	url(../img/menu-top.gif);
}

span#menu_bot
{
	display:		block;
	width:			150px;
	height:			48px;
	background-image:	url(../img/menu-bottom.gif);
}


div#menu a
{
	display:		block;
	font-weight:		bold;
	color:			#9fcc67;	/* green text on blue background */
	margin:			5px 0;
}

div#menu a:hover
{
	color:			#fbdd00;	/* cheesy yellow on blue background */
}

div#menu ul
{
	list-style-type:	none;
}



/*
	submenu is a bunch of search-engine friendly links

*/
div#submenu ul
{
	list-style-type:	none;
	font-size:		1 em;
}

div#submenu li
{
	margin-bottom:		5px;
}

div#submenu a
{
	color:			#FFA201;
	font-weight:		bold;
}

div#submenu a:hover
{
	color:			#006699;
	font-weight:		bold;

}





div.img_right
{
	float:			right;
	margin:			0 0 10px 10px;
}


div.img_left
{
	float:			left;
	margin:			0 10px 10px 0;
}

div.img_right p,
div.img_left p
{
	text-align:		center;
	font-style:		italic;
}



/*

CHUNKY BOXES AND PANELS DOWN RIGHT HAND SIDE, NEED TO NUDGE UP OVERLAPPING
THE HEADER A LITTLE.

*/

div#right_panel
{
	width:		320px;
	float:		right;
	margin-top:	-22px;
	
	
}

div#right_panel_landing
{
	width:		312px;
	float:		right;
	margin-left:	8px;
	margin-top:	-12px;
	
	
	
}

div#right_panel_landing_top
{
	width:		325px;
	float:		right;
	margin-top:	-22px;
	margin-left:	0px;

	
	
}





/*
	container for the three smallish square blue button-boxes when
	side-by side
*/
div.three_box
{
	width:		320px;
	height:		121px;
	float: 		right;
	clear:		right;
	color:		#ffffff;
	background-image:	url(../img/side-three.gif);
}

/*
	this is the mini-box itself, three of these in a line fit in
	the above div but note how the background image is part of the
	above too
*/
div.three_box div
{
	float:		left;
	width:		96px;
	margin-top:	20px;
	margin-left:	10px;
}

div.three_box h2
{
	font-size:	1.0em;
	font-weight:	bold;
	color:		#ffffff;
}

div.three_box h3
{
	font-size:	1.2em;
	font-weight:	bold;
	margin-bottom:	16px;
}



/*
	text and a photo on right currently having a pale green
	background. The background image fakes it a little having the
	right-hand and top white borders built in so a little nudging
	of the content is needed so these (and the curvy corners)
	don't get overlapped by text and such like.
*/
div.panel
{
	margin-left:	8px;
	width:		312px;	/*actually 305px wide, the rest is white space*/
	float: 		right;
	clear:		right;
	background-image:	url(../img/panel-back.gif);
}

div.panel2
{
	margin-left:	8px;
	width:		312px;	/*actually 305px wide, the rest is white space*/
	float: 		right;
	clear:		right;
}

div.panel_foot
{
	margin-left:	8px;
	width:		312px;
	height:		20px;
	float: 		right;
	clear:		right;
	background-image:	url(../img/panel-foot.gif);
}

/* contains 128px wide photo */
div.panel span
{
	float:		left;
	margin-left:	12px;
	width:		130px;
}

/* contains text */
div.panel div
{
	float:		left;
	margin-left:	12px;
	width:		145px;	/* there's a little white-space to the right of the box, dont overlap it! */
	margin-top: 	12px;
}

div.panel h3
{

}

div.panel h4
{
	color:		#014c93;
}

div.panel p
{
	font-size:	0.9em;
	color:		#666666;
}

div.panel b
{

}

div.panel i
{

}





/*
	big blue button, like the panel it's actually 305px + white space
	wide.
*/
div.big_button
{
	float: 		right;
	clear:		right;
	margin-left:	8px;
	width:		312px;
}






/*
	305*305 image panel for SEO pages
*/

div.image_panel
{
	float: 		right;
	clear:		right;

	margin-top:	6px;
	margin-right:	7px;
	margin-bottom:	4px;
}






div.big_box,
div.big_box_top
{
	width:		320px;
	float: 		right;
	clear:		right;
	color:		#ffffff;
}

div.big_box h2,
div.big_box_top h2
{
	font-size:	1.33em;
	font-weight:	bold;
	color:		#ffffff;
}

div.big_box h3,
div.big_box_top h3
{
	font-size:	1.5em;
	font-weight:	bold;
}

.green
{
	color:		#8bbf50;
}

.orange
{
	color:		#fbb800;
}

.yellow
{
	color:		#fbdd00;
}

span.box_in
{
	display:		block;
	width:			304px;
	margin-left:		8px;
	padding-left:		8px;
	height:			117px;
	background-image:	url(../img/side-back.gif);
}

span.box_top
{
	display:		block;
	width:			320px;
	height:			30px;
	background-image:	url(../img/side-top.gif);
}

div.big_box_top span.box_top
{
	background-image:	url(../img/side-top-top.gif);
}

span.box_bot
{
	display:		block;
	width:			320px;
	height:			15px;
	background-image:	url(../img/side-bottom.gif);
}

div.big_box_top div,
div.big_box div
{
	width:			140px;
	float:			right;
}


