#lava {
	/* you must set it to relative, so that you can use absolute position for children elements */
	position:relative;height:69px;}

#lava ul {
	/* remove the list style and spaces*/
	margin:0;padding:0;list-style:none;display:inline;		
	/* position absolute so that z-index can be defined */
	position:absolute; 	
	/* center the menu, depend on the width of you menu*/
	left:0px;top:0; 	
	/* should be higher than #box */
	z-index:100;
}
#lava ul li {	
	/* give some spaces between the list items */
	margin:0px;	
	/* display the list item in single row */
	float:left;
}

#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; 	
	/* should be lower than the list menu */
	z-index:50; 

	/* image of the right rounded corner */
	background:#540a68; 
	height:69px;
	
	/* 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;
}

#lava #box .head {
	/* image of the left rounded corner */
	background:#540a68; 
	height:68px;
	/* self-adjust left padding to make sure the box display in the center of the item */
	padding-left:0px;
}
	
	