.frame{
	position: relative;
}
.frame .nav{
	width: 100%;
	height: 50px;
	overflow: hidden;
	/*position: fixed;*/
	position: relative;
	
}
.nav>div{
	width: 194px;
	height: 50px;
	float: left;
	position: relative;
	cursor: pointer;
	border-right: 1px solid lightgray;
	/*提供3d环境*/
	transform-style: preserve-3d;
}
.frame .nav>div .btn_base{
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	transition: transform 0.1s;
	/*提供3d环境*/
	transform-style: preserve-3d;
}
.btn_base>div{
	position: absolute;
	height: 48px;
	pointer-events: none;
	width: 174px;
	padding-left: 20px;
	padding-top: 2px;
}
/*鼠标放上去的样式*/
.btn_base>div:nth-child(1){
	color: #FFFFFF;
	background-color: #000000;
}
/*鼠标没放上去的样式*/
.btn_base>div:nth-child(2){
	color: #808080;
	background-color: #FFFFFF;
}
.menu-current>div:nth-child(2){
	color: #FFFFFF;
	background-color: #000000;
}
/*未点击的时候的样式*/
.btn_base>div .block{
	display: block;
	width: 16px;
	height: 3px;
	background-color: #c7c7c7;
	margin-left: 1px;
	margin-top: 4px;
}
/*点击该导航的时候就显示红色*/
.menu-current>div .block{
	background-color: #FF0000;
}
.btn_base>div h1{
	font-family: "TrumpGothicEastBold", Arial, Helvetica, sans-serif;
	font-size: 16px;
	line-height: 30px;
	text-transform: uppercase;
	letter-spacing: 1px;
}
.menu-current>div .border-bottom{
	background-color: #000000;
}
.btn_base>div:nth-child(1){
	transform: rotateX(90deg) translateZ(25px);
}
.btn_base>div:nth-child(2){
	transform: rotateX(0deg) translateZ(25px);
}
/*鼠标悬浮时*/
.nav>div:hover .btn_base{
	transform: rotateX(-90deg);
}
.nav>div .menu-current{
	transform: rotateX(-90deg);
}