/************************* hack reset (for production, use Yahoo! reset CSS) *************************/
* {margin: 0;padding: 0;}
/************************* tabs *************************/
ul.tabs {display: table;margin:0px;padding: 0;list-style: none;position: relative;text-align:center;}
ul.tabs li {margin: 0;padding: 0;list-style: none;display: table-cell;float: left;position: relative;margin-left:7px;margin-right:7px;}
ul.tabs a {position: relative;display: block;text-align:center;	}
/************************* dropdowns *************************/
ul.dropdown {margin: 0;padding: 0;display: block;position: absolute;z-index: 999;top: 100%;width: 170px;display: none;text-align:left;}
ul.dropdown ul.dropdown {top: 0;left: 95%;}
ul.dropdown li {margin: 0;padding: 0;float: none;position: relative;list-style: none;display: block;height: 32px;text-align:left;}
ul.dropdown li a {display: block;text-align:left;}
/************************* menu-specifc *************************/
#menu {padding:0; margin:6px auto 0 auto;text-align:center;width:100%;clear:both;text-transform:uppercase;}
/* make sure menu is displayed over the top of everything else */
#menu * { z-index: 999; }
#menu .trandot { width:0px; height:0px; }
#menu ul {text-align:left;margin:0px;list-style-type:none;padding:0px;margin:0 auto 0 auto;}
#menu ul li h4 {margin: 0;}
#menu ul li h4 a {font-size: 13px;font-weight:normal;padding: 0;letter-spacing:auto;}
#menu ul li a {padding-left: 0px;}
#menu ul li a:hover {text-decoration:none;}
#menu ul li a.curr {text-decoration:none;}
#menu ul li a span {display: block;padding: 0 15px 0 11px;}
#menu ul.dropdown {padding-top: 18px;overflow:hidden;border-bottom: none;width: 200px;margin:0;}
#menu ul.dropdown li a {font-size:11px;font-weight:normal;border-bottom: none;line-height: 32px;overflow: hidden;height: 42px;padding-left:5px;}
#menu ul.dropdown li.last a {border-bottom-width: 0;}
#menu ul li h4 a:hover {background-image: none;}
/***** Tablet (768px - 959px) *****/
@media only screen and (min-width: 768px) and (max-width: 1000px) {
	#menu { margin:10px 0 0 2px; position:relative;height:25px;  }
	#menu ul.dropdown {padding-top: 16px;}
	#menu ul li h4 a {font-size: 11px;}
	ul.tabs li {margin-left:8px;}
	ul.dropdown {width: 150px;}	
	ul.dropdown li { margin-left:0; }		
	#menu ul.dropdown li a {font-size:10px;}
}
/***** END OF Tablet (768px - 959px) *****/

/***** Phone *****/
@media only screen and (max-width: 767px) {		
	#menu { margin:0; clear:both; width:100%; min-width:320px; max-width:320px; height:515px; position:relative;  top:12px; }		
	#menu * { position:relative; z-index:1200; }
	#menu ul li { font-size: 12px; text-align:left; font-weight: bold; margin:0; width:100%; min-width:320px; max-width:320px; border-radius:0; border:none; }	
	#menu ul li a { font-size: 12px; font-weight:bold; text-align:left; padding:0 0 0 5px; margin:0; width:100%; min-width:320px; max-width:320px; border-top-left-radius:0px; border-top-right-radius:0px; height:22px; line-height:22px; }	
	#menu ul li h4 a {font-size: 12px;font-weight:200;padding:0 0 2px 0;}
	#menu ul li.hasmore { margin-bottom:-2px; }
	#menu ul li.hasmore h4 a {height:22px;line-height:22px;}
	#menu ul.blockdown { margin:0; top:-4px; padding:0; display:block; }
	#menu ul.blockdown li { display:block; }
	#menu ul.blockdown li a { font-size:12px; font-weight:200; margin:0; padding:0 0 0 10px; }
	#menu a.curr { color:#FFFFFF; }
	/*
	.tabs li:first-child a { position:relative; top:2px; }
	*/
	#menu h4 { margin:0; padding:0; }
	#menu .mobilehide { display:none; }
	#menu ul.tabs { border-bottom:1px solid #FFFFFF; }
	/*
	#menu ul li.last { margin-bottom:-2px; }
	*/
}
/***** END OF Phone (landscape 480px) *****/