body { -webkit-backface-visibility: hidden; }

.magictime {
-webkit-animation-duration: 3s;
-moz-animation-duration: 3s;
-o-animation-duration: 3s;
animation-duration: 3s;
-webkit-animation-fill-mode: both;
-moz-animation-fill-mode: both;
-o-animation-fill-mode: both;
animation-fill-mode: both;
}

@-webkit-keyframes magic {
0% { opacity: 1; -webkit-transform-origin: 100% 200%; -webkit-transform: scale(1.0,1.0) rotate(0deg); }
100% { opacity: 0; -webkit-transform-origin: 200% 500%; -webkit-transform: scale(0.0,0.0) rotate(270deg); }
}

@-moz-keyframes magic {
0% { opacity: 1; -moz-transform-origin: 100% 200%; -moz-transform: scale(1.0,1.0) rotate(0deg); }
100% { opacity: 0; -moz-transform-origin: 200% 500%; -moz-transform: scale(0.0,0.0) rotate(270deg); }
}

@-o-keyframes magic {
0% { opacity: 1; -o-transform-origin: 100% 200%; -o-transform: scale(1.0,1.0) rotate(0deg); }
100% { opacity: 0; -o-transform-origin: 200% 500%; -o-transform: scale(0.0,0.0) rotate(270deg); }
}

@keyframes magic {
0% { opacity: 1; transform-origin: 100% 200%; transform: scale(1.0,1.0) rotate(0deg); }
100% { opacity: 0; transform-origin: 200% 500%; transform: scale(0.0,0.0) rotate(270deg); }
}

.magic {
-webkit-animation-name: magic;
-moz-animation-name: magic;
-o-animation-name: magic;
animation-name: magic;
}

@-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; }
}

@-moz-keyframes openDownLeft {
0% { -moz-transform-origin: bottom left; -moz-transform: rotate(0deg); -moz-animation-timing-function: ease-out; }
100% { -moz-transform-origin: bottom left; -moz-transform: rotate(-110deg); -moz-animation-timing-function: ease-in-out; }
}

@-o-keyframes openDownLeft {
0% { -o-transform-origin: bottom left; -o-transform: rotate(0deg); -o-animation-timing-function: ease-out; }
100% { -o-transform-origin: bottom left; -o-transform: rotate(-110deg); -o-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 }
}

.openDownLeft {
-webkit-animation-name: openDownLeft;
-moz-animation-name: openDownLeft;
-o-animation-name: openDownLeft;
animation-name: openDownLeft;
}

@-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; }
}

@-moz-keyframes openDownRight {
0% { -moz-transform-origin: bottom right; -moz-transform: rotate(0deg); -moz-animation-timing-function: ease-out; }
100% { -moz-transform-origin: bottom right; -moz-transform: rotate(110deg); -moz-animation-timing-function: ease-in-out; }
}

@-o-keyframes openDownRight { 
0% { -o-transform-origin: bottom right; -o-transform: rotate(0deg); -o-animation-timing-function: ease-out; }
100% { -o-transform-origin: bottom right; -o-transform: rotate(110deg); -o-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 }
}

.openDownRight {
-webkit-animation-name: openDownRight;
-moz-animation-name: openDownRight;
-o-animation-name: openDownRight;
animation-name: openDownRight;
}

@-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; }
}

@-moz-keyframes openUpLeft {
0% { -moz-transform-origin: top left; -moz-transform: rotate(0deg); -moz-animation-timing-function: ease-out; }
100% { -moz-transform-origin: top left; -moz-transform: rotate(110deg); -moz-animation-timing-function: ease-in-out; }
}

@-o-keyframes openUpLeft { 
0% { -o-transform-origin: top left; -o-transform: rotate(0deg); -o-animation-timing-function: ease-out; }
100% { -o-transform-origin: top left; -o-transform: rotate(110deg); -o-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 }
}

.openUpLeft {
-webkit-animation-name: openUpLeft;
-moz-animation-name: openUpLeft;
-o-animation-name: openUpLeft;
animation-name: openUpLeft;
}

@-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; }
}

@-moz-keyframes openUpRight {
0% { -moz-transform-origin: top right; -moz-transform: rotate(0deg); -moz-animation-timing-function: ease-out; }
100% { -moz-transform-origin: top right; -moz-transform: rotate(-110deg); -moz-animation-timing-function: ease-in-out; }
}

@-o-keyframes openUpRight { 
0% { -o-transform-origin: top right; -o-transform: rotate(0deg); -o-animation-timing-function: ease-out; }
100% { -o-transform-origin: top right; -o-transform: rotate(-110deg); -o-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 }
}

.openUpRight {
-webkit-animation-name: openUpRight;
-moz-animation-name: openUpRight;
-o-animation-name: openUpRight;
animation-name: openUpRight;
}

@-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); }
}

@-moz-keyframes perspectiveDown {
0% { -moz-transform-origin: 0 100%; -moz-transform: perspective(800px) rotateX(0deg); }
100% { -moz-transform-origin: 0 100%; -moz-transform: perspective(800px) rotateX(-180deg); }
}

@-o-keyframes perspectiveDown { 
0% { -o-transform-origin: 0 100%; -o-transform: perspective(800px) rotateX(0deg); }
100% { -o-transform-origin: 0 100%; -o-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); }
}

.perspectiveDown {
-webkit-backface-visibility: visible !important;
-moz-backface-visibility: visible !important;
-o-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: perspectiveDown;
-moz-animation-name: perspectiveDown;
-o-animation-name: perspectiveDown;
animation-name: perspectiveDown;
}

@-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); }
}

@-moz-keyframes perspectiveLeft {
0% { -moz-transform-origin: 0 0; -moz-transform: perspective(800px) rotateY(0deg); }
100% { -moz-transform-origin: 0 0; -moz-transform: perspective(800px) rotateY(-180deg); }
}

@-o-keyframes perspectiveLeft { 
0% { -o-transform-origin: 0 0; -o-transform: perspective(800px) rotateY(0deg); }
100% { -o-transform-origin: 0 0; -o-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); }
}

.perspectiveLeft {
-webkit-backface-visibility: visible !important;
-moz-backface-visibility: visible !important;
-o-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: perspectiveLeft;
-moz-animation-name: perspectiveLeft;
-o-animation-name: perspectiveLeft;
animation-name: perspectiveLeft;
}

@-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); }
}

@-moz-keyframes perspectiveRight {
0% { -moz-transform-origin: 100% 0; -moz-transform: perspective(800px) rotateY(0deg); }
100% { -moz-transform-origin: 100% 0; -moz-transform: perspective(800px) rotateY(180deg); }
}

@-o-keyframes perspectiveRight { 
0% { -o-transform-origin: 100% 0; -o-transform: perspective(800px) rotateY(0deg); }
100% { -o-transform-origin: 100% 0; -o-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); }
}

.perspectiveRight {
-webkit-backface-visibility: visible !important;
-moz-backface-visibility: visible !important;
-o-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: perspectiveRight;
-moz-animation-name: perspectiveRight;
-o-animation-name: perspectiveRight;
animation-name: perspectiveRight;
}

@-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); }
}

@-moz-keyframes perspectiveUp {
0% { -moz-transform-origin: 0 0; -moz-transform: perspective(800px) rotateX(0deg); }
100% { -moz-transform-origin: 0 0; -moz-transform: perspective(800px) rotateX(180deg); }
}

@-o-keyframes perspectiveUp { 
0% { -o-transform-origin: 0 0; -o-transform: perspective(800px) rotateX(0deg); }
100% { -o-transform-origin: 0 0; -o-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); }
}

.perspectiveUp {
-webkit-backface-visibility: visible !important;
-moz-backface-visibility: visible !important;
-o-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: perspectiveUp;
-moz-animation-name: perspectiveUp;
-o-animation-name: perspectiveUp;
animation-name: perspectiveUp;
}

@-webkit-keyframes puffIn {
0% { opacity: 0; -webkit-transform-origin: 50% 50%; -webkit-transform: scale(2.0,2.0); -webkit-filter: blur(2px); }
100% { opacity: 1; -webkit-transform-origin: 50% 50%; -webkit-transform: scale(1.0,1.0); }
}

@-moz-keyframes puffIn {
0% { opacity: 0; -moz-transform-origin: 50% 50%; -moz-transform: scale(2.0,2.0); -moz-filter: blur(2px); }
100% { opacity: 1; -moz-transform-origin: 50% 50%; -moz-transform: scale(1.0,1.0); }
}

@-o-keyframes puffIn {
0% { opacity: 0; -o-transform-origin: 50% 50%; -o-transform: scale(2.0,2.0); -o-filter: blur(2px); }
100% { opacity: 1; -o-transform-origin: 50% 50%; -o-transform: scale(1.0,1.0); }
}

@keyframes puffIn {
0% { opacity: 0; transform-origin: 50% 50%; transform: scale(2.0,2.0); filter: blur(2px); }
100% { opacity: 1; transform-origin: 50% 50%; transform: scale(1.0,1.0); }
}

.puffIn { 
-webkit-animation-name: puffIn;
-moz-animation-name: puffIn;
-o-animation-name: puffIn;
animation-name: puffIn;
}

@-webkit-keyframes puffOut { 
0% { opacity: 1; -webkit-transform-origin: 50% 50%; -webkit-transform: scale(1.0,1.0); }
100% { opacity: 0; -webkit-transform-origin: 50% 50%; -webkit-transform: scale(2.0,2.0); -webkit-filter: blur(2px); }
}

@-moz-keyframes puffOut {
0% { opacity: 1; -moz-transform-origin: 50% 50%; -moz-transform: scale(1.0,1.0); }
100% { opacity: 0; -moz-transform-origin: 50% 50%; -moz-transform: scale(2.0,2.0); filter: blur(2px); }
}

@-o-keyframes puffOut { 
0% { opacity: 1; -o-transform-origin: 50% 50%; -o-transform: scale(1.0,1.0); }
100% { opacity: 0; -o-transform-origin: 50% 50%; -o-transform: scale(2.0,2.0); }
}

@keyframes puffOut { 
0% { opacity: 1; transform-origin: 50% 50%; transform: scale(1.0,1.0); }
100% { opacity: 0; transform-origin: 50% 50%; transform: scale(2.0,2.0); filter: blur(2px); }
}

.puffOut { 
-webkit-animation-name: puffOut;
-moz-animation-name: puffOut;
-o-animation-name: puffOut;
animation-name: puffOut;
}

@-webkit-keyframes rotateDown { 
0% { -webkit-transform-origin: 0 0; -webkit-transform: perspective(800px) rotateX(0deg) translate3d(0,0,0); }
100% { opacity: 0; -webkit-transform-origin: 50% 100%; -webkit-transform: perspective(800px) rotateX(-180deg) translate3d(0,0,300px); }
}

@-moz-keyframes rotateDown {
0% { -moz-transform-origin: 0 0; -moz-transform: perspective(800px) rotateX(0deg) translateZ(0px); }
100% { opacity: 0; -moz-transform-origin: 50% 100%; -moz-transform: perspective(800px) rotateX(-180deg) translateZ(300px); }
}

@-o-keyframes rotateDown { 
0% { -o-transform-origin: 0 0; -o-transform: perspective(800px) rotateX(0deg) translateZ(0px); }
100% { opacity: 0; -o-transform-origin: 50% 100%; -o-transform: perspective(800px) rotateX(-180deg) translateZ(300px); }
}

@keyframes rotateDown { 
0% { 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); }
}

.rotateDown {
-webkit-backface-visibility: visible !important;
-moz-backface-visibility: visible !important;
-o-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: rotateDown;
-moz-animation-name: rotateDown;
-o-animation-name: rotateDown;
animation-name: rotateDown;
}

@-webkit-keyframes rotateLeft { 
0% { -webkit-transform-origin: 0 0; -webkit-transform: perspective(800px) rotateY(0deg) translate3d(0,0,0); }
100% { opacity: 0; -webkit-transform-origin: 50% 0; -webkit-transform: perspective(800px) rotateY(180deg) translate3d(0,0,300px); }
}

@-moz-keyframes rotateLeft {
0% { -moz-transform-origin: 0 0; -moz-transform: perspective(800px) rotateY(0deg) translateZ(0px); }
100% { opacity: 0; -moz-transform-origin: 50% 0; -moz-transform: perspective(800px) rotateY(180deg) translateZ(300px); }
}

@-o-keyframes rotateLeft { 
0% { -o-transform-origin: 0 0; -o-transform: perspective(800px) rotateY(0deg) translateZ(0px); }
100% { opacity: 0; -o-transform-origin: 50% 0; -o-transform: perspective(800px) rotateY(180deg) translateZ(300px); }
}

@keyframes rotateLeft { 
0% { 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); }
}

.rotateLeft {
-webkit-backface-visibility: visible !important;
-moz-backface-visibility: visible !important;
-o-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: rotateLeft;
-moz-animation-name: rotateLeft;
-o-animation-name: rotateLeft;
animation-name: rotateLeft;
}

@-webkit-keyframes rotateRight { 
0% { -webkit-transform-origin: 0 0; -webkit-transform: perspective(800px) rotateY(0deg) translate3d(0,0,0); }
100% { opacity: 0; -webkit-transform-origin: 50% 0; -webkit-transform: perspective(800px) rotateY(-180deg) translate3d(0,0,150px); }
}

@-moz-keyframes rotateRight {
0% { -moz-transform-origin: 0 0; -moz-transform: perspective(800px) rotateY(0deg) translateZ(0px); }
100% { opacity: 0; -moz-transform-origin: 50% 0; -moz-transform: perspective(800px) rotateY(-180deg) translateZ(150px); }
}

@-o-keyframes rotateRight { 
0% { -o-transform-origin: 0 0; -o-transform: perspective(800px) rotateY(0deg) translate3d(0px); }
100% { opacity: 0; -o-transform-origin: 50% 0; -o-transform: perspective(800px) rotateY(-180deg) translateZ(150px); }
}

@keyframes rotateRight { 
0% { 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); }
}

.rotateRight {
-webkit-backface-visibility: visible !important;
-moz-backface-visibility: visible !important;
-o-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: rotateRight;
-moz-animation-name: rotateRight;
-o-animation-name: rotateRight;
animation-name: rotateRight;
}

@-webkit-keyframes rotateUp { 
0% { -webkit-transform-origin: 0 0; -webkit-transform: perspective(800px) rotateX(0deg) translate3d(0,0,0); }
100% { opacity: 0; -webkit-transform-origin: 50% 0; -webkit-transform: perspective(800px) rotateX(180deg) translate3d(0,0,100px); }
}

@-moz-keyframes rotateUp {
0% { -moz-transform-origin: 0 0; -moz-transform: perspective(800px) rotateX(0deg) translateZ(0px); }
100% { opacity: 0; -moz-transform-origin: 50% 0; -moz-transform: perspective(800px) rotateX(180deg) translateZ(100px); }
}

@-o-keyframes rotateUp { 
0% { -o-transform-origin: 0 0; -o-transform: perspective(800px) rotateX(0deg) translateZ(0px); }
100% { opacity: 0; -o-transform-origin: 50% 0; -o-transform: perspective(800px) rotateX(180deg) translateZ(100px); }
}

@keyframes rotateUp { 
0% { 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); }
}

.rotateUp {
-webkit-backface-visibility: visible !important;
-moz-backface-visibility: visible !important;
-o-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: rotateUp;
-moz-animation-name: rotateUp;
-o-animation-name: rotateUp;
animation-name: rotateUp;
}

@-webkit-keyframes slideDown { 
0% { -webkit-transform-origin: 0 0; -webkit-transform: translateY(0%); }
100% { -webkit-transform-origin: 0 0; -webkit-transform: translateY(100%); }
}

@-moz-keyframes slideDown {
0% { -moz-transform-origin: 0 0; -moz-transform: translateY(0%); }
100% { -moz-transform-origin: 0 0; -moz-transform: translateY(100%); }
}

@-o-keyframes slideDown { 
0% { -o-transform-origin: 0 0; -o-transform: translateY(0%); }
100% { -o-transform-origin: 0 0; -o-transform: translateY(100%); }
}

@-ms-keyframes slideDown {
0% { -ms-transform-origin: 0 0; -ms-transform: translateY(0%); }
100% { -ms-transform-origin: 0 0; -ms-transform: translateY(100%); }
}

@keyframes slideDown { 
0% { transform-origin: 0 0; transform: translateY(0%); }
100% { transform-origin: 0 0; transform: translateY(100%); }
}

.slideDown {
-webkit-animation-name: slideDown;
-moz-animation-name: slideDown;
-o-animation-name: slideDown;
animation-name: slideDown;
}

@-webkit-keyframes slideLeft { 
0% { -webkit-transform-origin: 0 0; -webkit-transform: translateX(0%); }
100% { -webkit-transform-origin: 0 0; -webkit-transform: translateX(-100%); }
}

@-moz-keyframes slideLeft {
0% { -moz-transform-origin: 0 0; -moz-transform: translateX(0%); }
100% { -moz-transform-origin: 0 0; -moz-transform: translateX(-100%); }
}

@-o-keyframes slideLeft { 
0% { -o-transform-origin: 0 0; -o-transform: translateX(0%); }
100% { -o-transform-origin: 0 0; -o-transform: translateX(-100%); }
}

@-ms-keyframes slideLeft {
0% { -ms-transform-origin: 0 0; -ms-transform: translateX(0%); }
100% { -ms-transform-origin: 0 0; -ms-transform: translateX(-100%); }
}

@keyframes slideLeft { 
0% { transform-origin: 0 0; transform: translateX(0%); }
100% { transform-origin: 0 0; transform: translateX(-100%); }
}

.slideLeft {
-webkit-animation-name: slideLeft;
-moz-animation-name: slideLeft;
-o-animation-name: slideLeft;
animation-name: slideLeft;
}

@-webkit-keyframes slideRight { 
0% { -webkit-transform-origin: 0 0; -webkit-transform: translateX(0%); }
100% { -webkit-transform-origin: 0 0; -webkit-transform: translateX(100%); }
}

@-moz-keyframes slideRight {
0% { -moz-transform-origin: 0 0; -moz-transform: translateX(0%); }
100% { -moz-transform-origin: 0 0; -moz-transform: translateX(100%); }
}

@-o-keyframes slideRight { 
0% { -o-transform-origin: 0 0; -o-transform: translateX(0%); }
100% { -o-transform-origin: 0 0; -o-transform: translateX(100%); }
}

@-ms-keyframes slideRight {
0% { -ms-transform-origin: 0 0; -ms-transform: translateX(0%); }
100% { -ms-transform-origin: 0 0; -ms-transform: translateX(100%); }
}

@keyframes slideRight { 
0% { transform-origin: 0 0; transform: translateX(0%); }
100% { transform-origin: 0 0; transform: translateX(100%); }
}

.slideRight {
-webkit-animation-name: slideRight;
-moz-animation-name: slideRight;
-o-animation-name: slideRight;
animation-name: slideRight;
}

@-webkit-keyframes slideUp { 
0% { -webkit-transform-origin: 0 0; -webkit-transform: translateY(0%); }
100% { -webkit-transform-origin: 0 0; -webkit-transform: translateY(-100%); }
}

@-moz-keyframes slideUp {
0% { -moz-transform-origin: 0 0; -moz-transform: translateY(0%); }
100% { -moz-transform-origin: 0 0; -moz-transform: translateY(-100%); }
}

@-o-keyframes slideUp { 
0% { -o-transform-origin: 0 0; -o-transform: translateY(0%); }
100% { -o-transform-origin: 0 0; -o-transform: translateY(-100%); }
}

@-ms-keyframes slideUp {
0% { -ms-transform-origin: 0 0; -ms-transform: translateY(0%); }
100% { -ms-transform-origin: 0 0; -ms-transform: translateY(-100%); }
}

@keyframes slideUp { 
0% { transform-origin: 0 0; transform: translateY(0%); }
100% { transform-origin: 0 0; transform: translateY(-100%); }
}

.slideUp {
-webkit-animation-name: slideUp;
-moz-animation-name: slideUp;
-o-animation-name: slideUp;
animation-name: slideUp;
}

@-webkit-keyframes swap { 
0% { opacity: 0; -webkit-transform-origin: 0 100%; -webkit-transform: scale(0.0,0.0) translate(-700px,0px); }
100% { opacity: 1; -webkit-transform-origin: 100% 100%; -webkit-transform: scale(1.0,1.0) translate(0px,0px); }
}

@-moz-keyframes swap {
0% { opacity: 0; -moz-transform-origin: 0 100%; -moz-transform: scale(0.0,0.0) translate(-700px,0px); }
100% { opacity: 1; -moz-transform-origin: 100% 100%; -moz-transform: scale(1.0,1.0) translate(0px,0px); }
}

@-o-keyframes swap { 
0% { opacity: 0; -o-transform-origin: 0 100%; -o-transform: scale(0.0,0.0) translate(-700px,0px); }
100% { opacity: 1; -o-transform-origin: 100% 100%; -o-transform: scale(1.0,1.0) translate(0px,0px); }
}

@keyframes swap { 
0% { opacity: 0; transform-origin: 0 100%; transform: scale(0.0,0.0) translate(-700px,0px); }
100% { opacity: 1; transform-origin: 100% 100%; transform: scale(1.0,1.0) translate(0px,0px); }
}

.swap { 
-webkit-animation-name: swap;
-moz-animation-name: swap;
-o-animation-name: swap;
animation-name: swap;
}

@-webkit-keyframes twisterInDown { 
0% { opacity: 0; -webkit-transform-origin: 0 100%; -webkit-transform: scale(0.0,0.0) rotate(360deg) translateY(-100%); }
30% { -webkit-transform-origin: 0 100%; -webkit-transform: scale(0.0,0.0) rotate(360deg) translateY(-100%); }
100% { opacity: 1; -webkit-transform-origin: 100% 100%; -webkit-transform: scale(1.0,1.0) rotate(0deg) translateY(0%); }
}

@-moz-keyframes twisterInDown {
0% { opacity: 0; -moz-transform-origin: 0 100%; -moz-transform: scale(0.0,0.0) rotate(360deg) translateY(-100%); }
30% { -moz-transform-origin: 0 100%; -moz-transform: scale(0.0,0.0) rotate(360deg) translateY(-100%); }
100% { opacity: 1; -moz-transform-origin: 100% 100%; -moz-transform: scale(1.0,1.0) rotate(0deg) translateY(0%); }
}

@-o-keyframes twisterInDown { 
0% { opacity: 0; -o-transform-origin: 0 100%; -o-transform: scale(0.0,0.0) rotate(360deg) translateY(-100%); }
30% { -o-transform-origin: 0 100%; -o-transform: scale(0.0,0.0) rotate(360deg) translateY(-100%); }
100% { opacity: 1; -o-transform-origin: 100% 100%; -o-transform: scale(1.0,1.0) rotate(0deg) translateY(0%); }
}

@keyframes twisterInDown { 
0% { opacity: 0; transform-origin: 0 100%; transform: scale(0.0,0.0) rotate(360deg) translateY(-100%); }
30% { transform-origin: 0 100%; transform: scale(0.0,0.0) rotate(360deg) translateY(-100%); }
100% { opacity: 1; transform-origin: 100% 100%; transform: scale(1.0,1.0) rotate(0deg) translateY(0%); }
}

.twisterInDown { 
-webkit-animation-name: twisterInDown;
-moz-animation-name: twisterInDown;
-o-animation-name: twisterInDown;
animation-name: twisterInDown;
}

@-webkit-keyframes twisterInUp { 
0% { opacity: 0; -webkit-transform-origin: 100% 0; -webkit-transform: scale(0.0,0.0) rotate(360deg) translateY(100%); }
30% { -webkit-transform-origin: 100% 0; -webkit-transform: scale(0.0,0.0) rotate(360deg) translateY(100%); }
100% { opacity: 1; -webkit-transform-origin: 0 0; -webkit-transform: scale(1.0,1.0) rotate(0deg) translateY(0%); }
}

@-moz-keyframes twisterInUp {
0% { opacity: 0; -moz-transform-origin: 100% 0; -moz-transform: scale(0.0,0.0) rotate(360deg) translateY(100%); }
30% { -moz-transform-origin: 100% 0; -moz-transform: scale(0.0,0.0) rotate(360deg) translateY(100%); }
100% { opacity: 1; -moz-transform-origin: 0 0; -moz-transform: scale(1.0,1.0) rotate(0deg) translateY(0); }
}

@-o-keyframes twisterInUp { 
0% { opacity: 0; -o-transform-origin: 100% 0; -o-transform: scale(0.0,0.0) rotate(360deg) translateY(100%); }
30% { -o-transform-origin: 100% 0; -o-transform: scale(0.0,0.0) rotate(360deg) translateY(100%); }
100% { opacity: 1; -o-transform-origin: 0 0; -o-transform: scale(1.0,1.0) rotate(0deg) translateY(0); }
}

@keyframes twisterInUp { 
0% { opacity: 0; transform-origin: 100% 0; transform: scale(0.0,0.0) rotate(360deg) translateY(100%); }
30% { transform-origin: 100% 0; transform: scale(0.0,0.0) rotate(360deg) translateY(100%); }
100% { opacity: 1; transform-origin: 0 0; transform: scale(1.0,1.0) rotate(0deg) translateY(0); }
}

.twisterInUp { 
-webkit-animation-name: twisterInUp;
-moz-animation-name: twisterInUp;
-o-animation-name: twisterInUp;
animation-name: twisterInUp;
}

@-webkit-keyframes vanishIn {
0% { opacity: 0; -webkit-transform-origin: 50% 50%; -webkit-transform: scale(2.0,2.0); -webkit-filter: blur(90px); }
100% { opacity: 1; -webkit-transform-origin: 50% 50%; -webkit-transform: scale(1.0,1.0); }
}

@-moz-keyframes vanishIn {
0% { opacity: 0; -moz-transform-origin: 50% 50%; -moz-transform: scale(2.0,2.0); filter: blur(90px); }
100% { opacity: 1; -moz-transform-origin: 50% 50%; -moz-transform: scale(1.0,1.0); }
}

@-o-keyframes vanishIn {
0% { opacity: 0; -o-transform-origin: 50% 50%; -o-transform: scale(2.0,2.0); -o-filter: blur(90px); }
100% { opacity: 1; -o-transform-origin: 50% 50%; -o-transform: scale(1.0,1.0); }
}

@keyframes vanishIn {
0% { opacity: 0; transform-origin: 50% 50%; transform: scale(2.0,2.0); filter: blur(90px); }
100% { opacity: 1; transform-origin: 50% 50%; transform: scale(1.0,1.0); }
}

.vanishIn { 
-webkit-animation-name: vanishIn;
-moz-animation-name: vanishIn;
-o-animation-name: vanishIn;
animation-name: vanishIn;
}

@-webkit-keyframes vanishOut { 
0% { opacity: 1; -webkit-transform-origin: 50% 50%; -webkit-transform: scale(1.0,1.0); }
100% { opacity: 0; -webkit-transform-origin: 50% 50%; -webkit-transform: scale(2.0,2.0); -webkit-filter: blur(20px); }
}

@-moz-keyframes vanishOut {
0% { opacity: 1; -moz-transform-origin: 50% 50%; -moz-transform: scale(1.0,1.0); }
100% { opacity: 0; -moz-transform-origin: 50% 50%; -moz-transform: scale(2.0,2.0); filter: blur(20px); }
}

@-o-keyframes vanishOut { 
0% { opacity: 1; -o-transform-origin: 50% 50%; -o-transform: scale(1.0,1.0); }
100% { opacity: 0; -o-transform-origin: 50% 50%; -o-transform: scale(2.0,2.0); -o-filter: blur(20px); }
}

@keyframes vanishOut { 
0% { opacity: 1; transform-origin: 50% 50%; transform: scale(1.0,1.0); }
100% { opacity: 0; transform-origin: 50% 50%; transform: scale(2.0,2.0); filter: blur(20px); }
}

.vanishOut { 
-webkit-animation-name: vanishOut;
-moz-animation-name: vanishOut;
-o-animation-name: vanishOut;
animation-name: vanishOut;
}