/*=============================



Wattyl Industrial CDROM



site design and build by

Ben Manson of 3blindmice

july 2010



Colours:



blue #004B8D

red #CB0000

greys #3B3B3B, #464646, #4F4F4F, #595959, #959595, #ACACAC



**note: menu styles in cssMenu.css



=============================== */



body {

	font-size: 62.5%;

	line-height: 1em; 

	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;

	

	}

	

	body#metal {

		background: url(../images/bkgd_metal.jpg) repeat top left;

		}

	

	body#timber {

		background: url(../images/bkgd_timber.jpg) repeat top left;

		}

	

	body#road {

		background: url(../images/bkgd_road.jpg) repeat top left;

		}

	

	body.pcm {

		background: url(../images/bkgd_pcm.jpg) repeat top left;

		}

	

	body#pcmindex {

		background: url(../images/bkgd_epinamel.jpg) repeat top left;

		}

	

	body#duranamel {

		background: url(../images/bkgd_duranamel.jpg) repeat top left;

		}

	

	body#epinamel{

		background: url(../images/bkgd_epinamel.jpg) repeat top left;

		}

	

	body#galvit{

		background: url(../images/bkgd_galvit.jpg) repeat top left;

		}

	

	body#permachlor{

		background: url(../images/bkgd_permachlor.jpg) repeat top left;

		}

	

	body#polyu{

		background: url(../images/bkgd_polyu.jpg) repeat top left;

		}

		

	body#pcm_ancillary{

		background: url(../images/bkgd_ancillary.jpg) repeat top left;

		}

	

	/* -------------- HEADER -------------------- */

	

	#header {

		background: #000;

		width: 100%;

		}

		

		.wrap {

			width: 800px;

			margin: 0 auto;

			}

			

			#header .wrap, #content .wrap, #footer .wrap {

				position: relative;

				}

			

			

	/* -------------- TOC -------------------- */

	

	#toc .wrap {

		width: 800px;

		}

		

		#toclinks {

			background: url(../images/bkgdblue.png) transparent repeat;

			width: 780px;

			padding: 10px;

			}

	

		#tocbutton {

			border-top: 5px solid #000;

			}

			

			a#tocclick {

				padding: 5px 15px;

				position: relative;

				left: 600px;

				background-color: #000;

				color: #FFF;

				text-transform: uppercase;

				margin-bottom: 10px;

				}

				

				a#tocclick:hover {

					color: #CB0000;

					}

	

	

	/* -------------- CONTENT -------------------- */

		

	#content .wrap {

		background: url(../images/bkgdblue.png) transparent repeat;

		padding: 10px;

		width: 780px;

		margin-top: 3px;

		}

	

	#main {

		clear: both;

		}

	

		/* banner */

		#banner {

			background: #FFF;

			padding: 10px;

			}

		

		/* -- left column -- */

		#leftcol {

			clear: both;

			float: left;

			margin: 5px 5px 0 0;

			width: 560px;

			padding: 10px;

			background: #FFF;

			}

			

			#as2700 #leftcol {

				width: 760px;

				}



		/* -- left column -- */

		#leftcol2 {

			clear: both;

			float: left;

			margin: 5px 5px 0 0;

			width: 760px;

			padding: 10px;

			background: #FFF;

			}

			

			#as2700 #leftcol {

				width: 760px;

				}



		

		/* -- right column -- */

		#rightcol {

			float: left;

			width: 175px;

			background: #FFF;

			padding: 10px;

			margin-top: 5px;

			}

			

			img#logo {

				position: absolute;

				top: 50px;

				right: 30px;

				}

				

			p.breadcrumbs {

				font-size: 0.8em;

				color: #AAA;

				text-transform: uppercase;

				letter-spacing: 0.1em;

				}

				

				p.breadcrumbs a:link, p.breadcrumbs a:visited {

					color: #AAA;

					text-decoration: none;

					}

					

				p.breadcrumbs a:hover {

					color: #CB0000;

					}

			

			#banner h2 {

				padding-top: 50px;

				font-size: 1.4em;

				color: #ACACAC;

				padding-bottom: 5px;

				}

				

		h1 {

			text-transform: uppercase;

			font-size: 3.6em;

			margin-bottom: 5px;

			line-height: 1em;

			}

			

			#as2700 h1 {

				font-size: 3.4em;

				}

		

		h3 {

			font-size: 1.4em;

			text-transform: uppercase;

			font-weight: bold;

			}

			

			#leftcol h3 {

				font-size: 1.5em;

				padding: 1em 0 0.25em 0;

				border-bottom: 1px solid #D9D9D9;

				margin-bottom: 0.25em;

				}

		

		p {
	font-size: 1.5em;
	line-height: 1.5em;
	color: #333;

			

			}

			

			body.home p {

				padding-bottom: 1em;

				}

		

			

		a:link {

			color: #004B8D;

			text-decoration: none;

			}

			

		a:visited {

			color: #999;

			}

			

		a:hover {

			color: #CB0000;

			text-decoration: underline;

			}

		

		/* -- table of links -- */

		.datatable {

			width: 100%;

			margin: 15px 0 15px 0;

			padding: 0;

			/* border-collapse: collapse; */

			}

			

			.col1 {

				text-align: left;

				}

			

			.col2 {

				text-align: center;

				width: 100px;

				}

			

			.col3 {

				text-align: center;

				width: 130px;

				}

				

			td, th {

				font-size: 1.3em;

				line-height: 1.4em;

				padding: 6px 0 6px 10px;

				border-right: 1px solid #FFF;

				}

			

			th {

				background-color: #666;

				font-weight: normal;

				color: #FFF;

				text-transform: uppercase;

				border-bottom: 1px solid #555;

				border-top: 1px solid #555;

				font-weight: bold;

				}

			

			td {

				border-bottom: 1px solid #D9D9D9;

				color: #333;

				vertical-align: top;

				background-color: #F9F9F9;

				

				}

				

				td.col2, td.col3, th.col2, th.col3 {

					padding-left: 0;

					}

				

				tr.alt td {

					background-color: #E1E1E1;

					}

		

		

	

	

	/* -------------- FOOTER -------------------- */

	

	#footer .wrap {

		background: url(../images/bkgdgrey.png) transparent repeat;

		width: 780px;

		margin-top: 3px;

		padding: 10px;

		}

		

		.footercolumn {

			float: left;

			width: 185px;

			margin-right: 12px;

			margin-bottom: 5px;

			/* padding-left: 10px; */

			}

			

			.lastcolumn {

				margin-right: 0;

				}

		

		#footer h4 {

			font-size: 1.3em;

			border-bottom: 1px solid #848484;

			color: #FFF;

			padding-bottom: 7px;

			margin: 5px 0 5px 0;

			padding-left: 3px;

			}

			

		#footer p, #footer h5, #footer li {

			font-size: 1.1em;

			color: #FFF;

			line-height: 1.5em;

			padding: 0;

			padding-left: 3px;

			}

			

			/*

#footer p {

				border-bottom: 1px dotted #848484;

				}

*/

		

		#footer h5 {

			padding-top: 3px;

			font-weight: bold;

			}

		

		#footer ul, #footer li {

			margin: 0;

			padding: 0;

			}

			

			#footer li {

				list-style-type: none;

				list-style-image: url(../images/bullet.png);

				}

			

			#footer ul {

				padding-left: 23px;

				}

		

		#footer a:link, #footer a:visited {

			color: #EEE;

			}

	

	

	/* -------------- FIXES -------------------- */			

	.clear {

		 display:inline-block;

		}

		

		.clear:after {

		 display:block; 

		 visibility:hidden; 

		 clear:both; 

		 height:0; 

		 content: " "; 

		}