body{ margin: 10px 0 0 0; font-family: verdana; font-size: 70%; color: #000; }
a{ color: #000; text-decoration: none; }
img{ border: 0; margin: 0; padding: 0; }
legend{ font-weight: bold; }
input.text, textarea{ width: 50%; }
input.readonly{ color: #333; background-color: #ccc; }
div.feedback{ padding: 10px; margin: 10px 20px 20px; color: #000; font-weight: bold; background-color: #fff; }
label.error { color: red; }

#content{ margin: 0px auto; width: 990px; border: 1px solid #999; margin: 0px auto; color: #000; background-color: #ccc; }
#content div.msgHeader, #content div.msgDetail{ background: white; padding: 3px; width: 50%; }
#content div.msgHeader a, #content div.msgDetail a{ color: red; }
#content div.msgHeader{ margin: 1px 0; }
#content div.msgDetail{ margin: 1px 0 10px; display: none; }

#header{ height: 115px; background-color: #515e66; color: #fff; border-bottom: 1px #ccc solid; }
#header table{ width: 100%; }
#header a{ color: #fff; }

#topnav{ padding-right: 5px; text-align: right; }

#crumbtrail a{ font-weight: bold; }
#crumbtrail h1{ color: #fff; margin: 0; padding: 10px 10px 9px; font-size: 1.2em; background-color: #999; border-bottom: 1px #ccc solid; }

#main a{ color: #fff; height: 380px; margin: 0; }
#main tr th{ background-color: #999; text-align: left; }
#main td{ border-bottom: 1px solid #333; }
#main td.number{ text-align: right; }
#main select{ font-size: 1em; }
#main h2{ margin: 0; padding: 0 0 10px; }
#main p{ padding: 0 0 10px; margin: 0; }
#main tr td, #main tr th{ padding: 2px 0 2px 0; }

#leftColumn{ overflow: auto; width: 199px; float: left; margin: 0 0 10px; height: 360px; padding: 10px; color: #fff; background-color: #000; border-right: 1px #ccc solid; }
#leftColumn li{ list-style-type: none; padding: 3px; }
#leftColumn ul{ padding: 3px; margin: 0; }

/* news */
#viewport{ height: 360px; overflow: hidden; }
#viewport ul{ margin: 0; padding: 0; list-style-type: none; }
#viewport li{ margin: 0; padding: 0; }
#viewport li h2{ margin: 0; padding: 10px 0; }

#rightColumn{ overflow: auto; width: 770px; height: 380px; }
#rightColumnInner{ padding: 0 10px; }
#rightColumn table{ width: 100%; }
#rightColumn a{ color: #333; }

#footer{ padding: 9px 10px 0 10px; height: 55px; text-align: right; border-top: 1px #ccc solid; }
#footer{ color: #fff; background-color: #115e82; }
#footer a{ color: #fff; }
#footer table{width: 100%;}
#footer td.leftCol{text-align: left;}

#enquiry td{ vertical-align: top; border: none; }
#enquiry td.left{ width: 30%; }
#enquiry ul{ list-style-type: none; padding: 0; }

/**
 * relative column heading widths on product table
 */
#prodHeader{width:6em;}
#descHeader{width:auto;}
#appliesHeader{width:auto;}
#costPartsHeader{width:6em;}
#costInstallHeader{width:6em;}
#infoHeader{width:1em;}
#enquiryHeader{width:1em;}
 
/**
 * imgBox1 - two columns: one image, one text para
 */
.imgBox1 img{ float: left; padding-right: 20px; margin-bottom: 10px; }
.imgBox1 p{ text-align: justify; }
.imgBox1 div{ clear: both; }

/**
 * infoBox1 - multi-table columns, image above, text below
 */
.infoBox1{}
.infoBox1 img{ width: 225px; }
.infoBox1 td{ border-right: 2px solid #ccc; }
.infoBox1 th{ text-align: left; padding: 8px 4px 8px 4px; }
.infoBox1 td{ vertical-align: top; text-align: justify; padding: 8px 4px 8px 4px; }

/**
 * imgBox2 - two columns: multiple images stacked, one text para
 */
.imgBox2 div{ float: left; padding-right: 20px; width: 210px; }
.imgBox2 img{ margin-bottom: 10px; }

/**
 * two colum, text left, image right
 */
.two-column{}
.two-column-text{width:500px;}
.two-column-image{float:right;width:200px;}
h2{clear:both;}
