.MSDS {
	font-size:small;
	font-weight:bold;
}

h1, h2, h3, h4, h5, h6 {
	margin:auto;
}
pre, p {
	margin-top:auto;
}
ul, ol {
	margin:0 0 0 20px;
	padding:0;
}

hr.dotted {
	height:1px;
	border:0 none #ccc;
	border-bottom: 1px dashed #ccc;
}

.spiffy{
  width:350px;
  display:block

}

.spiffy *{
  display:block;
  height:1px;
  overflow:hidden;
  font-size:.01em;
  background:#335577
}

.spiffy1{

  margin-left:3px;
  margin-right:3px;
  padding-left:1px;
  padding-right:1px;
  border-left:1px solid #a7b5c4;
  border-right:1px solid #a7b5c4;
/*  background:#667f99 */
}
.spiffy2{

  margin-left:1px;
  margin-right:1px;
  padding-right:1px;
  padding-left:1px;
  border-left:1px solid #eaeef1;
  border-right:1px solid #eaeef1;
/*  background:#597590 */
}

.spiffy3{

  margin-left:1px;
  margin-right:1px;
  border-left:1px solid #597590;
  border-right:1px solid #597590;
}

.spiffy4{

  border-left:1px solid #a7b5c4;
  border-right:1px solid #a7b5c4
}

.spiffy5{

  border-left:1px solid #667f99;
  border-right:1px solid #667f99
}

.spiffyfg{
  background:#335577;
  width:350px;

}


pre {

font-size: 14px;

}

body {
	background: #FFFFFF;
	margin: 0px;
	font-size:14px;
	font-family: Arial, Helvetica, Sans-Serif, Verdana, Geneva;
}


div.caption {
color: #fff;
font-weight: bold;
font-size: 14px;
}

div.enlarge {
	font-size:x-small;
	font-family:helvetica;
}

img {
border: none;

}

div.sd { 
background: #FFFFFF;
position: relative;
visibility: visible;
left:0px;
top:0px;
z-index:1;
} 

#loading {
font-family: Arial, Helvetica, sans-serif, Verdana, Geneva;;
font-size: 12pt;
position: absolute;
top: 40px;
left: 40px;

}

.thetable A:hover { color: #00cc00; }
.thetable A:visited { color: #0000FF; }
.thetable A:active { color: #000000; }
.thetable A:visited:hover {color: #00cc00; } 
.thetable A:hover:active {color: #00cc00; }
.thetable A { color: #003388; }


.thetable A.cart:hover { background: #FFFFFF; color: #00cc00; }
.thetable A.cart:visited { color: #00cc00; }
.thetable A.cart:active { color: #00cc00; }
.thetable A.cart:visited:hover { background: #FFFFFF; color: #00cc00; } 
.thetable A.cart:hover:active { color: #00cc00; }

.thetable A.cart 
{ 
 color: #c00; 
 background: #fff;
 postion: relative;
}

.addCart
{
 visibility: hidden; 
 background: #FFFFCC;
 color: #000;
 border: 1px solid #000000;
 font-family:Arial, Helvetica, sans-serif, Verdana, Geneva;
 font-size: 12px;
 position: absolute;
 top: 0;
 left: 0;
}

TABLE
{
 border: 0 none black;
 width: 100%;
 padding : 0px;
}

TABLE#maintable
{
 border: none;
 width: 100%;
 padding : 0px;
}

TABLE#chemTable
{
 background: #CCCCDD;
 color: #000000;
 border-width: 0;
 width: 100%;
 padding : 0px;
}

TD.chem
{
  background: #FFFFFF;
  color: #000000;
  border-style: solid;
  border-color: #112255;
  border-width: thin;
  width: 50%;
}

.con
{
 background: #FFFFFF;
 color: #000000;

}

.des
{
 width: 65%;
 background: #FFFFFF;
 color: #000000;
 padding-left:20px;
}

.content {
	margin-right:10px;
}

.side {
	background-color:#000;
	width:25%;
	text-align:center;
	vertical-align:middle;
	color:white;
}

.pic
{
 width: 35%;
 background: #000000;
 color: #FFFFFF;
 vertical-align: middle;
}

.blackleft
{
 width: 30%;
 background: #000000;
 color: #FFFFFF;
 vertical-align: middle;
}

.mid
{
 width: 5%;
 background: #000000;
}

.standard {
background: #000000;
border: none;
}

.standard th { 
background: #CCCCCC;
color: #000000;
padding: 0px; 
margin: 0px; 
}

.standard tr { 
background: #000000;
color: #FFFFFF;
padding: 0px; 
margin: 0px; 
}

.standard  td { 
background: #FFFFFF;
color: #000000;
padding: 2px; 
margin: 0px;
}

.spectable { 
background: #ffffff;
color: #000000;
text-align: center;
}

.specborderb {
	font-weight: normal;
	clear: right;
	width: 100%;
	margin-top: 10px;
	margin-bottom: 10px;
}

td.specborderb {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #ccc;
}

.specborderb td {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #ccc;
}

.specborderb ol li {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #ccc;
}

.specborderb ul li {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #ccc;
}

.spectr { 
background: #95b5c5;
color: #000000;
padding: 1px;
font-weight:bold; 
text-align: center;
}

.spectrb { 
background: #d3d7e5;
color: #000000;
font-weight:normal;
padding: 1px; 
text-align: center;
}

.spectrc { 
background: #d3d7e5;
color: #000000;
padding: 1px; 
}

.spectrd { 
background: #95b5c5;
color: #000000;
padding: 1px;
font-weight: normal; 
text-align: center;
}

.spectd { 
background: #95b5c5;
color: #000000;
padding-left: 10px;
padding-right:10px;
font-weight:normal;
text-align: left;
}

.spectdb { 
background: #95b5c5;
color: #000000;
padding-left: 10px;
padding-right:10px;
font-weight:bold;
text-align: left;
}

/* I used this website to generate slightly different colour variants - http://www.colordic.org/colorsample/89b0c4.html */
/* represents every even row of the light coloured table  
tr.spectrb:nth-child(2n+1) {
	background:#e5e9ff;
}*/
/* represents every even row of the dark coloured table 
tr td.spectd:nth-child(2n+1) {
	background:#89b0c4;
}*/

.image_gallery {
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	width:auto;
	max-width:90%;
	min-width:40%;
	background-color:#eee;
	border:1px dashed #fff;
	padding: 10px;
}
.image_gallery img {
	border:1px dashed #eee;
	max-width:75px;
	max-height:75px;
}

.image_gallery img:hover {
	border:1px dashed grey;
	max-width:75px;
	max-height:75px;
}


.spect1 { 
background: #d3d7e5;
padding-top: 10px;
padding-left: 10px;
padding-right:10px;
padding-bottom:10px;
}

.spect2 { 
background: #95b5c5;
padding-top: 10px;
padding-left: 10px;
padding-right:10px;
padding-bottom:10px;
}

.price { 
color: #cc0000;
padding: 0px; 
margin: 0px; 
}




.menu_left td {
 background-color: transparent;
}

.menu {
 font-size:14px;
}


.menu A:hover { text-decoration: underline; color: #ddeeff; }
.menu A:visited { color: #00cc00; }
.menu A:active { color: #BBDDFF; }
.menu A:visited:hover { color: #ddeeff; } 
.menu A:hover:active { color: #ddeeff; }
.menu A { color:  #BBDDFF; text-decoration: none; font-size: 14px; }







/* ----------------------------------------------------- */
/* Search CSS */
/* ---------- */
/* Menu colours
#1d4d6a
7              #276c88
8              #286f8a
8              #4ca7c6
7              #4eaac9
#64c0e6
*/

/*Background colours - #89b0c4;#e5e9ff;#d3d7e5;#95b5c5; */



#sql-search div, #cse-search-box div {
	margin-top:2px;
	margin-right:5px;
	margin-left:-4px;
}

input.searchbutton {
	margin:0;
	padding:0;
	width:auto;
	height:20px;

	color:#fff; 
	font: bold 84% 'trebuchet ms',helvetica,sans-serif; 

	border: 1px solid; 
	border-color: #999 #ccc #ccc #999; /* makes it look intented */

	background-color:#89b0c4; /* For older browsers */
	background: -webkit-gradient(linear, left top, left bottom, from(#64c0e6), to(#1d4d6a));	/*For Webkit Browsers*/
	background: -moz-linear-gradient(top, #64c0e6, #1d4d6a);	/*For Firefox 3.6+*/
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#64c0e6', endColorstr='#1d4d6a');	/*For Internet Explorer*/
	
	/*round corners*/
	-moz-border-radius-topright:4px;
	-webkit-border-top-right-radius:4px;
	-moz-border-radius-bottomright:4px;
	-webkit-border-bottom-right-radius:4px;
	
	cursor:pointer;
}

#cse-search-box input.searchbutton {
	width:auto;
	height:18px;
}

input.searchbutton:hover {
	/*border-color: #c33 #c33 #c33 #c33;*/
	/* border-color: #666 #999 #999 #666; /* makes it look intented */
	border-color: #00cc00;
}

input.searchbutton:active {
	color:#fff;
	
	/*border-color: #999 #ccc #ccc #999;  makes it look intented */
	border-color: #7e9db9;
		
	background-color:#d3d7e5; /* For older browsers */
	background: -webkit-gradient(linear, left top, left bottom, from(#286f8a), to(#4ca7c6));	/*For Webkit Browsers*/
	background: -moz-linear-gradient(top,  #286f8a,  #4ca7c6);	/*For Firefox 3.6+*/
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#286f8a', endColorstr='#4ca7c6');	/*For Internet Explorer*/
}

input.searchbox, input#q {
	margin:0;
	padding:0;
	margin-right:-4px;
	width: auto;
	height:18px;
	
	color:gray;
	border: 1px solid; 
	border-color: #999 #ccc #ccc #999; /* makes it look intented */

	/*round corners*/
	-moz-border-radius-topleft:4px;
	-webkit-border-top-left-radius:4px;
	-moz-border-radius-bottomleft:4px;
	-webkit-border-bottom-left-radius:4px;
}

input#q {
	width:auto;
	height:18px;
}

input.searchbox:hover, input#q:hover {
	border-color: #00cc00;
}

input.searchbox:focus, input#q:focus {
	/* border-color: #68a; */
	border-color: #7e9db9;
}

/* ----------------------------------------------------- */





/*MENU*/
/*----*/


#menudiv {
width:100%;
min-width:1000px;
position: fixed;
top:0;
left:0;
z-index:100;
}


/* All <ul> tags in the menu including the first level */
.menulist, .menulist  ul {
 background-color: transparent;
 margin: 0;
 padding: 0;
 list-style: none;

}

/* Submenus (<ul> tags) are hidden and absolutely positioned downwards from their parent */
.menulist ul {
 background-color: transparent;
 visibility: hidden;
 position: absolute;
 /* top: 2.5em; /* I'm using ems rather than px to allow people to zoom their font */
 top : 28px; /* height of the menu pics */
 left: 0px;
 width: 250px;
 font: 14px/16px sans-serif;
}

/* Second and third etc. level submenus - position across from parent instead */
.menulist ul ul {
 top: 0px;
 left: 252px;
 width: 550px;
font: 12px/14px sans-serif;
}

/*
 All menu items (<li> tags). 'float: left' lines them up horizontally, and they are
 positioned relatively to correctly offset submenus. Also, they have overlapping borders.
*/
.menulist li {
 float: left;
 position: relative;
 background-color: transparent;
 border:none;
margin:0 0 0 -1px;
padding:0;
}

/* Items in submenus - override float/border/margin from above, restoring default vertical style */
.menulist ul li {
 background: #22748F;
 float: none;
 margin-right: 0;
 margin-bottom: -1px;
 border-width: 1px;
 border-style: solid;
 border-color: #8899bb;
}
.menulist ul>li:last-child {
 background: #22748F;
 margin-bottom: 1px;
}

/* Links inside the menu */

.menulist a {
 display: block;
 padding: 1px;
 color: #FFFFFF;
 background-color: transparent;
 text-decoration:  none;
 font-weight: normal;
}

/* Lit  items: 'hover' is mouseover, 'highlighted' are parent items to visible menus */
.menulist a:hover, .menulist a.highlighted:hover, .menulist a:focus {
 color: #FFFFFF;
 background-color: #00cc00;
}

.menulist  a.highlighted {
 color: #ffffff;
 background-color: #00cc00;
}

/*
 If you want per-item background images in your menu items, here's how to do it.
 1) Assign a unique ID tag to each link in your menu, like so: <a id="xyz" href="#">
 2) Copy and paste these next lines for each link you want to have an image:
    .menulist a#xyz {
      background-image: url(out.gif);
    }
    .menulist a#xyz:hover, .menulist a.highlighted#xyz, .menulist a:focus {
     background-image: url(over.gif);
    }
*/

/* Only style submenu indicators within submenus. */
.menulist a .subind {
 display:  none;
}
.menulist ul a .subind {
 display:  block;
 float: right;
}

/* 'Escaped Comment' hack for horizontal menubar width in IE5/Mac */
.menulist a {
 float: left;
}
.menulist ul a {
 float: none;
}
/* \*/
.menulist a {
 float: none;
}
/* */


/* This semi-commented section exists to fix bugs in IE/Windows (the 'Holly Hack'). \*/
* html .menulist  ul li {
 float: left;
 height: 1%;
}
* html .menulist  ul a {
 height: 1%;
}
/* End Hack */





/* Cat. no. - Description - Price - pk size - discount - stock? - cart img - dg img - ask */
/* -------------------------------------------------------------------------------------- */
.Style_CartItem, .Style_Price, .Style_Stock, .Style_discountString, .Style_discount, .Style_Ask, .Style_dg_link, .Style_Shopping-Cart {
	margin-left:0.5em;
}

.Style_Ask {
	font-weight:bold;
}

.Style_Price, .Style_Price a, .Style_Price a:visited, .Style_Price a:active {
	color:#c00;
	font-weight:bold;
	text-decoration:none;
}

.Style_discountString {
	font-weight:bold;
	font-style:italic;
	font-size:small;
}

.Style_discount {
	font-weight:normal;
	font-style:italic;
	/*text-transform:lowercase;*/
	font-size:small;
}

.Style_CatNo, .Style_CartItem {
	color:#003388;
	font-weight:bold;
}

/* ------------------------------- */