/***************/
/* main layout */
/***************/
body { margin: 0 10px; padding: 0; color: #424242; line-height:160%; /* backgrounds? */ }

#bodyWrapper { min-width: 760px; max-width: 981px; margin: auto; }

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

h1 { font-size: 1.67em; line-height: 1em; text-transform: lowercase; font-weight: normal; letter-spacing: -0.7px; }
h2 { font-size: 1.67em; line-height: 1em; font-weight: normal; letter-spacing: -0.7px; }

/*******************/
/* header elements */
/*******************/
#navContainer {  }

#navContainer #logo { float: left; }

#navContainer ul {
	list-style: none;
	margin: 0;
	padding: 0;
  background: transparent url('../images/bg_nav.png') top left no-repeat;
  height: 22px;
  padding: 4px 0 0 10px;
  font-size: 0.917em;
}
#navContainer ul li { display: inline; margin-right: 25px; padding-left:10px; color: #fff; }
#navContainer ul li a       { text-decoration: none; color: #fff; }
#navContainer ul li a:hover { color:#999999; }


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

#header { position: relative; display: none; margin-bottom: 8px; }
#header #flashHeader { position: absolute; right: 10px; bottom: 10px; }
#header #flashHeaderMission { position: absolute; left: 10px; bottom: 60px; }

body.home           #header { display: block; height: 309px; background: url('../images/headers/home.jpg') top left no-repeat; }
body.company        #header { display: block; height: 238px; background: url('../images/headers/company.jpg') top left no-repeat; }
body.bios           #header { display: block; height: 238px; background: url('../images/headers/bios.jpg') top left no-repeat; }
body.client_area    #header { display: block; height: 238px; background: url('../images/headers/clients.jpg') top left no-repeat; }
body.dealer_locator #header { display: block; height: 238px; background: url('../images/headers/dealers.jpg') top left no-repeat; }
body.services       #header { display: block; height: 238px; background: url('../images/headers/services.jpg') top left no-repeat; }
body.products       #header { display: block; height: 238px; background: #fff; width: 775px; margin: auto; }
body.news           #header { display: block; height: 238px; background: url('../images/headers/news.jpg') top left no-repeat; }
body.projects       #header { display: block; height: 238px; background: url('../images/headers/projects.jpg') top left no-repeat; }
body.testimonials   #header { display: block; height: 238px; background: url('../images/headers/testimonials.jpg') top left no-repeat; }
body.contact        #header { display: block; height: 238px; background: url('../images/headers/contact.jpg') top left no-repeat; }

#mainContainer {
	margin: 0;
	padding: 0;
}

#specialOffer { background-color:#f3f3f3;}

.title     { border: 1px solid #6b6c6e; background: #fff; padding-bottom: 1px; }
.title div { background: #6b6c6e; color: #fff; padding: 0 1px; }
.title.titred     { border: 1px solid #ed3f24; background: #fff; padding-bottom: 1px; }
.title.titred div { background: #ed3f24; color: #fff; padding: 0 1px; }

.bbox {  }
.bbox .boxtop     { border: 1px solid #ed3f24; background: #fff; padding-bottom: 1px; margin-bottom: 5px; }
.bbox .boxtop div { border: 1px solid #ed3f24; background: #ed3f24 url('../images/cross_red_fill.gif') top left no-repeat; height: 7px; }

.bbox.lgrey { color: #999999; }
.bbox.grey  { color: #6b6c6e; }
.bbox.red   { color: #6b6c6e; }

.bbox.lgrey .boxtop            { border-color: #999999; }
.bbox.grey  .boxtop            { border-color: #6b6c6e; }
.bbox.red   .boxtop            { border-color: #ed3f24; }
.bbox.lgrey .boxtop div        { border-color: #999999; background-color: #999999; background-image: url('../images/cross_lgrey_fill.gif'); }
.bbox.grey  .boxtop div        { border-color: #6b6c6e; background-color: #6b6c6e; background-image: url('../images/cross_grey_fill.gif'); }
.bbox.red   .boxtop div        { border-color: #ed3f24; background-color: #ed3f24; background-image: url('../images/cross_red_fill.gif'); }

.bbox.nofill .boxtop           { border: none; padding: 0; margin-bottom: 0; }

.bbox.lgrey.nofill .boxtop div { border-color: #999999; background-color: transparent; background-image: url('../images/cross_lgrey.gif'); }
.bbox.grey.nofill  .boxtop div { border-color: #6b6c6e; background-color: transparent; background-image: url('../images/cross_grey.gif'); }
.bbox.red.nofill   .boxtop div { border-color: #ed3f24; background-color: transparent; background-image: url('../images/cross_red.gif'); }

.bbox.lgrey.nofill { border-color: #999999; background-color: #999999; color: #fff; }
.bbox.grey.nofill  { border-color: #6b6c6e; background-color: #6b6c6e; color: #fff; }
.bbox.red.nofill   { border-color: #ed3f24; background-color: #ed3f24; color: #fff; }

.bio             { background: #f3f3f3; border: #CCCCCC 1px solid; padding: 10px; margin: 10px 0; }
.bio   .bioImage { border: 2px solid #ed3f24; margin-right: 5px; float: left; }
.lgrey .bioImage { border-color: #999; }
.grey  .bioImage { border-color: #6b6c6e; }
.red   .bioImage { border-color: #ed3f24; }

.boldRed { font-size:14px; color:#ed3f24; font-weight:bold;}
.redtxt { color:#ed3f24;}

#bullets { margin:0; margin-left:15px; padding:0;}
#bullets ul { margin:0; padding:0;}
#bullets li { list-style:none; margin:0; padding:0; background: #ed3f24 url('../images/cross_red_fill.gif') 5px 7px no-repeat; color:#FFFFFF; margin-bottom:5px; padding:1px 0 1px 15px; width:200px; }

#sbullets li { width:200px; line-height:18px; font-size:12px; color:#FFFFFF; background: #ed3f24 url('../images/cross_red_fill.gif') 5px 6px no-repeat; list-style:none; height:15px; vertical-align:text-top; padding:0 0 0 16px; margin:0 0 5px 0;}


/********/
/* news */
/********/
.newsItem:first-child             { margin-top: 0; }
.newsItem                         { background: #f3f3f3; border: #CCCCCC 1px solid; padding: 10px; margin: 10px 0; }
.newsItem .newsImage              { float: left; width: 150px; }
.newsItem .newsDetails            { margin-left: 160px; }
.newsItem .newsTitle              { font-weight: bold; margin-bottom: 5px; }
.newsItem .newsTitle a            { color: #424242; }
.newsItem .newsTitle a:hover      { color: #ed3f24; }
.newsItem .newsDate               {  }
.newsItem .newsContent            { margin-top: 5px; }
.newsItem .newsContent .newsImage { float: left; margin-right: 5px; margin-bottom: 5px; }
.newsItem img                     { border: #fff 4px solid; margin-right: 10px;}
	
/************/
/* services */
/************/
.serviceItem:first-child                   { margin-top: 0; }
.serviceItem                               { background: #f3f3f3; border: #ccc 1px solid; padding: 10px; margin: 10px 0; }
.serviceItem .serviceImage                 { float: left; border: #fff 4px solid; margin-right: 10px; }
.serviceItem .serviceDetails               { margin-left: 158px; }
.serviceItem .serviceTitle                 { font-weight: bold; }
.serviceItem .serviceTitle a               { color: #424242; }
.serviceItem .serviceTitle a:hover         { color: #ed3f24; }
.serviceItem .serviceContent               { margin-top: 5px; }
.serviceItem .serviceContent .serviceImage { float: left; margin-right: 5px; margin-bottom: 5px; }
	
/************/
/* projects */
/************/
.projectItem:first-child                   { margin-top: 0; }
.projectItem                               { background: #f3f3f3; border: #ccc 1px solid; padding: 10px; margin: 10px 0; }
.projectItem .projectImage                 { float: left; border: #fff 4px solid; margin-right: 10px; }
.projectItem .projectDetails               { margin-left: 168px; }
.projectItem .projectTitle                 { font-weight: bold; }
.projectItem .projectTitle a               { color: #424242; }
.projectItem .projectTitle a:hover         { color: #ed3f24; }
.projectItem .projectContent               { margin-top: 5px; }
.projectItem .projectContent .projectImage { float: left; margin-right: 5px; margin-bottom: 5px; }

/****************/
/* testimonials */
/****************/
.testimonialItem                                       { margin-bottom: 20px; }
.testimonialItem .testimonialCompany                   { font-weight: bold; }
.testimonialItem .testimonialCompany a                 { color: #424242; }
.testimonialItem .testimonialCompany a:hover           { color: #ed3f24; }
.testimonialItem .testimonialName                      {  }
.testimonialItem .testimonialContent                   { margin-top: 5px; font-size: 0.917em; line-height: 2em; }
.testimonialItem .testimonialContent .testimonialImage { float: left; margin-right: 5px; margin-bottom: 5px; }

/****************/
/* case studies */
/****************/
.caseItem                         { margin-bottom: 20px; }
.caseItem .caseTitle              { font-weight: bold; }
.caseItem .caseTitle a            { color: #424242; }
.caseItem .caseTitle a:hover      { color: #ed3f24; }
.caseItem .caseContent            { margin-top: 5px; font-size: 0.917em; line-height: 2em; }
.caseItem .caseContent .caseImage { float: left; margin-right: 5px; margin-bottom: 5px; }
.caseItem img { border:#999999 3px solid;}


a.readmore { color: #ed3f24; }

hr {
	border-bottom: solid #6b6c6e 2px;
	height: 1px;
	border-top: none;
	border-left: none;
	border-right: none;
}

.greeny { color:#006633; font-size:16px; font-weight:bold;}

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

/*******************/
/* footer elements */
/*******************/
#footer   { font-size: 0.917em; background: transparent url('../images/footer_line.gif') top left no-repeat; margin-top: 20px; padding-top: 5px; padding-left: 2px; }
#footer a { text-decoration: none; color: #6b6c6e; } /* for the clevercherry.com link */


/***********************/
/* general form styles */
/***********************/

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

/* contact form */
#contactForm div.formrow label  { width: 90px; }
#contactForm div.formrow.indent { margin-left: 100px; } /* 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 */