* { padding: 0; margin: 0; }

body {
 background-color: #959bac;
 color: #fff;
 font-family: Helvetica, Arial, sans-serif;
 font-size: 14px;
 min-width: 940px;
}

a, a:link, a:visited, a:active{
 color: #fff;
 text-decoration: none;
}

a:hover {
 color: #dde1ec;
}

/*---Top Content Area ---*/

#topContactWrapper {
 background-color: #050f2b;
 padding: 5px 0;
 width: 100%;
 overflow: hidden;
}
#topContactWrapper #topContact {     
 margin: 0 auto;
 width: 940px;    
 font-size: 10px;
 text-align: right;
 overflow: hidden;
 font-weight: bold;
}

/*---Header Area ---*/

#headerWrapper {
 background: #959bac url('images/header-bg.gif') no-repeat top center;
 height: 100px;
 width: 100%;
 overflow: hidden;
}
#headerWrapper #header {     
 margin: 0 auto;
 width: 940px;    
 overflow: hidden;
}
#headerWrapper #header img{  
 margin-top: 25px;
 float: left;
}

/*---Content Area ---*/

#contentWrapper {
 background-color: #4d556b;
 width: 100%;
 overflow: hidden;
}
#contentWrapper #content {     
 margin: 0 auto;
 width: 940px;    
 overflow: hidden;
}
#contentWrapper #content #lcol{  
 float: left;
 width: 460px;    
 margin-top: 35px;
 overflow: hidden;
}
#contentWrapper #content #lcol a img{  
 margin-top: 28px;
}
#contentWrapper #content .info{    
 width: 620px;    
 overflow: hidden;
}
#contentWrapper #content #rcol{  
 float: left;
 width: 460px;    
 margin-left: 18px;
 overflow: hidden;
}
#contentWrapper #content #rcol img{  
 margin-top: 8px;
}
#contentWrapper #contentShadowTop {     
 margin: 0 auto;
 width: 940px;    
 overflow: hidden;
}
#contentWrapper #contentShadowBottom {     
 margin: 0 auto;
 width: 940px;    
 overflow: hidden;
}

/*---Footer Area ---*/

#footerWrapper {
 background: #959bac url('images/footer-bg.gif') no-repeat top center;
 width: 100%;
 height: 130px;
 overflow: hidden;
}
#footerWrapper #footer {     
 margin: 0 auto;
 width: 940px;    
 text-align: center;
 font-size: 12px;
 padding-top: 15px;
 overflow: hidden;
}

/*--- Typography ---*/

#contentWrapper #content h3{   
 font-weight: bold;
 margin-bottom: 5px;
}
#contentWrapper #content .info h3{   
 font-weight: bold;
 margin-bottom: 15px;
}
#contentWrapper #content .info p{   
 margin-bottom: 20px;
}
#contentWrapper #content .info ul{   
 list-style: disc url('images/bullet.gif') inside;
 text-indent: 1.5em;
 margin-bottom: 20px;
}
#contentWrapper #content .info a, a:link, a:visited, a:hover, a:active{   
 text-decoration: underline;
}

/*--- Images ---*/

#contentWrapper #content .info div.withIcons{
 margin: 0 0 15px 20px;
}
#contentWrapper #content .info div.withIcons img{
 margin: 0 6px 0 0;
 float: left;
}

/*--- LavaLamp ---*/
	#lava {
		/* you must set it to relative, so that you can use absolute position for children elements */
		position:relative; 
		text-align:center; 
		width:440px;
    margin: 38px 0 0 140px;
		float: left;
	}
	
	#lava ul {
		/* remove the list style and spaces*/
		margin: 3px 0 0 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;
	}
	
		div#header div#lava ul li a {		
    text-transform: uppercase; 
    font-size: 14px;
    font-weight: bold;
    text-decoration: none;
    color: #fff;
	}
	
	#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:url(images/tail.gif) no-repeat right center; 
		height:20px;
		
		/* 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:url(images/head.gif) no-repeat 0 0; 
		height:20px;

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