/* ==================================================================================================================== */
/*                                                                                                                      */
/*   GENERAL FUNCTIONALITY CODE FOR ALL MENUS                                                                           */
/*                                                                                                                      */
/* ==================================================================================================================== */


.nav, .nav ul {
	padding:0; 
	margin:0;
	list-style:none;
	line-height:1;	
	}

.nav li {
	float: left;
	}

.nav a {
	display: block;
	}

.nav li ul {
	position: absolute;
	left: -999em;
	}

.nav li:hover {
	background-position: 0 0;
	}
	
.nav li:hover ul ul, .nav li.sfhover ul ul {			/* third level not visible when second level is */
	left: -999em;
	}

.nav li:hover ul ul ul, .nav li.sfhover ul ul ul {		/* fourth level not visible when third level is */
	left: -999em;
	}
	
.nav li:hover ul, 
.nav li li:hover ul, 
.nav li li li:hover ul, 
.nav li.sfhover ul, 
.nav li li.sfhover ul, 
.nav li li li.sfhover ul	
	{    
	left: auto;
	}	






/* ==================================================================================================================== */
/*                                                                                                                      */
/*   CUSTOMIZE THE FOLLOWING - ONE BLOCK FOR EACH MENU (IN CASE THERE ARE MORE THAN ONE)                                */
/*                                                                                                                      */
/* ==================================================================================================================== */





/* ==================================================================================================================== */
/*   CUSTOMIZING THE FIRST MENU , ID = "menu"                                                                   */
/* ==================================================================================================================== */



/* ----- GENERAL CUSTOMIZATION ---------------------------------------------------------------------------------------- */


	#menu li, #menu li a {
		height: 50px;		/* default width & height of ALL menu options */
		
		}
	
	#menu li a {
	border: 0px;			/* default border of ALL menu options */
	padding: 0px 15px; /* default padding of ALL menu link options */
	background: url(../images/img03.gif) no-repeat;
	text-transform: uppercase;
	text-decoration: none;
	font-family: bold 12px "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #D8D8D8;
	line-height: 50px;
		}
	



/* ----- IF LEVEL 1 CUSTOMIZATION ------------------------------------------------------------------------------------- */
	
	
	#menu ul.level1 li#lev1opt1 {
		width:150px; height:30px;			/* width & height of level 1 option 1, if different from default */
		background-image:url('image1A.gif');		/* optional: (background) image for level 1 option 1 */
		}

	#menu ul.level1 li#lev1opt2 {
		width:150px; height:30px;			/* width & height of level 1 option 2, if different from default */
		background-image:url('image1B.gif');		/* optional: (background) image for level 1 option 1 */
		}

	#menu ul.level1 li#lev1opt3 {
		width:150px; height:30px;			/* width & height of level 1 option 3, if different from default */
		background-image:url('image1C.gif');		/* optional: (background) image for level 1 option 1 */
		}		

	#menu ul.level1 li#lev1opt4 {
		width:150px; height:30px;			/* width & height of level 1 option 4, if different from default */
		background-image:url('image1D.gif');		/* optional: (background) image for level 1 option 1 */
		}	


/* ----- IF LEVEL 1 MENU IS MADE OF IMAGES ---------------------------------------------------------------------------- */

	#menu ul.level1 li a {
		text-indent:0px;				/* optional, only if level 1 are images */
		}	


	#menu ul.level1 li:hover, #menu ul.level1 li.sfhover {
		background-position:0 -30px;			/* if level 1 are images, position the image the appropriate number of pixels up */		
		}	



/* ----- IF LEVEL 2 CUSTOMIZATION ------------------------------------------------------------------------------------- */


	#menu ul.level2, #menu ul.level2 li, #menu ul.level2 li a {
		width: 105px;					/* width of level 2 menus */
		}

	#menu ul.level2 li, #menu ul.level2 li a {
		height: 20px;					/* height of level 2 menus */
		line-height: 20px;
		background-color: #666;					/* bgcolor of level 2 menus */		
		font-size: 10px;					/* font size of level 2 menus */
							/* color of level 2 menus */
		}
	
	#menu ul.level2 li a {
		background: url(../images/navBg.jpg) ;
		border-right: 1px solid #000;
		border-left: 1px solid #000;
		}
		
	#menu ul.level2 ul {
		margin:-40px 0 0 200px;				/* depending on the width/height of level 2 menu items */
		}