/*================================================================================           											
 	Title:          Main Stylesheet
	Site:           Environmental Remediation Resources (www.erraus.com.au)	
	Browser(s):     All    
	Author: 		Kristy Jane Kelly                    
 	Date Created: 	Feb-2009                                                       
   	Version			1.31                                                          
 	Last Modified	30/04/2009 (dd/mm/yyyy)                                      
*================================================================================*/
/*============================================================	
 MAIN LAYOUT/CONTAINERS		
=============================================================*/ 
body{
background: #EBF6FC url(../images/site/bodybg.jpg) repeat-x 0 0;
margin: 20px 0;
color: #333;
font: 11px/1.636em Verdana, Arial, Helvetica, "Helvetica Neue", sans-serif; 
}
#wrapper, #header, #nav, #menu, #banner, #contentwrapper, #footer{
margin: 0 auto;
}
body, #wrapper, #header, #logo, #logo a, #logo a img, #menu, #menu li, #primarycontent, #secondarycontent, div.boxrightcol{
padding: 0;
}
#logo, #logo a, #logo a img, #nav, #menu, #menu li, #menu li a, #menu li a.active, #primarycontent, #secondarycontent, #footer, #footer div{
margin: 0;
}
#wrapper{
position: relative;
width: 934px;
background: #fff url(../images/site/wrapperbg.jpg) repeat-y 0 0;
text-align: left;
}
#header{
height: 133px;
width: 934px;
background: #fff url(../images/site/header.jpg) no-repeat; 
}
#logo{
height: 115px;
width: 315px;
margin-left: 22px;
padding-top: 8px;
background: #fff;
}
#nav{
height: 32px;
width: 872px;
padding: 0 8px 0 30px;
background: transparent url(../images/site/menubar.gif) no-repeat 0 0;
margin-bottom: 10px;
}
#menu{
height: 30px;
width: 872px;
position:absolute;	/*fix the IE content chop off problem */
}

/*MAIN MENU LINKS
-------------------------------------------------------------*/
#menu li a, #menu li a.active{
font-family: Arial, Verdana, Helvetica, "Helvetica Neue", sans-serif;
font-size: 1.091em; /*12px */
text-decoration: none;
font-weight: bold;
color: #fff;
letter-spacing: 0.0556em;
padding: 8px 12px; /* opera 5,6 - as a state needs INLINE */
}
head:first-child+body #menu li a, head:first-child+body #menu li a.active{
padding: 0 12px; /*non-Opera browsers */
}
#menu li a, #menu li a:link{
display: inline; /* Only way it works in Opera 5-6 */
background: #0B4D8D url(../images/site/menutab.gif) no-repeat 100% 0;
}
head:first-child+body #menu li a{
display: block;
}
#menu li a:hover, #menu li a:focus, #menu li ul li a:hover, #menu ul li a:focus{
background: #366DA5;
}
#menu li a:focus{
outline: 0;
}
#menu li a.active{
background: #80A4F0;
}
#menu li a.active:hover, #menu li a.active:focus{
text-decoration: underline;
}
#menu li a.active:visited:after, #menu li a:visited:after{
content:"";
}
/*MAIN MENU LINKS part 2
-------------------------------------------------------------*/

#menu li{
	list-style: none;
	float: left;
	line-height: 31px;
	display: block;
	position: relative;
}
#menu li ul a, #menu li ul a:link
{
    background-color: #0A4885;
    background-image: none;
	display: block !important;
	width: 176px;
}
#menu li ul
{
	width: 200px;
	left: 0;
	top: 31px;
	position: absolute;
	display: none;
	margin: 0px;
	list-style-image: none !important;
	list-style-type: none !important;
	height: auto;
	background-color: #0A4885;
	z-index: 9999;
	border-left: 1px solid #004073;
	border-right: 1px solid #004073;
}

#menu li:hover li ul
{
    position: absolute;
    left: 200px;
    top: 0px;
    display: none;
}
#menu li:hover li:hover li ul
{
    display: none;
}

#menu li ul li
{
	border-bottom:1px solid #004073;
	float: none;
	line-height: 15px;
	list-style-image: none !important;
	list-style-type: none !important;
	padding: 0;
	margin: 0;
}
#menu li ul li a {
	padding-top: 6px !important;
	padding-bottom: 6px !important;
}

#menu li:hover ul
{
    display: block;
}
#menu li:hover li:hover ul
{
    display: block;
}
#menu li:hover li:hover li:hover ul
{
    display: block;
}
/* end MAIN MENU links */


#banner{
	height: 204px;
	width: 910px;
	padding: 0;
	margin: 0;
}
#banner img {
	height: 204px;
	width: 910px;
	padding: 0;
	margin: 0 0 0 1px;
	display:block;
}
#contentwrapper{
width: 912px;
padding: 0 11px;
background:  url(../images/site/contentwrapperbg.jpg) no-repeat 0 0;
}
#primarycontent{
background: #fff;
width: 670px;
padding: 10px 11px 20px 11px;
float: left;
min-height: 470px;
}
#home #primarycontent{
width: 690px;
padding: 10px 0 10px 0;
}
#productsindex #primarycontent{
width: 890px;
padding: 10px 11px 20px 11px;
}
#secondarycontent{
float: right;
width: 220px;
padding-top: 10px;
}
#footer{
width: 912px;
background: transparent url(../images/site/footerbg.gif) no-repeat center bottom;
padding: 10px 11px 5px 11px;
color: #444;
text-align: center;
clear:both;
}
#footer div{
padding: 0 0 0 10px;
line-height: 1.636em;
}
div.boxleftcol{
margin: 0 10px 10px 0;
float: left;
padding-top: 6px;
width: 335px; 
/* background: #fff url(../images/site/boxleftcol.gif) no-repeat 0 0; */
}
div.boxleftcolinner{
padding: 5px 10px 10px 10px; 
width: 325px; 
height: 265px;
/*background: #fff url(../images/site/boxleftcolinner.gif) no-repeat bottom left;*/
}
div.boxrightcol{
margin: 0 0 10px 0;
float: left;
padding-top: 6px;
width: 220px; 
background: #EEF2F5 url(../images/site/boxrightcol.gif) no-repeat 0 0;
}
div.boxrightcolinner{
padding: 5px 10px 10px 10px;
width: 200px; 
background: #EEF2F5 url(../images/site/boxrightcolinner.gif) bottom left;
}
#home div.boxrightcolinner{
overflow: hidden;
}
#home .newsbox a{
	color: red;
	font-weight:bold;
}
#home .newsbox{
}
#home .contactbox{
}
.inline{
display: inline;
}
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
/*============================================================	
 TYPOGRAPHY	
=============================================================*/ 
h1:first-letter, h2:first-letter, h3:first-letter, h4:first-letter, h5:first-letter,
h6:first-letter{
text-transform: capitalize; 
}
h1{
font-size: 2em;
font-weight: bold;
margin: 0.818em 0;
}
h1#title{
visibility: hidden;
margin: 0;
}
div.h2left{
background: url(../images/site/headerL.gif) no-repeat left top;
padding-left: 6px;
margin-left: -11px;
}
div.h2right{
background: url(../images/site/headerR.gif) no-repeat right top;
padding-right: 6px;
}
h2{
font-family: Arial, "Century Gothic", Verdana, Helvetica, "Helvetica Neue", sans-serif;
font-size: 1.455em;
padding: 5px 0 9px 0;
margin: 0 0 1.125em 0;
color: #EEF2F5; 
background: url(../images/site/headerspan.gif) repeat-x;
font-weight: bold;
}
#primarycontent h2 {
	padding: 7px 0 7px 0;
}
.about{
}
.whychoose{
}
.products{
background: url(../images/site/products.png) no-repeat left -2px;
}
.services{
}
.resources{
background: url(../images/site/resources.png) no-repeat left -2px;
}
.news{
background: url(../images/site/news.png) no-repeat left -2px;
}
.contact{
background: url(../images/site/contact.png) no-repeat left -2px;
}
.glossary{
background: url(../images/site/glossary.png) no-repeat left -2px;
}
.privacy{
background: url(../images/site/privacy.png) no-repeat left -3px;
}
.notfound{
background: url(../images/site/filenotfound.png) no-repeat left;
padding-left: 19px;
}
.whychoose, .products, .resources, .news, .contact, .glossary, .privacy{
padding-left: 28px;
}
#home h2{
color: #EEF2F5;
margin:0;
}
#home #primarycontent h2 {
background: transparent url(../images/site/headerspan.gif) repeat-x scroll 0 0;
padding-left: 10px !important;
}
#home .about{
}
#home .whychoose{
}
#home .products{
}
#home .services{
}
#home div.boxrightcolinner h2{ 
color: #0A4A86;
background: #EEF2F5;
}
#home div.boxrightcolinner .news{
background: #EEF2F5 url(../images/site/news.png) no-repeat left -2px;
}
#home div.boxrightcolinner .contact{
background: #EEF2F5 url(../images/site/contact.png) no-repeat left -2px;
}
h3{
color: #0E2B63;
font-weight: bold;
font-size: 1.273em;
margin: 1.286em 1em 1.286em 0;
}
#home h3{
margin: 0.727em 0 0 0;
font-size: 1.091em; /*12px */
}
#home h3.quote{
font-family: Arial, Helvetica, "Helvetica Neue", Verdana, sans-serif;
color: #366DA5;
letter-spacing: 0.5px;
}
#contact h3, #about h3, #resources h3{
color: #4167A6;
padding: 0.273em 0 0.273em 20px;
font-size: 1.091em; /*12px */
border: 1px solid #D1D9DF;
}
.contactform, .doc{
background: #EEF2F5 url(../images/site/contactform.png) no-repeat left;
}
.warehouse{
background: #EEF2F5 url(../images/site/house.png) no-repeat left;
}
.phone{
background: #EEF2F5 url(../images/site/phone.png) no-repeat left;
}
.fax{
background: #EEF2F5 url(../images/site/fax.png) no-repeat left;
}
.email{
background: #EEF2F5 url(../images/site/email_attach.png) no-repeat left;
}
.mailing{
background: #EEF2F5 url(../images/site/email_open.png) no-repeat left;
}
.mission{
}
.vcard{
background: #EEF2F5 url(../images/site/vcard_add.png) no-repeat left;
}
.benefit{
}
#about h3.benefit, #about h3.mission{
padding-left: 6px; /* cos these two are different sized icons */
}
h4{
font-size: 1.273em;
font-weight: bold;
font-size: 1.364em; /*15px */
margin: 1.2em 0;
}
h5{
font-size: medium; 
font-weight: normal;
margin: 1.5em 0; 
color: #366DA5;
background: none;
padding-left: 0px;
}
h6{
font-size: 1em;
font-weight: normal;
margin: 0.182em 0 0.182em 1.364em;
}
p, abbr, acronym, q, cite, del, ins, address, em, dfn, blockquote, caption, th, tr, td, tbody, thead, tfoot, a, ul, ol, dl{
font-size: 1em; 
margin: 1.636em 0; 
padding: 0;
}
div.boxleftcolinner p{
margin: 1em 0;
}
div.boxrightcolinner p{
margin: 0;
}
#contact #primarycontent p{
margin-left: 4.545em;
}
#privacy #primarycontent p,
#about #primarycontent p{
margin-left: 1.818em;
margin-right: 2.727em;
}
p.contentlinks{
color: #0E2B63;
margin: 0;
}
#footer p{
font-size: 0.909em; /* 10px */
color: #666;
margin: 0.636em 0; /*7px*/
line-height: 1.182em;
}
ol, ul, dl{
margin-left: 10px; 
margin-right: 10px; 
}
#home .boxleftcolinner ul{
margin-left: 30px;
}
#about #primarycontent ul{
margin-left: 60px;
}
dt{
font-weight: bold;
}
dd{
color: #777;
margin-left: 0;
}
ol{
list-style: outside decimal;
}
ol ol{
margin: 0 0 0 40px; 
list-style: outside lower-alpha;
}
ol ol ol{
margin: 0 0 0 40px; 
list-style: outside lower-roman;
}
ul{
list-style: square url(../images/site/bullet.gif);
}
ul ul{
margin: 0 0 0 40px;
list-style: circle url(../images/site/subbullet.png);
}
ul ul ul{
margin: 0 0 0 40px;
list-style: disc url(../images/site/subsubbullet.png);
} 
ol ol, ol ol ol, ul ul, ul ul ul{
padding: 0;
}
li{
margin: 0;
padding: 0;
}
hr{
background-color: #CCC; /* IE requires color */
height: 1px; 
border: 0;
margin: 5px auto;
width: 100%;
} 
hr.hr-resources{
margin: 1.636em auto 0 auto;  
}
abbr, acronym{
cursor: help;
border-bottom: 1px dotted;
}
.quote, .quotemarks, .quotemarkslarge{
font-family: Georgia, "Times New Roman", Times, serif;
}
.quotemarks{
font-size: 22px;
}
.quotemarkslarge{
font-size: 32px;
line-height: 32px;
}
q:lang(en){
quotes: '\201C' '\201D' "\2018" "\2019";
}
q:before{ 
content: open-quote;
}
q:after{ 
content: close-quote; 
}
q:before, q:after{
font-family: Georgia, "Times New Roman", Times, serif;
}
em, dfn, cite, address{
font-style: italic;
}
cite, address{
color: #888;
}
strong{ 
font-weight: 600;
}
sup, sub{
font-size: 0.818em; 
line-height: 0;
}
del{
text-decoration: line-through;
color: #444;
}
ins{
text-decoration: underline;
color: #111;
}
small{ 
font-size: 0.818em; /* 9px */
margin: 1.777em 0;
color: #777;
}
p.date{
font-size: 0.909em; /*10px*/
color:#666;
margin: 0 0 0.455em 0;
}
p.alert{
color: #f00;
display: inline;
font-weight: bold;
font-size: 1.091em;
}
p.copyright{
font-size: 0.636em; /* 7px */
color: #CCC;
margin-top: 0;
}
/*============================================================	
 IMAGES		
=============================================================*/ 
img{
border: 0;
outline: 0; 
padding: 0;
margin: 18px 0; 
}
.imgcentre{
display:block;
margin-left: auto;
margin-right: auto;
}
.caption{ /* specifically used for images (not to be confused with table) */
display: block;
text-align: center;
font-size: 0.909em; 
margin: 0.182em; 
}
/*============================================================	
 HYPERLINKS	
=============================================================*/ 
/*DEFAULT
-------------------------------------------------------------*/
a, a:link{
text-decoration: none;
padding-left: 0; /* Opera 5-6 (as bg arrows don't show up) */
color: #4167A6;
outline: 0;
border: 0;
}
head:first-child+body a{
}
a:visited{
color: #000C46;
}
a:visited:after{
color: #EC5742;
text-decoration: none;
}
head:first-child+body a:visited:after{ 
}
a:hover, a:focus{
color: #0E2B63;
}
a:focus{
outline: 0;
}
a:active{
color: #0E2B63;
text-decoration: none;
}
/*PRINT THIS LINK 
-------------------------------------------------------------*/
a.print, a.print:visited{
text-decoration: none;
background: #fff url(../images/site/printthis.gif) no-repeat 3em -27px;
padding-right: 2.5em;
color: #999;
float: right;
}
a.print:visited:after{
content: "";
}
a.print:focus{
outline: 1px dotted #666;
}
a.print:hover, a.print:focus, a.print:active{
background: #fff url(../images/site/printthis.gif) no-repeat 3em -69px;
color: #666;
}
/*EXTERNAL LINKS
-------------------------------------------------------------*/
a[href^="http"]:after { /* will not flag validator, unlike CSS3 version. crude but it works*/
content: "\00A0\2197";
}
a[href^="www."]:after {
content: "\00A0\2197"; 
}
a.noexternal[href^="www."]:after, a.noexternal[href^="http"]:after{
content: "";
}
a.noexternal{
outline: 0;
}
/*NAMED ANCHORS (remove formatting)
-------------------------------------------------------------*/
a.name, a.name:link, a.name:hover, a.name:focus, a.name:visited, a.name:active{  
text-decoration: none; 
background-color: inherit;
background-image: none;
color: inherit;
padding: 0;
margin: 0;
line-height: 0;
height: 0;
}
a.name:visited:after{
content: "";
}
a.name:focus{
outline: 0;
}
a.navname,
a.navname:link, a.navname:hover, a.navname:focus, a.navname:visited, a.navname:active{
display: none; /* main pages with return to nav content links - hide anchor above nav list */
}
/*RETURN TO TOP
-------------------------------------------------------------*/
a.top:link, a.top:visited{
text-decoration: none;
background: #fff url(../images/site/arrow.gif) no-repeat 3em -64px;
padding-right: 1.2em;
color: #888;
position: relative;
left: 47.5%;
}
a.top:visited:after{
content: "";
}
a.top:hover, a.top:active, a.top:focus{
background: #fff url(../images/site/arrow.gif) no-repeat 3em -27px;
color: #333;
}
a.top:focus{
outline: 0;
}

/*BREADCRUMBS MENU: PRODUCTS PAGES
-------------------------------------------------------------*/
ul.breadcrumbs{
margin: 0;
list-style: none;
padding-left: 0;
display: inline;
}
.breadcrumbs li{
display: inline;
}
.breadcrumbs li a, .breadcrumbs li a:link, .breadcrumbs li a:visited{
color: #366DA5;
text-decoration:none; 
border-bottom: 1px dotted #366DA5;
padding: 0 0 1px 0;
background-image: none;
}
.breadcrumbs li a:visited:after{
content: "";
}
.breadcrumbs li a:hover, .breadcrumbs li a:focus{
text-decoration: underline;
}
.breadcrumbs li a:focus{
outline: 1px dotted #366DA5;
}
.breadcrumbs li a:active{
text-decoration: overline underline;
border-bottom: 1px solid #366DA5;
}
/*RESOURCES MENU/DOWNLOADS MENU: PRODUCTS PAGES
-------------------------------------------------------------*/
ul.downloads{
margin: 3px 0 3px 40px;
list-style-image: none !important;
}
ul.downloads li a{
padding: 3px 0 3px 22px; 
}
/*DOCUMENT ICONS/FILE TYPE ICONS (stuff IE)
-------------------------------------------------------------*/
a[href$='.pdf']{
background: transparent url(../images/site/pdf.png) no-repeat center left;
}
a[href$='.swf']{
background: transparent url(../images/site/flash.png) no-repeat center left;
}
a[href$='.xls']{
background: transparent url(../images/site/pdf.png) no-repeat center left;
}
a[href$='.doc']{
background: transparent url(../images/site/word.png) no-repeat center left;
}
a[href$='.ppt']{
background: transparent url(../images/site/powerpoint.png) no-repeat center left;
}
/*DOCUMENT LINKS: DON'T WANT ICON TO APPEAR 
-------------------------------------------------------------*/
a.noicon[href$='.pdf'], a.noicon[href$='.swf'], a.noicon[href$='.xls'], a.noicon[href$='.doc'],
a.noicon[href$='.ppt']{
}
/*LINKED BRAND IMAGES (PRODUCT PAGE, MANUFACTURER SECTION) 
-------------------------------------------------------------*/
ul.downloads li.brandimage, ul.downloads li.brandimagenolink {
list-style: none;
background-image: none;
margin-left: -20px;
}
ul.downloads li.brandimage a{
border: 0;
text-decoration: none;
outline: 0;
background-image: none;
padding-left: 0;
}
ul.downloads li.brandimage a:after{
content: "";
}
ul.downloads li.brandimage a:visited:after{
content: "";
}
ul.downloads li.brandimage img{
margin: 0;
border: 1px solid #fff;
clear:both;
}
ul.downloads li.brandimage img:hover, ul.downloads li.brandimage img:focus{
border: 1px solid #0E2B63;
}
/*SECONDARY CONTENT COLUMN LINKS: NO BACKGROUND IMAGES
-------------------------------------------------------------*/
#products div.boxrightcolinner a{
background-image: none;
padding: 0;
outline: 0;
}
/*SECONDARY COLUMN: CONTENT LINKS MENU
-------------------------------------------------------------*/
div.boxrightcolinner ul{
list-style-type: none; /* Opera 5-6 fudge */
list-style-image: none; /* Opera 5-6 fudge */
margin: 20px 3px 0 3px;
border-top: 1px solid #D1D9DF;
}
div.boxrightcolinner ul ul{
margin-top:0;
margin-bottom: 0;
border-top: 0;
margin-left: 15px;
}
div.boxrightcolinner ul li{
display: inline;
line-height: 2.545em;
}
div.boxrightcolinner ul li a, div.boxrightcolinner ul li a:visited{
padding: 0 0 0 1.455em;
border-top: 1px solid #EEF2F5;
border-bottom: 1px solid #D1D9DF;
text-decoration: none;
margin: 0;
color: #4167A6;
background-color: #EEF2F5;
}
div.boxrightcolinner ul li a{ /* stupid Opera 6 */
display: block;
}
div.boxrightcolinner ul li a:visited:after{
content: "";
}
div.boxrightcolinner ul li a:hover, div.boxrightcolinner ul li a:focus{
background-color: #E0E9EF;
border-bottom: 1px outset #81929F;
}
div.boxrightcolinner ul li a:focus{
outline: 0;
}
#products div.boxrightcolinner ul li a{
padding: 0 0 0 0;
}
div.boxrightcolinner ul li a:active{
border: 1px inset #81929F;
background-color: #D1D9DF;
}
/*TABLES: NO BACKGROUND IMAGES
-------------------------------------------------------------*/
#productsindex table td a, 
#productsindex table td a:visited{
background-image: none;
padding-left: 0;
}
/*TABLES: WITH IMAGES
-------------------------------------------------------------*/
#resources table td a{
padding: 3px 0 3px 22px;
}
/*FOOTER MENUS
-------------------------------------------------------------*/
#footer a{
font-weight: normal;
color: #555;
padding: 0;
background-image: none;
font-size: 0.909em;
margin: 0;
}
#footer a:hover, #footer a:focus{
color: #111;
background-image: none;
}
#footer a:focus{
outline: 1px dotted #111;
}
#footer a:active{
text-decoration: overline underline;
}
#footer ul{
list-style: none;
padding: 0;
display: block;
margin: 3px 0 1px 0;
}
#footer ul li{
display: inline;
}
#footer ul li a, #footer ul li a:visited{
color: #0E2B63;
text-decoration: underline;
background-image: none;
font-size: 1em;
}
#footer ul li a:hover, #footer ul li a:focus{
color: #366DA5;
}
#footer ul li a:focus{
outline: 1px dotted #366DA5;
}
#footer ul li a:active{
text-decoration: overline underline;
background: #fff;
border-top: 1px solid #002B63;
}
/*============================================================	
 TABLES			
=============================================================*/ 
table{
border-collapse: separate; /* Opera 5/6 makes a meal of what I want with collapse */
border-spacing: 0;
vertical-align: middle;
width: 100%;
margin: 1em auto; 
font-size: 1em;
white-space: normal;
}
head:first-child+body table{ 
border-collapse: collapse; /* not for opera */
}
td, th{
border: none /* first for opera */
}
thead th, thead td, tfoot th, tfoot td {
border: 1px solid #888;
background-color: #4167A6;
color: #fff;
}
thead th, tfoot th{
text-align: center;
font-weight: normal;
}
tbody td, tbody th{
border: none;
text-align: left;
}
table th, table td{
padding: 10px;
white-space: normal; 
}
tbody th{
background: #B3D1EF;
font-weight: normal;
text-align: center;
color: #222;
}
tr{
background: #fff;
}
tr.odd{
background: #EEF2F5;
}
tr td:first-child{
text-align: center;
}
#productsindex tr td:first-child, #resources tr td:first-child{
text-align: left;
}
tr:hover, tr.odd:hover{
background: #FFFFFF;
}
tr ul{
margin-top: 0;
margin-bottom: 0;
}
caption{
font-style: italic;
color: #666;
text-align: left;
}
.equalcol{
width: 100%;
}
.equalcol th, td{	/* Not sure who put this in, but it affects all td elements! Didn't change because not sure how many pages it might affect. */
width: 33.33%;
}
.fixtd td {	/* added to fix the above */
	width: auto;
}
.sixcol th, .sixcol td{
width: 16.67%;
text-align: center;
}
.fourcol th, .fourcol td{
width: 25%;
}
.sixtyperc{
width: 60%;
}
.nowrap td, .nowrap th{
white-space: nowrap;
}
.center td{
text-align: center;
}
table.compact{
width: 75%;
}
#resources table{
width: 95%;
margin: 1em 1em;
}
#products #catindex{
width: 80%;
border: 0;
margin-top: 2.727em;
}
#products #catindex td{
border: 0;
padding: 0.091em;
vertical-align: middle;
}
#products #catindex td:first-child{
text-align: left;
}
#products #catindex tr{
border-top: 1px solid #CCC;
border-bottom: 1px solid #CCC;
}
#products #catindex td a{
display: block;
background-image: none;
font-size: 1.091em;
margin-top: 0.273em;
margin-bottom: 0.273em;
line-height: 120px;
}
#products #catindex td:first-child a:visited{
line-height: 1.636em;
}
#products #catindex td:first-child a, #products #catindex td:first-child a:visited{
border: 0;
text-decoration: none;
}
#products #catindex a{
outline: 0;
}
#products #catindex td a:hover, #products #catindex td a:focus{
}
#products #catindex td:first-child a:hover, #products #catindex td:first-child a:focus{
background-image: none;
}
#products #catindex td a:visited:after{
content: "";
}
#products #catindex td a:active{
text-decoration: underline; /* Opera 5-6 */
}
head:first-child+body #products #catindex td a:active{
text-decoration: overline underline; /* non-Opera */
}
#products #catindex img{
margin: 0;
vertical-align: middle;
}
/*============================================================	
 FORMS	
=============================================================*/ 
form *{
margin: 0;
padding: 0;
}
form ol{
list-style: none;
margin: 0;
}
form ol li{
padding: 0.364em; 
}
form label{
color: #444;
display: block;
}
form input, form textarea, form select{
border: 1px solid #CCC;
font: inherit;
color: #777;
padding: 0.273em 0;
width: 100%; /* if not using #labeltop or #labelside, change the width here */
}
form input:focus, form textarea:focus, form select:focus{
background: #EEF2F5;
color: #2F2F2F;
border: 1px inset #999;
outline: 0; /* safari */
}
form ol li textarea{
height: 8em;
}
form em {
color: #f00;
font-style: normal;
font-weight: bold;
}
.button { /* submit button  */
margin-bottom: 1em;
border: 1px outset #333;
cursor: pointer;
color: #2F2F2F;
width: 5em; 
text-align: center;
font-size: 1em;
}
.button:hover, 
.button:focus{
background: #999;
border: 1px outset #333;
}
.button:active{
background: #666;
border: 1px inset #222;
}
/* LABEL ON TOP OF INPUT FIELDS
----------------------------------------*/ 
#labeltop ol li label,
#labeltop ol li input,
#labeltop ol li textarea, 
#labeltop ol li select{
width: 80%; 
}
/*============================================================	
 CSS IMAGE ZOOM	
=============================================================*/

/* PHOTOZOOM 3 (credit www.randsco.com) - some bugs found (text-align: right is needed on PZ3-c)
-------------------------------------------------------------*/
.PZ3-l { float:left; text-align: left; text-align: left;}
.PZ3-r { float: right; direction:rtl; text-align: right;}
.PZ3-c {display:block; margin: 1.636em auto; direction:rtl; text-align:left; }
  html>/**/body .PZ3-r { position:relative; }
.PZ3zoom { border:1px solid #369; }
.PZ3zoom a,.PZ3zoom a:visited { display:block; padding:0; overflow:hidden; text-decoration:none;
  height:100%; width:100%; border: 0;} html>/**/body .PZ3-r a { right:0; }
.PZ3zoom a:hover { position:absolute; z-index:999; padding:0; background:none; cursor:default; height:auto; width:auto; overflow:visible; border:1px solid #369; margin:-1px 0 0 -1px;}
  html>body .PZ3zoom a:hover { margin:-1px -1px 0 -1px; }
.PZ3zoom a img { border:0; height:100%; width:100%; margin-top:0; margin-bottom:0;}
.PZ3zoom a:hover img { height:auto; width:auto;
  border:0; margin-top:0; margin-bottom:0;}
a:hover .PZ3cap,
a:hover .PZ31cap { display:block; direction:ltr; font-size: 1em; margin-top:-3px; background:#CFCFCF; color: #2F2F2F; text-align:left; }
a:hover .PZ3cap { padding:3px 5px;}
.PZ3inr { display:block; padding:2px 5px; }
.noCap a:hover .PZ3cap, .noCap a:hover .PZ31cap { display:none; }
.noBdr,.noBdr a:hover { border:0; }
.Lnk a:hover { cursor:pointer; }
.noLnk{text-decoration: none; border: 0;}
div.PZ3zoom img.imgcentre{ /*overrides the .imgcentre class (default on all images) when also wrapped in photozoom */
margin: 0;
}
.PZ3-c {display:block; margin: 1.636em auto; direction:rtl; text-align:right; }

/* The PZ3 Image zoom doesn't work in Opera 5 and 6. "hover mouse to enlarge" part of the image caption is wrapped in <span class="none"> the following is to hide that caption from lt Opera 7.*/
span.none{
display: none; /* Opera 5,6 */
}
head:first-child+body span.none{ /* non-Opera*/
display: inline;
}
/* HACKS FOR OPERA 7 (undo HACKS FOR OPERA 5-6 throughout the stylesheet) 
===========================================================*/
@media screen{ 
span.none{ /* zoom image "hover mouse to enlarge" caption (reverse hiding from O5-6) */
display: inline;
}
a, a:link{
}
#menu li a, #menu li a.active, #menu li a:link, #menu li a.active:link{ 
display: block;
padding: 0 12px;
}
table{
border-collapse: collapse;
}
}


/* HOMEPAGE FOOTER LOGOS
------------------------------------------ */
p.logos {
	clear: both;
	margin: 0 auto;
	text-align: center !important;
	}
	
p.logos img, p.logos a img {
	border: none; }
	
	
/* Contact page */

.contactpage {
width: 970px;
}

.contactpage .boxleftcol {
	width: 325px;
}
.fixcol {
width: auto
}

.contactpage .boxleftcolinner {
	width: 315px;
	height: auto;
	padding-right: 3px !important;
	padding-left: 3px !important;
}

.contactpage .boxleftcol h2 {
	padding-left: 10px !important;
}

.contactpage p {
	margin-left:10px !important;
	margin-right:10px !important;
}


/* Misc */

.plain {
	margin-left: 8px;
}

.plain td, .plain th {
	border: none;
	text-align: left !important;
	width: auto;
}

.plain tr:hover {
	background: none !important;
}

ol.normal {
	list-style-type: disc !important;
	border: 0;
	padding-left: 15px;
	margin: 0;
}
ol.normal li {
	list-style-type: disc !important;
	line-height: 16px;
}
ol.normal li a {
	display: inline;
	color: #4167A6 !important;
	padding: 0;
	text-decoration: underline;
	font-weight: normal !important;
}

.workshops {
	margin-bottom: 20px;
}
.workshops p {
	margin: 12px 0 !important;
}
.workshops a {
	color: #4167A6 !important;
}
.workshops a:hover {
	color: #0E2B63 !important;
	text-decoration: none !important;
}

.popup-content {
	width: 640px;
	padding: 0 20px;
	text-align:left;
}
.popup-content p {
	margin: 12px 0 12px;
}
#fancybox-close {
	top: -25px !important;
}

.left-image {
	float:left;
	margin: 3px 20px 15px 0;
}