body{
	font-family:Geneva, Arial, Helvetica, sans-serif;
	background: url(../images/bg-main.png) repeat-x scroll;
	background-color: #3B4584;
}
.page .foot #foot {
	background-color: #334488;
}

/* **************** CONTENT OBJECTS ***************** */
/* ====== Default spacing ====== */
h1, h2, h3, h4, h5, h6, ul, ol,dl, p,blockquote {padding:10px;}
h1, h2, h3, h4, h5, h6,img{padding-bottom:0px;}
pre{
	margin: 10px;
}
table h1,table h2,table h3, table h4, table h5, table h6, table p, table ul, table ol, table dl{padding:0;}
/* ====== Elements ====== */
img{
	display:inline block;
	position: relative;
}
em{font-style: italic;}
strong{font-weight:bold;}
.head {

}

hr{border: 5px solid #e2e2e2; border-width: 0 0 5px 0; margin: 20px 10px 10px 10px;}
code{color:#0B8C8F;}
/* ====== Headings ====== */
/* .h1-.h6 classes should be used to maintain the semantically appropriate heading levels - NOT for use on non-headings */
h1, .h1{font-size:196%;  font-weight:normal; font-style: normal; color:#AE0345;}
h2, .h2{
	font-size:167%;
	font-weight:normal;
	font-style: normal;
	color:#DA0036;
}
h3, .h3{
	font-size:146.5%;
	font-weight:normal;
	font-style: normal;
	color:#62AED5;
}
h4, .h4{
	font-size:123.1%;
	font-weight:bolder;
	font-style: normal;
	color: #520182;
}
h5, .h5{
	font-size:108%;
	font-weight:bold;
	font-style: normal;
	color:#F53DBF;
}
h6, .h6{
	font-size:108%;
	font-weight:normal;
	font-style: italic;
	color:#FFFFFF;
}
/* if additional headings are needed they should be created via additional classes, never via location dependant styling */
.category{font-size:108%; font-weight:normal; font-style: normal; text-transform:uppercase; color: #333;}
.category a{color: #333;}
.important a{font-weight:bold;}
/* links */
a {
	color: #FFFFFF;
	font-weight:bold;
	text-decoration: none
}
a:focus, a:hover { text-decoration: underline }
a:visited {
	color:#FFFFFF;
}
/* ====== Lists ======*/
/* numbered list */
ol.simpleList li{list-style-type: decimal; margin-left:40px;}
/* standard list */
ul.simpleList li{list-style-type:disc; margin-left:40px;}
/* ====== Tables ====== */
.data{padding: 20px; position:relative; border-right:solid 1px/* border fixes a FF2 bug which causes the data table to overlay its borders*/}
.data table {width:100%;border:1px solid #AE0345;}
.txtC, .data .txtC td, .data .txtC th{text-align:center;}
.txtL, .data .txtL td, .data .txtL th{text-align:left;}
.txtR, .data .txtR td, .data .txtR th{text-align:right;}
.txtB, .data .txtB td, .data .txtB th{vertical-align:bottom;}
.txtM, .data .txtM td, .data .txtM th{vertical-align:middle;}
.data th,.data td{padding:3px 20px}
.data thead tr{background-color: #fff0f8;}
.data th{color: #000; font-weight:bold}
/* specification table - extends data table */
.spec{padding:10px;}
.spec table{border-top: 1px solid #e2e2e2; border-bottom-color:#fff; border-left:none; border-right:none;}
.spec th, .spec td{border:1px solid #e2e2e2; border-width: 1px 0; padding-left:0;}
.spec .odd, .spec .even{background-color: #fff;}


/* ====== blockquote ====== */
cite{display:block; text-align:right; padding-top: 10px;}
/* ====== callout ====== */
.callout{
	font-size:167%;
	font-weight:bold;
	font-style: normal;
	color:#62AED5;
}
.callout cite{display:block; text-align:right;padding-top: 30px; font-size:69.25%;}
.callout span.quot{font-size: 500%; vertical-align: sub; color:#e2e2e2; line-height:25px; font-weight:bold;}
.callout span.quotLast{vertical-align:middle;}
/* ====== image treatments (get more from jason santa maria) ====== */
.caption{font-size:13px; color:#666666; font-style:italic;padding-top:0;}
/* will need to either 
1. find a way to capture the width of the caption in the width of the image or flash
2. Set some default widths, mby use flickr widths?
*/
/* ====== media ====== */
.media{overflow:hidden; overflow:visible; margin:10px;}
.media .img{float:left;margin-right: 10px;}
.media .img img{display:block;}
.media .imgExt{float:right; margin-left: 10px;}
/* ====== color formatting classes ====== */
.red {
	color:#DA0036;
	font-weight: bold;
	font-size: 120%;
}
/* ====== special formatting classes ====== */
.detail{color: #777; font-size:11px;display:block;}
.purple {
	font-size: 98%;
	font-weight: normal;
	color: #F53DBF;
}