body {
background: #fff url(../images/body_bg.gif) repeat-x top;
margin:0px 0px 0px 0px;
}

h2 { font:Geneva, Arial, Helvetica, sans-serif bold; font-size:13px; letter-spacing:.1px; margin:0; padding:0; color:#666666; font-style:italic; }

p { margin-top:0; padding-top:0; }

.style1 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
}

.style2 {
padding: 10px;
	margin: 5px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
}
.style3 {
	font-size: 14px;
	font-weight: bold;
	color: #FF0000;
}

.style3 a:link{
	font-size: 14px;
	font-weight: bold;
	color: #FF0000;
}
.style3 a:hover{
	font-size: 14px;
	font-weight: bold;
	color: #666666;
}

.style3 a:visited{
	font-size: 14px;
	font-weight: bold;
	color: #FF0000;
}
.style4 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 11px;
}
.style5 {
	color: #000000;
	font-weight: bold;
}

.selected {
	color: #F15210;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 11px;
}

.selected a, .selected a:visited{
	color: #F15210;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 11px;
}

.selected a:hover, .selected a:active{
	color: #F15210;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 11px;
}

#img_wrapper {
background: url(../images/bg_top.gif) no-repeat top center;
}

.content_corner {
background: url(../images/content_corner2.gif) no-repeat bottom right;
}

.content_bg {
background: url(../images/content_bg.gif) no-repeat bottom;
}

img.floatLeft { 
    float: left; 
    margin: 4px 4px 4px 0px;  
}
img.floatRight { 
    float: right; 
    padding: 0px 0px 0px 0px; 
    margin: 4px 2px 0px 2px; 
}

#msds_nav{
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
}

.active {
		color: #f90;
		text-decoration: none;
		font: bold 11px Verdana, Arial, Helvetica, sans-serif;
}

#msds_nav a, #msds_nav a:visited{
		color: #fc0;
		text-decoration: none;
		font: bold 11px Verdana, Arial, Helvetica, sans-serif;
}

#msds_nav a:hover, #msds_nav a:active{
		color: #f90;
		text-decoration: underline;
}

#msds_list {
	
	width: 600px;
	margin: 5px 0px 0px 66px;
	font: normal 15px "trebuchet ms", Verdana, Arial, Helvetica, sans-serif;
	color: #333;
	float: center;
	}
	
	#msds_list ul {
		list-style: none;
		margin: 0;
		padding: 0;
		border: none;
		}
		
	#msds_list li {
		margin: 0;
		list-style: none;
		list-style-image: none;
		}
	
	#msds_list li a {
		display: block;
		padding: 7px 5px 7px 0.5em;
		background-color: #edf3fe;
		color: #000;
		text-decoration: none;
		width: 100%;
		}
		
#msds_list li.white a {
		display: block;
		background-color: #fff;
		color: #000;
		text-decoration: none;
		width: 100%;
		}

	html>body #msds_list li a {
		width: auto;
		}
		
			html>body #msds_list li.white a {
		width: auto;
		}

	#msds_list li a:hover {
		background-color: #eee;
		color: #000;
		}
		
.ALIGN_RIGHT {
text-align: right;
}

.content {
padding:6px;
font: normal 12px "trebuchet ms", Verdana, Arial, Helvetica, sans-serif;
}

.content h2{
padding:0px;
margin:0px;
}

.content h3{
padding:0px;
margin:0px;
}

.content a, .content a:visited{
color: #2f75bb;
text-decoration: none;
}

.content a:hover, .content a:active{
color: #2f75bb;
text-decoration: underline;
}

/* =============MAIN NAV=============*/

	/* navigation */
	
	#nav {
		position: relative;
		float: left;
		margin: 0;
		padding: 0;
		list-style: none;
		background: #fff url(../images/main_nav_img.gif) 0 0 repeat;
		height: 88px;
		width: 528px;
	}

	#nav li ul, #nav li ul {
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
	}

	#nav a {
		float: left;
		display: block;
		text-decoration: none;
		font: bold 12px Verdana, Arial, Helvetica, sans-serif;
		color: #fff;
		background: url(../images/main_nav_seperator.gif) no-repeat top right;
		margin: 0px 0px 0px 0px;
		padding: 42px 16px 31px 15px;
	}

	#nav li { /*float the main list items*/
		float: left;
		display: block;
		padding: 0px 0px 0px 0px
		margin: 0px 0px 0px 0px;
	}

	#nav li ul {
		display: none;
		padding: 0px 0px 0px 0px
		margin: 0px 0px 0px 0px;
	}

/*this is for the sub menu*/

	#nav li.off ul, #nav li.on ul  { /*put the subnav below*/
		position: absolute;
		top: 87px;
		left: 0px;
		background:transparent url(../images/opaque.png);
		width: 528px;
	}

	#nav li.on ul {
				position: absolute;
		top: 87px;
		left: 0px;
		background:transparent url(../images/opaque.png);
		width: 528px;
	}

	#nav li.on:hover ul, #nav li.over ul { /*for ie*/
		position: absolute;
		top: 87px;
		left: 0px;
 		filter: progid:DXImageTransform.Microsoft.Alpha(opacity=85);
		width: 528px;
	}

	#nav li a {
	
		color: #fff;
		font-weight: bold;
		display: block;
	}

	#nav li.on a {
		color: #f90;
	}

	#nav li.on ul a, #nav li.off ul a {
		border: 0;
		float: left; /*ie doesn't inherit the float*/
		color: #f90;
		width: auto;
	}

	#nav li.on:hover ul a, #nav li.over ul li a { /*for ie - the specificity is necessary*/
		background:transparent;
	}

	#nav li.on ul {
		display: block;
	}

	#nav li.off:hover ul, #nav li.over ul {
		display: block;
		z-index: 6000;
	}

	#nav li.off a:hover, #nav li.on a:hover { 
		color: #f90;
	}

	/*do the image replacement*/

/*active area - for this demo - the code could be based on a body class, and probably work better.*/

 #liRetailers.on a {
 	background-position: 0px 0px;
 } /*add selectors for the other li's and background-positions*/

/*hover states*/

#liHome a:hover, #liHome:hover a, #liHome.over a {
color: #fc0;
}

#liProducts a:hover, #liProducts:hover a, #liProducts.over a {
color: #fc0;
}

#liRetailers a:hover, #liRetailers:hover a, #liRetailers.over a {
color: #fc0;
}

#liMSDS a:hover, #liMSDS:hover a, #liMSDS.over a {
color: #fc0;
}

#liPrivateLabel a:hover, #liPrivateLabel:hover a, #liPrivateLabel.over a {
color: #fc0;
}

#liContact a:hover, #liContact:hover a, #liContact.over a {
color: #fc0;
}

#liContact a {
	background: url(../images/main_nav_img.gif) no-repeat top right;
}

/*subnav formatting*/

#nav li.off ul a, #nav li.on ul a {
	padding: 10px 0px 10px 10px;
	margin: 0px 0px 0px 0px;
	display: block;
	background:transparent;
	color: #333;
	font: bold 10px Verdana, Arial, Helvetica, sans-serif;
}		

#nav li.on ul a {
	background: #f90;
}

/* =============left nav 2============== */

/* common styling */

.bordertest {
border-left: 2px solid #f90;
border-right: 1px solid #4f4f4f;
border-bottom: 1px solid #333;
border-top: 1px solid #666;
}

.left_seperate {
padding: 0px 0px 0px 0px; 
margin: 0px 0px 0px 0px;
}

.left_seperate img{
padding: 0px 0px 0px 0px; 
margin: 0px 0px 0px 0px;
height: 1px;
}

.menu {
  z-index: 1000;
  text-align: left;
  margin: 0;
  border: 0 none;
  padding: 0;
  width: 198px; 
  list-style: none;
  display:block; 
}

.menu ul li a, 
.menu ul li a:visited {
z-index: 1000;
display:block; 
text-decoration:none;   
text-align: left; 
border-left: 4px solid #fc0; 
background: #fff url(../images/left_nav_seperator.gif) no-repeat bottom right;
color: #666;
font: normal 12px Verdana, Arial, Helvetica, sans-serif;
margin: 5px 0px 0px 0px;
padding: 4px 0px 4px 6px;
width: 188px;

}

.menu img{
z-index: 1000;
padding: 0px 0px 0px 0px; 
margin: 0px 0px 0px 0px;
height: 1px;
text-align: left; 

}

.menu ul {
z-index: 1000;
padding:0; 
margin:0;
list-style-type: none;

}

.menu ul li {
z-index: 1000;
float:left; 
margin-right:1px; 
position:relative;
}

.menu ul li ul {
z-index: 1000;
display: none;

}

/* specific to non IE browsers */

.menu ul li:hover a {
z-index: 1000;
color:#fff; 
background: #666 url(../images/left_gradi.gif) 0 0 repeat;
border-left: 4px solid #f90;
}

.menu ul li:hover ul {
z-index: 1000;
display:block; 
position:absolute; 
top:5px; 
left:198px; 
width:175px;
}

/* sub level state */

.menu ul li:hover ul li a {
z-index: 1000;
border-left: 2px solid #fc0;
border-right: 1px solid #999;
border-bottom: 1px solid #999;
font: normal 10px/18px Verdana, Arial, Helvetica, sans-serif;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 5px;
background: #EEE;
color: #666;
width:175px;
}

/* sub level hover */

.menu ul li:hover ul li a:hover {
z-index: 1000;
border-left: 2px solid #f90;
border-right: 1px solid #4f4f4f;
border-bottom: 1px solid #333;
background: #666 url(../images/left_gradi_1.gif) 0 0 repeat;
color: #FFF;
}

/*============layout=============*/

#footer {
background-color: #f1f0e0;
		margin: 0px 0px 0px 0px;
		padding: 25px 0px 25px 0px;
		font: normal 10px "trebuchet ms", Verdana, Arial, Helvetica, sans-serif;
}

#footer span{
		color: #666;
		font: bold 10px "trebuchet ms", Verdana, Arial, Helvetica, sans-serif;
}

#footer p{
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
		color: #f90;
		font: bold 10px "trebuchet ms", Verdana, Arial, Helvetica, sans-serif;
}

#footer a, #footer a:visited {
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
		color: #666;
		font: normal 10px "trebuchet ms", Verdana, Arial, Helvetica, sans-serif;
		text-decoration: none;
}

#footer a:hover, #footer a:active {
		color: #666;
		font: normal 10px "trebuchet ms", Verdana, Arial, Helvetica, sans-serif;
		text-decoration: underline;
}

#hm_specials {
		margin: 0px 0px 0px 0px;
		padding: 0px 5px 0px 15px;
		font: normal 15px "trebuchet ms", Verdana, Arial, Helvetica, sans-serif;
}

#hm_specials h1{
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
		color: #fff;
		font: bold 16px "trebuchet ms", Verdana, Arial, Helvetica, sans-serif;
}

#hm_specials h2{
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
		color: #333;
		font: bold 14px "trebuchet ms", Verdana, Arial, Helvetica, sans-serif;
}

#hm_specials a, #hm_specials a:visited{
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
		color: #fff;
		font: bold 16px "trebuchet ms", Verdana, Arial, Helvetica, sans-serif;
		text-decoration: none;
}

#hm_specials a:hover, #hm_specials a:active{
	text-decoration: underline;
}

.border_content {
border-top: 2px solid #999;
margin: 2px 20px 0px 20px;
padding: 0px 0px 2px 0px;
height: 2px;
}

#top_layer {
z-index: 1000;
}

#bottom_layer {
z-index: 0;

}

.top_layer {
z-index: 1000;
}

.bottom_layer {
z-index: 0;
}


	#mainleft {
		z-index: 0;
		position:relative; 
		float: left;
		left:0px; 
		top: 0px;
		width: 219px; 
		margin: 13px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
		font: normal 12px "trebuchet ms", Verdana, Arial, Helvetica, sans-serif;
		}
	
	#maincenter {
	    z-index: 0;
		position:relative; 
		float: left;
		left:0px; 
		top: 0px;
		width: 263px; 
		margin: 13px 0px 13px 0px;
		padding: 0px 0px 0px 0px;
		font: normal 12px "trebuchet ms", Verdana, Arial, Helvetica, sans-serif;
		background: url(../images/colum_sperat.gif) top left repeat-y;  
		height: 285px;
		}
	
		#mainright {
		z-index: 0;
		position:relative; 
		float: left;
		left:0px; 
		top: 0px;
		width: 262px; 
		margin: 13px 0px 13px 0px;
		padding: 0px 0px 0px 0px;
		font: normal 12px "trebuchet ms", Verdana, Arial, Helvetica, sans-serif;
		background: #fff url(../images/colum_sperat.gif) top left repeat-y; 
		height:auto;
		}
	
#mainleft h1{ 
	z-index: 0;
	margin: 0px 0px 0px 0px;
	padding: 13px 5px 2px 15px;
	font-size:16px;
	color: #333;
	}
	
#mainleft h2{ 
	z-index: 0;
	margin: 8px 0px 0px 15px;
	padding: 0px 5px 0px 7px;
	font-size:14px;
	border-left: 2px solid #fc0;
	color: #fc0;
	}
	
#mainleft h3{ 
	z-index: 0;
	margin: 0px 0px 0px 0px;
	padding: 0px 5px 0px 5px;
	font-size:13px;
	}
	
#mainleft p { 
	z-index: 0;
	margin: 0px 0px 0px 15px;
	padding: 3px 5px 0px 5px;
	font-size:12px;
	border-left: 2px solid #fc0;
	color: #666;
	line-height: 1.1em;
	}
	
#mainleft a, #mainleft a:visited { 
	z-index: 0;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	font: bold 10px/20px Verdana, Arial, Helvetica, sans-serif;
	color: #000;
	text-decoration: none;
	/*background: #fff url(../images/more_icon.gif) no-repeat bottom left; */
	}
	
#mainleft a:hover, #mainleft a:active { 
	z-index: 0;
	text-decoration: underline;
	}
		
#mainright h1 { 
	z-index: 0;
	margin: 0px 0px 10px 0px;
	padding: 0px 15px 0px 20px;
	font-size:16px;
	color: #fc0;
	}
	
	#maincenter h1, #mainleft h1{ 
	z-index: 0;
	margin: 0px 0px 0px 0px;
	padding: 0px 15px 0px 20px;
	font-size:16px;
	color: #fc0;
	}
	
#maincenter h2, #mainright h2, #mainleft h2 { 
    z-index: 0;
	margin: 0px 0px 0px 0px;
	padding: 0px 15px 0px 20px;
	font-size:14px;
	color: #666;
	}
	
#mainright h3 { 
	z-index: 0;
	margin: 0px 0px 0px 0px;
	padding: 6px 15px 0px 20px;
font-size:13px;
	}
	
	#maincenter h3. #mainleft h3{ 
	z-index: 0;
	margin: 0px 0px 0px 0px;
	padding: 0px 15px 0px 20px;
font-size:13px;
	}
	
#maincenter p, #mainleft p{ 
	z-index: 0;
	margin: 0px 0px 0px 0px;
	padding: 3px 15px 2px 20px;
	font-size:12px;
	color: #666;
	line-height: 1.1em;
	}
	
#mainright p { 
	z-index: 0;
	margin: 0px 0px 0px 0px;
	padding: 3px 15px 2px 20px;
	font-size:12px;
	color: #666;
	line-height: 1.1em;
	}
	
#maincenter a, #maincenter a:visited, #mainright a, #mainright a:visited { 
	z-index: 0;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	font: bold 10px/20px Verdana, Arial, Helvetica, sans-serif;
	color: #000;
	text-decoration: none;
	/*background: #fff url(../images/more_icon.gif) no-repeat bottom left; */
	}
	
	#maincenter .link, #mainright .link, #mainleft .link { 
	z-index: 0;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	font: bold 10px/20px Verdana, Arial, Helvetica, sans-serif;
	color: #000;
	text-decoration: none;
	}
	
	#maincenter_sub a, #maincenter_sub a:visited{ 
	z-index: 0;
	position:relative; 
	left: 0px; 
	top: 60px;
	margin: 0px 0px 0px 0px;
	padding: 75px 0px 0px 225px;
	text-decoration: none;
	background: url(../images/warning.gif) no-repeat bottom left; 
	}
	
#maincenter a:hover, #maincenter a:active, #mainright a:hover, #mainright a:active { 
	z-index: 0;
	text-decoration: underline;
	}
	
	#maincenter_sub a:hover, #maincenter_sub a:active{ 
	z-index: 0;
	text-decoration: none;
	}
	
	#maincenter span {
	background: #fff url(../images/warning.gif) no-repeat bottom left;
	}
	
	/*left colum*/
	
		#template_column {
		width: 150px; 
		margin: 0px 0px 0px 0px;
		padding: 5px 0px 5px 0px;
		font: normal 12px "trebuchet ms", Verdana, Arial, Helvetica, sans-serif;
		background: #fff url(../images/left_column_rep.gif) right repeat-y;
		height: 100%;
		}
		
		#template_column p { 
	margin: 0px 0px 0px 0px;
	padding: 10px 10px 5px 5px;
	color: #555;
	line-height: 1.1em;
	text-align: left;
	}
	
	#priv_box p {
	font-family: Verdana, Helvetica, Arial, sans-serif;
	color: #333;
	background-color: #666;
	text-decoration: none;
	border: solid #000 1px; 
	padding: 5px;
	margin: 15px 5px 0px 5px; 
	font: bold 10px Verdana, Arial, Helvetica, sans-serif;
}

#priv_box a, #priv_box a:visited { 
	color: #fff;
	text-decoration: none;
	}
	
	#priv_box a:hover, #priv_box a:active { 
	color: #fc0;
	text-decoration: underline;
	}
	
		/*main column*/
	
		#main_column { 
		margin: 0px;
		padding: 5px;
		font: normal 12px "trebuchet ms", Verdana, Arial, Helvetica, sans-serif;
		}
		
		#main_column p { 
	margin: 0px 0px 0px 0px;
	padding: 5px 0px 15px 0px;
	color: #333;
	line-height: 1.1em;
	text-align: left;
	}
	
#details { 
		border: 1px solid #ccc;
		background: #eee;
		font: normal 12px "trebuchet ms", Verdana, Arial, Helvetica, sans-serif;
		}

div.button {
	float: center;
	width: 79px; 
	height: 19px;
	margin: 0 0 0 0;
	background: url(../images/button.gif) 0 0px no-repeat;
	}

div.button a, div.button a:visited {
	display: block;
	margin: 0; 
	padding:0;
	width:100%; height:100%;
	overflow:hidden;
	text-align:center;
	font: bold 10px Verdana, serif;
	color:#444;
	text-decoration: none;
	background: url(../images/button.gif) 0 -19px no-repeat;
	}
	
div.button span {
	display: block;
	margin:0; 
	padding: 3px 0px 0px 0px;
	}
div.button a:hover, div.button a:active {
	background-image: none;
	color: black;
	}
	
	div.button2 {
	float: center;
	width: 79px; 
	height: 19px;
	margin: 0 0 0 0;
	background: url(../images/button2.gif) 0 0px no-repeat;
	}

div.button2 a, div.button2 a:visited {
	display: block;
	margin: 0; 
	padding:0;
	width:100%; height:100%;
	overflow:hidden;
	text-align:center;
	font: bold 10px Verdana, serif;
	color:#444;
	text-decoration: none;
	background: url(../images/button2.gif) 0 -19px no-repeat;
	}
	
div.button2 span {
	display: block;
	margin:0; 
	padding: 3px 0px 0px 0px;
	}
div.button2 a:hover, div.button a:active {
	background-image: none;
	color: black;
	}
