a {

		text-decoration:none; 

		color:#fff;

	}

	

	#lava {

		/* you must set it to relative, so that you can use absolute position for children elements */

		position:relative; 

		width:980px; 

		height:35px;

		font: bold 14px arial;

        text-decoration: none;

        color: #fff;

        outline: none;

        text-align:left;

		padding-top:9px;

        letter-spacing: -2; /*espacio de letra*/

		margin-left:10px;

		float:left;



		}

	

	#lava ul {

		/* remove the list style and spaces*/

		margin:0; 

		padding:0; 

		list-style:none; 

		display:inline;

		color:#000;



		/* position absolute so that z-index can be defined */

		position:inherit;

		float:left;

		

		

		/* center the menu, depend on the width of you menu*/

		left:0px; 

		top:0; 

		

		/* should be higher than #box */

		z-index:100;

		width:980px;



	}

	

	#lava ul li {

		

		/* give some spaces between the list items */

		margin:0 10px; 

		

		/* display the list item in single row */

		float:left;

		margin-right:50px;

		color:#000; }



 ##lava ul li { color:#000;}

	

	#lava #box {

		

		/* position absolute so that z-index can be defined and able to move this item using javascript */

		position:absolute; 

		left:0; 

		top:0; 

		background-image:url(imagenes/lava.png);

		

		/* should be lower than the list menu */

		z-index:50; 



		/* image of the right rounded corner */

		height:35px;

		

		/* add padding 8px so that the tail would appear */

		padding-right:8px;

		

		/* self-adjust negative margin to make sure the box display in the center of the item */

		margin-left:-10px;

		color:#000;

	}

	

	#lava #box .head {

		/* image of the left rounded corner */

		height:35px;

		background-image:url(imagenes/lava.png);



		/* self-adjust left padding to make sure the box display in the center of the item */

		padding-left:10px;

		color:#000;

	}