* {
	margin:0;
	padding:0;
}
li {
	list-style:none;
}
.nav1 {
	width:1200px;
	height:60px;
	background:#69bded;
	margin:0 auto;
}
#nav .nav1 ul li {
	width:200px;
	line-height:60px;
	text-align:center;
	background:#69bded;
	float:left;
}
#nav .nav1 ul li a {
	color:#000;
	display:block;
	width:200px;
	height:60px;
	text-decoration:none;
}
#nav .nav1 ul li a:hover {
	background:#f5a6ac;
	color:#fff;
	transition:all 0.7s;
}
.nav2 .li {
	position:relative;
}
.nav3 {
	position:obsolute;
	height:0px;
	overflow:hidden;
	transition:height 0.7s;
	-moz-transition:height 0.7s;
	/* Firefox 4 */ -webkit-transition:height 0.7s;
	/* Safari and Chrome */
}
/*就是当鼠标悬浮在li 上面的时候，让他子元素中的 nav3 显示可见*/ 
.nav2 .li:hover .nav3 {
	height:180px;
}
.nav2 .li:nth-child(3):hover .nav3 {
	height:240px;
}
#nav {
	height:60px;
	background:#3d313f;
	position:fixed;
	z-index:100000;
	/* 必须设置最高层 */top:0px;
	width:100%;
}
#header {
	height:460px;
}
#content {
	width:1200px;
	height:1300px;
	margin:0 auto;
}
#footer {
	height:200px;
	background:#1D1D1D;
}