@charset "utf-8";
/* CSS Document */

/******************************** move from / to  ******************************/
 
.pt-page-moveToLeft {
	-webkit-animation: moveToLeft .3s linear both;
	animation: moveToLeft .3s linear both;
}

.pt-page-moveFromLeft {
	-webkit-animation: moveFromLeft .3s linear both;
	animation: moveFromLeft .3s linear both;
}

.pt-page-moveToRight {
	-webkit-animation: moveToRight .3s linear both;
	animation: moveToRight .3s linear both;
}

.pt-page-moveFromRight {
	-webkit-animation: moveFromRight .3s linear both;
	animation: moveFromRight .3s linear both;
}

.pt-page-moveToTop {
	-webkit-animation: moveToTop .3s linear both;
	animation: moveToTop .3s linear both;
}

.pt-page-moveFromTop {
	-webkit-animation: moveFromTop .3s linear both;
	animation: moveFromTop .3s linear both;
}

.pt-page-moveToBottom {
	-webkit-animation: moveToBottom .3s linear both;
	animation: moveToBottom .3s linear both;
}

.pt-page-moveFromBottom {
	-webkit-animation: moveFromBottom .3s linear both;
	animation: moveFromBottom .3s linear both;
}

@-webkit-keyframes moveToLeft {
	from { }
	to { -webkit-transform: translateX(-100%); }
}
@keyframes moveToLeft {
	from { }
	to { -webkit-transform: translateX(-100%); transform: translateX(-100%); }
}

@-webkit-keyframes moveFromLeft {
	from { -webkit-transform: translateX(-100%); }
}
@keyframes moveFromLeft {
	from { -webkit-transform: translateX(-100%); transform: translateX(-100%); }
}

@-webkit-keyframes moveToRight { 
	from { }
	to { -webkit-transform: translateX(100%); }
}
@keyframes moveToRight { 
	from { }
	to { -webkit-transform: translateX(100%); transform: translateX(100%); }
}

@-webkit-keyframes moveFromRight {

	from { -webkit-transform: translateX(100%); }
}
@keyframes moveFromRight {
	from { -webkit-transform: translateX(100%); transform: translateX(100%); }
}

@-webkit-keyframes moveToTop {
	from { }
	to { -webkit-transform: translateY(-100%); }
}
@keyframes moveToTop {
	from { }
	to { -webkit-transform: translateY(-100%); transform: translateY(-100%); }
}

@-webkit-keyframes moveFromTop {
	from { -webkit-transform: translateY(-100%); }
}
@keyframes moveFromTop {
	from { -webkit-transform: translateY(-100%); transform: translateY(-100%); }
}

@-webkit-keyframes moveToBottom {
	from { }
	to { -webkit-transform: translateY(100%); }
}
@keyframes moveToBottom {
	from { }
	to { -webkit-transform: translateY(100%); transform: translateY(100%); }
}

@-webkit-keyframes moveFromBottom {
	from { -webkit-transform: translateY(100%); }
}
@keyframes moveFromBottom {
	from { -webkit-transform: translateY(100%); transform: translateY(100%); }
}
/******************************** move from / to  ******************************/


/**************************Sliding Entrances**************************/
@-webkit-keyframes slideOutUp {
0% {
opacity:0;
-webkit-transform:none;
transform:none
}
100% {
opacity:1;
-webkit-transform:translate3d(0, -30%, 0);
transform:translate3d(0, -30%, 0)
}
}

@keyframes slideOutUp {
0% {
opacity:0;
-webkit-transform:none;
-ms-transform:none;
transform:none
}
100% {
opacity:1;
-webkit-transform:translate3d(0, -30%, 0);
transform:translate3d(0, -30%, 0)
}
}

.slideOutUp {
  -webkit-animation-name: slideOutUp;
  animation-name: slideOutUp;
}

@-webkit-keyframes slideOutDown {
0% {
opacity:0;
-webkit-transform:none;
transform:none
}
100% {
opacity:1;
-webkit-transform:translate3d(0, 30%, 0);
transform:translate3d(0, 30%, 0)
}
}

@keyframes slideOutDown {
0% {
opacity:0;
-webkit-transform:none;
-ms-transform:none;
transform:none
}
100% {
opacity:1;
-webkit-transform:translate3d(0, 30%, 0);
transform:translate3d(0, 30%, 0)
}
}

.slideOutDown {
  -webkit-animation-name: slideOutDown;
  animation-name: slideOutDown;
}

@-webkit-keyframes slideOutLeft {
0% {
opacity:0;
-webkit-transform:none;
transform:none
}
100% {
opacity:1;
-webkit-transform:translate3d(-30%, 0, 0);
transform:translate3d(-30%, 0, 0);
}
}

@keyframes slideOutLeft {
0% {
opacity:0;
-webkit-transform:none;
-ms-transform:none;
transform:none
}
100% {
opacity:1;
-webkit-transform:translate3d(-30%, 0, 0);
transform:translate3d(-30%, 0, 0);
}
}

.slideOutLeft {
  -webkit-animation-name: slideOutLeft;
  animation-name: slideOutLeft;
}

@-webkit-keyframes slideOutRight {
0% {
opacity:0;
-webkit-transform:none;
transform:none
}
100% {
opacity:1;
-webkit-transform:translate3d(30%, 0, 0);
transform:translate3d(30%, 0, 0);
}
}

@keyframes slideOutRight {
0% {
opacity:0;
-webkit-transform:none;
-ms-transform:none;
transform:none
}
100% {
opacity:1;
-webkit-transform:translate3d(30%, 0, 0);
transform:translate3d(30%, 0, 0);
}
}

.slideOutRight {
  -webkit-animation-name: slideOutRight;
  animation-name: slideOutRight;
}
/*************************Sliding Entrances******************************/


/*************************Button******************************/
@-webkit-keyframes heartBeat {
0% {
opacity:0.7;
-webkit-transform:scale(1,1);
transform:scale(1,1);
}
50% {
opacity:1;
-webkit-transform:scale(1.05,1.05);
transform:scale(1.05,1.05);
}
100% {
opacity:0.7;
-webkit-transform:scale(1,1);
transform:scale(1,1);
}
}
@keyframes heartBeat {
0% {
	opacity:0.7;
	-webkit-transform:scale(1,1);
	-ms-transform:scale(1,1);
	transform:scale(1,1);
}
50% {
	opacity:1;
	-webkit-transform:scale(1.05,1.05);
	-ms-transform:scale(1.05,1.05);
	transform:scale(1.05,1.05);
}
100% {
	opacity:0.7;
	-webkit-transform:scale(1,1);
	-ms-transform:scale(1,1);
	transform:scale(1,1);
}
}
.heartBeat {
	-webkit-animation-name: heartBeat;
	animation-name: heartBeat;
	animation-duration:1.5s; 
	animation-delay:0.5s;
	animation-fill-mode: both;
	animation-iteration-count:infinite;
	-webkit-animation-duration:1.5s; 
	-webkit-animation-delay:0.5s;
	-webkit-animation-fill-mode: both;
	-webkit-animation-iteration-count:infinite;
}

@-webkit-keyframes climbUp {
0% {
opacity:0;
-webkit-transform:none;
transform:none
}
100% {
opacity:1;
-webkit-transform:translate3d(0, -30%, 0);
transform:translate3d(0, -30%, 0)
}
}
@keyframes climbUp {
0% {
opacity:0;
-webkit-transform:none;
-ms-transform:none;
transform:none
}
100% {
opacity:1;
-webkit-transform:translate3d(0, -30%, 0);
transform:translate3d(0, -30%, 0)
}
}
.climbUp {
	-webkit-animation-name: climbUp;
	animation-name: climbUp;
	animation-duration:1.5s; 
	animation-delay:0.5s;
	animation-fill-mode: both;
	animation-iteration-count:infinite;
	-webkit-animation-duration:1.5s; 
	-webkit-animation-delay:0.5s;
	-webkit-animation-fill-mode: both;
	-webkit-animation-iteration-count:infinite;
}

@-webkit-keyframes blinkFade {
0% {
opacity:0;
-webkit-transform:translate3d(0, 2%, 0);
transform:translate3d(0, 2%, 0)
}
100% {
opacity:1;
-webkit-transform:none;
transform:none
}
}
@keyframes blinkFade {
0% {
opacity:0;
-webkit-transform:translate3d(0, 2%, 0);
-ms-transform:translate3d(0, 2%, 0);
transform:translate3d(0, 2%, 0)
}
100% {
opacity:1;
-webkit-transform:none;
-ms-transform:none;
transform:none
}
}
.blinkFade {
	-webkit-animation-name: blinkFade;
	animation-name: blinkFade;
	-webkit-animation-duration: 1.2s;
	 animation-duration: 1.2s;
	 -webkit-animation-fill-mode: both;
	 animation-fill-mode: both;
	 -webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite
}

@-webkit-keyframes goUp {
	0% { -webkit-transform: translateY(100%); opacity:0;}
	50% { -webkit-transform: translateY(0%); opacity:1;}
	100% { -webkit-transform: translateY(-100%); opacity:0;}
}
@keyframes goUp {
	0% { -webkit-transform: translateY(100%); transform: translateY(100%); opacity:0;}
	50% { -webkit-transform: translateY(0%); transform: translateY(0%); opacity:1;}
	100% { -webkit-transform: translateY(-100%); transform: translateY(-100%); opacity:0;}
}
.goUp {
	-webkit-animation: goUp ease 1.5s both infinite;
	animation: goUp ease 1.5s both infinite;
}

@-webkit-keyframes swingLeft-Right {
	0%{-webkit-transform:translateX(0px);transform:translateX(0px)}
	25%{-webkit-transform:translateX(10px);transform:translateX(10px)}
	50%{-webkit-transform:translateX(0px);transform:translateX(0px)}
	75%{-webkit-transform:translateX(-10px);transform:translateX(-10px)}
	100%{-webkit-transform:translateX(0px);transform:translateX(0px)}
}
@keyframes swingLeft-Right {
	0%{-webkit-transform:translateX(0px);transform:translateX(0px)}
	25%{-webkit-transform:translateX(10px);transform:translateX(10px)}
	50%{-webkit-transform:translateX(0px);transform:translateX(0px)}
	75%{-webkit-transform:translateX(-10px);transform:translateX(-10px)}
	100%{-webkit-transform:translateX(0px);transform:translateX(0px)}
}
.swingLeft-Right {
	-webkit-animation: swingLeft-Right 3s linear infinite;
	animation: swingLeft-Right 3s linear infinite;}

@-webkit-keyframes swingTop-Bottom {
	0%{-webkit-transform:translateY(0px);transform:translateY(0px)}
	25%{-webkit-transform:translateY(10px);transform:translateY(10px)}
	50%{-webkit-transform:translateY(0px);transform:translateY(0px)}
	75%{-webkit-transform:translateY(-10px);transform:translateY(-10px)}
	100%{-webkit-transform:translateY(0px);transform:translateY(0px)}
}
@keyframes swingTop-Bottom {
	0%{-webkit-transform:translateY(0px);transform:translateY(0px)}
	25%{-webkit-transform:translateY(10px);transform:translateY(10px)}
	50%{-webkit-transform:translateY(0px);transform:translateY(0px)}
	75%{-webkit-transform:translateY(-10px);transform:translateY(-10px)}
	100%{-webkit-transform:translateY(0px);transform:translateY(0px)}
}
.swingTop-Bottom {
	-webkit-animation: swingTop-Bottom 4.2s linear infinite;
	animation: swingTop-Bottom 4.2s linear infinite;
}

@-webkit-keyframes roolPositive {
		0% { -webkit-transform:rotate(0deg);transform: rotate(0deg);}
		100% {-webkit-transform:rotate(360deg); transform: rotate(360deg);}
	}
@keyframes roolPositive {
		0% { -webkit-transform:rotate(0deg);transform: rotate(0deg);}
		100% {-webkit-transform:rotate(360deg); transform: rotate(360deg);}
}
.roolPositive {
	-webkit-animation:roolPositive linear infinite;
	animation:roolPositive linear infinite;
	-webkit-animation-duration: 8s;
	animation-duration: 8s;
}
@-webkit-keyframes roolInverse {
		0% { -webkit-transform:rotate(0deg);transform: rotate(0deg);}
		100% {-webkit-transform:rotate(-360deg); transform: rotate(-360deg);}
	}
@keyframes roolInverse {
		0% { -webkit-transform:rotate(0deg);transform: rotate(0deg);}
		100% {-webkit-transform:rotate(-360deg); transform: rotate(-360deg);}
}
.roolInverse {
	-webkit-animation:roolInverse linear infinite;
	animation:roolInverse linear infinite;
	-webkit-animation-duration: 8s;
	animation-duration: 8s;
}
@-webkit-keyframes roolClock {
		0% { -webkit-transform:rotate(0deg);transform: rotate(0deg);}
		4% { -webkit-transform:rotate(-30deg);transform: rotate(-30deg);}
		8% { -webkit-transform:rotate(-30deg);transform: rotate(-30deg);}
		12% { -webkit-transform:rotate(-60deg);transform: rotate(-60deg);}
		16% { -webkit-transform:rotate(-60deg);transform: rotate(-60deg);}
		20% { -webkit-transform:rotate(-90deg);transform: rotate(-90deg);}
		24% { -webkit-transform:rotate(-90deg);transform: rotate(-90deg);}
		28% { -webkit-transform:rotate(-120deg);transform: rotate(-120deg);}
		32% { -webkit-transform:rotate(-120deg);transform: rotate(-120deg);}
		36% { -webkit-transform:rotate(-150deg);transform: rotate(-150deg);}
		40% { -webkit-transform:rotate(-150deg);transform: rotate(-150deg);}
		44% { -webkit-transform:rotate(-180deg);transform: rotate(-180deg);}
		48% { -webkit-transform:rotate(-180deg);transform: rotate(-180deg);}
		52% { -webkit-transform:rotate(-210deg);transform: rotate(-210deg);}
		56% { -webkit-transform:rotate(-210deg);transform: rotate(-210deg);}
		60% { -webkit-transform:rotate(-240deg);transform: rotate(-240deg);}
		64% { -webkit-transform:rotate(-240deg);transform: rotate(-240deg);}
		68% { -webkit-transform:rotate(-270deg);transform: rotate(-270deg);}
		72% { -webkit-transform:rotate(-270deg);transform: rotate(-270deg);}
		76% { -webkit-transform:rotate(-300deg);transform: rotate(-300deg);}
		80% { -webkit-transform:rotate(-300deg);transform: rotate(-300deg);}
		84% { -webkit-transform:rotate(-330deg);transform: rotate(-330deg);}
		88% { -webkit-transform:rotate(-330deg);transform: rotate(-330deg);}
		92% { -webkit-transform:rotate(-360deg);transform: rotate(-360deg);}
		96% { -webkit-transform:rotate(-360deg);transform: rotate(-360deg);}
		100% { -webkit-transform:rotate(-360deg);transform: rotate(-360deg);}

}
@keyframes roolClock {
		0% { -webkit-transform:rotate(0deg);transform: rotate(0deg);}
		12.5% {-webkit-transform:rotate(90deg); transform: rotate(90deg);}
		25% { -webkit-transform:rotate(90deg);transform: rotate(90deg);}
		37.5% { -webkit-transform:rotate(180deg);transform: rotate(180deg);}
		50% { -webkit-transform:rotate(180deg);transform: rotate(180deg);}
		62.5% { -webkit-transform:rotate(270deg);transform: rotate(270deg);}
		75% {-webkit-transform:rotate(270deg); transform: rotate(270deg);}
		87.5% { -webkit-transform:rotate(360deg);transform: rotate(360deg);}
		100% { -webkit-transform:rotate(360deg);transform: rotate(360deg);}
}
.roolClock{
	-webkit-animation:roolClock 25s 1.5s infinite linear;
	animation:roolClock 25s 1.5s infinite linear;
}
.sway{
	animation:sway 2s linear;
	-webkit-animation:sway 2s linear;
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite
}

@-webkit-keyframes sway {
	0% { -webkit-transform:rotate(0deg);transform: rotate(0deg);}
	25% {-webkit-transform:rotate(30deg); transform: rotate(30deg);}
	50% {-webkit-transform:rotate(0deg); transform: rotate(0deg);}
	75% {-webkit-transform:rotate(-30deg); transform: rotate(-30deg);}
	100% {-webkit-transform:rotate(0deg); transform: rotate(0deg);}
}
@keyframes sway {
	0% { -webkit-transform:rotate(0deg);transform: rotate(0deg);}
	25% {-webkit-transform:rotate(30deg); transform: rotate(30deg);}
	50% {-webkit-transform:rotate(0deg); transform: rotate(0deg);}
	75% {-webkit-transform:rotate(-30deg); transform: rotate(-30deg);}
	100% {-webkit-transform:rotate(0deg); transform: rotate(0deg);}
}

/*************************Button******************************/


/*************************zoon******************************/
.zoomInMid{
	animation-name: zoomInMid;
	-webkit-animation-name: zoomInMid;	

	animation-duration: 0.7s;	
	-webkit-animation-duration: 0.7s;

	animation-timing-function: ease;	
	-webkit-animation-timing-function: ease;		

	visibility: visible !important;	
}

@keyframes zoomInMid {
	0% {
		transform: translateY(100%) scale(0.6) scaleY(0.5);
	}
	60%{
		transform: translateY(-7%) scaleY(1.12);
	}
	75%{
		transform: translateY(3%);
	}	
	100% {
		transform: translateY(0%) scale(1) scaleY(1);
	}	
}

@-webkit-keyframes zoomInMid {
	0% {
		-webkit-transform: translateY(100%) scale(0.6) scaleY(0.5);
	}
	60%{
		-webkit-transform: translateY(-7%) scaleY(1.12);
	}
	75%{
		-webkit-transform: translateY(3%);
	}	
	100% {
		-webkit-transform: translateY(0%) scale(1) scaleY(1);
	}	
}
@-webkit-keyframes zoomInBigA {
	0%{-webkit-transform:scale(0);transform:scale(0)}50%{-webkit-transform:scale(1.2);transform:scale(1.2)}100%{-webkit-transform:scale(1);transform:scale(1)}
}
@keyframes zoonImBigA {
	0%{-webkit-transform:scale(0);transform:scale(0)}50%{-webkit-transform:scale(1.2);transform:scale(1.2)}100%{-webkit-transform:scale(1);transform:scale(1)}
}
.zoomInBigA {
	-webkit-animation-name: zoomInBigA;
	animation-name: zoomInBigA
}
.zoomInBigB{
	animation-name: zoomInBigB;
	-webkit-animation-name: zoomInBigB;	

	animation-duration: 1.6s;	
	-webkit-animation-duration: 1.6s;

	animation-timing-function: ease-out;	
	-webkit-animation-timing-function: ease-out;	

	visibility: visible !important;			
}

@keyframes zoomInBigB {
	0% {
		transform: scale(0.3) rotate(6deg) translateX(-30%) translateY(30%);
		opacity: 0.2;
	}
	30% {
		transform: scale(1.03) rotate(-2deg) translateX(2%) translateY(-2%);		
		opacity: 1;
	}
	45% {
		transform: scale(0.98) rotate(1deg) translateX(0%) translateY(0%);
		opacity: 1;
	}
	60% {
		transform: scale(1.01) rotate(-1deg) translateX(0%) translateY(0%);		
		opacity: 1;
	}	
	75% {
		transform: scale(0.99) rotate(1deg) translateX(0%) translateY(0%);
		opacity: 1;
	}
	90% {
		transform: scale(1.01) rotate(0deg) translateX(0%) translateY(0%);		
		opacity: 1;
	}	
	100% {
		transform: scale(1) rotate(0deg) translateX(0%) translateY(0%);
		opacity: 1;
	}		
}

@-webkit-keyframes zoomInBigB {
	0% {
		-webkit-transform: scale(0.3) rotate(6deg) translateX(-30%) translateY(30%);
		opacity: 0.2;
	}
	30% {
		-webkit-transform: scale(1.03) rotate(-2deg) translateX(2%) translateY(-2%);		
		opacity: 1;
	}
	45% {
		-webkit-transform: scale(0.98) rotate(1deg) translateX(0%) translateY(0%);
		opacity: 1;
	}
	60% {
		-webkit-transform: scale(1.01) rotate(-1deg) translateX(0%) translateY(0%);		
		opacity: 1;
	}	
	75% {
		-webkit-transform: scale(0.99) rotate(1deg) translateX(0%) translateY(0%);
		opacity: 1;
	}
	90% {
		-webkit-transform: scale(1.01) rotate(0deg) translateX(0%) translateY(0%);		
		opacity: 1;
	}	
	100% {
		-webkit-transform: scale(1) rotate(0deg) translateX(0%) translateY(0%);
		opacity: 1;
	}				
}
@-webkit-keyframes zoomTiny {
	0%{-webkit-transform:scale(2);transform:scale(2);opacity:0}
	1%{-webkit-transform:scale(2);transform:scale(2);opacity:1}
	100%{-webkit-transform:scale(1);transform:scale(1);opacity:1}
}
@keyframes zoomTiny {
	0%{-webkit-transform:scale(2);transform:scale(2);opacity:0}
	1%{-webkit-transform:scale(2);transform:scale(2);opacity:1}
	100%{-webkit-transform:scale(1);transform:scale(1);opacity:1}
}
.zoomTiny {
	-webkit-animation-name: zoomTiny;
	animation-name: zoomTiny;
}
.zoomTinyBig{
	animation-name: zoomTinyBig;
	-webkit-animation-name: zoomTinyBig;	

	animation-duration: 1.2s;	
	-webkit-animation-duration: 1.2s;

	animation-timing-function: ease-out;	
	-webkit-animation-timing-function: ease-out;	

	visibility: visible !important;	
}

@keyframes zoomTinyBig {
	0% {
		transform: scale(1.8);		
	}
	50% {
		transform: scale(0.95);
	}	
	80% {
		transform: scale(1.05);
	}
	90% {
		transform: scale(0.98);
	}	
	100% {
		transform: scale(1);
	}			
}

@-webkit-keyframes zoomTinyBig {
	0% {
		-webkit-transform: scale(1.8);		
	}
	50% {
		-webkit-transform: scale(0.95);
	}	
	80% {
		-webkit-transform: scale(1.05);
	}
	90% {
		-webkit-transform: scale(0.98);
	}	
	100% {
		-webkit-transform: scale(1);
	}					
}
/*************************zoon******************************/


/*************************rotate******************************/
@-webkit-keyframes rotateInBig{
	0% {
		opacity:0;
		-webkit-transform:rotate(0deg);
		transform:rotate(0deg);
	}
	100% {
		opacity:1;
		-webkit-transform:rotate(360deg);
		transform:rotate(360deg);
	} 
}
@keyframes rotateInBig {
	0% {
		opacity:0;
		-webkit-transform:rotate(0deg);
		transform:rotate(0deg);
	}
	100% {
		opacity:1;
		-webkit-transform:rotate(360deg);
		transform:rotate(360deg);
	} 
}
.rotateInBig{
	-webkit-animation-name: rotateInBig;
	animation-name: rotateInBig;
	-webkit-animation-duration: 1s;
	animation-duration: 2s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	opacity:0;
}

@-webkit-keyframes rotateInmid{
	0% {
		-webkit-transform:rotate(-150deg);
		transform:rotate(-150deg);
	}
	10%{
		opacity:1;
		-webkit-transform:rotate(-100deg);
		transform:rotate(-100deg);
	}
	20%{
		opacity:1;
		-webkit-transform:rotate(-150deg);
		transform:rotate(-150deg);
	}
	40%{
		opacity:1;
		-webkit-transform:rotate(-130deg);
		transform:rotate(-100deg);
	}
	60%{
		opacity:1;
		-webkit-transform:rotate(-100deg);
		transform:rotate(-130deg);
	}
	100% {
		opacity:1;
		-webkit-transform:rotate(0deg);
		transform:rotate(0deg);
	} 
}
@keyframes rotateInmid {
	0% {
		-webkit-transform:rotate(-150deg);
		transform:rotate(-150deg);
	}
	10%{
		-webkit-transform:rotate(-100deg);
		transform:rotate(-100deg);
	}
	20%{
		-webkit-transform:rotate(-150deg);
		transform:rotate(-150deg);
	}
	40%{
		-webkit-transform:rotate(-130deg);
		transform:rotate(-100deg);
	}
	60%{
		-webkit-transform:rotate(-100deg);
		transform:rotate(-130deg);
	}
	100% {
		-webkit-transform:rotate(0deg);
		transform:rotate(0deg);
	} 
}
.rotateInmid{	
	opacity:0;
	transform:rotate(-150deg);
	-webkit-transform:rotate(-150deg);
	transform-origin:52% 40%;
	-webkit-transform-origin:51.5% 40.2%;
	animation:rotateInmid 4s linear;
	-webkit-animation:rotateInmid 4s linear;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}

/*************************rotate******************************/


/*************************special******************************/

@-webkit-keyframes fly {
		0% { -webkit-transform:translate3d(-200%,200%,0);transform:translate3d(-200%,200%,0);}
		100% {-webkit-transform:translate3d(500%,-200%,0);transform:translate3d(500%,-200%,0);}
	}
@keyframes fly {
		0% { -webkit-transform:rotate(0deg);transform: rotate(0deg);}
		100% {-webkit-transform:rotate(720deg); transform: rotate(720deg);}
}
.fly{
	width:60%;
	-webkit-animation-duration: 3s;
	animation-duration: 3s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	animation-name:fly;
	-webkit-animation-name:fly;
}
@-webkit-keyframes growUp{
	0%{-webkit-transform:scale(1,0); opacity:0;}
	100%{-webkit-transform:scale(1,1); opacity:1;}
}
@keyframes growUp{
	0%{-webkit-transform:scale(1,0); opacity:0;}
	100%{-webkit-transform:scale(1,1); opacity:1;}
}
.growUp{
	-webkit-transform-origin:50% 100%;
	-webkit-animation:growUp 1.2s both;
}
.growDown{
	animation-name: growDown;
	-webkit-animation-name: growDown;	

	animation-duration: 1.1s;	
	-webkit-animation-duration: 1.1s;

	animation-timing-function: ease-out;	
	-webkit-animation-timing-function: ease-out;	

	transform-origin: 50% 0%;
	-ms-transform-origin: 50% 0%;
	-webkit-transform-origin: 50% 0%; 		
}

@keyframes growDown {
	0% {
		transform: scaleY(0.1);
	}
	40% {
		transform: scaleY(1.02);
	}
	60% {
		transform: scaleY(0.98);
	}
	80% {
		transform: scaleY(1.01);
	}
	100% {
		transform: scaleY(0.98);
	}				
	80% {
		transform: scaleY(1.01);
	}
	100% {
		transform: scaleY(1);
	}							
}

@-webkit-keyframes growDown {
	0% {
		-webkit-transform: scaleY(0.1);
	}
	40% {
		-webkit-transform: scaleY(1.02);
	}
	60% {
		-webkit-transform: scaleY(0.98);
	}
	80% {
		-webkit-transform: scaleY(1.01);
	}
	100% {
		-webkit-transform: scaleY(0.98);
	}				
	80% {
		-webkit-transform: scaleY(1.01);
	}
	100% {
		-webkit-transform: scaleY(1);
	}		
}
@-webkit-keyframes passBy {
0% {
-webkit-transform:translate3d(-500px, 0, 0);
transform:translate3d(-500px, 0, 0)
}
100% {
-webkit-transform:translate3d(100px, 0, 0);
transform:translate3d(100px, 0, 0)
}

}
@keyframes passBy {
0% {
-webkit-transform:translate3d(-500px, 0, 0);
transform:translate3d(-500px, 0, 0)
}
100% {
-webkit-transform:translate3d(100px, 0, 0);
transform:translate3d(100px, 0, 0)
}
}

.passBy {
	-webkit-animation-name: passBy;
	animation-name: passBy;
	-webkit-animation-duration: 4s;
	animation-duration: 4s;
	animation-timing-function: linear;
	-webkit-animation-timing-function: linear;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}
.slideExpandUp{
	animation-name: slideExpandUp;
	-webkit-animation-name: slideExpandUp;	

	animation-duration: 1.6s;	
	-webkit-animation-duration: 1.6s;

	animation-timing-function: ease-out;	
	-webkit-animation-timing-function: ease -out;

	visibility: visible !important;	
}

@keyframes slideExpandUp {
	0% {
		transform: translateY(100%) scaleX(0.5);
	}
	30%{
		transform: translateY(-8%) scaleX(0.5);
	}	
	40%{
		transform: translateY(2%) scaleX(0.5);
	}
	50%{
		transform: translateY(0%) scaleX(1.1);
	}
	60%{
		transform: translateY(0%) scaleX(0.9);		
	}
	70% {
		transform: translateY(0%) scaleX(1.05);
	}			
	80%{
		transform: translateY(0%) scaleX(0.95);		
	}
	90% {
		transform: translateY(0%) scaleX(1.02);
	}	
	100%{
		transform: translateY(0%) scaleX(1);		
	}
}

@-webkit-keyframes slideExpandUp {
	0% {
		-webkit-transform: translateY(100%) scaleX(0.5);
	}
	30%{
		-webkit-transform: translateY(-8%) scaleX(0.5);
	}	
	40%{
		-webkit-transform: translateY(2%) scaleX(0.5);
	}
	50%{
		-webkit-transform: translateY(0%) scaleX(1.1);
	}
	60%{
		-webkit-transform: translateY(0%) scaleX(0.9);		
	}
	70% {
		-webkit-transform: translateY(0%) scaleX(1.05);
	}			
	80%{
		-webkit-transform: translateY(0%) scaleX(0.95);		
	}
	90% {
		-webkit-transform: translateY(0%) scaleX(1.02);
	}	
	100%{
		-webkit-transform: translateY(0%) scaleX(1);		
	}
}


/*************************special******************************/

/*************************attention******************************/
.bounceBig{
	animation-name: bounceBig;
	-webkit-animation-name: bounceBig;	

	animation-duration: 1.6s;	
	-webkit-animation-duration: 1.6s;

	animation-timing-function: ease;	
	-webkit-animation-timing-function: ease;	
	
	transform-origin: 50% 100%;
	-ms-transform-origin: 50% 100%;
	-webkit-transform-origin: 50% 100%; 	
}

@keyframes bounceBig {
	0% {
		transform: translateY(0%) scaleY(0.6);
	}
	60%{
		transform: translateY(-100%) scaleY(1.1);
	}
	70%{
		transform: translateY(0%) scaleY(0.95) scaleX(1.05);
	}
	80%{
		transform: translateY(0%) scaleY(1.05) scaleX(1);
	}	
	90%{
		transform: translateY(0%) scaleY(0.95) scaleX(1);
	}				
	100%{
		transform: translateY(0%) scaleY(1) scaleX(1);
	}	
}

@-webkit-keyframes bounceBig {
	0% {
		-webkit-transform: translateY(0%) scaleY(0.6);
	}
	60%{
		-webkit-transform: translateY(-100%) scaleY(1.1);
	}
	70%{
		-webkit-transform: translateY(0%) scaleY(0.95) scaleX(1.05);
	}
	80%{
		-webkit-transform: translateY(0%) scaleY(1.05) scaleX(1);
	}	
	90%{
		-webkit-transform: translateY(0%) scaleY(0.95) scaleX(1);
	}				
	100%{
		-webkit-transform: translateY(0%) scaleY(1) scaleX(1);
	}		
}
@-webkit-keyframes pulseBig {
0% { opacity:0;
-webkit-transform:scale(1, 1);
-ms-transform:scale(1, 1);
transform:scale(1, 1)
}
50%{
-webkit-transform:scale(1.1, 1.1);
-ms-transform:scale(1.1, 1.1);
transform:scale(1.1, 1.1)
}

100% {
-webkit-transform:scale(1,1);
-ms-transform:scale(1,1);
transform:scale(1,1)
}
}
@keyframes pulseBig{
0% {opacity:0;
-webkit-transform:scale(1, 1);
-ms-transform:scale(1, 1);
transform:scale(1, 1)
}
50%{
-webkit-transform:scale(1.2, 1.2);
-ms-transform:scale(1.2, 1.2);
transform:scale(1.2, 1.2)
}

100% {
-webkit-transform:scale(1,1);
-ms-transform:scale(1,1);
transform:scale(1,1)
}
}
.pulseBig{
	-webkit-animation-name: pulseBig;
	animation-name: pulseBig
}
@-webkit-keyframes emphasize {
0% {
-webkit-transform:scale(1, 1);
-ms-transform:scale(1, 1);
transform:scale(1, 1)
}
50%{
-webkit-transform:scale(1.3, 1.3);
-ms-transform:scale(1.3, 1.3);
transform:scale(1.3, 1.3)
}

100% {
-webkit-transform:scale(1,1);
-ms-transform:scale(1,1);
transform:scale(1,1)
}
}
@keyframes emphasize {
0% {
-webkit-transform:scale(1, 1);
-ms-transform:scale(1, 1);
transform:scale(1, 1)
}
50%{
-webkit-transform:scale(1.1, 1.1);
-ms-transform:scale(1.1, 1.1);
transform:scale(1.1, 1.1)
}

100% {
-webkit-transform:scale(1,1);
-ms-transform:scale(1,1);
transform:scale(1,1)
}
}
.emphasize {
	-webkit-animation-name: emphasize;
	animation-name: emphasize
}
.hatch{
	animation-name: hatch;
	-webkit-animation-name: hatch;	

	animation-duration: 2s;	
	-webkit-animation-duration: 2s;

	animation-timing-function: ease-in-out;	
	-webkit-animation-timing-function: ease-in-out;

	transform-origin: 50% 100%;
	-ms-transform-origin: 50% 100%;
	-webkit-transform-origin: 50% 100%; 

	visibility: visible !important;		
}

@keyframes hatch {
	0% {
		transform: rotate(0deg) scaleY(0.6);
	}
	20% {
		transform: rotate(-2deg) scaleY(1.05);
	}
	35% {
		transform: rotate(2deg) scaleY(1);
	}
	50% {
		transform: rotate(-2deg);
	}	
	65% {
		transform: rotate(1deg);
	}	
	80% {
		transform: rotate(-1deg);
	}		
	100% {
		transform: rotate(0deg);
	}									
}

@-webkit-keyframes hatch {
	0% {
		-webkit-transform: rotate(0deg) scaleY(0.6);
	}
	20% {
		-webkit-transform: rotate(-2deg) scaleY(1.05);
	}
	35% {
		-webkit-transform: rotate(2deg) scaleY(1);
	}
	50% {
		-webkit-transform: rotate(-2deg);
	}	
	65% {
		-webkit-transform: rotate(1deg);
	}	
	80% {
		-webkit-transform: rotate(-1deg);
	}		
	100% {
		-webkit-transform: rotate(0deg);
	}		
}

/*************************attention******************************/


/*************************bounce******************************/
@-webkit-keyframes bounceInBig {
0% { opacity:0;
-webkit-transform:scale3d(1, 1, 1);
transform:scale3d(1, 1, 1)
}
10%, 20% {
-webkit-transform:scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
transform:scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg)
}
30%, 50%, 70%, 90% {
-webkit-transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)
}
40%, 60%, 80% {
-webkit-transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)
}
100% {
-webkit-transform:scale3d(1, 1, 1);
transform:scale3d(1, 1, 1)
}
}
@keyframes bounceInBig {
0% {opacity:0;
-webkit-transform:scale3d(1, 1, 1);
-ms-transform:scale3d(1, 1, 1);
transform:scale3d(1, 1, 1)
}
10%, 20% {
-webkit-transform:scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
-ms-transform:scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
transform:scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg)
}
30%, 50%, 70%, 90% {
-webkit-transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
-ms-transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)
}
40%, 60%, 80% {
-webkit-transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
-ms-transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)
}
100% {
-webkit-transform:scale3d(1, 1, 1);
-ms-transform:scale3d(1, 1, 1);
transform:scale3d(1, 1, 1)
}
}
.bounceInBig {
	-webkit-animation-name: bounceInBig;
	animation-name: bounceInBig
}
/*************************bounce******************************/

/*************************derection******************************/
@-webkit-keyframes rightBottom {
0% {
-webkit-transform:translate3d(160px, 160px, 0);
transform:translate3d(160px, 160px, 0)
}
100% {
-webkit-transform:translate3d(0, 0, 0);
transform:translate3d(0, 0, 0)
}

}
@keyframes rightBottom {
0% {
-webkit-transform:translate3d(160px, 160px, 0);
transform:translate3d(160px, 160px, 0)
}
100% {
-webkit-transform:translate3d(0, 0, 0);
transform:translate3d(0, 0, 0)
}
}
.rightBottom {
	-webkit-animation-name: rightBottom;
	animation-name: rightBottom;

}
@-webkit-keyframes rightTop {
0% {
-webkit-transform:translate3d(160px, -160px, 0);
transform:translate3d(160px, -160px, 0)
}
100% {
-webkit-transform:translate3d(0, 0, 0);
transform:translate3d(0, 0, 0)
}

}
@keyframes rightTop {
0% {
-webkit-transform:translate3d(160px, -160px, 0);
transform:translate3d(160px, -160px, 0)
}
100% {
-webkit-transform:translate3d(0, 0, 0);
transform:translate3d(0, 0, 0)
}
}
.rightTop {
	-webkit-animation-name: rightTop;
	animation-name: rightTop;

}
@-webkit-keyframes leftTop {
0% {
-webkit-transform:translate3d(-160px, -160px, 0);
transform:translate3d(-160px, -160px, 0)
}
100% {
-webkit-transform:translate3d(0, 0, 0);
transform:translate3d(0, 0, 0)
}

}
@keyframes leftTop {
0% {
-webkit-transform:translate3d(-160px, -160px, 0);
transform:translate3d(-160px, -160px, 0)
}
100% {
-webkit-transform:translate3d(0, 0, 0);
transform:translate3d(0, 0, 0)
}
}
.leftTop {
	-webkit-animation-name: leftTop;
	animation-name: leftTop;

}
@-webkit-keyframes leftBottom {
0% {
-webkit-transform:translate3d(-160px, 160px, 0);
transform:translate3d(-160px, 160px, 0)
}
100% {
-webkit-transform:translate3d(0, 0, 0);
transform:translate3d(0, 0, 0)
}

}
@keyframes leftBottom {
0% {
-webkit-transform:translate3d(-160px, 160px, 0);
transform:translate3d(-160px, 160px, 0)
}
100% {
-webkit-transform:translate3d(0, 0, 0);
transform:translate3d(0, 0, 0)
}
}
.leftBottom {
	-webkit-animation-name: leftBottom;
	animation-name: leftBottom;

}
/*************************derection******************************/

/*************************stretch******************************/

.stretchLeft{
	animation-name: stretchLeft;
	-webkit-animation-name: stretchLeft;	

	animation-duration: 1.5s;	
	-webkit-animation-duration: 1.5s;

	animation-timing-function: ease-out;	
	-webkit-animation-timing-function: ease-out;	

	transform-origin: 100% 0%;
	-ms-transform-origin: 100% 0%;
	-webkit-transform-origin: 100% 0%; 
}

@keyframes stretchLeft {
	0% {
		transform: scaleX(0.3);
	}
	40% {
		transform: scaleX(1.02);
	}
	60% {
		transform: scaleX(0.98);
	}
	80% {
		transform: scaleX(1.01);
	}
	100% {
		transform: scaleX(0.98);
	}				
	80% {
		transform: scaleX(1.01);
	}
	100% {
		transform: scaleX(1);
	}							
}

@-webkit-keyframes stretchLeft {
	0% {
		-webkit-transform: scaleX(0.3);
	}
	40% {
		-webkit-transform: scaleX(1.02);
	}
	60% {
		-webkit-transform: scaleX(0.98);
	}
	80% {
		-webkit-transform: scaleX(1.01);
	}
	100% {
		-webkit-transform: scaleX(0.98);
	}				
	80% {
		-webkit-transform: scaleX(1.01);
	}
	100% {
		-webkit-transform: scaleX(1);
	}		
}
.stretchRight{
	animation-name: stretchRight;
	-webkit-animation-name: stretchRight;	

	animation-duration: 1.5s;	
	-webkit-animation-duration: 1.5s;

	animation-timing-function: ease-out;	
	-webkit-animation-timing-function: ease-out;	

	transform-origin: 0% 0%;
	-ms-transform-origin: 0% 0%;
	-webkit-transform-origin: 0% 0%; 		
}

@keyframes stretchRight {
	0% {
		transform: scaleX(0.3);
	}
	40% {
		transform: scaleX(1.02);
	}
	60% {
		transform: scaleX(0.98);
	}
	80% {
		transform: scaleX(1.01);
	}
	100% {
		transform: scaleX(0.98);
	}				
	80% {
		transform: scaleX(1.01);
	}
	100% {
		transform: scaleX(1);
	}							
}

@-webkit-keyframes stretchRight {
	0% {
		-webkit-transform: scaleX(0.3);
	}
	40% {
		-webkit-transform: scaleX(1.02);
	}
	60% {
		-webkit-transform: scaleX(0.98);
	}
	80% {
		-webkit-transform: scaleX(1.01);
	}
	100% {
		-webkit-transform: scaleX(0.98);
	}				
	80% {
		-webkit-transform: scaleX(1.01);
	}
	100% {
		-webkit-transform: scaleX(1);
	}		
}
@-webkit-keyframes float01 {
60% {
-webkit-transform:translate3d(0, -10px, 0);
transform:translate3d(0, -10px, 0)
}
100% {
-webkit-transform:translate3d(0, 0, 0);
transform:translate3d(0, 0, 0)
}

}
@keyframes float01 {
60% {
-webkit-transform:translate3d(0, -10px, 0);
transform:translate3d(0, -10px, 0)
}
100% {
-webkit-transform:translate3d(0, 0, 0);
transform:translate3d(0, 0, 0)
}
}
.float01 {
	-webkit-animation-name: float01;
	animation-name: float01
}
@-webkit-keyframes float02 {
60% {
-webkit-transform:translate3d(30px, 0, 0);
transform:translate3d(30px, 0, 0)
}
100% {
-webkit-transform:translate3d(0, 0, 0);
transform:translate3d(0, 0, 0)
}

}
@keyframes float02 {
60% {
-webkit-transform:translate3d(30px, 0, 0);
transform:translate3d(30px, 0, 0)
}
100% {
-webkit-transform:translate3d(0, 0, 0);
transform:translate3d(0, 0, 0)
}
}
.float02 {
	-webkit-animation-name: float02;
	animation-name: float02;

}
/*************************stretch******************************/
