/*
* @Author: win
* @Date:   2016-09-09 12:12:43
* @Last Modified by:   win
* @Last Modified time: 2016-09-09 15:56:51
*/
html,body{
	width: 100%;
	height: 100%;
}
.head{
	width: 100%;
	height: 120px;
	background-color: #1F1F1F;
	text-align: center;
	line-height: 120px;
	position: fixed;
	top: 0;
	left: 0;
	color: hsla(0,0%,89%,1.00);
}

.nave{
	width:260px;
	background: #eee;
	position: fixed;
	left: 0;
	top: 120px;
}
.nave ul{width: 100%;height: 100%;}
.nave ul li{
	width: 100%;
	text-align: center;
	cursor: pointer;
	transition: all 1s;
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	-ms-transition: all 1s;
	-o-transition: all 1s;
}
.nave ul li:nth-child(even){
	background: #fff;
}
.nave ul li:nth-child(1).current{
	background: #fa2828;
}
.nave ul li:nth-child(2).current{
	background: #333645;
}
.nave ul li:nth-child(3).current{
	background: #76d241;
}
.nave ul li:nth-child(4).current{
	background: #3bb600;
}
.nave ul li:nth-child(5).current{
	background: #ff4326;
}
.nave ul li:nth-child(6).current{
	background: #3766b4;
}
.nave ul li:nth-child(7).current{
	background: #4b96e7;
}


.main_box{
	width: 100%;
	height: 100%;
	background: pink;
	padding: 120px 0 0 260px;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
}

.main_box>div{
	width: 100%;
}
.page1{
	background: #f43737;
}
.page2{
	background: #474a57;
}
.page3{
	background: #e4af05;
}
.page4{
	background: #7cd454;
}
.page5{
	background: #3db416;
}
.page6{
	background: #4472bb;
}
.page7{
	background: #4993e6;
}

.fotter{
	width: 100%;
	height: 200px;
	background: pink;
}