#wrapper{ 
	width: 100%;
	background: url(../images/bg.jpg) no-repeat;
	background-position: 0px -340px; }



/*导航开始*/
#wrapper .homePage{ 
	width: 100%; }
.homePage_top{ 
	width: 100%;
	height: 50px;
	background: #DFD8C6; }
.homePage_top a{ 
	display: block;
	width: 100px;
	color: #b06262;
	line-height: 50px;
	text-align: center; }
.homePage_top a:hover{ 
	color: #fff;
	background: #d88e6f; }

/*导航右边的联系方式*/
.top-right{ 
	position: absolute;
	right: 0;
	top: 0;
	width: 300px;
	text-align: center; }
.top-right a{ 
	font-size: 14px; }
.top-right a:hover{ 
	font-size: 20px;
	background: #d88e6f; }


 #wrapper .toTop{
	position: fixed; 
	right: 0;
	bottom: 50%;
	z-index: 100;
	text-align: center;}
.toTop a{ 
	display: block;
	width: 34px;
	line-height: 34px;
	margin-bottom: 5px;
	background: rgba(255,255,255,0.3);
	border-radius: 17px;
	font-size: 10px; }
.toTop a:hover,
.toTop a.current{ 
	color: #fff;
	background: #6c5151;}



/*首页开始*/
.homePage_content{	
	width: 350px;
	text-align: center;
	margin: 250px 0;
	margin-left: 800px;
	overflow: hidden; }
.homePage_content h1{	
	line-height: 70px;
	margin-bottom: 20px; }
.homePage_content p.me{ 
	width: 80px;
	line-height: 30px;
	text-align: center;
	background: #ccc;
	border: 1px solid #D1A8A8;
	margin: 20px auto 0;
	cursor: pointer; }
.homePage_content .me:hover{ 
	background: #d88e6f; }


#left,
#right{ 
	display: block;
	width: 350px;
	height: 2px;
	background: #bc9e9e;
	-webkit-transition: margin-left 1s linear;
	-moz-transition: margin-left 1s linear;
	-ms-transition: margin-left 1s linear;
	-o-transition: margin-left 1s linear;
	transition: margin-left 1s linear;
	 }
#left{ 
	margin-left: -350px; }
#right{ 
	margin-left: 350px; }



/*主体内容开始*/
#wrapper .mainBody{ 
	width: 100%; }


.mainBody .page1,
.mainBody .page2,
.mainBody .page3{
	position: relative; 
	width: 100%;
	height: 400px;
	opacity: 0.5;
	overflow: hidden; }


.mainBody .page1{ 
	 background: #CFC4B2;}
.mainBody .page1 .mypic{
	width: 300px; 
	margin-left: -10px;
	overflow: hidden; }
.mainBody .page1 .introduce{ 	
	 position: absolute;
	 top: 70px;
	 right: 100px;
	 width: 500px; }
.mainBody .page1 .introduce p{ 
	margin-left: 800px;
	-webkit-transition: all 1s linear; }


.mainBody .page1:hover p{ 
	margin-left: 0; }
.mainBody .page1:hover p:nth-of-type(1){ 
	-webkit-transition-delay: 0.2s; }
.mainBody .page1:hover p:nth-of-type(2){ 
	-webkit-transition-delay: 0.4s; }
.mainBody .page1:hover p:nth-of-type(3){ 
	-webkit-transition-delay: 0.6s; }
.mainBody .page1:hover p:nth-of-type(4){ 
	-webkit-transition-delay: 0.8s; }
.mainBody .page1:hover p:nth-of-type(5){ 
	-webkit-transition-delay: 1s; }



.mainBody .page2{ 
	background: #F2ECDC; }
.mainBody .page2 .myschool{
	width: 560px;
	position: absolute;
	top: 0;
	right: 0;
	overflow: hidden; }
.mainBody .page2 .myschool img{ 
	display: block;
	margin-left: -310px; }
.mainBody .page2 .study{ 
	width: 400px;
	margin-top: 30px;
	margin-left: 20px; }
.mainBody .page2 .study h2{ 
	margin-left: -200px; }

.mainBody .page2 .study p{ 
	margin-top: 350px;
	-webkit-transition: all 1s linear; }


.mainBody .page2:hover p{ 
	margin-top: 0; }
.mainBody .page2:hover p:nth-of-type(1){ 
	-webkit-transition-delay: 0.02s; }
.mainBody .page2:hover p:nth-of-type(2){ 
	-webkit-transition-delay: 0.2s; }
.mainBody .page2:hover p:nth-of-type(3){ 
	-webkit-transition-delay: 0.4s; }
.mainBody .page2:hover p:nth-of-type(4){ 
	-webkit-transition-delay: 0.6s; }
.mainBody .page2:hover p:nth-of-type(5){ 
	-webkit-transition-delay: 0.8s; }
.mainBody .page2:hover p:nth-of-type(6){ 
	-webkit-transition-delay: 1s; }


.mainBody .page3{
height: 500px;	
	background: #CFC4B2; }
.mainBody .page3 .skill{ 
	position: absolute;
	top: 20px;
	right: 100px;
	width: 500px;
	padding:20px;
	font-size: 14px;
	text-indent: 2em;}
.mainBody .page3 .skill h2{ 
	line-height: 0px; }
.mainBody .page3 .myweb{
	width: 560px;
	overflow: hidden; }
.mainBody .page3 .myweb img{ 
	display: block;
	margin-top: 50px;
	margin-left: -906px; }

.mainBody .page3 .skill p{ 
	margin-top: 350px;
	-webkit-transition: all 1s linear; }


.mainBody .page3:hover p{ 
	margin-top: 0; }
.mainBody .page3:hover p:nth-of-type(1){ 
	-webkit-transition-delay: 0.02s; }
.mainBody .page3:hover p:nth-of-type(2){ 
	-webkit-transition-delay: 0.2s; }
.mainBody .page3:hover p:nth-of-type(3){ 
	-webkit-transition-delay: 0.4s; }
.mainBody .page3:hover p:nth-of-type(4){ 
	-webkit-transition-delay: 0.6s; }
.mainBody .page3:hover p:nth-of-type(5){ 
	-webkit-transition-delay: 0.8s; }
.mainBody .page3:hover p:nth-of-type(6){ 
	-webkit-transition-delay: 1s; }