/* Default Text CSS */
p, li {
	font-family: Georgia, Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 19px;
	color: #444444;
	margin-bottom: 5px;
}

.no_top_margin {
	margin-top: 2px;
}

/* Links */
a {
	font-family: Arial, Helvetica, sans-serif;
	font-style:italic;
	font-weight:bold;
	font-size: 17px;
	line-height:21px;
	text-decoration:underline;
	color: #a4a4a4;
}

.bottomlink {
	font-family: Arial, Helvetica, sans-serif;
	font-style:italic;
	font-weight:bold;
	font-size: 15px;
	text-decoration: none;
	color: #8fb8d1;
}

/* Body Text Callout (larger & italic) */
.callout {
	font-family: Georgia, Arial, Helvetica, sans-serif;
	font-style:italic;
	font-size: 16px;
	line-height: 20px;
	color: #444444;
}

/* Blue Subheader */
.subhead {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight:bold;
	font-size: 20px;
	line-height:24px;
	color: #72a4c5;
}

.sidenote {
	font-family: Arial, Helvetica, sans-serif;
	font-style:italic;
	font-weight:bold;
	font-size: 17px;
	line-height:21px;
	color: #a4a4a4;
}

/* Links at the bottom of the page (legal/logos section) */
.legal {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	line-height: 12px;
	color: #888888;
}

.clear { clear: both; }

body {
	background:url(../images/shadow.gif) #86b5d2 repeat-y scroll 990px 0px; /*scroll = background image moves when the rest of the page scrolls*/
	font-family: 'Lucida Grande',Helvetica,Arial,sans-serif;
	font-size: 62.5%;
	float: left;
	margin: 0 0 0 0;
}

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

div#header {
	background:url(../images/BackgroundPattern.jpg) repeat scroll 0 0 #ffffff;
	height: 500px;
	width: 990px;
	
}

div#main-image {
	background:url(../images/home_topart.gif) no-repeat scroll 0 0;
	height: 493px;
	width: 600px;	
}

.menuholder {
	position: absolute;
	margin-top: 22px;
}
.menushadow {
	background: url(../images/menu_bgshadow.png) repeat-x;
}
.menushadow div {
	background: url(../images/menu_endshadow.png) right top no-repeat;
	color: #00CC00;
	padding:16px;
}
.menushadow img {
	padding-left: 17px;
	border: 0px;
}

/* the green image that hangs to the right in the header */
#header-img {
	margin-top: 115px;
	margin-left: 630px;
}


/* these next 3 are for the small headers on all the pages except for home */

div#header-small {
	background:url(../images/BackgroundPattern.jpg) repeat scroll 0 0 #ffffff;
	height: 250px;
	width: 990px;
}

img#title-img {
	margin-top: 120px;
	margin-left: 33px;
	position: absolute;
}

/* the b&w image that hangs to the right in the header */
span#header-img-small {
	margin-left: 700px;
	position: absolute;
}

/* content in the header for the 404 and 500 pages */
div#error-content {
	padding: 230px 0 0 40px;
}

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

/* in firefox if we omit the width attribute here, it still works. we need it for IE however */
div#main-content {
	background:url(../images/BackgroundPattern.jpg) repeat scroll 0 0 #ffffff;
	width: 990px;
}

div#left-col {
	float: left;
	width: 490px;
	margin: 0 0 0 30px;
	padding: 0 0 50px 0;
}

div#right-col {
	float: right;
	width: 400px;
	margin: 0;
}

#right-col img {
	border: 0;
}

/* these 2 are the columns for the buy now page.
 * they are in the main.css because when they were in their own
 * css file named buy.css, it was getting loaded first and throwing 
 * off IE. */
div#left-col-buy {
	float: left;
	width: 350px;
	margin: 5px 0 0 35px;
	padding-bottom: 350px; /* adds some space to the bottom */
}

div#right-col-buy {
	float: right;
	width: 600px;
	margin: 50px 0 0 0;
}

/* same with the FAQ page */
div#faq-text {
	padding: 10px 0 50px 0;
	margin: 0 240px 0 45px;
}

/* gets rid of the gap between an FAQ question and answer */
#faq-text p {
	margin-top: 0px;
}


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

div#footer {
	background:url(../images/BackgroundPattern.jpg) repeat scroll 0 0 #ffffff;
	height: 200px;
	width: 990px;
}

div#footer-content {
	margin: 0 30px 10px 30px;
	border-top: 4px solid #72a4c5;
}