@-webkit-keyframes x-slide-up {
0% {
opacity: 0;
-webkit-transform: translateY(50px);
-moz-transform:    translateY(50px);
-ms-transform:     translateY(50px);
-o-transform:      translateY(50px);
transform:         translateY(50px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
-moz-transform:    translateY(0);
-ms-transform:     translateY(0);
-o-transform:      translateY(0);
transform:         translateY(0);
}
}
@-o-keyframes x-slide-up {
0% {
opacity: 0;
-webkit-transform: translateY(50px);
-moz-transform:    translateY(50px);
-ms-transform:     translateY(50px);
-o-transform:      translateY(50px);
transform:         translateY(50px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
-moz-transform:    translateY(0);
-ms-transform:     translateY(0);
-o-transform:      translateY(0);
transform:         translateY(0);
}
}
@keyframes x-slide-up {
0% {
opacity: 0;
-webkit-transform: translateY(50px);
-moz-transform:    translateY(50px);
-ms-transform:     translateY(50px);
-o-transform:      translateY(50px);
transform:         translateY(50px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
-moz-transform:    translateY(0);
-ms-transform:     translateY(0);
-o-transform:      translateY(0);
transform:         translateY(0);
}
}
@-webkit-keyframes x-slide-up-out {
0% {
opacity: 1;
-webkit-transform: translateY(0);
-moz-transform:    translateY(0);
-ms-transform:     translateY(0);
-o-transform:      translateY(0);
transform:         translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(50px);
-moz-transform:    translateY(50px);
-ms-transform:     translateY(50px);
-o-transform:      translateY(50px);
transform:         translateY(50px);
}
}
@-o-keyframes x-slide-up-out {
0% {
opacity: 1;
-webkit-transform: translateY(0);
-moz-transform:    translateY(0);
-ms-transform:     translateY(0);
-o-transform:      translateY(0);
transform:         translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(50px);
-moz-transform:    translateY(50px);
-ms-transform:     translateY(50px);
-o-transform:      translateY(50px);
transform:         translateY(50px);
}
}
@keyframes x-slide-up-out {
0% {
opacity: 1;
-webkit-transform: translateY(0);
-moz-transform:    translateY(0);
-ms-transform:     translateY(0);
-o-transform:      translateY(0);
transform:         translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(50px);
-moz-transform:    translateY(50px);
-ms-transform:     translateY(50px);
-o-transform:      translateY(50px);
transform:         translateY(50px);
}
}
.x-slide-up {
-webkit-animation: x-slide-up 0.5s 0s 1 ease-in-out;
-moz-animation: x-slide-up 0.5s 0s 1 ease-in-out;
-ms-animation: x-slide-up 0.5s 0s 1 ease-in-out;
-o-animation: x-slide-up 0.5s 0s 1 ease-in-out;
animation: x-slide-up 0.5s 0s 1 ease-in-out;
-webkit-animation-fill-mode: both;
-moz-animation-fill-mode:    both;
-o-animation-fill-mode:      both;
animation-fill-mode:         both;
}
.x-slide-up-out {
-webkit-animation: x-slide-up-out 0.5s 0s 1 ease-in-out;
-moz-animation: x-slide-up-out 0.5s 0s 1 ease-in-out;
-ms-animation: x-slide-up-out 0.5s 0s 1 ease-in-out;
-o-animation: x-slide-up-out 0.5s 0s 1 ease-in-out;
animation: x-slide-up-out 0.5s 0s 1 ease-in-out;
-webkit-animation-fill-mode: both;
-moz-animation-fill-mode:    both;
-o-animation-fill-mode:      both;
animation-fill-mode:         both;
} @-webkit-keyframes x-slide-down {
0% {
opacity: 0;
-webkit-transform: translateY(-50px);
-moz-transform:    translateY(-50px);
-ms-transform:     translateY(-50px);
-o-transform:      translateY(-50px);
transform:         translateY(-50px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
-moz-transform:    translateY(0);
-ms-transform:     translateY(0);
-o-transform:      translateY(0);
transform:         translateY(0);
}
}
@-o-keyframes x-slide-down {
0% {
opacity: 0;
-webkit-transform: translateY(-50px);
-moz-transform:    translateY(-50px);
-ms-transform:     translateY(-50px);
-o-transform:      translateY(-50px);
transform:         translateY(-50px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
-moz-transform:    translateY(0);
-ms-transform:     translateY(0);
-o-transform:      translateY(0);
transform:         translateY(0);
}
}
@keyframes x-slide-down {
0% {
opacity: 0;
-webkit-transform: translateY(-50px);
-moz-transform:    translateY(-50px);
-ms-transform:     translateY(-50px);
-o-transform:      translateY(-50px);
transform:         translateY(-50px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
-moz-transform:    translateY(0);
-ms-transform:     translateY(0);
-o-transform:      translateY(0);
transform:         translateY(0);
}
}
@-webkit-keyframes x-slide-down-out {
0% {
opacity: 1;
-webkit-transform: translateY(0);
-moz-transform:    translateY(0);
-ms-transform:     translateY(0);
-o-transform:      translateY(0);
transform:         translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(-50px);
-moz-transform:    translateY(-50px);
-ms-transform:     translateY(-50px);
-o-transform:      translateY(-50px);
transform:         translateY(-50px);
}
}
@-o-keyframes x-slide-down-out {
0% {
opacity: 1;
-webkit-transform: translateY(0);
-moz-transform:    translateY(0);
-ms-transform:     translateY(0);
-o-transform:      translateY(0);
transform:         translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(-50px);
-moz-transform:    translateY(-50px);
-ms-transform:     translateY(-50px);
-o-transform:      translateY(-50px);
transform:         translateY(-50px);
}
}
@keyframes x-slide-down-out {
0% {
opacity: 1;
-webkit-transform: translateY(0);
-moz-transform:    translateY(0);
-ms-transform:     translateY(0);
-o-transform:      translateY(0);
transform:         translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(-50px);
-moz-transform:    translateY(-50px);
-ms-transform:     translateY(-50px);
-o-transform:      translateY(-50px);
transform:         translateY(-50px);
}
}
.x-slide-down {
-webkit-animation: x-slide-down 0.5s 0s 1 ease-in-out;
-moz-animation: x-slide-down 0.5s 0s 1 ease-in-out;
-ms-animation: x-slide-down 0.5s 0s 1 ease-in-out;
-o-animation: x-slide-down 0.5s 0s 1 ease-in-out;
animation: x-slide-down 0.5s 0s 1 ease-in-out;
-webkit-animation-fill-mode: both;
-moz-animation-fill-mode:    both;
-o-animation-fill-mode:      both;
animation-fill-mode:         both;
}
.x-slide-down-out {
-webkit-animation: x-slide-down-out 0.5s 0s 1 ease-in-out;
-moz-animation: x-slide-down-out 0.5s 0s 1 ease-in-out;
-ms-animation: x-slide-down-out 0.5s 0s 1 ease-in-out;
-o-animation: x-slide-down-out 0.5s 0s 1 ease-in-out;
animation: x-slide-down-out 0.5s 0s 1 ease-in-out;
-webkit-animation-fill-mode: both;
-moz-animation-fill-mode:    both;
-o-animation-fill-mode:      both;
animation-fill-mode:         both;
} @-webkit-keyframes x-slide-left {
0% {
opacity: 0;
-webkit-transform: translateX(-50px);
-moz-transform:    translateX(-50px);
-ms-transform:     translateX(-50px);
-o-transform:      translateX(-50px);
transform:         translateX(-50px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
-moz-transform:    translateX(0);
-ms-transform:     translateX(0);
-o-transform:      translateX(0);
transform:         translateX(0);
}
}
@-o-keyframes x-slide-left {
0% {
opacity: 0;
-webkit-transform: translateX(-50px);
-moz-transform:    translateX(-50px);
-ms-transform:     translateX(-50px);
-o-transform:      translateX(-50px);
transform:         translateX(-50px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
-moz-transform:    translateX(0);
-ms-transform:     translateX(0);
-o-transform:      translateX(0);
transform:         translateX(0);
}
}
@keyframes x-slide-left {
0% {
opacity: 0;
-webkit-transform: translateX(-50px);
-moz-transform:    translateX(-50px);
-ms-transform:     translateX(-50px);
-o-transform:      translateX(-50px);
transform:         translateX(-50px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
-moz-transform:    translateX(0);
-ms-transform:     translateX(0);
-o-transform:      translateX(0);
transform:         translateX(0);
}
}
@-webkit-keyframes x-slide-left-out {
0% {
opacity: 1;
-webkit-transform: translateX(0);
-moz-transform:    translateX(0);
-ms-transform:     translateX(0);
-o-transform:      translateX(0);
transform:         translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(-50px);
-moz-transform:    translateX(-50px);
-ms-transform:     translateX(-50px);
-o-transform:      translateX(-50px);
transform:         translateX(-50px);
}
}
@-o-keyframes x-slide-left-out {
0% {
opacity: 1;
-webkit-transform: translateX(0);
-moz-transform:    translateX(0);
-ms-transform:     translateX(0);
-o-transform:      translateX(0);
transform:         translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(-50px);
-moz-transform:    translateX(-50px);
-ms-transform:     translateX(-50px);
-o-transform:      translateX(-50px);
transform:         translateX(-50px);
}
}
@keyframes x-slide-left-out {
0% {
opacity: 1;
-webkit-transform: translateX(0);
-moz-transform:    translateX(0);
-ms-transform:     translateX(0);
-o-transform:      translateX(0);
transform:         translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(-50px);
-moz-transform:    translateX(-50px);
-ms-transform:     translateX(-50px);
-o-transform:      translateX(-50px);
transform:         translateX(-50px);
}
}
.x-slide-left {
-webkit-animation: x-slide-left 0.5s 0s 1 ease-in-out;
-moz-animation: x-slide-left 0.5s 0s 1 ease-in-out;
-ms-animation: x-slide-left 0.5s 0s 1 ease-in-out;
-o-animation: x-slide-left 0.5s 0s 1 ease-in-out;
animation: x-slide-left 0.5s 0s 1 ease-in-out;
-webkit-animation-fill-mode: both;
-moz-animation-fill-mode:    both;
-o-animation-fill-mode:      both;
animation-fill-mode:         both;
}
.x-slide-left-out {
-webkit-animation: x-slide-left-out 0.5s 0s 1 ease-in-out;
-moz-animation: x-slide-left-out 0.5s 0s 1 ease-in-out;
-ms-animation: x-slide-left-out 0.5s 0s 1 ease-in-out;
-o-animation: x-slide-left-out 0.5s 0s 1 ease-in-out;
animation: x-slide-left-out 0.5s 0s 1 ease-in-out;
-webkit-animation-fill-mode: both;
-moz-animation-fill-mode:    both;
-o-animation-fill-mode:      both;
animation-fill-mode:         both;
} @-webkit-keyframes x-slide-right {
0% {
opacity: 0;
-webkit-transform: translateX(50px);
-moz-transform:    translateX(50px);
-ms-transform:     translateX(50px);
-o-transform:      translateX(50px);
transform:         translateX(50px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
-moz-transform:    translateX(0);
-ms-transform:     translateX(0);
-o-transform:      translateX(0);
transform:         translateX(0);
}
}
@-o-keyframes x-slide-right {
0% {
opacity: 0;
-webkit-transform: translateX(50px);
-moz-transform:    translateX(50px);
-ms-transform:     translateX(50px);
-o-transform:      translateX(50px);
transform:         translateX(50px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
-moz-transform:    translateX(0);
-ms-transform:     translateX(0);
-o-transform:      translateX(0);
transform:         translateX(0);
}
}
@keyframes x-slide-right {
0% {
opacity: 0;
-webkit-transform: translateX(50px);
-moz-transform:    translateX(50px);
-ms-transform:     translateX(50px);
-o-transform:      translateX(50px);
transform:         translateX(50px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
-moz-transform:    translateX(0);
-ms-transform:     translateX(0);
-o-transform:      translateX(0);
transform:         translateX(0);
}
}
@-webkit-keyframes x-slide-right-out {
0% {
opacity: 1;
-webkit-transform: translateX(0);
-moz-transform:    translateX(0);
-ms-transform:     translateX(0);
-o-transform:      translateX(0);
transform:         translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(50px);
-moz-transform:    translateX(50px);
-ms-transform:     translateX(50px);
-o-transform:      translateX(50px);
transform:         translateX(50px);
}
}
@-o-keyframes x-slide-right-out {
0% {
opacity: 1;
-webkit-transform: translateX(0);
-moz-transform:    translateX(0);
-ms-transform:     translateX(0);
-o-transform:      translateX(0);
transform:         translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(50px);
-moz-transform:    translateX(50px);
-ms-transform:     translateX(50px);
-o-transform:      translateX(50px);
transform:         translateX(50px);
}
}
@keyframes x-slide-right-out {
0% {
opacity: 1;
-webkit-transform: translateX(0);
-moz-transform:    translateX(0);
-ms-transform:     translateX(0);
-o-transform:      translateX(0);
transform:         translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(50px);
-moz-transform:    translateX(50px);
-ms-transform:     translateX(50px);
-o-transform:      translateX(50px);
transform:         translateX(50px);
}
}
.x-slide-right {
-webkit-animation: x-slide-right 0.5s 0s 1 ease-in-out;
-moz-animation: x-slide-right 0.5s 0s 1 ease-in-out;
-ms-animation: x-slide-right 0.5s 0s 1 ease-in-out;
-o-animation: x-slide-right 0.5s 0s 1 ease-in-out;
animation: x-slide-right 0.5s 0s 1 ease-in-out;
-webkit-animation-fill-mode: both;
-moz-animation-fill-mode:    both;
-o-animation-fill-mode:      both;
animation-fill-mode:         both;
}
.x-slide-right-out {
-webkit-animation: x-slide-right-out 0.5s 0s 1 ease-in-out;
-moz-animation: x-slide-right-out 0.5s 0s 1 ease-in-out;
-ms-animation: x-slide-right-out 0.5s 0s 1 ease-in-out;
-o-animation: x-slide-right-out 0.5s 0s 1 ease-in-out;
animation: x-slide-right-out 0.5s 0s 1 ease-in-out;
-webkit-animation-fill-mode: both;
-moz-animation-fill-mode:    both;
-o-animation-fill-mode:      both;
animation-fill-mode:         both;
} @-webkit-keyframes x-fade-in {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@-o-keyframes x-fade-in {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes x-fade-in {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@-webkit-keyframes x-fade-in-out {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@-o-keyframes x-fade-in-out {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@keyframes x-fade-in-out {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
.x-fade-in {
-webkit-animation: x-fade-in 0.5s 0s 1 ease-in-out;
-moz-animation: x-fade-in 0.5s 0s 1 ease-in-out;
-ms-animation: x-fade-in 0.5s 0s 1 ease-in-out;
-o-animation: x-fade-in 0.5s 0s 1 ease-in-out;
animation: x-fade-in 0.5s 0s 1 ease-in-out;
-webkit-animation-fill-mode: both;
-moz-animation-fill-mode:    both;
-o-animation-fill-mode:      both;
animation-fill-mode:         both;
}
.x-fade-in-out {
-webkit-animation: x-fade-in-out 0.5s 0s 1 ease-in-out;
-moz-animation: x-fade-in-out 0.5s 0s 1 ease-in-out;
-ms-animation: x-fade-in-out 0.5s 0s 1 ease-in-out;
-o-animation: x-fade-in-out 0.5s 0s 1 ease-in-out;
animation: x-fade-in-out 0.5s 0s 1 ease-in-out;
-webkit-animation-fill-mode: both;
-moz-animation-fill-mode:    both;
-o-animation-fill-mode:      both;
animation-fill-mode:         both;
} @-webkit-keyframes x-sign-flip {
0% {
opacity: 0;
-webkit-transform: rotateX(-60deg);
-moz-transform:    rotateX(-60deg);
-ms-transform:     rotateX(-60deg);
-o-transform:      rotateX(-60deg);
transform:         rotateX(-60deg);
}
100% {
opacity: 1;
-webkit-transform: rotateX(0deg);
-moz-transform:    rotateX(0deg);
-ms-transform:     rotateX(0deg);
-o-transform:      rotateX(0deg);
transform:         rotateX(0deg);
}
}
@-o-keyframes x-sign-flip {
0% {
opacity: 0;
-webkit-transform: rotateX(-60deg);
-moz-transform:    rotateX(-60deg);
-ms-transform:     rotateX(-60deg);
-o-transform:      rotateX(-60deg);
transform:         rotateX(-60deg);
}
100% {
opacity: 1;
-webkit-transform: rotateX(0deg);
-moz-transform:    rotateX(0deg);
-ms-transform:     rotateX(0deg);
-o-transform:      rotateX(0deg);
transform:         rotateX(0deg);
}
}
@keyframes x-sign-flip {
0% {
opacity: 0;
-webkit-transform: rotateX(-60deg);
-moz-transform:    rotateX(-60deg);
-ms-transform:     rotateX(-60deg);
-o-transform:      rotateX(-60deg);
transform:         rotateX(-60deg);
}
100% {
opacity: 1;
-webkit-transform: rotateX(0deg);
-moz-transform:    rotateX(0deg);
-ms-transform:     rotateX(0deg);
-o-transform:      rotateX(0deg);
transform:         rotateX(0deg);
}
}
@-webkit-keyframes x-sign-flip-out {
0% {
opacity: 1;
-webkit-transform: rotateX(0deg);
-moz-transform:    rotateX(0deg);
-ms-transform:     rotateX(0deg);
-o-transform:      rotateX(0deg);
transform:         rotateX(0deg);
}
100% {
opacity: 0;
-webkit-transform: rotateX(-60deg);
-moz-transform:    rotateX(-60deg);
-ms-transform:     rotateX(-60deg);
-o-transform:      rotateX(-60deg);
transform:         rotateX(-60deg);
}
}
@-o-keyframes x-sign-flip-out {
0% {
opacity: 1;
-webkit-transform: rotateX(0deg);
-moz-transform:    rotateX(0deg);
-ms-transform:     rotateX(0deg);
-o-transform:      rotateX(0deg);
transform:         rotateX(0deg);
}
100% {
opacity: 0;
-webkit-transform: rotateX(-60deg);
-moz-transform:    rotateX(-60deg);
-ms-transform:     rotateX(-60deg);
-o-transform:      rotateX(-60deg);
transform:         rotateX(-60deg);
}
}
@keyframes x-sign-flip-out {
0% {
opacity: 1;
-webkit-transform: rotateX(0deg);
-moz-transform:    rotateX(0deg);
-ms-transform:     rotateX(0deg);
-o-transform:      rotateX(0deg);
transform:         rotateX(0deg);
}
100% {
opacity: 0;
-webkit-transform: rotateX(-60deg);
-moz-transform:    rotateX(-60deg);
-ms-transform:     rotateX(-60deg);
-o-transform:      rotateX(-60deg);
transform:         rotateX(-60deg);
}
}
.x-sign-flip { -webkit-transform-origin: 50% 0;
-moz-transform-origin: 50% 0;
-ms-transform-origin: 50% 0;
-o-transform-origin: 50% 0;
transform-origin: 50% 0;
-webkit-animation: x-sign-flip 0.5s 0s 1 ease-in-out;
-moz-animation: x-sign-flip 0.5s 0s 1 ease-in-out;
-ms-animation: x-sign-flip 0.5s 0s 1 ease-in-out;
-o-animation: x-sign-flip 0.5s 0s 1 ease-in-out;
animation: x-sign-flip 0.5s 0s 1 ease-in-out;
-webkit-animation-fill-mode: both;
-moz-animation-fill-mode:    both;
-o-animation-fill-mode:      both;
animation-fill-mode:         both;
}
.x-sign-flip-out { -webkit-transform-origin: 50% 0;
-moz-transform-origin: 50% 0;
-ms-transform-origin: 50% 0;
-o-transform-origin: 50% 0;
transform-origin: 50% 0;
-webkit-animation: x-sign-flip-out 0.5s 0s 1 ease-in-out;
-moz-animation: x-sign-flip-out 0.5s 0s 1 ease-in-out;
-ms-animation: x-sign-flip-out 0.5s 0s 1 ease-in-out;
-o-animation: x-sign-flip-out 0.5s 0s 1 ease-in-out;
animation: x-sign-flip-out 0.5s 0s 1 ease-in-out;
-webkit-animation-fill-mode: both;
-moz-animation-fill-mode:    both;
-o-animation-fill-mode:      both;
animation-fill-mode:         both;
}
.x-drop-from-bottom.x-sign-flip,
.x-drop-from-bottom.x-sign-flip-out{
-webkit-transform-origin: 50% 100%;
-moz-transform-origin: 50% 100%;
-ms-transform-origin: 50% 100%;
-o-transform-origin: 50% 100%;
transform-origin: 50% 100%;
}