/* 
	LEVEL ONE
*/

ul.dropdown ul
{
	list-style-type: none;	
}

/* Ensure top level nav items stay in hover state when sub items are in hover state */
#nav li:hover a, #nav li a:hover
{
	background-position: bottom;
}


/* Nav level one -------------------------------------------------------------------------------------  */            
ul.dropdown li
{ 
   zoom: 1;
   position: relative;
}

	ul.dropdown li.level1
	{
		padding-left: 10px !important;  	
	}

ul.dropdown a:active
{
   color: #ffa500;
}

ul.dropdown li a
{
   display: block; 
}

ul.dropdown li.hover, ul.dropdown li:hover
{
   color: #fff; 
    
}

ul.dropdown li.hover a
{
   color: #fff;
}

/* Level 1 nav buttons */
#about-dexion
{
	width: 51px;
	height: 12px;
	background: url('../images/layout/nav/nav_about.png') top left no-repeat;
	margin-bottom: 3px;  	
}
      
#environment
{
	width: 74px;
	height: 12px;
	background: url('../images/layout/nav/nav_environment.png') top left no-repeat;
	margin-bottom: 3px;	
}

#products
{
	width: 58px;
	height: 12px;
	background: url('../images/layout/nav/nav_products.png') top left no-repeat;
	margin-bottom: 3px;	
}

#case-studies
{
	width: 71px;
	height: 12px;
	background: url('../images/layout/nav/nav_casestudies.png') top left no-repeat;	
	margin-bottom: 3px;
}

#case-studies
{
	width: 71px;
	height: 12px;
	background: url('../images/layout/nav/nav_casestudies.png') top left no-repeat;	
	margin-bottom: 3px;
}

#news
{
	width: 31px;
	height: 12px;;
	background: url('../images/layout/nav/nav_news.png') top left no-repeat;
	margin-bottom: 3px;	
}

#supply-centre-network
{
	width: 131px;
	height: 12px;
	background: url('../images/layout/nav/nav_supplycentre.png') top left no-repeat;	
	margin-bottom: 3px;
}

#contact-us
{
	width: 67px;
	height: 12px;
	background: url('../images/layout/nav/nav_contactus.png') top left no-repeat;
	margin-bottom: 3px;		
}

	#about-dexion:hover, #environment:hover, #products:hover, #case-studies:hover, #news:hover, #supply-centre-network:hover, #contact-us:hover
	{
		background-position: bottom;	
	}	


/* 
	LEVEL TWO
*/
ul.dropdown ul 						
{  
   margin: 0;
   padding: 0;  
   position: absolute;
   visibility: hidden;     
   padding-bottom: 10px; 
}

ul.dropdown ul li
{            
   float: none;
   height: 14px; 
   line-height: 10px;
   width: 166px;
   background-color: #000000;
   margin-bottom: 1px;
}

ul.dropdown ul li a
{      
   font-size: 10px;
   line-height: 10px;
   width:auto !important;
   padding-bottom: 3px;    
}

	/* Red Subnav */

	.red_subnav1 a
	{
		color: #ff0000	!important;
        background: url('../images/layout/dotted-line-red4.png') left bottom no-repeat;
	}

	.red_subnav2 a
	{
		color: #ff3333	!important;
        background: url('../images/layout/dotted-line-red3.png') left bottom no-repeat;           
	}      	

	.red_subnav3 a
	{
		color: #ff6666	!important;
        background: url('../images/layout/dotted-line-red2.png') left bottom no-repeat;             
	}
		
	.red_subnav4 a
	{
		color: #ff9999	!important;
        background: url('../images/layout/dotted-line-red1.png') left bottom no-repeat;            
	}						

	/* Green Subnav */

	.green_subnav1 a
	{
		color: #00cc66	!important;
        background: url('../images/layout/dotted-line-green4.png') left bottom no-repeat;
	}

	.green_subnav2 a
	{
		color: #33d685	!important;
        background: url('../images/layout/dotted-line-green3.png') left bottom no-repeat;
	}	

	.green_subnav3 a
	{
		color: #66e0a3	!important;
        background: url('../images/layout/dotted-line-green2.png') left bottom no-repeat;
	}

	.green_subnav4 a
	{
		color: #99ebc2	!important;
        background: url('../images/layout/dotted-line-green1.png') left bottom no-repeat;
	}						
		
		
	/* Yellow Subnav */
	.yellow_subnav1 a
	{
		color: #ffff00	!important;
        background: url('../images/layout/dotted-line-yellow2.png') left bottom no-repeat;
	}

	.yellow_subnav2 a
	{
		color: #ffff66	!important;
        background: url('../images/layout/dotted-line-yellow1.png') left bottom no-repeat;
	}	
						  
/* IE 6 & 7 Needs Inline Block */
ul.dropdown ul li a					
{
   border-right: none;
   width: 100%;
   display: inline-block; 
} 

/* 
	LEVEL THREE
*/
ul.dropdown ul ul 					
{
   left: 100%;
   top: 0;
}

ul.dropdown li:hover > ul 			
{
   visibility: visible;
}