/***************/
/* main layout */
/***************/
body { margin: 0; padding: 0; }
#bodyWrapper { width: 778px; margin: auto; background-image: url('../images/bg.gif'); background-repeat: repeat-x; }

/* specific link colours for this site */
a:link 	  { color: #00234e; padding: 0 2px 3px 2px; text-decoration: none; }
a:visited { color: #00234e; padding: 0 2px 3px 2px; text-decoration: none; }
a:hover   { color: #4e6c90; background: #9cb4d2 bottom repeat-x; padding: 0 2px 3px 2px; text-decoration: none; }
a:active  { color: #4e6c90; padding: 0 2px 3px 2px; text-decoration: none; }


/*******************/
/* header elements */
/*******************/
#navContainer {
	margin: 0;
}

#navContainer a { padding: 0; background: none; }

#navContainer #headerContainer { padding-top: 40px; height: 82px; }
#navContainer #headerContainer #headerFlash { float: right; }


#navContainer img {  }

#navContainer ul {
	background: #8c9396;
	list-style: none;
	margin: 0;
	padding: 5px 0 3px 20px;
	margin-top: 15px;
}
#navContainer ul li {
	display: inline;
	text-transform: uppercase;
	font: em Arial, Helvetica, sans-serif;
	font-weight: bold;
	margin-right: 22px;
}
#navContainer ul li a { color: #fff; }
#navContainer ul li a:hover { color: #00234e; }


/********************/
/* content elements */
/********************/
#mainContainer {
	margin: 15px 0;
	padding: 11px;
	background: #fff;
	color: #00234e;
}

.whiteBox { background: #e7e7e9; color: #00234e; padding: 4px 8px; margin-bottom: 10px; }
.whiteBox p { margin: 8px 0; }

#mainBox { padding: 0; height: 277px; }
#mainBox a { background: none; padding: 0; }
#mainBox a img { margin-bottom: 10px; }

/* news on the front page */
#newsContainer { width: 365px; }
#newsContainer .newsItem { max-height: 222px; overflow: hidden; padding-bottom: 3px; margin-top: 10px; border-bottom: 1px solid #4e6c90; line-height: 2em; }
#newsContainer .newsItem a			{ display: block; }
#newsContainer .newsItem a:link		{ background: #00234e; color: #fff; }
#newsContainer .newsItem a:visited	{ background: #00234e; color: #fff; }
#newsContainer .newsItem a:hover	{ background: #10325b; color: #fff; }
#newsContainer .newsItem a:active	{ background: #10325b; color: #fff; }

/* news on the news page */
#newsItems {  }
#newsItems .newsItem			{ margin-bottom: 20px; padding: 4px 8px; background-color: #4e6c90; color: #fff; overflow: hidden; }
#newsItems .newsItem a			{ color: #9cb4d2; background: transparent; }
#newsItems .newsItem a:hover	{ color: #00234e; }
.newsImage { float: left; margin: 5px 10px 5px 4px; border: 1px solid #9cb4d2; padding: 0 !important; }

#downloadsBox { float: left; position: relative; width: 184px; height: 255px; font-weight: bold; background-color: #fff; color: #00234e; border: 1px solid #9cb4d2; }
#downloadsBox .download { margin-bottom: 15px; padding: 0 5px; }
#downloadsBox .download a { background: none; color: #9cb4d2; }
#downloadsBox #helpful a { position: absolute; bottom: 10px; left: 8px; display: block; background-image: none; text-align: center; text-transform: uppercase; width: 164px; padding-top: 2px; }

h1, h2, h3, h4, h5, h6 { text-transform: uppercase; }

h2 { background: #003366 url('../images/link_bg.gif') bottom repeat-x; padding: 0 2px 3px 2px; color: #FFFFFF; font: 1.19em 'Gill Sans', Tahoma, Arial, Helvetica, sans-serif; padding: 4px; margin-bottom: 10px; font-weight: bold; }
h2 span.section { font-weight: bold; font-size: 1.3em; color:#91ABC6; }

div.section { margin-bottom: 10px; }
div.section img { float: left; margin-right: 10px; border: 1px solid #9cb4d2; }
div.section div {  }
div.section p { padding: 6px 8px; height: 113px; overflow: hidden; background-color: #d5dfeb; }

.floatleft { float: left; }

hr {
	border-bottom: dashed #4e6c90 1px;
	height: 1px;
	border-top: none;
	border-left: none;
	border-right: none;
}

/*******************/
/* footer elements */
/*******************/
#footer { background: #00234e; color: #fff; padding: 3px 0 4px 9px; }
#footer a { text-decoration: none; color: #fff; background: none; } /* for the clevercherry.com link */


/***********************/
/* general form styles */
/***********************/
#contactForm		{ float: left; width: 530px; margin-top: 10px; }  /* the contact form itself */
#contactForm select	{ padding-right: 0; }
#contactDetails		{ float: right; width: 160px; background-color: #4e6c90; color: #fff; padding: 10px; margin-right: 20px; } /* contact info or whatever on right */
#contactDetails	a	{ color: #9cb4d2; }
#contactDetails	a:hover	{ color: #00234e; }

#callbackForm {  }
#callbackForm p { font-family: Arial, Helvetica, sans-serif; font-weight: bold; }
#callbackForm input { width: 161px; margin-top: 12px; padding: 3px 6px; font-family: Arial, Helvetica, sans-serif; font-size: 1em; }
#callbackForm #callbackSubmit,
#callbackForm #contactUs { width: 175px; text-align: right; text-transform: uppercase; padding: 0 6px 2px; border: 0; font: 'Gill Sans', Tahoma, Arial, Helvetica, sans-serif; color: #00234e; background-color: #9cb4d2; background-image: url('../images/link_bg.gif'); background-position: bottom; background-repeat: repeat-x; }

/* all form elements are contained within a formrow div, with a label and
 *  then the element, this is the best way (but still not good) to emulate
 *  a table */
div.formrow {
	clear: both;
	text-align: left;
	margin-bottom: 10px;
}

div.formrow label {
	float: left;
	text-align: right;
	margin-right: 10px;
	width: 130px; /* default width for a default form, add new form ids and override */
}
div.formrow.indent { margin-left: 140px; } /* label width + label margin-right, override as above */

/* message and error boxes, not just useful in contact form */
div.box { border: 1px solid #0c0; color: #0c0; padding: 3px 5px; margin-bottom: 15px; float: left; } /* you may need to clearfix this */
div.box.nomargin { margin-bottom: 0; } /* if before something with a margin-top */
div.box.error { border-color: #f00; color: #f00; } /* error box in red */