/*
Title:      Navigation & Sub navigation formating
Author:     Martin Cayouette, martin.cayouette@nurun.com
Updated:    April 8 2008

Content: 	Main Navigation Image 
			Main Navigation Formating			
				Sub Navigation Formating - First Level
				Sub Navigation Formating - Second Level
				Sub Navigation Formating - Third Level
				Sub Navigation Formating - Fourth Level				
				Sub Navigation Alignment
				IE6 Navigation patch (set from javascript)
			Navigation Formating - YUI Tweaks

*/
/* ---[ Main Navigation Image ]------------------------------- */

/* ---[ Main Navigation Formating ]------------------------------- */
#nav {
	position: absolute;
	width: 950px;
	height: 41px;	
	z-index: 6;
	}
	#main-nav {
		width: 950px;
		height: 41px;
		background: url(../images/nav_bkg.gif) no-repeat top left;
		}
		#main-nav .bd {
			position: relative; 
			}

/* ---[ Sub Navigation Formating - First Level ]------------------------------- */
#main-nav ul#main-nav-container {
	position: absolute;
	display: block;	
	height: 41px;
	padding-right: 64px;
	background: url(../images/nav_bkg_end.png) no-repeat top right;
	_background: url(../images/nav_bkg_end.gif) no-repeat top right;
	z-index: 6;
	font-size: 85%;
	}
#main-nav ul li {
	float: left;
	display: block;
	padding: 0 1px 0 1px;
	margin: 0;
	background: #000 url(../images/nav_line_vertical.jpg) no-repeat top right;
	}
#main-nav ul li a {
	float: left; /*IE6*/
	display: block;
	height: 21px;
	padding: 20px 12px 0 12px;				
	text-transform: uppercase;
	background: none;
	}
	#main-nav ul li a:hover {
		color: #fdc600;
		text-decoration: none;
		background: url(../images/nav_bkg_on.jpg) repeat-x top left;			
		}
#main-nav ul li#home {
	padding-left: 30px;
	margin-left: 0;
	}

/* ---[ Sub Navigation Formating - Second Level ]------------------------------- */
#main-nav ul.level-2 {
	position: absolute;
	display: none;
	top: 41px;
	left: 0px;
	width: 150px;
	height: 180px;
	background: #3e3e3e;
	z-index: 6;
	}	
	#main-nav ul li:hover > ul.level-2 {
		display: block; 
		}		
#main-nav ul.level-2 li { 
	width: 148px;
	/*height: 14px;*/
	padding: 0 1px 0 1px;
	background: #3e3e3e;
	}
#main-nav ul.level-2 li a {
	margin: 0;
	padding: 2px 5px 2px 8px;
	color: #fff;
	width: 135px;
	height: auto;
	/*height: 14px;*/
	cursor: hand;
	cursor: pointer;
	}
	#main-nav ul.level-2 li a:hover {
		color: #fff;
		background: #555454 url(../images/nav_bkg_submenu.gif) no-repeat 99% 50%;
		}
	#main-nav ul.level-2 li.sub-nav-line,
	#main-nav ul.level-2 li.sub-nav-linenavOver3 {
		height: 1px;
		margin: 0;		
		}
		#main-nav ul.level-2 li.sub-nav-line span,
		#main-nav ul.level-2 li.sub-nav-linenavOver3 span {
			position: static;
			display: block;
			height: 1px;
			margin: 0 8px 0 8px;
			padding: 0;
			line-height: 0;	/*IE6*/
			border-top: 1px solid #555454;			
			}

/* ---[ Sub Navigation Formating - Third Level ]------------------------------- */
#main-nav ul.level-3 {
	position: absolute;
	display: none;
	clear: both;/*IE6*/
	left: 150px;
	width: 150px!important;
	height: 180px!important;
	background: #555454;
	z-index: 6;
	}
	#main-nav ul li:hover > ul.level-3 {
		display: block; 
		}
#main-nav ul.level-3 li {		
	background: #555454;	
	}
	#main-nav ul.level-3 li a:hover {
		background: #666 url(../images/nav_bkg_submenu.gif) no-repeat 98% 50%;
		}

/* ---[ Sub Navigation Formating - Fourth Level ]------------------------------- */
#main-nav ul.level-4 {
	position: absolute;
	display: none;
	clear: both;/*IE6*/	
	top: 0;
	left: 150px;
	width: 175px;/*Fit for Out Max 800R LTD*/
	height: 180px;
	background: #666;
	z-index: 6;
	}
	#main-nav ul li:hover > ul.level-4 {
		display: block;
		}
#main-nav ul.level-4 li {
	width: 175px;/*Fit for Out Max 800R LTD*/
	/*height: 142px;*/
	margin: 0;
	padding: 0;
	background: #666;
	}
	#main-nav ul.level-4 li img {
		width: 114px;/*127*/
		height: 85px;
		}
	#main-nav ul.level-4 li a {
		text-transform: none;
		background: #666;		
		width: 159px;/*Fit for Out Max 800R LTD*/
		}
		#main-nav ul.level-4 li a:hover {
			background: none;
			}
	#main-nav ul.level-4 li span {
		text-transform: uppercase;
		}

/* ---[ Sub Navigation Alignment - Saut de 18px ]------------------------------- */
/* ---[ level-3 ]--- */
#main-nav ul.level-3.items-1 {
	top: 0px;
	}
	#main-nav ul.level-3.items-1 li {
		top: 0px;
		}	
#main-nav ul.level-3.items-2 { /* Top 'Ul' Alignment */
	top: -19px;
	}
	#main-nav ul.level-3.items-2 li { /* Keep 'LI' beside the Others parent LI */	
		top: 18px;	
		}	
#main-nav ul.level-3.items-3 {
	top: -38px;
	}
	#main-nav ul.level-3.items-3 li {		
		top: 36px;	
		}	
#main-nav ul.level-3.items-4 {
	top: -57px;
	}
	#main-nav ul.level-3.items-4 li {		
		top: 54px;	
		}	
#main-nav ul.level-3.items-5 {
	top: -76px;
	}
	#main-nav ul.level-3.items-5 li {		
		top: 72px;	
		}
#main-nav ul.level-3.items-6 {
	top: -95px;
	}
	#main-nav ul.level-3.items-6 li {		
		top: 90px;	
		}
/* ---[ level-3 : level-4 ]--- */
/* ---[ level-3.items-1 : level-4 ]--- */
#main-nav ul.level-3.items-1 ul.level-4.items-1 {
	top: 0px;
	}
#main-nav ul.level-3.items-1 ul.level-4.items-2 {
	top: -19px;
	}
#main-nav ul.level-3.items-1 ul.level-4.items-3 {
	top: -38px;
	}
#main-nav ul.level-3.items-1 ul.level-4.items-4 {
	top: -57px;
	}
#main-nav ul.level-3.items-1 ul.level-4.items-5 {
	top: -75px;
	}
#main-nav ul.level-3.items-1 ul.level-4.items-6 {
	top: -93px;
	}
#main-nav ul.level-3.items-1 ul.level-4.items-1 li,
#main-nav ul.level-3.items-1 ul.level-4.items-2 li,
#main-nav ul.level-3.items-1 ul.level-4.items-3 li,
#main-nav ul.level-3.items-1 ul.level-4.items-4 li,
#main-nav ul.level-3.items-1 ul.level-4.items-5 li,
#main-nav ul.level-3.items-1 ul.level-4.items-6 li {
	top: 0px;
	}
/* ---[ level-3.items-2 : level-4 ]--- */
#main-nav ul.level-3.items-2 ul.level-4.items-1 { /* Top 'Ul' Alignment */
	top: -18px;
	}
#main-nav ul.level-3.items-2 ul.level-4.items-2 {
	top: -37px;
	}
#main-nav ul.level-3.items-2 ul.level-4.items-3 {
	top: -56px;
	}
#main-nav ul.level-3.items-2 ul.level-4.items-4 {
	top: -75px;
	}
#main-nav ul.level-3.items-2 ul.level-4.items-5 {
	top: -94px;
	}
#main-nav ul.level-3.items-2 ul.level-4.items-6 {
	top: -113px;
	}
#main-nav ul.level-3.items-2 ul.level-4.items-1 li,
#main-nav ul.level-3.items-2 ul.level-4.items-2 li,
#main-nav ul.level-3.items-2 ul.level-4.items-3 li,
#main-nav ul.level-3.items-2 ul.level-4.items-4 li,
#main-nav ul.level-3.items-2 ul.level-4.items-5 li,
#main-nav ul.level-3.items-2 ul.level-4.items-6 li {/* Keep 'LI' at Top */
	top: 0px;
	}
/* ---[ level-3.items-3 : level-4 ]--- */
#main-nav ul.level-3.items-3 ul.level-4.items-1 {
	top: -36px;
	}	
#main-nav ul.level-3.items-3 ul.level-4.items-2 {
	top: -55px;
	}
#main-nav ul.level-3.items-3 ul.level-4.items-3 {
	top: -74px;
	}
#main-nav ul.level-3.items-3 ul.level-4.items-4 {
	top: -93px;
	}
#main-nav ul.level-3.items-3 ul.level-4.items-5 {
	top: -112px;
	}
#main-nav ul.level-3.items-3 ul.level-4.items-6 {
	top: -131px;
	}
#main-nav ul.level-3.items-3 ul.level-4.items-1 li,
#main-nav ul.level-3.items-3 ul.level-4.items-2 li,
#main-nav ul.level-3.items-3 ul.level-4.items-3 li,
#main-nav ul.level-3.items-3 ul.level-4.items-4 li,
#main-nav ul.level-3.items-3 ul.level-4.items-5 li,
#main-nav ul.level-3.items-3 ul.level-4.items-6 li {
	top: 0px;
	}
/* ---[ level-3.items-4 : level-4 ]--- */
#main-nav ul.level-3.items-4 ul.level-4.items-1 {
	top: -54px;
	}
#main-nav ul.level-3.items-4 ul.level-4.items-2 {
	top: -73px;
	}
#main-nav ul.level-3.items-4 ul.level-4.items-3 {
	top: -92px;
	}
#main-nav ul.level-3.items-4 ul.level-4.items-4 {
	top: -111px;
	}
#main-nav ul.level-3.items-4 ul.level-4.items-5 {
	top: -130px;
	}
#main-nav ul.level-3.items-4 ul.level-4.items-6 {
	top: -149px;
	}
#main-nav ul.level-3.items-4 ul.level-4.items-1 li,
#main-nav ul.level-3.items-4 ul.level-4.items-2 li,
#main-nav ul.level-3.items-4 ul.level-4.items-3 li,
#main-nav ul.level-3.items-4 ul.level-4.items-4 li,
#main-nav ul.level-3.items-4 ul.level-4.items-5 li,
#main-nav ul.level-3.items-4 ul.level-4.items-6 li {
	top: 0px;
	}
/* ---[ level-3.items-5 : level-4 ]--- */
#main-nav ul.level-3.items-5 ul.level-4.items-1 {
	top: -72px;
	}
#main-nav ul.level-3.items-5 ul.level-4.items-2 {
	top: -91px;
	}
#main-nav ul.level-3.items-5 ul.level-4.items-3 {
	top: -110px;
	}
#main-nav ul.level-3.items-5 ul.level-4.items-4 {
	top: -129px;
	}
#main-nav ul.level-3.items-5 ul.level-4.items-5 {
	top: -147px;
	}
#main-nav ul.level-3.items-5 ul.level-4.items-6 {
	top: -165px;
	}
#main-nav ul.level-3.items-5 ul.level-4.items-1 li,
#main-nav ul.level-3.items-5 ul.level-4.items-2 li,
#main-nav ul.level-3.items-5 ul.level-4.items-3 li,
#main-nav ul.level-3.items-5 ul.level-4.items-4 li,
#main-nav ul.level-3.items-5 ul.level-4.items-5 li,
#main-nav ul.level-3.items-5 ul.level-4.items-6 li {
	top: 0px;
	}
	
/* ---[ level-3.items-6 : level-4 ]--- */
#main-nav ul.level-3.items-6 ul.level-4.items-1 {
	top: -90px;
	}
#main-nav ul.level-3.items-6 ul.level-4.items-2 {
	top: -109px;
	}
#main-nav ul.level-3.items-6 ul.level-4.items-3 {
	top: -128px;
	}
#main-nav ul.level-3.items-6 ul.level-4.items-4 {
	top: -147px;
	}
#main-nav ul.level-3.items-6 ul.level-4.items-5 {
	top: -165px;
	}
#main-nav ul.level-3.items-6 ul.level-4.items-6 {
	top: -183px;
	}
#main-nav ul.level-3.items-6 ul.level-4.items-1 li,
#main-nav ul.level-3.items-6 ul.level-4.items-2 li,
#main-nav ul.level-3.items-6 ul.level-4.items-3 li,
#main-nav ul.level-3.items-6 ul.level-4.items-4 li,
#main-nav ul.level-3.items-6 ul.level-4.items-5 li,
#main-nav ul.level-3.items-6 ul.level-4.items-6 li {
	top: 0px;
	}

/* ---[ IE Navigation patch (set from javascript) ]------------------------------- */
#main-nav ul li.navOver2 ul { /*SHOW level-2*/
	display: block; 
	}		
	/*HIDE level-3 - level-4*/	
	#main-nav ul li.navOver2 ul ul { 
		display: none;
		}	
		#main-nav ul ul li.navOver3 ul { /*SHOW level-3*/
			display: block; 
			}
		#main-nav ul ul li.navOver3 ul ul { /*HIDE level-4*/
			display: none;
			}
			#main-nav ul ul ul li.navOver4 ul { /*SHOW level-4*/
				display: block; 
				}

/* ---[ Navigation Formating - YUI Tweaks ]------------------------------- */
#nav #main-nav .yuimenuitemlabel,
#nav #main-nav .yuimenubaritemlabel {
	white-space: normal;
	}
