/********* Page Structure - Start **********/

body {
	margin: 0 0 20px 0;
	padding: 0;
	background-image: url(images/bg.jpg);
}

/* the central page area which pops out from the background */
#page {
	text-align: left;
	margin: 0px auto 0px auto; 
	padding: 0;
	width: 716px;
}

/* the actual content area which is contained within the #page element */
#content {
	font: sans-serif, Helvetica, Verdana, Arial;
	color: #000000;
	margin: 0px auto; 
	padding: 25 pix auto;
}	

/* this is a left-side table with a border around the pic and caption */
#captionboxleft {
	float: left;
	margin: 10px 15px 10px 0;
	padding: 5px;
	border:1px solid #000000;
	font: bold 12pt Arial, Helvetica, Verdana ;
	text-align:center;
	color: #000000;
}

/* this is a right-side table with a border around the pic and caption */
#captionboxright {
	float: right;
	margin: 10px 0 10px 15px;
	padding: 5px;
	border:1px solid #000000;
	font: bold 12pt Arial, Helvetica, Verdana ;
	text-align:center;
	color: #000000;
}

/* this is a left-side sidebar with a double border around the contents */
#sidebarleft {
	float: left;
	margin: 0px 0px 0px 0;
	padding: 0px;
	border:4px double #CCCCCC;
	font: 10pt Arial, Helvetica, sans-serif;
	text-align: left;
	color: #000000;
}

/* this is a right-side sidebar with a double border around the contents */
#sidebarright{
	float: right;
	margin: 0px 1px 0px 15px;
	padding: 1px;
	border: 2px double #CCCCCC;
	font: 10pt Arial, Helvetica, sans-serif;
	text-align: left;
	color: #000000;
}

/* these are central, wide boxes which stretches almost all the way across the content */
#widebox {
	background: #fafafa;	
	border: 2px solid  #000000;
	margin: 20px 110px 20px 110px;
	padding: 10px;
}

#widebox2 {
	background: #fafafa;	
	border: 2px solid  #000000;
	margin: 20px 75px 20px 75px;
	padding: 10px;
}

#wideboxdashed {
	border: 2px dashed  #000000;
	margin: 20px 100px 20px 100px;
	padding:10px;
}

img.border {
	float: left;
	margin: 5px 5px 5px 0;
	border: 1px solid  #000000;
}

img.noborder {
	margin: 15px 0 15px 0;
}

/* this image style goes inside a captionbox */
img.box {
	margin: 10px 0 10px 0;
	border: 1px solid  #000000;
}

/* this image style goes inside a captionbox */
img.boxnoborder {
	margin: 10px 0 10px 0;
}

/* these three elements are used to create a wide table with alternating blue and white cells */
#bluewhitetable {
	border: 1px solid #000000;
	margin: 25px auto 25px auto;
	width: 580px;
	text-align: left;
}

.elementblue {
	background: #FFFFCC;
	border-top: 1px solid #FFCC00;
	border-bottom: 1px solid #FFCC00;
	padding: 0px 10px 0px 0px;
}

.elementwhite {
	padding: 0px 10px 0px 0px;
}

/******** Content Formatting Starts Here ****/

/* main sidebar where videos and tesimonial graphics go */
.column_left {
	float: left;
	margin: 15px 15px 15px 0;
	width: 217px;
	background: #E7F5FE;
	border: 1px dashed #99FFFF;
}

/* this is where the main content (i.e. the copy) goes */
.content_right {
	float: right;
	padding: 0 5px 0 5px;
	background-image: url(images/md.jpg);
}

p {
	font: 10pt Verdana, Arial, Helvetica, sans-serif;
	color: #000000;
	margin-right: auto;
	margin-left: auto;
	width: auto;
}

li {
	font: 10pt Verdana, Arial, Helvetica, sans-serif;
	color: #000000;
	margin-bottom: 15px;
	margin-left: 40px;
}

/*** Text Formatting Starts Here ****/

/* eyebrows go above the main headline block */
.eyebrow {
	font: bold italic 13pt Arial, Helvetica, sans-serif;
	text-align: center;
	color: #000000;
	margin-top: -5px;
	margin-bottom: 10px;
}

/* a very large headline used only very sparingly */
.h1ltblue35 {
	font: bold 35pt Arial, Helvetica, sans-serif;
	text-align: center;
	color: #3366FF;
	line-height: 100%;
	margin-top: 0px;
	margin-bottom: 0px;
}

/* large H1 headlines - the margins may need adjustment for specific headline triads */
.h1orange {
	font: bold 25pt Arial, Helvetica, sans-serif;
	text-align: center;
	color: #FF6600;
	line-height: 100%;
	margin-top: 1px;
	margin-bottom: 15px;
}

.h1ltblue {
	font: bold 25pt Arial, Helvetica, sans-serif;
	text-align: center;
	color: #3366FF;
	line-height: 190%;
	margin-top: 0px;
	margin-bottom: 0px;
}

/* slightly smaller H2 headlines */
.h2orange {
	font: bold 22pt Arial, Helvetica, sans-serif;
	text-align: center;
	color: #FF9900;
	line-height: 150%;
	margin-top: 0px;
	margin-bottom: 0px;
}

.h2ltblue {
	font: bold 22pt Arial, Helvetica, sans-serif;
	text-align: center;
	color: #3366FF;
	line-height: 150%;
	margin-top: 0px;
	margin-bottom: 0px;
}

/* used when headline elements need to be packed closer together */
.h2navycompressed {
	font: bold 20pt Arial, Helvetica, sans-serif;
	text-align: center;
	color: #003399;
	line-height: 100%;
	margin-top: 20px;
	margin-bottom: 20px;
}

.h2navy {
	font: bold 22pt Arial, Helvetica, sans-serif;
	text-align: center;
	color: #33339F;
	line-height: 150%;
	margin-top: 0px;
	margin-bottom: 0px;
}

.h2black {
	font: bold 22pt Arial, Helvetica, sans-serif;
	text-align: center;
	color: #000000;
	line-height: 120%;
	margin-top: 10px;
	margin-bottom: 10px;
}

/* two slightly smaller H2 headlines which may be needed to get the look just right */
.h2ltblue20 {
	font: bold 20pt Arial, Helvetica, sans-serif;
	text-align: center;
	color: #3366FF;
	line-height: 140%;
	margin-top: 0px;
	margin-bottom: 0px;
}

.h2navy20 {
	font: bold 20pt Arial, Helvetica, sans-serif;
	text-align: center;
	color: #33339F;
	line-height: 140%;
	margin-top: 0px;
	margin-bottom: 0px;
}

/* medium size H3 headlines */
.h3black {
	font: bold 16pt Arial, Helvetica, sans-serif;
	text-align: center;
	color: #000000;
	line-height: 110%;
	margin-top: 0px;
	margin-bottom: 0px;
}

.h3navy {
	font: bold 16pt Arial, Helvetica, sans-serif;
	text-align: center;
	color: #003399;
	line-height: 120%;
	margin-top: 15px;
	margin-bottom: 15px;
}

.h3ltblue {
	font: bold 16pt Arial, Helvetica, sans-serif;
	text-align: center;
	color: #3366FF;
	line-height: 150%;
	margin-top: 0px;
	margin-bottom: 0px;
}

.h3maroon {
	font: bold 16pt Arial, Helvetica, sans-serif;
	text-align: center;
	color: #800000;
	line-height: 150%;
	margin-top: 0px;
	margin-bottom: 0px;
}

/* used when headline elements need to be packed closer together */
.mednavy16compressed {
	font: bold 16pt Arial, Helvetica, sans-serif;
	text-align: center;
	color: #003399;
	line-height: 0.75;
	margin-top: 0px;
	margin-bottom: 0px;
}

/* a slightly smaller H3 headline which may be needed to get the look just right */
.h3navy15 {
	font: bold 15pt Arial, Helvetica, sans-serif;
	text-align: center;
	color: #003399;
	line-height: 100%;
	margin-top: 0px;
	margin-bottom: 0px;
}

/* body copy headlines which are only slightly larger than the main text */
/*and which can be called with p elements rather than the various H elements */
/* some are set for wider spacing between lines as needed */
.bchblack {
	font: bold 12pt Arial, Helvetica, sans-serif;
	text-align: center;
	color: #000000;
}

.bchnavyleft {
	font: bold 14pt Arial, Helvetica, sans-serif;
	text-align: left;
	color: #003399;
}

.bchnavycenter {
	font: bold 14pt Arial, Helvetica, sans-serif;
	text-align: center;
	line-height: 150%;
	color: #003399;
}

.bchltblue {
	font: bold 14pt Arial, Helvetica, sans-serif;
	text-align: center;
	line-height: 150%;
	color: #3366FF;
}

.bchmaroon {
	font: bold 14pt Arial, Helvetica, sans-serif;
	text-align: center;
	color: #800000;
	line-height: 150%;
	margin-top: 0;
	margin-bottom: 0;
}

.bchorange {
	font: bold 14pt Arial, Helvetica, sans-serif;
	text-align: center;
	color: #FF9900;
}

/* these body copy headlines may be exactly the same size as the body text */
/* or perhaps even smaller -- useful for opt-in boxes and similar elements */
.bchltblue10 {
	font: bold 10pt Arial, Helvetica, sans-serif;
	text-align: center;
	color: #3366FF;
}

.bchmaroon14 {
	font:bold 14pt Times New Roman, Times, Georgia, serif;
	text-align: center;
	color: #800000;
}

.bchnavy10 {
	font: bold 14pt Times, Geogia, serif;
	text-align: center;
	color: #33339F;
}

/* this  text is used in some tables */
.tabletext {
	font: 10pt Verdana, Arial, Helvetica, sans-serif;
	color: #000000;
	text-align: left;
	margin: 5px 5px 5px 5px;
	padding: 5px 5px 5px 5px;
}

.td { 
vertical-align: top; 
}

.tinyborder {
	border: 1px solid #000000;
	border-collapse: collapse;
}

/* used for invisible tables intended to offset lists from left-hand div elements */
.nopadding {
	margin: 5px;
	padding: 0px;
	border-collapse: collapse;
}