/*无限旋转-反方向*/
.l-rotating-left {
	animation: Lrotatingleft 6s linear infinite;
	-moz-animation: Lrotatingleft 6s linear infinite;
	-ms-animation: Lrotatingleft 6s linear infinite;
	-webkit-animation: Lrotatingleft 6s linear infinite;
}
/*无限旋转-顺方向*/
.l-rotating-right {
	animation: Lrotatingright 6s linear infinite;
	-moz-animation: Lrotatingright 6s linear infinite;
	-ms-animation: Lrotatingright 6s linear infinite;
	-webkit-animation: Lrotatingright 6s linear infinite;
}
/*阴影*/
.l-shadow{ 
      animation:Lshadow 2s ; animation-fill-mode:forwards;
	  -moz-animation:Lshadow 2s ; -moz-animation-fill-mode:forwards;
	  -ms-animation:Lshadow 2s ; -ms-animation-fill-mode:forwards;
	  -webkit-animation:Lshadow 2s ; -webkit-animation-fill-mode:forwards;
	  }
/*调动画时间*/
.magictime {
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}
/*漩涡-出*/
.magic {
	-webkit-animation-name: magic;
	animation-name: magic;
}
/*从上往左倾斜*/
.openDownLeft {
	-webkit-animation-name: openDownLeft;
	animation-name: openDownLeft;
}
/*从上往右倾斜*/
.openDownRight {
	-webkit-animation-name: openDownRight;
	animation-name: openDownRight;
}
/*从下往左倾斜*/
.openUpLeft {
	-webkit-animation-name: openUpLeft;
	animation-name: openUpLeft;
}
/*从下往右倾斜*/
.openUpRight {
	-webkit-animation-name: openUpRight;
	animation-name: openUpRight;
}
/*从上左方向回正*/
.openDownLeftRetourn {
	-webkit-animation-name: openDownLeftRetourn;
	animation-name: openDownLeftRetourn;
}
/*从上右方向回正*/
.openDownRightRetourn {
	-webkit-animation-name: openDownRightRetourn;
	animation-name: openDownRightRetourn;
}
/*从下左方向回正*/
.openUpLeftRetourn {
	-webkit-animation-name: openUpLeftRetourn;
	animation-name: openUpLeftRetourn;
}
/*从下右方向回正*/
.openUpRightRetourn {
	-webkit-animation-name: openUpRightRetourn;
	animation-name: openUpRightRetourn;
}
/*从上往左倾斜-隐藏*/
.openDownLeftOut {
	-webkit-animation-name: openDownLeftOut;
	animation-name: openDownLeftOut;
}
/*从上往右倾斜-隐藏*/
.openDownRightOut {
	-webkit-animation-name: openDownRightOut;
	animation-name: openDownRightOut;
}
/*从下往左倾斜-隐藏*/
.openUpLeftOut {
	-webkit-animation-name: openUpLeftOut;
	animation-name: openUpLeftOut;
}
/*从下往右倾斜-隐藏*/
.openUpRightOut {
	-webkit-animation-name: openUpRightOut;
	animation-name: openUpRightOut;
}
/*从中间反转到下*/
.perspectiveDown {
	-webkit-backface-visibility: visible !important;
	backface-visibility: visible !important;
	-webkit-animation-name: perspectiveDown;
	animation-name: perspectiveDown;
}
/*从中间反转到左*/
.perspectiveLeft {
	-webkit-backface-visibility: visible !important;
	backface-visibility: visible !important;
	-webkit-animation-name: perspectiveLeft;
	animation-name: perspectiveLeft;
}
/*从中间反转到右*/
.perspectiveRight {
	-webkit-backface-visibility: visible !important;
	backface-visibility: visible !important;
	-webkit-animation-name: perspectiveRight;
	animation-name: perspectiveRight;
}
/*从中间反转到上*/
.perspectiveUp {
	-webkit-backface-visibility: visible !important;
	backface-visibility: visible !important;
	-webkit-animation-name: perspectiveUp;
	animation-name: perspectiveUp;
}
/*从下反转到中间*/
.perspectiveDownRetourn {
	-webkit-backface-visibility: visible !important;
	backface-visibility: visible !important;
	-webkit-animation-name: perspectiveDownRetourn;
	animation-name: perspectiveDownRetourn;
}
/*从左反转到中间*/
.perspectiveLeftRetourn {
	-webkit-backface-visibility: visible !important;
	backface-visibility: visible !important;
	-webkit-animation-name: perspectiveLeftRetourn;
	animation-name: perspectiveLeftRetourn;
}
/*从右反转到中间*/
.perspectiveRightRetourn {
	-webkit-backface-visibility: visible !important;
	backface-visibility: visible !important;
	-webkit-animation-name: perspectiveRightRetourn;
	animation-name: perspectiveRightRetourn;
}
/*从上反转到中间*/
.perspectiveUpRetourn {
	-webkit-backface-visibility: visible !important;
	backface-visibility: visible !important;
	-webkit-animation-name: perspectiveUpRetourn;
	animation-name: perspectiveUpRetourn;
}
/*模糊大到中间*/
.puffIn {
	-webkit-animation-name: puffIn;
	animation-name: puffIn;
}
/*中间慢慢放大到-隐藏*/
.puffOut {
	-webkit-animation-name: puffOut;
	animation-name: puffOut;
}
/*从中间反转到下-隐藏*/
.rotateDown {
	-webkit-backface-visibility: visible !important;
	backface-visibility: visible !important;
	-webkit-animation-name: rotateDown;
	animation-name: rotateDown;
}
/*从中间反转到右-隐藏*/
.rotateLeft {
	-webkit-backface-visibility: visible !important;
	backface-visibility: visible !important;
	-webkit-animation-name: rotateLeft;
	animation-name: rotateLeft;
}
/*从中间反转到左-隐藏*/
.rotateRight {
	-webkit-backface-visibility: visible !important;
	backface-visibility: visible !important;
	-webkit-animation-name: rotateRight;
	animation-name: rotateRight;
}
/*从中间反转到上-隐藏*/
.rotateUp {
	-webkit-backface-visibility: visible !important;
	backface-visibility: visible !important;
	-webkit-animation-name: rotateUp;
	animation-name: rotateUp;
}
/*从中间往下移动*/
.slideDown {
	-webkit-animation-name: slideDown;
	animation-name: slideDown;
}
/*从中间往左移动*/
.slideLeft {
	-webkit-animation-name: slideLeft;
	animation-name: slideLeft;
}
/*从中间往右移动*/
.slideRight {
	-webkit-animation-name: slideRight;
	animation-name: slideRight;
}
/*从中间往上移动*/
.slideUp {
	-webkit-animation-name: slideUp;
	animation-name: slideUp;
}
/*从下往中间移动*/
.slideDownRetourn {
	-webkit-animation-name: slideDownRetourn;
	animation-name: slideDownRetourn;
}
/*从左往中间移动*/
.slideLeftRetourn {
	-webkit-animation-name: slideLeftRetourn;
	animation-name: slideLeftRetourn;
}
/*从右往中间移动*/
.slideRightRetourn {
	-webkit-animation-name: slideRightRetourn;
	animation-name: slideRightRetourn;
}
/*从上往中间移动*/
.slideUpRetourn {
	-webkit-animation-name: slideUpRetourn;
	animation-name: slideUpRetourn;
}
/*从左往小到大移动到中间*/
.swap {
	-webkit-animation-name: swap;
	animation-name: swap;
}
/*从小到大旋转到中间*/
.twisterInDown {
	-webkit-animation-name: twisterInDown;
	animation-name: twisterInDown;
}
/*从小到大-大旋转到中间*/
.twisterInUp {
	-webkit-animation-name: twisterInUp;
	animation-name: twisterInUp;
}
/*从大到小-模糊到中间*/
.vanishIn {
	-webkit-animation-name: vanishIn;
	animation-name: vanishIn;
}
/*从小到大-模糊到隐藏*/
.vanishOut {
	-webkit-animation-name: vanishOut;
	animation-name: vanishOut;
}
/*从中间到小-延迟到隐藏*/
.swashOut {
	-webkit-animation-name: swashOut;
	animation-name: swashOut;
}
/*从小到大-延迟到中间*/
.swashIn {
	-webkit-animation-name: swashIn;
	animation-name: swashIn;
}
/*从中间到小-左右移动-到隐藏*/
.foolishOut {
	-webkit-animation-name: foolishOut;
	animation-name: foolishOut;
}
/*从小到中间-左右移动-到显示*/
.foolishIn {
	-webkit-animation-name: foolishIn;
	animation-name: foolishIn;
}
/*从中间到小-旋转-到隐藏*/
.holeOut {
	-webkit-animation-name: holeOut;
	animation-name: holeOut;
}
/*放大缩小-放大缩小-移动到最右面-隐藏*/
.tinRightOut {
	-webkit-animation-name: tinRightOut;
	animation-name: tinRightOut;
}
/*放大缩小-放大缩小-移动到最左面-隐藏*/
.tinLeftOut {
	-webkit-animation-name: tinLeftOut;
	animation-name: tinLeftOut;
}
/*放大缩小-放大缩小-移动到最上面-隐藏*/
.tinUpOut {
	-webkit-animation-name: tinUpOut;
	animation-name: tinUpOut;
}
/*放大缩小-放大缩小-移动到最下面-隐藏*/
.tinDownOut {
	-webkit-animation-name: tinDownOut;
	animation-name: tinDownOut;
}
/*从最左面移动到中间*/
.tinRightIn {
	-webkit-animation-name: tinRightIn;
	animation-name: tinRightIn;
}
/*从最右面移动到中间*/
.tinLeftIn {
	-webkit-animation-name: tinLeftIn;
	animation-name: tinLeftIn;
}
/*从最上面移动到中间*/
.tinUpIn {
	-webkit-animation-name: tinUpIn;
	animation-name: tinUpIn;
}
/*从最下面移动到中间*/
.tinDownIn {
	-webkit-animation-name: tinDownIn;
	animation-name: tinDownIn;
}
/*中间往左上角旋转-模糊到隐藏*/
.bombRightOut {
	-webkit-animation-name: bombRightOut;
	animation-name: bombRightOut;
}
/*中间往右上角旋转-模糊到隐藏*/
.bombLeftOut {
	-webkit-animation-name: bombLeftOut;
	animation-name: bombLeftOut;
}
/*box下方颤动*/
.boingInUp {
	-webkit-animation-name: boingInUp;
	animation-name: boingInUp;
}
/*左右颤动-慢慢隐藏*/
.boingOutDown {
	-webkit-animation-name: boingOutDown;
	animation-name: boingOutDown;
}
/*中间往上-中间到小-慢慢隐藏*/
.spaceOutUp {
	-webkit-animation-name: spaceOutUp;
	animation-name: spaceOutUp;
}
/*中间往右-中间到小-慢慢隐藏*/
.spaceOutRight {
	-webkit-animation-name: spaceOutRight;
	animation-name: spaceOutRight;
}
/*中间往下-中间到小-慢慢隐藏*/
.spaceOutDown {
	-webkit-animation-name: spaceOutDown;
	animation-name: spaceOutDown;
}
/*中间往左-中间到小-慢慢隐藏*/
.spaceOutLeft {
	-webkit-animation-name: spaceOutLeft;
	animation-name: spaceOutLeft;
}
/*上往中间-小到中间*/
.spaceInUp {
	-webkit-animation-name: spaceInUp;
	animation-name: spaceInUp;
}
/*右往中间-小到中间*/
.spaceInRight {
	-webkit-animation-name: spaceInRight;
	animation-name: spaceInRight;
}
/*下往中间-小到中间*/
.spaceInDown {
	-webkit-animation-name: spaceInDown;
	animation-name: spaceInDown;
}
/*左往中间-小到中间*/
.spaceInLeft {
	-webkit-animation-name: spaceInLeft;
	animation-name: spaceInLeft;
}
@keyframes Lshadow {
	0%{ box-shadow:0 0 0 #888888;
	}
	100%{ box-shadow:0 0 10px #888888;
	}
}
@-moz-keyframes Lshadow {
	0%{ box-shadow:0 0 0 #888888;
	}
	100%{ box-shadow:0 0 10px #888888;
	}
}
@-ms-keyframes Lshadow {
	0%{ box-shadow:0 0 0 #888888;
	}
	100%{ box-shadow:0 0 10px #888888;
	}
}
@-webkit-keyframes Lshadow {
	0%{ box-shadow:0 0 0 #888888;
	}
	100%{ box-shadow:0 0 10px #888888;
	}
}
@keyframes Lrotatingleft {
0% {
 transform:rotate(0deg);
}
 100% {
 transform:rotate(-360deg);
}
}
@-webkit-keyframes Lrotatingleft {
0% {
 -webkit-transform:rotate(0deg);
}
 100% {
 -webkit-transform:rotate(-360deg);
}
}
@-moz-keyframes Lrotatingleft {
0% {
 -moz-transform:rotate(0deg);
}
 100% {
 -moz-transform:rotate(-360deg);
}
}
@-ms-keyframes Lrotatingleft {
0% {
 -ms-transform:rotate(0deg);
}
 100% {
 -ms-transform:rotate(-360deg);
}
}
@keyframes Lrotatingright {
0% {
 transform:rotate(0deg);
}
 100% {
 transform:rotate(360deg);
}
}
@-webkit-keyframes Lrotatingright {
0% {
 -webkit-transform:rotate(0deg);
}
 100% {
 -webkit-transform:rotate(360deg);
}
}
@-moz-keyframes Lrotatingright {
0% {
 -moz-transform:rotate(0deg);
}
 100% {
 -moz-transform:rotate(360deg);
}
}
@-ms-keyframes Lrotatingright {
0% {
 -ms-transform:rotate(0deg);
}
 100% {
 -ms-transform:rotate(360deg);
}
}
 @-webkit-keyframes magic {
 0% {
 opacity: 1;
 -webkit-transform-origin: 100% 200%;
 -webkit-transform: scale(1, 1) rotate(0deg);
}
 100% {
 opacity: 0;
 -webkit-transform-origin: 200% 500%;
 -webkit-transform: scale(0, 0) rotate(270deg);
}
}
@keyframes magic {
 0% {
 opacity: 1;
 transform-origin: 100% 200%;
 transform: scale(1, 1) rotate(0deg);
}
 100% {
 opacity: 0;
 transform-origin: 200% 500%;
 transform: scale(0, 0) rotate(270deg);
}
}
@-webkit-keyframes openDownLeft {
 0% {
 -webkit-transform-origin: bottom left;
 -webkit-transform: rotate(0deg);
 -webkit-animation-timing-function: ease-out;
}
 100% {
 -webkit-transform-origin: bottom left;
 -webkit-transform: rotate(-110deg);
 -webkit-animation-timing-function: ease-in-out;
}
}
@keyframes openDownLeft {
 0% {
 transform-origin: bottom left;
 transform: rotate(0deg);
 animation-timing-function: ease-out;
}
 100% {
 transform-origin: bottom left;
 transform: rotate(-110deg);
 animation-timing-function: ease-in-out;
}
}
@-webkit-keyframes openDownRight {
 0% {
 -webkit-transform-origin: bottom right;
 -webkit-transform: rotate(0deg);
 -webkit-animation-timing-function: ease-out;
}
 100% {
 -webkit-transform-origin: bottom right;
 -webkit-transform: rotate(110deg);
 -webkit-animation-timing-function: ease-in-out;
}
}
@keyframes openDownRight {
 0% {
 transform-origin: bottom right;
 transform: rotate(0deg);
 animation-timing-function: ease-out;
}
 100% {
 transform-origin: bottom right;
 transform: rotate(110deg);
 animation-timing-function: ease-in-out;
}
}
@-webkit-keyframes openUpLeft {
 0% {
 -webkit-transform-origin: top left;
 -webkit-transform: rotate(0deg);
 -webkit-animation-timing-function: ease-out;
}
 100% {
 -webkit-transform-origin: top left;
 -webkit-transform: rotate(110deg);
 -webkit-animation-timing-function: ease-in-out;
}
}
@keyframes openUpLeft {
 0% {
 transform-origin: top left;
 transform: rotate(0deg);
 animation-timing-function: ease-out;
}
 100% {
 transform-origin: top left;
 transform: rotate(110deg);
 animation-timing-function: ease-in-out;
}
}
@-webkit-keyframes openUpRight {
 0% {
 -webkit-transform-origin: top right;
 -webkit-transform: rotate(0deg);
 -webkit-animation-timing-function: ease-out;
}
 100% {
 -webkit-transform-origin: top right;
 -webkit-transform: rotate(-110deg);
 -webkit-animation-timing-function: ease-in-out;
}
}
@keyframes openUpRight {
 0% {
 transform-origin: top right;
 transform: rotate(0deg);
 animation-timing-function: ease-out;
}
 100% {
 transform-origin: top right;
 transform: rotate(-110deg);
 animation-timing-function: ease-in-out;
}
}
@-webkit-keyframes openDownLeftRetourn {
 0% {
 -webkit-transform-origin: bottom left;
 -webkit-transform: rotate(-110deg);
 -webkit-animation-timing-function: ease-in-out;
}
 100% {
 -webkit-transform-origin: bottom left;
 -webkit-transform: rotate(0deg);
 -webkit-animation-timing-function: ease-out;
}
}
@keyframes openDownLeftRetourn {
 0% {
 transform-origin: bottom left;
 transform: rotate(-110deg);
 animation-timing-function: ease-in-out;
}
 100% {
 transform-origin: bottom left;
 transform: rotate(0deg);
 animation-timing-function: ease-out;
}
}
@-webkit-keyframes openDownRightRetourn {
 0% {
 -webkit-transform-origin: bottom right;
 -webkit-transform: rotate(110deg);
 -webkit-animation-timing-function: ease-in-out;
}
 100% {
 -webkit-transform-origin: bottom right;
 -webkit-transform: rotate(0deg);
 -webkit-animation-timing-function: ease-out;
}
}
@keyframes openDownRightRetourn {
 0% {
 transform-origin: bottom right;
 transform: rotate(110deg);
 animation-timing-function: ease-in-out;
}
 100% {
 transform-origin: bottom right;
 transform: rotate(0deg);
 animation-timing-function: ease-out;
}
}
@-webkit-keyframes openUpLeftRetourn {
 0% {
 -webkit-transform-origin: top left;
 -webkit-transform: rotate(110deg);
 -webkit-animation-timing-function: ease-in-out;
}
 100% {
 -webkit-transform-origin: top left;
 -webkit-transform: rotate(0deg);
 -webkit-animation-timing-function: ease-out;
}
}
@keyframes openUpLeftRetourn {
 0% {
 transform-origin: top left;
 transform: rotate(110deg);
 animation-timing-function: ease-in-out;
}
 100% {
 transform-origin: top left;
 transform: rotate(0deg);
 animation-timing-function: ease-out;
}
}
@-webkit-keyframes openUpRightRetourn {
 0% {
 -webkit-transform-origin: top right;
 -webkit-transform: rotate(-110deg);
 -webkit-animation-timing-function: ease-in-out;
}
 100% {
 -webkit-transform-origin: top right;
 -webkit-transform: rotate(0deg);
 -webkit-animation-timing-function: ease-out;
}
}
@keyframes openUpRightRetourn {
 0% {
 transform-origin: top right;
 transform: rotate(-110deg);
 animation-timing-function: ease-in-out;
}
 100% {
 transform-origin: top right;
 transform: rotate(0deg);
 animation-timing-function: ease-out;
}
}
@-webkit-keyframes openDownLeftOut {
 0% {
 opacity: 1;
 -webkit-transform-origin: bottom left;
 -webkit-transform: rotate(0deg);
 -webkit-animation-timing-function: ease-out;
}
 100% {
 opacity: 0;
 -webkit-transform-origin: bottom left;
 -webkit-transform: rotate(-110deg);
 -webkit-animation-timing-function: ease-in-out;
}
}
@keyframes openDownLeftOut {
 0% {
 opacity: 1;
 transform-origin: bottom left;
 transform: rotate(0deg);
 animation-timing-function: ease-out;
}
 100% {
 opacity: 0;
 transform-origin: bottom left;
 transform: rotate(-110deg);
 animation-timing-function: ease-in-out;
}
}
@-webkit-keyframes openDownRightOut {
 0% {
 opacity: 1;
 -webkit-transform-origin: bottom right;
 -webkit-transform: rotate(0deg);
 -webkit-animation-timing-function: ease-out;
}
 100% {
 opacity: 0;
 -webkit-transform-origin: bottom right;
 -webkit-transform: rotate(110deg);
 -webkit-animation-timing-function: ease-in-out;
}
}
@keyframes openDownRightOut {
 0% {
 opacity: 1;
 transform-origin: bottom right;
 transform: rotate(0deg);
 animation-timing-function: ease-out;
}
 100% {
 opacity: 0;
 transform-origin: bottom right;
 transform: rotate(110deg);
 animation-timing-function: ease-in-out;
}
}
@-webkit-keyframes openUpLeftOut {
 0% {
 opacity: 1;
 -webkit-transform-origin: top left;
 -webkit-transform: rotate(0deg);
 -webkit-animation-timing-function: ease-out;
}
 100% {
 opacity: 0;
 -webkit-transform-origin: top left;
 -webkit-transform: rotate(110deg);
 -webkit-animation-timing-function: ease-in-out;
}
}
@keyframes openUpLeftOut {
 0% {
 opacity: 1;
 transform-origin: top left;
 transform: rotate(0deg);
 animation-timing-function: ease-out;
}
 100% {
 opacity: 0;
 transform-origin: top left;
 transform: rotate(110deg);
 animation-timing-function: ease-in-out;
}
}
@-webkit-keyframes openUpRightOut {
 0% {
 opacity: 1;
 -webkit-transform-origin: top right;
 -webkit-transform: rotate(0deg);
 -webkit-animation-timing-function: ease-out;
}
 100% {
 opacity: 0;
 -webkit-transform-origin: top right;
 -webkit-transform: rotate(-110deg);
 -webkit-animation-timing-function: ease-in-out;
}
}
@keyframes openUpRightOut {
 0% {
 opacity: 1;
 transform-origin: top right;
 transform: rotate(0deg);
 animation-timing-function: ease-out;
}
 100% {
 opacity: 0;
 transform-origin: top right;
 transform: rotate(-110deg);
 animation-timing-function: ease-in-out;
}
}
@-webkit-keyframes perspectiveDown {
 0% {
 -webkit-transform-origin: 0 100%;
 -webkit-transform: perspective(800px) rotateX(0deg);
}
 100% {
 -webkit-transform-origin: 0 100%;
 -webkit-transform: perspective(800px) rotateX(-180deg);
}
}
@keyframes perspectiveDown {
 0% {
 transform-origin: 0 100%;
 transform: perspective(800px) rotateX(0deg);
}
 100% {
 transform-origin: 0 100%;
 transform: perspective(800px) rotateX(-180deg);
}
}
@-webkit-keyframes perspectiveLeft {
 0% {
 -webkit-transform-origin: 0 0;
 -webkit-transform: perspective(800px) rotateY(0deg);
}
 100% {
 -webkit-transform-origin: 0 0;
 -webkit-transform: perspective(800px) rotateY(-180deg);
}
}
@keyframes perspectiveLeft {
 0% {
 transform-origin: 0 0;
 transform: perspective(800px) rotateY(0deg);
}
 100% {
 transform-origin: 0 0;
 transform: perspective(800px) rotateY(-180deg);
}
}
@-webkit-keyframes perspectiveRight {
 0% {
 -webkit-transform-origin: 100% 0;
 -webkit-transform: perspective(800px) rotateY(0deg);
}
 100% {
 -webkit-transform-origin: 100% 0;
 -webkit-transform: perspective(800px) rotateY(180deg);
}
}
@keyframes perspectiveRight {
 0% {
 transform-origin: 100% 0;
 transform: perspective(800px) rotateY(0deg);
}
 100% {
 transform-origin: 100% 0;
 transform: perspective(800px) rotateY(180deg);
}
}
@-webkit-keyframes perspectiveUp {
 0% {
 -webkit-transform-origin: 0 0;
 -webkit-transform: perspective(800px) rotateX(0deg);
}
 100% {
 -webkit-transform-origin: 0 0;
 -webkit-transform: perspective(800px) rotateX(180deg);
}
}
@keyframes perspectiveUp {
 0% {
 transform-origin: 0 0;
 transform: perspective(800px) rotateX(0deg);
}
 100% {
 transform-origin: 0 0;
 transform: perspective(800px) rotateX(180deg);
}
}
@-webkit-keyframes perspectiveDownRetourn {
 0% {
 -webkit-transform-origin: 0 100%;
 -webkit-transform: perspective(800px) rotateX(-180deg);
}
 100% {
 -webkit-transform-origin: 0 100%;
 -webkit-transform: perspective(800px) rotateX(0deg);
}
}
@keyframes perspectiveDownRetourn {
 0% {
 transform-origin: 0 100%;
 transform: perspective(800px) rotateX(-180deg);
}
 100% {
 transform-origin: 0 100%;
 transform: perspective(800px) rotateX(0deg);
}
}
@-webkit-keyframes perspectiveLeftRetourn {
 0% {
 -webkit-transform-origin: 0 0;
 -webkit-transform: perspective(800px) rotateY(-180deg);
}
 100% {
 -webkit-transform-origin: 0 0;
 -webkit-transform: perspective(800px) rotateY(0deg);
}
}
@keyframes perspectiveLeftRetourn {
 0% {
 transform-origin: 0 0;
 transform: perspective(800px) rotateY(-180deg);
}
 100% {
 transform-origin: 0 0;
 transform: perspective(800px) rotateY(0deg);
}
}
@-webkit-keyframes perspectiveRightRetourn {
 0% {
 -webkit-transform-origin: 100% 0;
 -webkit-transform: perspective(800px) rotateY(180deg);
}
 100% {
 -webkit-transform-origin: 100% 0;
 -webkit-transform: perspective(800px) rotateY(0deg);
}
}
@keyframes perspectiveRightRetourn {
 0% {
 transform-origin: 100% 0;
 transform: perspective(800px) rotateY(180deg);
}
 100% {
 transform-origin: 100% 0;
 transform: perspective(800px) rotateY(0deg);
}
}
@-webkit-keyframes perspectiveUpRetourn {
 0% {
 -webkit-transform-origin: 0 0;
 -webkit-transform: perspective(800px) rotateX(180deg);
}
 100% {
 -webkit-transform-origin: 0 0;
 -webkit-transform: perspective(800px) rotateX(0deg);
}
}
@keyframes perspectiveUpRetourn {
 0% {
 transform-origin: 0 0;
 transform: perspective(800px) rotateX(180deg);
}
 100% {
 transform-origin: 0 0;
 transform: perspective(800px) rotateX(0deg);
}
}
@-webkit-keyframes puffIn {
 0% {
 opacity: 0;
 -webkit-transform-origin: 50% 50%;
 -webkit-transform: scale(2, 2);
 -webkit-filter: blur(2px);
}
 100% {
 opacity: 1;
 -webkit-transform-origin: 50% 50%;
 -webkit-transform: scale(1, 1);
 -webkit-filter: blur(0px);
}
}
@keyframes puffIn {
 0% {
 opacity: 0;
 transform-origin: 50% 50%;
 transform: scale(2, 2);
 filter: blur(2px);
}
 100% {
 opacity: 1;
 transform-origin: 50% 50%;
 transform: scale(1, 1);
 filter: blur(0px);
}
}
@-webkit-keyframes puffOut {
 0% {
 opacity: 1;
 -webkit-transform-origin: 50% 50%;
 -webkit-transform: scale(1, 1);
 -webkit-filter: blur(0px);
}
 100% {
 opacity: 0;
 -webkit-transform-origin: 50% 50%;
 -webkit-transform: scale(2, 2);
 -webkit-filter: blur(2px);
}
}
@keyframes puffOut {
 0% {
 opacity: 1;
 transform-origin: 50% 50%;
 transform: scale(1, 1);
 -webkit-filter: blur(0px);
}
 100% {
 opacity: 0;
 transform-origin: 50% 50%;
 transform: scale(2, 2);
 -webkit-filter: blur(2px);
}
}
@-webkit-keyframes rotateDown {
 0% {
 opacity: 1;
 -webkit-transform-origin: 0 0;
 -webkit-transform: perspective(800px) rotateX(0deg) translateZ(0px);
}
 100% {
 opacity: 0;
 -webkit-transform-origin: 50% 100%;
 -webkit-transform: perspective(800px) rotateX(-180deg) translateZ(300px);
}
}
@keyframes rotateDown {
 0% {
 opacity: 1;
 transform-origin: 0 0;
 transform: perspective(800px) rotateX(0deg) translateZ(0px);
}
 100% {
 opacity: 0;
 transform-origin: 50% 100%;
 transform: perspective(800px) rotateX(-180deg) translateZ(300px);
}
}
@-webkit-keyframes rotateLeft {
 0% {
 opacity: 1;
 -webkit-transform-origin: 0 0;
 -webkit-transform: perspective(800px) rotateY(0deg) translateZ(0px);
}
 100% {
 opacity: 0;
 -webkit-transform-origin: 50% 0;
 -webkit-transform: perspective(800px) rotateY(180deg) translateZ(300px);
}
}
@keyframes rotateLeft {
 0% {
 opacity: 1;
 transform-origin: 0 0;
 transform: perspective(800px) rotateY(0deg) translateZ(0px);
}
 100% {
 opacity: 0;
 transform-origin: 50% 0;
 transform: perspective(800px) rotateY(180deg) translateZ(300px);
}
}
@-webkit-keyframes rotateRight {
 0% {
 opacity: 1;
 -webkit-transform-origin: 0 0;
 -webkit-transform: perspective(800px) rotateY(0deg) translate3d(0px);
}
 100% {
 opacity: 0;
 -webkit-transform-origin: 50% 0;
 -webkit-transform: perspective(800px) rotateY(-180deg) translateZ(150px);
}
}
@keyframes rotateRight {
 0% {
 opacity: 1;
 transform-origin: 0 0;
 transform: perspective(800px) rotateY(0deg) translate3d(0px);
}
 100% {
 opacity: 0;
 transform-origin: 50% 0;
 transform: perspective(800px) rotateY(-180deg) translateZ(150px);
}
}
@-webkit-keyframes rotateUp {
 0% {
 opacity: 1;
 -webkit-transform-origin: 0 0;
 -webkit-transform: perspective(800px) rotateX(0deg) translateZ(0px);
}
 100% {
 opacity: 0;
 -webkit-transform-origin: 50% 0;
 -webkit-transform: perspective(800px) rotateX(180deg) translateZ(100px);
}
}
@keyframes rotateUp {
 0% {
 opacity: 1;
 transform-origin: 0 0;
 transform: perspective(800px) rotateX(0deg) translateZ(0px);
}
 100% {
 opacity: 0;
 transform-origin: 50% 0;
 transform: perspective(800px) rotateX(180deg) translateZ(100px);
}
}
@-webkit-keyframes slideDown {
 0% {
 -webkit-transform-origin: 0 0;
 -webkit-transform: translateY(0%);
}
 100% {
 -webkit-transform-origin: 0 0;
 -webkit-transform: translateY(100%);
}
}
@keyframes slideDown {
 0% {
 transform-origin: 0 0;
 transform: translateY(0%);
}
 100% {
 transform-origin: 0 0;
 transform: translateY(100%);
}
}
@-webkit-keyframes slideLeft {
 0% {
 -webkit-transform-origin: 0 0;;
 -webkit-transform: translateX(0%);
}
 100% {
 -webkit-transform-origin: 0 0;
 -webkit-transform: translateX(-100%);
}
}
@keyframes slideLeft {
 0% {
 transform-origin: 0 0;
 transform: translateX(0%);
}
 100% {
 transform-origin: 0 0;
 transform: translateX(-100%);
}
}
@-webkit-keyframes slideRight {
 0% {
 -webkit-transform-origin: 0 0;
 -webkit-transform: translateX(0%);
}
 100% {
 -webkit-transform-origin: 0 0;
 -webkit-transform: translateX(100%);
}
}
@keyframes slideRight {
 0% {
 transform-origin: 0 0;
 transform: translateX(0%);
}
 100% {
 transform-origin: 0 0;
 transform: translateX(100%);
}
}
@-webkit-keyframes slideUp {
 0% {
 -webkit-transform-origin: 0 0;
 -webkit-transform: translateY(0%);
}
 100% {
 -webkit-transform-origin: 0 0;
 -webkit-transform: translateY(-100%);
}
}
@keyframes slideUp {
 0% {
 transform-origin: 0 0;
 transform: translateY(0%);
}
 100% {
 transform-origin: 0 0;
 transform: translateY(-100%);
}
}
@-webkit-keyframes slideDownRetourn {
 0% {
 -webkit-transform-origin: 0 0;
 -webkit-transform: translateY(100%);
}
 100% {
 -webkit-transform-origin: 0 0;
 -webkit-transform: translateY(0%);
}
}
@keyframes slideDownRetourn {
 0% {
 transform-origin: 0 0;
 transform: translateY(100%);
}
 100% {
 transform-origin: 0 0;
 transform: translateY(0%);
}
}
@-webkit-keyframes slideLeftRetourn {
 0% {
 -webkit-transform-origin: 0 0;
 -webkit-transform: translateX(-100%);
}
 100% {
 -webkit-transform-origin: 0 0;
 -webkit-transform: translateX(0%);
}
}
@keyframes slideLeftRetourn {
 0% {
 transform-origin: 0 0;
 transform: translateX(-100%);
}
 100% {
 transform-origin: 0 0;
 transform: translateX(0%);
}
}
@-webkit-keyframes slideRightRetourn {
 0% {
 -webkit-transform-origin: 0 0;
 -webkit-transform: translateX(100%);
}
 100% {
 -webkit-transform-origin: 0 0;
 -webkit-transform: translateX(0%);
}
}
@keyframes slideRightRetourn {
 0% {
 transform-origin: 0 0;
 transform: translateX(100%);
}
 100% {
 transform-origin: 0 0;
 transform: translateX(0%);
}
}
@-webkit-keyframes slideUpRetourn {
 0% {
 -webkit-transform-origin: 0 0;
 -webkit-transform: translateY(-100%);
}
 100% {
 -webkit-transform-origin: 0 0;
 -webkit-transform: translateY(0%);
}
}
@keyframes slideUpRetourn {
 0% {
 transform-origin: 0 0;
 transform: translateY(-100%);
}
 100% {
 transform-origin: 0 0;
 transform: translateY(0%);
}
}
@-webkit-keyframes swap {
 0% {
 opacity: 0;
 -webkit-transform-origin: 0 100%;
 -webkit-transform: scale(0, 0) translate(-700px, 0px);
}
 100% {
 opacity: 1;
 -webkit-transform-origin: 100% 100%;
 -webkit-transform: scale(1, 1) translate(0px, 0px);;
}
}
@keyframes swap {
 0% {
 opacity: 0;
 transform-origin: 0 100%;
 transform: scale(0, 0) translate(-700px, 0px);
}
 100% {
 opacity: 1;
 transform-origin: 100% 100%;
 transform: scale(1, 1) translate(0px, 0px);
}
}
@-webkit-keyframes twisterInDown {
 0% {
 opacity: 0;
 -webkit-transform-origin: 0 100%;
 -webkit-transform: scale(0, 0) rotate(360deg) translateY(-100%);
}
 30% {
 -webkit-transform-origin: 0 100%;
 -webkit-transform: scale(0, 0) rotate(360deg) translateY(-100%);
}
 100% {
 opacity: 1;
 -webkit-transform-origin: 100% 100%;
 -webkit-transform: scale(1, 1) rotate(0deg) translateY(0%);
}
}
@keyframes twisterInDown {
 0% {
 opacity: 0;
 transform-origin: 0 100%;
 transform: scale(0, 0) rotate(360deg) translateY(-100%);
}
 30% {
 transform-origin: 0 100%;
 transform: scale(0, 0) rotate(360deg) translateY(-100%);
}
 100% {
 opacity: 1;
 transform-origin: 100% 100%;
 transform: scale(1, 1) rotate(0deg) translateY(0%);
}
}
@-webkit-keyframes twisterInUp {
 0% {
 opacity: 0;
 -webkit-transform-origin: 100% 0;
 -webkit-transform: scale(0, 0) rotate(360deg) translateY(100%);
}
 30% {
 -webkit-transform-origin: 100% 0;
 -webkit-transform: scale(0, 0) rotate(360deg) translateY(100%);
}
 100% {
 opacity: 1;
 -webkit-transform-origin: 0 0;
 -webkit-transform: scale(1, 1) rotate(0deg) translateY(0);
}
}
@keyframes twisterInUp {
 0% {
 opacity: 0;
 transform-origin: 100% 0;
 transform: scale(0, 0) rotate(360deg) translateY(100%);
}
 30% {
 transform-origin: 100% 0;
 transform: scale(0, 0) rotate(360deg) translateY(100%);
}
 100% {
 opacity: 1;
 transform-origin: 0 0;
 transform: scale(1, 1) rotate(0deg) translateY(0);
}
}
@-webkit-keyframes vanishIn {
 0% {
 opacity: 0;
 -webkit-transform-origin: 50% 50%;
 -webkit-transform: scale(2, 2);
 -webkit-filter: blur(90px);
}
 100% {
 opacity: 1;
 -webkit-transform-origin: 50% 50%;
 -webkit-transform: scale(1, 1);
 -webkit-filter: blur(0px);
}
}
@keyframes vanishIn {
 0% {
 opacity: 0;
 transform-origin: 50% 50%;
 transform: scale(2, 2);
 -webkit-filter: blur(90px);
}
 100% {
 opacity: 1;
 transform-origin: 50% 50%;
 transform: scale(1, 1);
 -webkit-filter: blur(0px);
}
}
@-webkit-keyframes vanishOut {
 0% {
 opacity: 1;
 -webkit-transform-origin: 50% 50%;
 -webkit-transform: scale(1, 1);
 -webkit-filter: blur(0px);
}
 100% {
 opacity: 0;
 -webkit-transform-origin: 50% 50%;
 -webkit-transform: scale(2, 2);
 -webkit-filter: blur(20px);
}
}
@keyframes vanishOut {
 0% {
 opacity: 1;
 transform-origin: 50% 50%;
 transform: scale(1, 1);
 -webkit-filter: blur(0px);
}
 100% {
 opacity: 0;
 transform-origin: 50% 50%;
 transform: scale(2, 2);
 -webkit-filter: blur(20px);
}
}
@-webkit-keyframes swashOut {
 0% {
 opacity: 1;
 -webkit-transform-origin: 50% 50%;
 -webkit-transform: scale(1, 1);
 transform: scale(1, 1);
}
 80% {
 opacity: 1;
 -webkit-transform-origin: 50% 50%;
 -webkit-transform: scale(0.9, 0.9);
}
 100% {
 opacity: 0;
 -webkit-transform-origin: 50% 50%;
 -webkit-transform: scale(0, 0);
}
}
@keyframes swashOut {
 0% {
 opacity: 1;
 transform-origin: 50% 50%;
 transform: scale(1, 1);
}
 80% {
 opacity: 1;
 transform-origin: 50% 50%;
 transform: scale(0.9, 0.9);
}
 100% {
 opacity: 0;
 transform-origin: 50% 50%;
 transform: scale(0, 0);
}
}
@-webkit-keyframes swashIn {
 0% {
 opacity: 0;
 -webkit-transform-origin: 50% 50%;
 -webkit-transform: scale(0, 0);
}
 90% {
 opacity: 1;
 -webkit-transform-origin: 50% 50%;
 -webkit-transform: scale(0.9, 0.9);
}
 100% {
 opacity: 1;
 -webkit-transform-origin: 50% 50%;
 -webkit-transform: scale(1, 1);
}
}
@keyframes swashIn {
 0% {
 opacity: 0;
 transform-origin: 50% 50%;
 transform: scale(0, 0);
}
 90% {
 opacity: 1;
 transform-origin: 50% 50%;
 transform: scale(0.9, 0.9);
}
 100% {
 opacity: 1;
 transform-origin: 50% 50%;
 transform: scale(1, 1);
}
}
@-webkit-keyframes foolishOut {
 0% {
 opacity: 1;
 -webkit-transform-origin: 50% 50%;
 -webkit-transform: scale(1, 1) rotate(360deg);
}
 20% {
 opacity: 1;
 -webkit-transform-origin: 0% 0%;
 -webkit-transform: scale(0.5, 0.5) rotate(0deg);
}
 40% {
 opacity: 1;
 -webkit-transform-origin: 100% 0%;
 -webkit-transform: scale(0.5, 0.5) rotate(0deg);
}
 60% {
 opacity: 1;
 -webkit-transform-origin: 0%;
 -webkit-transform: scale(0.5, 0.5) rotate(0deg);
}
 80% {
 opacity: 1;
 -webkit-transform-origin: 0% 100%;
 -webkit-transform: scale(0.5, 0.5) rotate(0deg);
}
 100% {
 opacity: 0;
 -webkit-transform-origin: 50% 50%;
 -webkit-transform: scale(0, 0) rotate(0deg);
}
}
@keyframes foolishOut {
 0% {
 opacity: 1;
 transform-origin: 50% 50%;
 transform: scale(1, 1) rotate(360deg);
}
 20% {
 opacity: 1;
 transform-origin: 0% 0%;
 transform: scale(0.5, 0.5) rotate(0deg);
}
 40% {
 opacity: 1;
 transform-origin: 100% 0%;
 transform: scale(0.5, 0.5) rotate(0deg);
}
 60% {
 opacity: 1;
 transform-origin: 0%;
 transform: scale(0.5, 0.5) rotate(0deg);
}
 80% {
 opacity: 1;
 transform-origin: 0% 100%;
 transform: scale(0.5, 0.5) rotate(0deg);
}
 100% {
 opacity: 0;
 transform-origin: 50% 50%;
 transform: scale(0, 0) rotate(0deg);
}
}
@-webkit-keyframes foolishIn {
 0% {
 opacity: 0;
 -webkit-transform-origin: 50% 50%;
 -webkit-transform: scale(0, 0) rotate(360deg);
}
 20% {
 opacity: 1;
 -webkit-transform-origin: 0% 100%;
 -webkit-transform: scale(0.5, 0.5) rotate(0deg);
}
 40% {
 opacity: 1;
 -webkit-transform-origin: 100% 100%;
 -webkit-transform: scale(0.5, 0.5) rotate(0deg);
}
 60% {
 opacity: 1;
 -webkit-transform-origin: 0%;
 -webkit-transform: scale(0.5, 0.5) rotate(0deg);
}
 80% {
 opacity: 1;
 -webkit-transform-origin: 0% 0%;
 -webkit-transform: scale(0.5, 0.5) rotate(0deg);
}
 100% {
 opacity: 1;
 -webkit-transform-origin: 50% 50%;
 -webkit-transform: scale(1, 1) rotate(0deg);
}
}
@keyframes foolishIn {
 0% {
 opacity: 0;
 transform-origin: 50% 50%;
 transform: scale(0, 0) rotate(360deg);
}
 20% {
 opacity: 1;
 transform-origin: 0% 100%;
 transform: scale(0.5, 0.5) rotate(0deg);
}
 40% {
 opacity: 1;
 transform-origin: 100% 100%;
 transform: scale(0.5, 0.5) rotate(0deg);
}
 60% {
 opacity: 1;
 transform-origin: 0%;
 transform: scale(0.5, 0.5) rotate(0deg);
}
 80% {
 opacity: 1;
 transform-origin: 0% 0%;
 transform: scale(0.5, 0.5) rotate(0deg);
}
 100% {
 opacity: 1;
 transform-origin: 50% 50%;
 transform: scale(1, 1) rotate(0deg);
}
}
@-webkit-keyframes holeOut {
 0% {
 opacity: 1;
 -webkit-transform-origin: 50% 50%;
 -webkit-transform: scale(1, 1) rotateY(0deg);
}
 100% {
 opacity: 0;
 -webkit-transform-origin: 50% 50%;
 -webkit-transform: scale(0, 0) rotateY(180deg);
}
}
@keyframes holeOut {
 0% {
 opacity: 1;
 transform-origin: 50% 50%;
 transform: scale(1, 1) rotateY(0deg);
}
 100% {
 opacity: 0;
 transform-origin: 50% 50%;
 transform: scale(0, 0) rotateY(180deg);
}
}
@-webkit-keyframes tinRightOut {
 0%, 20%, 40%, 50% {
 opacity: 1;
 -webkit-transform: scale(1, 1) translateX(0);
}
 10%, 30% {
 opacity: 1;
 -webkit-transform: scale(1.1, 1.1) translateX(0);
}
 100% {
 opacity: 0;
 -webkit-transform: scale(1, 1) translateX(900%);
}
}
@keyframes tinRightOut {
 0%, 20%, 40%, 50% {
 opacity: 1;
 transform: scale(1, 1) translateX(0);
}
 10%, 30% {
 opacity: 1;
 transform: scale(1.1, 1.1) translateX(0);
}
 100% {
 opacity: 0;
 transform: scale(1, 1) translateX(900%);
}
}
@-webkit-keyframes tinLeftOut {
 0%, 20%, 40%, 50% {
 opacity: 1;
 -webkit-transform: scale(1, 1) translateX(0);
}
 10%, 30% {
 opacity: 1;
 -webkit-transform: scale(1.1, 1.1) translateX(0);
}
 100% {
 opacity: 0;
 -webkit-transform: scale(1, 1) translateX(-900%);
}
}
@keyframes tinLeftOut {
 0%, 20%, 40%, 50% {
 opacity: 1;
 transform: scale(1, 1) translateX(0);
}
 10%, 30% {
 opacity: 1;
 transform: scale(1.1, 1.1) translateX(0);
}
 100% {
 opacity: 0;
 transform: scale(1, 1) translateX(-900%);
}
}
@-webkit-keyframes tinUpOut {
 0%, 20%, 40%, 50% {
 opacity: 1;
 -webkit-transform: scale(1, 1) translateY(0);
}
 10%, 30% {
 opacity: 1;
 -webkit-transform: scale(1.1, 1.1) translateY(0);
}
 100% {
 opacity: 0;
 -webkit-transform: scale(1, 1) translateY(-900%);
}
}
@keyframes tinUpOut {
 0%, 20%, 40%, 50% {
 opacity: 1;
 transform: scale(1, 1) translateY(0);
}
 10%, 30% {
 opacity: 1;
 transform: scale(1.1, 1.1) translateY(0);
}
 100% {
 opacity: 0;
 transform: scale(1, 1) translateY(-900%);
}
}
@-webkit-keyframes tinDownOut {
 0%, 20%, 40%, 50% {
 opacity: 1;
 -webkit-transform: scale(1, 1) translateY(0);
}
 10%, 30% {
 opacity: 1;
 -webkit-transform: scale(1.1, 1.1) translateY(0);
}
 100% {
 opacity: 0;
 -webkit-transform: scale(1, 1) translateY(900%);
}
}
@keyframes tinDownOut {
 0%, 20%, 40%, 50% {
 opacity: 1;
 transform: scale(1, 1) translateY(0);
}
 10%, 30% {
 opacity: 1;
 transform: scale(1.1, 1.1) translateY(0);
}
 100% {
 opacity: 0;
 transform: scale(1, 1) translateY(900%);
}
}
@-webkit-keyframes tinRightIn {
 0% {
 opacity: 0;
 -webkit-transform: scale(1, 1) translateX(900%);
}
 50%, 70%, 90% {
 opacity: 1;
 -webkit-transform: scale(1.1, 1.1) translateX(0);
}
 60%, 80%, 100% {
 opacity: 1;
 -webkit-transform: scale(1, 1) translateX(0);
}
}
@keyframes tinRightIn {
 0% {
 opacity: 0;
 transform: scale(1, 1) translateX(900%);
}
 50%, 70%, 90% {
 opacity: 1;
 transform: scale(1.1, 1.1) translateX(0);
}
 60%, 80%, 100% {
 opacity: 1;
 transform: scale(1, 1) translateX(0);
}
}
@-webkit-keyframes tinLeftIn {
 0% {
 opacity: 0;
 -webkit-transform: scale(1, 1) translateX(-900%);
}
 50%, 70%, 90% {
 opacity: 1;
 -webkit-transform: scale(1.1, 1.1) translateX(0);
}
 60%, 80%, 100% {
 opacity: 1;
 -webkit-transform: scale(1, 1) translateX(0);
}
}
@keyframes tinLeftIn {
 0% {
 opacity: 0;
 transform: scale(1, 1) translateX(-900%);
}
 50%, 70%, 90% {
 opacity: 1;
 transform: scale(1.1, 1.1) translateX(0);
}
 60%, 80%, 100% {
 opacity: 1;
 transform: scale(1, 1) translateX(0);
}
}
@-webkit-keyframes tinUpIn {
 0% {
 opacity: 0;
 -webkit-transform: scale(1, 1) translateY(-900%);
}
 50%, 70%, 90% {
 opacity: 1;
 -webkit-transform: scale(1.1, 1.1) translateY(0);
}
 60%, 80%, 100% {
 opacity: 1;
 -webkit-transform: scale(1, 1) translateY(0);
}
}
@keyframes tinUpIn {
 0% {
 opacity: 0;
 transform: scale(1, 1) translateY(-900%);
}
 50%, 70%, 90% {
 opacity: 1;
 transform: scale(1.1, 1.1) translateY(0);
}
 60%, 80%, 100% {
 opacity: 1;
 transform: scale(1, 1) translateY(0);
}
}
@-webkit-keyframes tinDownIn {
 0% {
 opacity: 0;
 -webkit-transform: scale(1, 1) translateY(900%);
}
 50%, 70%, 90% {
 opacity: 1;
 -webkit-transform: scale(1.1, 1.1) translateY(0);
}
 60%, 80%, 100% {
 opacity: 1;
 -webkit-transform: scale(1, 1) translateY(0);
}
}
@keyframes tinDownIn {
 0% {
 opacity: 0;
 transform: scale(1, 1) translateY(900%);
}
 50%, 70%, 90% {
 opacity: 1;
 transform: scale(1.1, 1.1) translateY(0);
}
 60%, 80%, 100% {
 opacity: 1;
 transform: scale(1, 1) translateY(0);
}
}
@-webkit-keyframes bombRightOut {
 0% {
 opacity: 1;
 -webkit-transform-origin: 50% 50%;
 -webkit-transform: rotate(0deg);
 -webkit-filter: blur(0px);
}
 50% {
 opacity: 1;
 -webkit-transform-origin: 200% 50%;
 -webkit-transform: rotate(160deg);
 -webkit-filter: blur(0px);
}
 100% {
 opacity: 0;
 -webkit-transform-origin: 200% 50%;
 -webkit-transform: rotate(160deg);
 -webkit-filter: blur(20px);
}
}
@keyframes bombRightOut {
 0% {
 opacity: 1;
 transform-origin: 50% 50%;
 transform: rotate(0deg);
 -webkit-filter: blur(0px);
}
 50% {
 opacity: 1;
 transform-origin: 200% 50%;
 transform: rotate(160deg);
 -webkit-filter: blur(0px);
}
 100% {
 opacity: 0;
 transform-origin: 200% 50%;
 transform: rotate(160deg);
 -webkit-filter: blur(20px);
}
}
@-webkit-keyframes bombLeftOut {
 0% {
 opacity: 1;
 -webkit-transform-origin: 50% 50%;
 -webkit-transform: rotate(0deg);
 -webkit-filter: blur(0px);
}
 50% {
 opacity: 1;
 -webkit-transform-origin: -100% 50%;
 -webkit-transform: rotate(-160deg);
 -webkit-filter: blur(0px);
}
 100% {
 opacity: 0;
 -webkit-transform-origin: -100% 50%;
 -webkit-transform: rotate(-160deg);
 -webkit-filter: blur(20px);
}
}
@keyframes bombLeftOut {
 0% {
 opacity: 1;
 transform-origin: 50% 50%;
 transform: rotate(0deg);
 -webkit-filter: blur(0px);
}
 50% {
 opacity: 1;
 transform-origin: -100% 50%;
 transform: rotate(-160deg);
 -webkit-filter: blur(0px);
}
 100% {
 opacity: 0;
 transform-origin: -100% 50%;
 transform: rotate(-160deg);
 -webkit-filter: blur(20px);
}
}
@-webkit-keyframes boingInUp {
 0% {
 opacity: 0;
 -webkit-transform-origin: 50% 0%;
 -webkit-transform: perspective(800px) rotateX(-90deg);
}
 50% {
 opacity: 1;
 -webkit-transform-origin: 50% 0%;
 -webkit-transform: perspective(800px) rotateX(50deg);
}
 100% {
 opacity: 1;
 -webkit-transform-origin: 50% 0%;
 -webkit-transform: perspective(800px) rotateX(0deg);
}
}
@keyframes boingInUp {
 0% {
 opacity: 0;
 transform-origin: 50% 0%;
 transform: perspective(800px) rotateX(-90deg);
}
 50% {
 opacity: 1;
 transform-origin: 50% 0%;
 transform: perspective(800px) rotateX(50deg);
}
 100% {
 opacity: 1;
 transform-origin: 50% 0%;
 transform: perspective(800px) rotateX(0deg);
}
}
@-webkit-keyframes boingOutDown {
 0% {
 opacity: 1;
 -webkit-transform-origin: 100% 100%;
 -webkit-transform: perspective(800px) rotateX(0deg) rotateY(0deg);
}
 20% {
 opacity: 1;
 -webkit-transform-origin: 100% 100%;
 -webkit-transform: perspective(800px) rotateX(0deg) rotateY(10deg);
}
 30% {
 opacity: 1;
 -webkit-transform-origin: 0% 100%;
 -webkit-transform: perspective(800px) rotateX(0deg) rotateY(0deg);
}
 40% {
 opacity: 1;
 -webkit-transform-origin: 0% 100%;
 -webkit-transform: perspective(800px) rotateX(10deg) rotateY(10deg);
}
 100% {
 opacity: 0;
 -webkit-transform-origin: 100% 100%;
 -webkit-transform: perspective(800px) rotateX(90deg) rotateY(0deg);
}
}
@keyframes boingOutDown {
 0% {
 opacity: 1;
 transform-origin: 100% 100%;
 transform: perspective(800px) rotateX(0deg) rotateY(0deg);
}
 20% {
 opacity: 1;
 transform-origin: 100% 100%;
 transform: perspective(800px) rotateX(0deg) rotateY(10deg);
}
 30% {
 opacity: 1;
 transform-origin: 0% 100%;
 transform: perspective(800px) rotateX(0deg) rotateY(0deg);
}
 40% {
 opacity: 1;
 transform-origin: 0% 100%;
 transform: perspective(800px) rotateX(10deg) rotateY(10deg);
}
 100% {
 opacity: 0;
 transform-origin: 100% 100%;
 transform: perspective(800px) rotateX(90deg) rotateY(0deg);
}
}
@-webkit-keyframes spaceOutUp {
 0% {
 opacity: 1;
 -webkit-transform-origin: 50% 0%;
 -webkit-transform: scale(1) translate(0%, 0%);
}
 100% {
 opacity: 0;
 -webkit-transform-origin: 50% 0%;
 -webkit-transform: scale(.2) translate(0%, -200%);
}
}
@keyframes spaceOutUp {
 0% {
 opacity: 1;
 transform-origin: 50% 0%;
 transform: scale(1) translate(0%, 0%);
}
 100% {
 opacity: 0;
 transform-origin: 50% 0%;
 transform: scale(.2) translate(0%, -200%);
}
}
@-webkit-keyframes spaceOutRight {
 0% {
 opacity: 1;
 -webkit-transform-origin: 100% 50%;
 -webkit-transform: scale(1) translate(0%, 0%);
}
 100% {
 opacity: 0;
 -webkit-transform-origin: 100% 50%;
 -webkit-transform: scale(.2) translate(200%, 0%);
}
}
@keyframes spaceOutRight {
 0% {
 opacity: 1;
 transform-origin: 100% 50%;
 transform: scale(1) translate(0%, 0%);
}
 100% {
 opacity: 0;
 transform-origin: 100% 50%;
 transform: scale(.2) translate(200%, 0%);
}
}
@-webkit-keyframes spaceOutDown {
 0% {
 opacity: 1;
 -webkit-transform-origin: 50% 100%;
 -webkit-transform: scale(1) translate(0%, 0%);
}
 100% {
 opacity: 0;
 -webkit-transform-origin: 50% 100%;
 -webkit-transform: scale(.2) translate(0%, 200%);
}
}
@keyframes spaceOutDown {
 0% {
 opacity: 1;
 transform-origin: 50% 100%;
 transform: scale(1) translate(0%, 0%);
}
 100% {
 opacity: 0;
 transform-origin: 50% 100%;
 transform: scale(.2) translate(0%, 200%);
}
}
@-webkit-keyframes spaceOutLeft {
 0% {
 opacity: 1;
 -webkit-transform-origin: 0% 50%;
 -webkit-transform: scale(1) translate(0%, 0%);
}
 100% {
 opacity: 0;
 -webkit-transform-origin: 0% 50%;
 -webkit-transform: scale(.2) translate(-200%, 0%);
}
}
@keyframes spaceOutLeft {
 0% {
 opacity: 1;
 transform-origin: 0% 50%;
 transform: scale(1) translate(0%, 0%);
}
 100% {
 opacity: 0;
 transform-origin: 0% 50%;
 transform: scale(.2) translate(-200%, 0%);
}
}
@-webkit-keyframes spaceInUp {
 0% {
 opacity: 0;
 -webkit-transform-origin: 50% 0%;
 -webkit-transform: scale(.2) translate(0%, -200%);
}
 100% {
 opacity: 1;
 -webkit-transform-origin: 50% 0%;
 -webkit-transform: scale(1) translate(0%, 0%);
}
}
@keyframes spaceInUp {
 0% {
 opacity: 0;
 transform-origin: 50% 0%;
 transform: scale(.2) translate(0%, -200%);
}
 100% {
 opacity: 1;
 transform-origin: 50% 0%;
 transform: scale(1) translate(0%, 0%);
}
}
@-webkit-keyframes spaceInRight {
 0% {
 opacity: 0;
 -webkit-transform-origin: 100% 50%;
 -webkit-transform: scale(.2) translate(200%, 0%);
}
 100% {
 opacity: 1;
 -webkit-transform-origin: 100% 50%;
 -webkit-transform: scale(1) translate(0%, 0%);
}
}
@keyframes spaceInRight {
 0% {
 opacity: 0;
 transform-origin: 100% 50%;
 transform: scale(.2) translate(200%, 0%);
}
 100% {
 opacity: 1;
 transform-origin: 100% 50%;
 transform: scale(1) translate(0%, 0%);
}
}
@-webkit-keyframes spaceInDown {
 0% {
 opacity: 0;
 -webkit-transform-origin: 50% 100%;
 -webkit-transform: scale(.2) translate(0%, 200%);
}
 100% {
 opacity: 1;
 -webkit-transform-origin: 50% 100%;
 -webkit-transform: scale(1) translate(0%, 0%);
}
}
@keyframes spaceInDown {
 0% {
 opacity: 0;
 transform-origin: 50% 100%;
 transform: scale(.2) translate(0%, 200%);
}
 100% {
 opacity: 1;
 transform-origin: 50% 100%;
 transform: scale(1) translate(0%, 0%);
}
}
@-webkit-keyframes spaceInLeft {
 0% {
 opacity: 0;
 -webkit-transform-origin: 0% 50%;
 -webkit-transform: scale(.2) translate(-200%, 0%);
}
 100% {
 opacity: 1;
 -webkit-transform-origin: 0% 50%;
 -webkit-transform: scale(1) translate(0%, 0%);
}
}
@keyframes spaceInLeft {
 0% {
 opacity: 0;
 transform-origin: 0% 50%;
 transform: scale(.2) translate(-200%, 0%);
}
 100% {
 opacity: 1;
 transform-origin: 0% 50%;
 transform: scale(1) translate(0%, 0%);
}
}