@font-face {
font-family: 'myHaedingFont';
src: url('../images/Futuramc.eot?#iefix') format('embedded-opentype'),
url('../images/Futuramc.woff') format('woff'),
url('../images/Futuramc.ttf') format('truetype'),
url('../images/Futuramc.svg#svgFontName') format('svg');
}

@font-face {
    font-family: "mybodyFont";
    src: url("../images/tahoma.eot"); /* IE */
    src: local("mybodyFont"), url("../images/tahoma.ttf") format("truetype"); /* non-IE */  
}


/* remove the list style */
#nav {
	margin:0; padding:0; list-style:none;
}	
	
/* make the LI display inline */
/* it's position relative so that position absolute */
/* can be used in submenu */
#nav li {
	float:left; 
	display:block; 
	width:auto; 
	position:relative;
	z-index:500; 
	color:#FFFFFF;
}

/* this is the parent menu */
#nav li a {
	display:block; 
	padding:16px 15px 15px 15px;
	font-weight:bold;   
	text-decoration:none; 
	color:#000;
	font-family:Tahoma, mybodyFont; 
	font-size:11px;
	text-transform:uppercase;
}

#nav li a:hover {
	background:url(../images/menu_bg.png) repeat-x; text-decoration:none; color:#FFFFFF;
}
	
/* you can make a different style for default selected value */
#nav a.selected {
	color:#FFFFFF;
}

/* submenu, it's hidden by default */
#nav ul {
	position:absolute; left:0; display:none; padding:0; list-style:none; border-top:1px solid #B45100; color:#FFFFFF;
}

#nav ul li {
	width:140px; float:left; background:#CA5E00; border-bottom:1px solid #B45100; border-left:1px solid #B45100; 
	border-right:1px solid #B45100; color:#FFFFFF;
}

/* display block will make the link fill the whole area of LI */
#nav ul a {
	display:block; padding: 8px 5px; color:#fff; text-decoration:none; font-size:12px; font-weight:normal; 
	font-family:Tahoma; text-transform:capitalize; 
}

#nav ul a:hover {
	text-decoration:none; background:url(../images/menu_bg.png) repeat-x; color:#FFFFFF;
}

/* fix ie6 small issue */
/* we should always avoid using hack like this */
/* should put it into separate file : ) */
*html #nav ul {
	margin:0;
}