#lava {
		/* you must set it to relative, so that you can use absolute position for children elements */
		                                                                                              
		height: 30px;
		                                                                                              
		background-color: black;
		                                                                                              
		text-transform: uppercase;
		                                                                                              
		font-size: 16px;
		                                                                                              
		font-family: "Lucida Grande", Verdana, Arial, sans-serif;
		                                                                                              
		position:relative; 
		text-align:center; 
		width: 960px;
	}
	
	#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:110px; 
		top:0; 
		
		/* should be higher than #box */
		z-index:100;

	}
	
	#lava ul li {
		
		/* give some spaces between the list items */ 
		
		/* display the list item in single row */
		padding-top: 3px;
		
		                                              
		
		                                         
		margin-left: 35px;
		
		                                              
		
		                                         
		margin-bottom: 0;
		
		                                              
		
		                                         
		margin-right: 35px;
		
		                                              
		
		                                         
		margin-top: 0;
		
		                                              
		
		                                         
		float:left;
	}
	
	#lava #box {
		
		/* position absolute so that z-index can be defined and able to move this item using javascript */
		
		                                                                                                  
		
		                                                                                                  
		float: right;
		
		                                                                                                  
		
		                                                                                                  
		background-position: 0;
		
		                                                                                                  
		position:absolute; 
		left:0; 
		top: 0px; 
		
		/* should be lower than the list menu */
		z-index:50; 

		/* image of the right rounded corner */ 
		height: 50px;
		
		/* add padding 8px so that the tail would appear */
		padding-right: 10px;
		
		/* 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 */
		border-bottom-width: 1px;
		                                      
		border-bottom-color: #e03231;
		                                      
		padding-bottom: 4px;
		                                      
		padding-top: 4px;
		                                      
		border-top-color: white;
		                                      
		border-top-width: 1px;
		                                      
		border-top-style: solid;
		                                      
		padding-right: 10px;
		                                      
		background:#af1c1d;
		height:20px;

		/* self-adjust left padding to make sure the box display in the center of the item */
		padding-left:10px;
	}
	#lava li a {
		color: white;
	}
	#lava li a:hover {
		color: white;
	}