@-webkit-keyframes upIn{
	0%{opacity:0; -webkit-transform:translate3d(0,-30px,0);}
	100%{opacity:1; -webkit-transform:translate3d(0,0,0);}
}
@-moz-keyframes upIn{
	0%{opacity:0; -moz-transform:translate3d(0,-30px,0);}
	100%{opacity:1; -moz-transform:translate3d(0,0,0);}
}
@keyframes upIn{
	0%{opacity:0; transform:translate3d(0,-30px,0);}
	100%{opacity:1; transform:translate3d(0,0,0);}
}



@-webkit-keyframes downIn{
	0%{opacity:0; -webkit-transform:translate3d(0,30px,0);}
	100%{opacity:1; -webkit-transform:translate3d(0,0,0);}
}
@-moz-keyframes downIn{
	0%{opacity:0; -moz-transform:translate3d(0,30px,0);}
	100%{opacity:1; -moz-transform:translate3d(0,0,0);}
}
@keyframes downIn{
	0%{opacity:0; transform:translate3d(0,30px,0);}
	100%{opacity:1; transform:translate3d(0,0,0);}
}



@-webkit-keyframes leftIn{
	0%{opacity:0; -webkit-transform:translate3d(-30px,0,0);}
	100%{opacity:1; -webkit-transform:translate3d(0,0,0);}
}
@-moz-keyframes leftIn{
	0%{opacity:0; -moz-transform:translate3d(-30px,0,0);}
	100%{opacity:1; -moz-transform:translate3d(0,0,0);}
}
@keyframes leftIn{
	0%{opacity:0; transform:translate3d(-30px,0,0);}
	100%{opacity:1; transform:translate3d(0,0,0);}
}



@-webkit-keyframes rightIn{
	0%{opacity:0; -webkit-transform:translate3d(30px,0,0);}
	100%{opacity:1; -webkit-transform:translate3d(0,0,0);}
}
@-moz-keyframes rightIn{
	0%{opacity:0; -moz-transform:translate3d(30px,0,0);}
	100%{opacity:1; -moz-transform:translate3d(0,0,0);}
}
@keyframes rightIn{
	0%{opacity:0; transform:translate3d(30px,0,0);}
	100%{opacity:1; transform:translate3d(0,0,0);}
}



@-webkit-keyframes fadeIn{
	0%{opacity:0;}
	100%{opacity:1;}
}
@-moz-keyframes fadeIn{
	0%{opacity:0;}
	100%{opacity:1;}
}
@keyframes fadeIn{
	0%{opacity:0;}
	100%{opacity:1;}
}

@-webkit-keyframes fadeOut{
	0%{opacity:1;}
	100%{opacity:0;}
}
@-moz-keyframes fadeOut{
	0%{opacity:1;}
	100%{opacity:0;}
}
@keyframes fadeOut{
	0%{opacity:1;}
	100%{opacity:0;}
}


@-webkit-keyframes bounceIn {
  0% {opacity:0; -webkit-transform:scale3d(.3, .3, .3); transform:scale3d(.3, .3, .3);}
  60% {opacity:1; -webkit-transform:scale3d(1.03, 1.03, 1.03); transform:scale3d(1.03, 1.03, 1.03);}
  80% {-webkit-transform:scale3d(.97, .97, .97); transform:scale3d(.97, .97, .97);}
  100% {opacity:1; -webkit-transform:scale3d(1, 1, 1); transform:scale3d(1, 1, 1);}
}
@-moz-keyframes bounceIn {
  0% {opacity:0; -moz-transform:scale3d(.3, .3, .3); transform:scale3d(.3, .3, .3);}
  60% {opacity:1; -moz-transform:scale3d(1.03, 1.03, 1.03); transform:scale3d(1.03, 1.03, 1.03);}
  80% {-moz-transform:scale3d(.97, .97, .97); transform:scale3d(.97, .97, .97);}
  100% {opacity:1; -moz-transform:scale3d(1, 1, 1); transform:scale3d(1, 1, 1);}
}
@keyframes bounceIn {
  0% {opacity:0; transform:scale3d(.3, .3, .3);}
  60% {opacity:1; transform:scale3d(1.03, 1.03, 1.03);}
  80% {transform:scale3d(.97, .97, .97);}
  100% {opacity:1; transform:scale3d(1, 1, 1);}
}


@-webkit-keyframes titleIn{
	0%{opacity:0; -webkit-transform:scale(8);}
	70%{opacity:1; -webkit-transform:scale(0.9);}
	80%{-webkit-transform:translateX(10px) scale(1);}
	85%{-webkit-transform:translateX(-10px);}
	90%{-webkit-transform:translateX(5px);}
	95%{-webkit-transform:translateX(-5px);}
	100%{-webkit-transform:translateX(0);}
}
@-moz-keyframes titleIn{
	0%{opacity:0; -moz-transform:scale(8);}
	70%{opacity:1; -moz-transform:scale(0.8);}
	80%{-moz-transform:translateX(10px) scale(1);}
	85%{-moz-transform:translateX(-10px);}
	90%{-moz-transform:translateX(5px);}
	95%{-moz-transform:translateX(-5px);}
	100%{-moz-transform:translateX(0);}
}
@keyframes titleIn{
	0%{opacity:0; transform:scale(8);}
	70%{opacity:1; transform:scale(0.8);}
	80%{transform:translateX(10px) scale(1);}
	85%{transform:translateX(-10px);}
	90%{transform:translateX(5px);}
	95%{transform:translateX(-5px);}
	100%{transform:translateX(0);}
}



html,body{width:100%; height:100%; overflow:hidden;}
#full_screen{position:absolute; top:0; left:0; width:100%; height:100%;}
.pages{position:relative; width:100%; height:100%; overflow:hidden;}



#indicator{position:absolute; top:200px; right:5%; width:14px; z-index:10;}
#indicator li{position:relative; width:14px; height:14px; margin:10px 0; cursor:pointer;}
#indicator li i{position:absolute; top:0; right:0; width:10px; height:10px; border:2px solid #fff; border-radius:50%; -webkit-transform:scale(0); -moz-transform:scale(0); transform:scale(0); -webkit-transition:0.3s; -moz-transition:0.3s; transition:0.3s;}
#indicator li b{position:absolute; top:2px; right:2px; width:10px; height:10px; background:#fff; border-radius:50%; -webkit-transform:scale(1); -moz-transform:scale(1); transform:scale(1); -webkit-transition:0.3s; -moz-transition:0.3s; transition:0.3s;}
#indicator li span{display:none; position:absolute; top:-4px; right:22px; width:80px; height:20px; border-radius:3px; background:#fff; background:rgba(255,255,255,0.6) color:#000; line-height:20px; font-size:12px; text-align:center; -webkit-animation:fadeIn 1s 0.1s both; -moz-animation:fadeIn 1s 0.1s both; animation:fadeIn 1s 0.1s both;}

#indicator li.act i{-webkit-transform:scale(1); -moz-transform:scale(1); transform:scale(1);}
#indicator li.act b{-webkit-transform:scale(0); -moz-transform:scale(0); transform:scale(0);}
/*#indicator li.act span{display:block;}*/




@-webkit-keyframes holeIn{
	0%{width:0; height:0; margin:0 0 0 0;}
	100%{width:343px; height:449px; margin:-225px 0 0 -172px;}
}
@-moz-keyframes holeIn{
	0%{width:0; height:0; margin:0 0 0 0;}
	100%{width:343px; height:449px; margin:-225px 0 0 -172px;}
}
@keyframes holeIn{
	0%{width:0; height:0; margin:0 0 0 0;}
	100%{width:343px; height:449px; margin:-225px 0 0 -172px;}
}

@-webkit-keyframes handIn{
	0%{-webkit-transform:translate3d(-100%,-100%,0);}
	100%{-webkit-transform:translate3d(0,0,0);}
}
@-moz-keyframes handIn{
	0%{-moz-transform:translate3d(-100%,-100%,0);}
	100%{-moz-transform:translate3d(0,0,0);}
}
@keyframes handIn{
	0%{transform:translate3d(-100%,-100%,0);}
	100%{transform:translate3d(0,0,0);}
}


.slogan{position:absolute; top:20%; left:50%; width:400px; margin-left:-580px;}
.slogan p{position:relative; padding:60px 0 35px; color:#fff; font-size:17px;}
.slogan p:after{content:''; position:absolute; bottom:0; left:0; width:58px; height:2px; background-color:#fff;}


#page01{

	background: url('../img/ys/pg01_bg.jpg')


}
#page01 .main{display:none; position:absolute; top:20%; left:42%; width:344px; height:450px; margin-top:40px;}
#page01 .main .hole{width:343px; height:449px;}
#page01 .main .hole{position:absolute; top:50%; left:50%; width:343px; height:449px; margin:-225px 0 0 -172px; overflow:hidden; -webkit-animation:holeIn 0.8s 0.1s ease both; -moz-animation:holeIn 0.8s 0.1s ease both; animation:holeIn 0.8s 0.1s ease both;}
#page01 .main .hole img{position:absolute; top:50%; left:50%; width:343px; height:449px; margin:-225px 0 0 -172px;}
#page01 .main .hand{position:absolute; top:163px; left:150px; width:247px; height:164px; overflow:hidden;}
#page01 .main:after{content:''; position:absolute; top:160px; left:150px; width:50px; height:80px; background:url(../img/ys/hole_a.png) no-repeat; -webkit-transform:translate3d(0,0,0); -moz-transform:translate3d(0,0,0); transform:translate3d(0,0,0); -webkit-animation:fadeIn 0.1s 0.9s both; -moz-animation:fadeIn 0.1s 0.9s both; animation:fadeIn 0.1s 0.9s both;}
#page01 .main .hand img{position:absolute; top:0; left:0; -webkit-animation:handIn 1.2s 1s both; -moz-animation:handIn 1.2s 1s both; animation:handIn 1.2s 1s both;}
#page01 .main .clh{position:absolute; top:50px; left:378px; width:569px; height:570px; background:url(../img/ys/p1_clh.png) no-repeat; -webkit-animation:rightIn 1s 2.1s both; -moz-animation:rightIn 1s 2.1s both; animation:rightIn 1s 2.1s both;}

#page01 .main .client01{position:absolute; top:328px; left:-116px; width:195px; height:23px; background:url(../img/ys/p1_client01.png) no-repeat; -webkit-animation:bounceIn 0.6s 2.4s both; -moz-animation:bounceIn 0.6s 2.4s both; animation:bounceIn 0.6s 2.4s both;}
#page01 .main .client02{position:absolute; top:137px; left:-136px; width:115px; height:67px; background:url(../img/ys/p1_client02.png) no-repeat; -webkit-animation:bounceIn 0.6s 2.6s both; -moz-animation:bounceIn 0.6s 2.6s both; animation:bounceIn 0.6s 2.6s both;}
#page01 .main .client03{position:absolute; top:18px; left:-91px; width:130px; height:83px; background:url(../img/ys/p1_client03.png) no-repeat; -webkit-animation:bounceIn 0.6s 2.8s both; -moz-animation:bounceIn 0.6s 2.8s both; animation:bounceIn 0.6s 2.8s both;}
#page01 .main .client04{position:absolute; top:-71px; left:116px; width:144px; height:61px; background:url(../img/ys/p1_client04.png) no-repeat; -webkit-animation:bounceIn 0.6s 3s both; -moz-animation:bounceIn 0.6s 3s both; animation:bounceIn 0.6s 3s both;}
#page01 .main .client05{position:absolute; top:0; left:321px; width:105px; height:82px; background:url(../img/ys/p1_client05.png) no-repeat; -webkit-animation:bounceIn 0.6s 3.2s both; -moz-animation:bounceIn 0.6s 3.2s both; animation:bounceIn 0.6s 3.2s both;}
#page01 .main .client06{position:absolute; top:161px; left:310px; width:159px; height:70px; background:url(../img/ys/p1_client06.png) no-repeat; -webkit-animation:bounceIn 0.6s 3.4s both; -moz-animation:bounceIn 0.6s 3.4s both; animation:bounceIn 0.6s 3.4s both;}

#page01 .slogan h1{width:354px; height:134px; margin-bottom:45px; text-indent:-9999px; background:url(../img/ys/p1_title.png) no-repeat; overflow:hidden; -webkit-animation:fadeIn 1s 4s both;  -moz-animation:fadeIn 1s 4s both; animation:fadeIn 1s 4s both;}
#page01 .slogan .a1{width: 80%;-webkit-animation:leftIn 1s 4.5s both; -moz-animation:leftIn 1s 4.5s both; animation:leftIn 1s 4.5s both;}
#page01 .slogan .a2{width: 60%;-webkit-animation:leftIn 1s 4.7s both; -moz-animation:leftIn 1s 4.7s both; animation:leftIn 1s 4.7s both;}
#page01 .slogan p{-webkit-animation:downIn 1s 5.3s both; -moz-animation:downIn 1s 5.3s both; animation:downIn 1s 5.3s both;}

#page01.animated .main{display:block;}




@-webkit-keyframes cloud{
	0%{opacity:0; -webkit-transform:translate3d(100px,0,0);}
	25%{opacity:0.5;}
	49%{opacity:0; -webkit-transform:translate3d(0,0,0);}
	56%{opacity:0; -webkit-transform:translate3d(80px,-50px,0);}
	75%{opacity:0.45;}
	100%{opacity:0; -webkit-transform:translate3d(-90px,-50px,0);}
}
@-moz-keyframes cloud{
	0%{opacity:0; -moz-transform:translate3d(100px,0,0);}
	25%{opacity:0.5;}
	49%{opacity:0; -moz-transform:translate3d(0,0,0);}
	56%{opacity:0; -moz-transform:translate3d(80px,-50px,0);}
	75%{opacity:0.45;}
	100%{opacity:0; -moz-transform:translate3d(-90px,-50px,0);}
}
@keyframes cloud{
	0%{opacity:0; transform:translate3d(100px,0,0);}
	25%{opacity:0.5;}
	49%{opacity:0; transform:translate3d(0,0,0);}
	56%{opacity:0; transform:translate3d(80px,-50px,0);}
	75%{opacity:0.45;}
	100%{opacity:0; transform:translate3d(-90px,-50px,0);}
}

@-webkit-keyframes volcanoIn{
	0%{opacity:0; -webkit-transform:translate3d(0,80px,0);}
	100%{opacity:1; -webkit-transform:translate3d(0,0,0);}
}
@-moz-keyframes volcanoIn{
	0%{opacity:0; -moz-transform:translate3d(0,80px,0);}
	100%{opacity:1; -moz-transform:translate3d(0,0,0);}
}
@keyframes volcanoIn{
	0%{opacity:0; transform:translate3d(0,80px,0);}
	100%{opacity:1; transform:translate3d(0,0,0);}
}



#page02{
	background: url('../img/ys/pg_2bg.jpg') no-repeat center;
	background-size:100% 100%;
	background-color: #131a20;
}
#page02 .volcano{display:none; position:absolute; top:80px; left:24%; z-index:1; height:100%; width:auto; -webkit-animation:volcanoIn 1s 0.1s both; -moz-animation:volcanoIn 1s 0.1s both; animation:volcanoIn 1s 0.1s both;}
#page02 .volcano img{height:70%;}
#page02 .cloud01{position:absolute; top:35%; left:28%; z-index:2; width: 60px; height: auto; -webkit-animation:cloud 16s linear 0.5s infinite both; -moz-animation:cloud 16s linear 0.5s infinite both; animation:cloud 16s linear 0.5s infinite both;}
#page02 .cloud02{position:absolute; top:45%; left:85%; z-index:2; width:46px; height:auto; -webkit-animation:cloud 13s linear 2s infinite both; -moz-animation:cloud 13s linear 2s infinite both; animation:cloud 13s linear 2s infinite both;}
#page02 .cloud03{position:absolute; top:50%; left:92%; width:30px; height:auto; -webkit-animation:cloud 20s linear 5s infinite both; -moz-animation:cloud 20s linear 5s infinite both; animation:cloud 20s linear 5s infinite both;}
#page02 .cloud04{position:absolute; top:30%; left:60%; width:50px; height:auto; -webkit-animation:cloud 25s linear 8s infinite both; -moz-animation:cloud 25s linear 8s infinite both; animation:cloud 25s linear 8s infinite both;}

#page02 .clh{display:none; position:absolute; bottom:-70px; left:50%; z-index:3; width:483px; height:626px; margin-left:-52px; -webkit-animation:downIn 1s 0.6s both; -moz-animation:downIn 1s 0.6s both; animation:downIn 1s 0.6s both;}
#page02 img{height: 82%;}
#page02 .slogan{display:none;}
#page02 .slogan h1{width:206px; height:163px; margin-bottom:45px; text-indent:-9999px; background:url(../img/ys/p2_title.png) no-repeat; overflow:hidden; -webkit-animation:fadeIn 1s 1.2s both; -moz-animation:fadeIn 1s 1.2s both; animation:fadeIn 1s 1.2s both;}
#page02 .slogan .a1{-webkit-animation:leftIn 1s 1.7s both; -moz-animation:leftIn 1s 1.7s both; animation:leftIn 1s 1.7s both;}
#page02 .slogan .a2{-webkit-animation:leftIn 1s 1.9s both; -moz-animation:leftIn 1s 1.9s both; animation:leftIn 1s 1.9s both;}
#page02 .slogan p{-webkit-animation:downIn 1s 2.5s both; -moz-animation:downIn 1s 2.5s both; animation:downIn 1s 2.5s both;}

#page02.animated .clh, #page02.animated .volcano, #page02.animated .slogan{display:block;}






#page03{background-color:#979797;}
#page03 .tree{display:none; position:absolute; bottom:160px; left:50%; width:644px; height:auto; margin-left:-30px; -webkit-animation:fadeIn 1s 0.1s both; -moz-animation:fadeIn 1s 0.1s both; animation:fadeIn 1s 0.1s both;}
#page03 .clh{display:none; position:absolute; bottom:0; left:50%; width:531px; height:625px; margin-left:-310px; -webkit-animation:rightIn 1s 0.6s both; -moz-animation:rightIn 1s 0.6s both; animation:rightIn 1s 0.6s both;}

#page03 .tree img{

	width: 100%;
	height: 100%;
}


#page03 .slogan{display:none;}
#page03 .slogan h1{width:236px; height:131px; margin-bottom:45px; text-indent:-9999px; background:url(../img/ys/p3_title.png) no-repeat; overflow:hidden; -webkit-animation:fadeIn 1s 1.4s both; -moz-animation:fadeIn 1s 1.4s both; animation:fadeIn 1s 1.4s both;}
#page03 .slogan .a1{-webkit-animation:leftIn 1s 1.9s both; -moz-animation:leftIn 1s 1.9s both; animation:leftIn 1s 1.9s both;}
#page03 .slogan .a2{-webkit-animation:leftIn 1s 2.1s both; -moz-animation:leftIn 1s 2.1s both; animation:leftIn 1s 2.1s both;}
#page03 .slogan p{-webkit-animation:downIn 1s 2.7s both; -moz-animation:downIn 1s 2.7s both; animation:downIn 1s 2.7s both;}

#page03.animated .clh, #page03.animated .tree, #page03.animated .slogan{display:block;}

#page03 p{color: ;}

@-webkit-keyframes bird{
	0%{opacity:0; -webkit-transform:translate3d(0,0,0) scale(1) rotate(0);}
	25%{-webkit-transform:translate3d(-9px,-3px,0) scale(.75) rotate(10deg);}
	50%{opacity:1; -webkit-transform:translate3d(6px,-6px,0) scale(.5) rotate(-8deg);}
	75%{-webkit-transform:translate3d(-3px,-9px,0) scale(.25) rotate(3deg);}
	100%{-webkit-transform:translate3d(0,-12px,0) scale(0) rotate(0);}
}
@-moz-keyframes bird{
	0%{opacity:0; -moz-transform:translate3d(0,0,0) scale(1) rotate(0);}
	25%{-moz-transform:translate3d(-9px,-3px,0) scale(.75) rotate(10deg);}
	50%{opacity:1; -moz-transform:translate3d(6px,-6px,0) scale(.5) rotate(-8deg);}
	75%{-moz-transform:translate3d(-3px,-9px,0) scale(.25) rotate(3deg);}
	100%{-moz-transform:translate3d(0,-12px,0) scale(0) rotate(0);}
}
@keyframes bird{
	0%{opacity:0; transform:translate3d(0,0,0) scale(1) rotate(0);}
	25%{transform:translate3d(-9px,-3px,0) scale(.75) rotate(10deg);}
	50%{opacity:1; transform:translate3d(6px,-6px,0) scale(.5) rotate(-8deg);}
	75%{transform:translate3d(-3px,-9px,0) scale(.25) rotate(3deg);}
	100%{transform:translate3d(0,-12px,0) scale(0) rotate(0);}
}


#page04{background-color:#4e6d88;}
#page04 .main{display:none; position:absolute; bottom:0; left:50%; margin-left:-430px; width:1000px; height:50px;}
#page04 .main .hill{position:absolute; bottom:330px; left:390px; width:910px; height:173px; -webkit-animation:fadeIn 1s 0.1s both; -moz-animation:fadeIn 1s 0.1s both; animation:fadeIn 1s 0.1s both;}
#page04 .main .hill div{width:910px; height:173px; background:url(../img/ys/p4_hill.png) no-repeat;}
#page04 .main .hill img{ -webkit-transform-origin:50% 0; -moz-transform-origin:50% 0; transform-origin:50% 0;}

#page04 .main .clh{position:absolute; bottom:0; left:0; width:1101px; height:629px; -webkit-animation:downIn 1s 0.8s both; -moz-animation:downIn 1s 0.8s both; animation:downIn 1s 0.8s both;}

#page04 .bird{position:absolute; top:40px; left:230px; -webkit-animation:bird 10s linear 0.6s infinite both; -moz-animation:bird 10s linear 0.6s infinite both; animation:bird 10s linear 0.6s infinite both;}
#page04 .bird1{position:absolute; top:30px; left:210px; -webkit-animation:bird 8s linear 3s infinite both; -moz-animation:bird 8s linear 3s infinite both; animation:bird 8s linear 3s infinite both;}
#page04 .bird2{position:absolute; top:60px; left:150px; -webkit-animation:bird 6s linear 5.5s infinite both; -moz-animation:bird 6s linear 5.5s infinite both; animation:bird 6s linear 5.5s infinite both;}

#page04 .slogan{display:none;}
#page04 .slogan h1{width:215px; height:123px; margin-bottom:45px; text-indent:-9999px; background:url(../img/ys/p4_title.png) no-repeat; overflow:hidden; -webkit-animation:fadeIn 1s 1.5s both; -moz-animation:fadeIn 1s 1.5s both; animation:fadeIn 1s 1.5s both;}
#page04 .slogan .a1{-webkit-animation:leftIn 1s 2s both; -moz-animation:leftIn 1s 2s both; animation:leftIn 1s 2s both;}
#page04 .slogan .a2{-webkit-animation:leftIn 1s 2.2s both; -moz-animation:leftIn 1s 2.2s both; animation:leftIn 1s 2.2s both;}
#page04 .slogan p{-webkit-animation:downIn 1s 2.8s both; -moz-animation:downIn 1s 2.8s both; animation:downIn 1s 2.8s both;}

#page04.animated .main, #page04.animated .slogan{display:block;}



@-webkit-keyframes lineWidth{
	0%{width:0;}
	100%{width:100%;}
}
@-moz-keyframes lineWidth{
	0%{width:0;}
	100%{width:100%;}
}
@keyframes lineWidth{
	0%{width:0;}
	100%{width:100%;}
}

#page05{background-color:#373248;  background-position:center center; background-repeat:no-repeat;}
#page05 b{display:none; position:absolute; top:0; left:-10%; width:120%; height:100%; background:url(../img/ys/p5_bg.jpg) no-repeat center center; background-size:cover; -webkit-animation:fadeIn 1s 0.1s both; -moz-animation:fadeIn 1s 0.1s both; animation:fadeIn 1s 0.1s both;}
#page05 .main{display:none; position:absolute; top:20%; left:50%; width:700px; margin-left:-350px;}
#page05 .main img{display:block; margin:auto; -webkit-animation:downIn 1s 0.1s both; -moz-animation:downIn 1s 0.1s both; animation:downIn 1s 0.1s both;}
#page05 .main a{position:relative; display:block; width:210px; height:50px; margin:80px auto 0; *border-top:1px solid #fff; *border-bottom:1px solid #fff; line-height:50px; text-align:center; color:#fff; box-shadow:0 0 20px 5px rgba(0,0,0,0); -webkit-transition:0.3s; -moz-transition:0.3s; transition:0.3s; -webkit-animation:fadeIn 1s 0.7s both; -moz-animation:fadeIn 1s 0.7s both; animation:fadeIn 1s 0.7s both;}
#page05 .main a:before, #page05 .main a:after{content:''; position:absolute; width:100%; height:1px; background:#fff; -webkit-animation:lineWidth 0.6s 1.6s both; -moz-animation:lineWidth 0.6s 1.6s both; animation:lineWidth 0.6s 1.6s both;}
#page05 .main a:before{top:0; left:0;}
#page05 .main a:after{right:0; bottom:0;}
#page05 .main a:hover{background:#fff; color:#000; box-shadow:0 0 20px 5px rgba(0,0,0,0.2);}


#page05.animated .main, #page05.animated b{display:block;}



