/***************/
/* main layout */
/***************/
body { margin:0; padding: 0; background:#e2e6ed url(../images/bg_head.jpg) no-repeat top; color:#324365;}

/* specific link colours for this site */
a:link 	  { color: #718493; text-decoration: none; }
a:visited { color: #718493; text-decoration: none; }
a:hover   { color: #324365; text-decoration: underline; }
a:active  { color: #718493; text-decoration: underline; }

#mainContainerWrapper {
  background-image:url(../images/bg_y.jpg);
  background-position:top;
  background-repeat:repeat-y;}

#mainContainer {
  margin: 10px 0 0 0;
  padding: 10px;
  background:#FFFFFF;
  width: 759px;
  text-align:left;}
  
/*******************/
/* header elements */
/*******************/
#logoContainer {
	width:200px;
	float:left;}
	
#signUp {  width:314px; background-color:#e2e6ed; padding:10px 0 3px 10px; margin-bottom:20px;}
#signUp form { padding-top:5px;}
#signUp form td { text-align:right;}
#signUp form input { border:0; height:14px; padding:3px; width:178px; color:#415271;}
	
#navContainer { 
	border-top:#231f20 1px solid;
	margin-top:10px;
	background:url(../images/nav_bg.gif) repeat-x left 0px #324365;}
	
#navContainer ul { margin:5px 0 0 24px; padding:0; }
#navContainer ul li { margin:0; padding:0; float:left; margin-right:29px; font-size:14px; padding-bottom:7px; list-style:none; }
#navContainer ul li a { text-decoration: none; color:#FFFFFF; }
#navContainer ul li a:hover { color:#718493;} 

/********************/
/* content elements */
/********************/

#imgContainer {
	margin-top:8px;}
	
#contentContainer {
	padding-top:8px;}
	
.bigger { font-size:14px;}

.edsLinks a {background-color:#e2e6ed;}
	
/********************/
/* product elements */
/********************/

#prodNavContainer { background:#324365 url(../images/choose_prod.gif) 15px no-repeat; border-top:#231f20; height:22px; margin:0 0 5px 0; padding:5px 0 0 100px; }
#prodNavContainer ul { margin:0; padding:0;}
#prodNavContainer li { margin:0; padding:0; float:left; color:#FFFFFF; padding-left:25px; background:url(../images/navprod_bullet.gif) 10px no-repeat; list-style:none;}
#prodNavContainer li a { color:#FFFFFF;}
#prodNavContainer li a:hover { color:#6B8CA0; text-decoration:none;}

#prodTitle { background-color:#324365; font-size:16px; color:#FFFFFF; padding:5px;}
#prodTitle .pdf { background:#e2e6ed url(../images/pdf_arrow.gif) 5px  no-repeat; float:right; margin-left:5px; width:190px; font-size:12px; color:#324365;}
#prodTitle .pdf a { color:#003366; text-decoration:none; display:block; padding:0px 0 0 25px;}
#prodTitle .pdf a:hover { color:#e2e6ed; background-color:#324365; border:1px solid #e2e6ed; }

#prodContent { padding:10px;}
#prodContent li { margin-bottom:6px; list-style:none;}
#prodContent li strong { color:#324365; background-color:#e2e6ed; padding:0 4px;}

/********/
/* news */
/********/
.newsItem                         { margin-bottom: 10px;  }
.newsItem .newsTitle              { font-weight: bold; font-size:14px; background-color:#e2e6ed; padding:3px; }
.newsItem .newsTitle a			  { color:#324365;}
.newsItem .newsTitle a:hover	  { color:#718493;}
.newsItem .newsDate               { font-style: italic; color:#718493; }
.newsItem .newsContent            { margin-top:10px;  }
.newsItem .newsContent .newsImage { float: left; margin-right:10px; border:2px #718493; }

/*****************/
/* photo gallery */
/*****************/
div.galleryItem { /* one gallery item */
  width: 100px;
  height: 100px;
  float: left;
  margin: 5px;
}

/*******************/
/* footer elements */
/*******************/
#footerContainer { background:url(../images/bg_foot.jpg) bottom no-repeat; height:50px;}

#footer { text-align:left; width:759px; padding-top:13px; }
#footer a { text-decoration: none; } /* for the clevercherry.com link */


/***********************/
/* general form styles */
/***********************/
#contactform	{ float: left; }  /* the contact form itself */
#contact		{ float: right; } /* contact info or whatever on right */

/* 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: 80px; /* default width for a default form, add new form ids and override */
}
div.formrow.indent { margin-left: 90px; } /* label width + label margin-right, override as above */

/* message and error boxes, not just useful in contact form */
div.box { border: 1px solid #080; color: #080; 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 */