	#divNav {
		background: transparent  no-repeat top left;
		margin: 0;
		padding: 0;
		height: 80px;
		width: 580px;
	}

	#nav {
	position: absolute;
	top: 141px;
	height: 80px;
	width: 580px;
	font-size:12px;
	margin-left: 0px;
	margin-right: 0px;
	left: 260px;
			
	}

	#nav li ul, #nav li ul {
	margin: 0;
	padding: 0;
	margin-left:0;
	height: 0px;
	width: 0px;
	}

	#nav a {
		text-decoration: none;
	}

	#nav li { /*float the main list items*/
		margin: 0;
		float: left;
		display: block;
		padding-right: 5px;
	}

	#nav li ul {
		display: none;
	}

	#nav li.off ul, #nav li.on ul  { /*put the subnav below*/
		position: absolute;
		top: 36px;
		left: 40px;
		padding-top: 15px;
		background: #006699;
		height: 34px;
		width: 546px;
		padding-left: 25px;
		
	}

	#nav li.on ul {
		background: #006699;/*color fonndo del submenu*/
	}

	#nav li.on:hover ul, #nav li.over ul { /*for ie*/
		background: #006699;
	}

	#nav li a {
		color:#999999; /*color letras menu*/
		font-weight: bold;
		display: block;
		width: 65px;
		padding: 0;
	}

	#nav li.on a {
		color: #000; /*color letras menu cuando es seleccionado*/
	}

	#nav li.on ul a, #nav li.off ul a {
		border: 0;
		float: left; /*ie doesn't inherit the float*/
		color: #000;
		width: auto;
		margin-right: 15px;
	}

	#nav li.on:hover ul a, #nav li.over ul li a { /*for ie - the specificity is necessary*/
		background: #006699; 
	}

	#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: #000; /*color letras 2 submenu*/
	}

	/*do the image replacement*/

	#nav li span {
		position: absolute;
		left: 0px;
	}

	#tube a, #obp a, #impe a, #trata a, #jardin a, #piscina a, #energia a, #movt a {
		display: block;
		border:solid 1px #000000;
		position:relative;
		text-align:center;
		height: 34px;
		white-space:normal;
		width:100px;		
		background: #006699 no-repeat; /*contains all hover states*/
	}

/*first, put the initial states in place*/

#tube a {
	background-position:center;
}

#obp a {
	background-position:center;
}

#impe a {
	background-position:center;
}

#trata a {
	background-position:center;
}

#jardin a {
	background-position:center;
}

#piscina a {
	background-position:center;
}

#energia a {
	background-position:center;
}

#movt a {
	background-position:center;
}

/*active area - for this demo - the code could be based on a body class, and probably work better.*/

 #tube.on a {
 	background-position:center;
 } /*add selectors for the other li's and background-positions*/

/*hover states*/
#tube a:hover, #tube:hover a, #tube.over a {
	background-position:center;
}

#obp a:hover, #obp:hover a, #obp.over a {
	background-position:center;
}

#impe a:hover, #impe:hover a, #impe.over a {
	background-position:center;
}

#trata a:hover, #trata:hover a, #trata.over a {
	background-position:center;
}

#jardin a:hover, #jardin:hover a, #jardin.over a {
	background-position:center;
}

#piscina a:hover, #piscina:hover a, #piscina.over a {
	background-position:center;
}

#energia a:hover, #energia:hover a, #energia.over a {
	background-position:center;
}

#movt a:hover, #movt:hover a, #movt.over a {
	background-position:center;
}
/*subnav formatting*/

#nav li.off ul a, #nav li.on ul a {
	display: block;
	background: #006699;
	color: #FFFFFF;
	font-family: arial, verdana, sans-serif;
	font-size: small;
	
	
}		

#nav li.on ul a {
	background: #006699;
}

