div#menu
{
	border:		 0px #000 dotted;
	font-size:	 17px;
	line-height: 20px;
	margin-top:	 10px;
}

div#menu_under
{
	position:	absolute;
	left:		0;
	top:		170px;
	border:		0px #000 dotted;
	background:	#a71c53;
	width:		4000px;
	height:		3px;
}

#lava 
{
	/* set to relative, so can use absolute position for children elements */
	position:	relative; 
	text-align:	center; 
	height:		30px;
	border:		0px #f00 dotted;
	/* width:	583px; */
}

#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 your menu*/
	left:	140px; 
	top:	0; 
	
	/* should be higher than #box */
	z-index:100;

}

#lava ul li 
{
	
	/* give some spaces between the list items */
	margin:0 15px; 
	
	/* 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:	#a71c53; 
	height:		26px;	/* Height of the bg right bit. john_w. */
	
	/* 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:	#eee;
	height:		25px;	/* Height of the bg right bit. john_w. */

	/* self-adjust left padding to make sure the box display in the center of the item */
	padding-left:  10px;
	padding-right: 10px;
}