/***************/
/* main layout */
/***************/
body { margin: 42px 0; padding: 0; background: #e3e4e5 url(../images/bg.jpg) fixed no-repeat left top; font-size:95%; }

#headerContainer { padding-top: 40px; background: transparent url(../images/header.png) scroll no-repeat top; width: 907px; margin: auto; }
#footerContainer { padding-bottom: 40px; background: transparent url(../images/footer.png) scroll no-repeat bottom; }
#middleContainer { padding: 0 80px; background: transparent url(../images/middle.png) scroll repeat-y; }

#bodyWrapper { width: 780px; margin: auto; }

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

/*******************/
/* header elements */
/*******************/
#navContainer { margin-bottom: 8px; }

#navContainer #logo { float: left; }

#navContainer ul { float: right; margin-top: 149px; font-size: 0.6875em; line-height: 1em; }
#navContainer ul li { font-weight: bold; margin-right: 0; }
#navContainer ul li a { text-decoration: none; color: #000; }

ul.nav    { list-style: none; margin: 0; padding: 0; padding-bottom:5px; }
ul.nav li { display: inline; margin-right: 10px; }


/********************/
/* content elements */
/********************/
#mainContainer {  }

.pageHeader { background: #a66465; color: #fff; padding: 10px; }
.content    { font-family: 'Georgia', serif; }


hr {
  margin: 18px 0;
  border: 0;
  padding: 0;
  background: transparent url(../images/hr.gif) scroll repeat;
  height: 2px;
}

.hr { 
	background: transparent url(../images/hr.gif) scroll repeat;
	height:2px;
	padding:0;
	margin: 18px 0;
 }

/*********/
/* items */
/*********/

.paging { text-align: right; margin: 20px 0; }

.item                  { margin-bottom: 10px; }
.item .itemImage       { float: left; }
.item .itemDetail      { float: right; width: 622px; }
.item .itemHeader      { margin-bottom: 5px; }
.item .itemHeaderLeft  { float: left; width: 200px; }
.item .itemHeaderLeft img { border:5px solid #000000;}
.item .itemHeaderRight { float: right; width: 515px; }
.itemTitle       	   { font-family: Georgia, serif; font-size: 1.25em; line-height: 1.5em; }
.itemTitle a           { color:#000;}
.item .itemPrice       { font-family: Georgia, serif; font-size: 1em; line-height: 1.5em; }
.item .itemSRP         { font-family: Georgia, serif; font-size: 1em; line-height: 1.5em; color: #080; }
.item .itemContent     { font-size: 0.875em; }
.item .itemMore        { }
.item .itemImage img   { border:5px solid #000000;}

.item #enquire { float: left; width: 150px; }
.item #email   { float: left; width: 150px; }
#itemBack      { float: left; width:150px;  }

#contactBox { font-size: 0.87em; float: left; margin-left: 44px; width: 190px; text-align: right;}
#contactBox a { color:#FFFFFF;}
#conatactBox a:hover { color:#333333;}

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

/*******************/
/* footer elements */
/*******************/
#footer { font-size: 0.625em; line-height: 1em; width: 887px; margin: auto; text-align: right; padding-right: 20px; padding-bottom:5px; }
#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 */

.required { color: #f00; }

/* 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 */

#recaptcha_widget         { margin-bottom: 15px; }
#recaptcha_image          { float: left; width: 300px; }
#recaptcha_options        { border-left: 1px solid #999; padding-left: 5px; float: left; margin-left: 10px; }
#recaptcha_response_field { width: 325px; }
#recaptcha_notice         { font-size: 0.723em !important; color: #555; }

ul.clean    { list-style: none; margin: 0; padding: 0; }
ul.clean li { list-style: none; margin: 0; padding: 0; }

/* 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 */