body {
	_behavior:url("csshover3.htc");/*-------------ie6支援hover--加入body-------------------*/
}
*{
	padding:0;
	margin:0;
}

/* ---------- 大小與定位 ---------- */
* html #menu ul {
    /* 解決IE6不理overflow問題，直接指定高度 */
    height:30px;
}

/* 解決IE6條列式餘白問題*/
* html #menu ul li {
    display:inline;
}
#menu ul li a {
	/* 將a改為區塊元件，以便指定寬高 */
	display: block;
	/* 固定高度 */
	height: auto;/*修改選單高度*/
	width: 80px;
	text-align: center;
}
#menu ul li ul {
	/* 讓第二層ul跳脫文件流以利定位 */
	position: absolute;
	/* 固定寬度  修改選單寬度*/
	width: 116px;
	/* 避免出現捲軸 */
	overflow: visible;
	/* 讓ul與母階層li相同位置 */
	clear: left;
	margin-top: 65px;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
}
/* 修正IE7絕對定位差異 */
*:first-child+html #menu ul li ul {
    margin-top:0;
}
/* 修正IE6絕對定位差異 */
* html #menu ul li ul {
	margin-top: 0;
}
#menu ul li ul li {
	/* 覆寫繼承自第一層的浮動設定 */
	float: none;
	text-align: center;
	width: 80px;
}
#menu ul li ul li a {
	/* 覆寫繼承自第一層的浮動設定 */
	float: none;
	width: 100%;
}
/* 修正IE7絕對定位差異 */
*:first-child+html #menu ul li ul li ul {
    margin-top:-30px;
}

/* ---------- 隱藏與顯示階層 ---------- */
#menu ul li ul {
    /* 預先隱藏第二層 */
    visibility:hidden;
}
#menu ul li:hover ul {
    /* 觸動第一層時，顯示第二層 */
    visibility:visible;
}
/* ---------- 以下為美化用，非必需 ---------- */
/* 第一層a字型 */
#menu ul li a {
    color:#FFF;
    text-decoration:none;
    line-height: 30px;
}

/*第二層ul背景色彩與邊框  */
#menu ul li ul {
	background-color: #FFFFFF;
}
/* 第二層a字型 */
#menu ul li ul li a {
    color:#333333;
    text-decoration:none;
}
/* 觸動第一層li時，改變背景色 */
#menu ul li:hover, #menu ul li a:hover {
    background:#FFFFFF;
}

#menu ul li:hover a {
    color:#333333;
}
/* 觸動第二層以上li時改變背景色 */
#menu ul li ul li:hover, #menu ul li ul li a:hover {
    background:#dfdfdf;
}