/**
 * Bounce animation
 */
.mcs-bounce[data-mode="animation"] .mcs-item[data-action="exit"]{-webkit-animation-timing-function:cubic-bezier(.84,0,1,1);animation-timing-function:cubic-bezier(.84,0,1,1);-webkit-animation-duration:0.4s;animation-duration:0.4s;-webkit-animation-delay:0s;animation-delay:0s}

.mcs-bounce[data-mode="animation"] .mcs-item[data-action="enter"]{-webkit-animation-timing-function:cubic-bezier(.12,.37,.25,1);animation-timing-function:cubic-bezier(.12,.37,.25,1);-webkit-animation-duration:0.4s;animation-duration:0.4s}

/* Horizontal Forward */
.mcs-bounce.MagicScroll-horizontal[data-mode="animation"] [data-forward] .mcs-item[data-action="exit"]{-webkit-animation-name:h-forward-exit-bounce;animation-name:h-forward-exit-bounce}
.mcs-bounce.MagicScroll-horizontal[data-mode="animation"] [data-forward] .mcs-item[data-action="enter"]{-webkit-animation-name:h-forward-enter-bounce;animation-name:h-forward-enter-bounce}

@-webkit-keyframes h-forward-exit-bounce{0%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}
    40%{opacity:0.6}
    100%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}
}
@keyframes h-forward-exit-bounce{0%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}
    40%{opacity:0.6}
    100%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}
}
@-webkit-keyframes h-forward-enter-bounce{0%{opacity:0;-webkit-transform:translateX(3000px);transform:translateX(3000px)}
    60%{opacity:1;-webkit-transform:translateX(-30px);transform:translateX(-30px)}
    75%{-webkit-transform:translateX(10px);transform:translateX(10px)}
    90%{-webkit-transform:translateX(-5px);transform:translateX(-5px)}
    100%{-webkit-transform:translateX(0px);transform:translateX(0px)}
}
@keyframes h-forward-enter-bounce{0%{opacity:0;-webkit-transform:translateX(3000px);transform:translateX(3000px)}
    60%{opacity:1;-webkit-transform:translateX(-30px);transform:translateX(-30px)}
    75%{-webkit-transform:translateX(10px);transform:translateX(10px)}
    90%{-webkit-transform:translateX(-5px);transform:translateX(-5px)}
    100%{-webkit-transform:translateX(0px);transform:translateX(0px)}
}

/* Horizontal Backward */
.mcs-bounce.MagicScroll-horizontal[data-mode="animation"] [data-backward] .mcs-item[data-action="exit"]{-webkit-animation-name:h-backward-exit-bounce;animation-name:h-backward-exit-bounce}
.mcs-bounce.MagicScroll-horizontal[data-mode="animation"] [data-backward] .mcs-item[data-action="enter"]{-webkit-animation-name:h-backward-enter-bounce;animation-name:h-backward-enter-bounce}
@-webkit-keyframes h-backward-exit-bounce{0%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}
    40%{opacity:0.6}
    100%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}
}
@keyframes h-backward-exit-bounce{0%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}
    40%{opacity:0.6}
    100%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}
}
@-webkit-keyframes h-backward-enter-bounce{0%{opacity:0;-webkit-transform:translateX(-3000px);transform:translateX(-3000px)}
    60%{opacity:1;-webkit-transform:translateX(30px);transform:translateX(30px)}
    75%{-webkit-transform:translateX(-10px);transform:translateX(-10px)}
    90%{-webkit-transform:translateX(5px);transform:translateX(5px)}
    100%{-webkit-transform:translateX(0px);transform:translateX(0px)}
}
@keyframes h-backward-enter-bounce{0%{opacity:0;-webkit-transform:translateX(-3000px);transform:translateX(-3000px)}
    60%{opacity:1;-webkit-transform:translateX(30px);transform:translateX(30px)}
    75%{-webkit-transform:translateX(-10px);transform:translateX(-10px)}
    90%{-webkit-transform:translateX(5px);transform:translateX(5px)}
    100%{-webkit-transform:translateX(0px);transform:translateX(0px)}
}

/* Vertical Forward */
.mcs-bounce.MagicScroll-vertical[data-mode="animation"] [data-forward] div[data-action="exit"]{-webkit-animation-name:v-forward-exit-bounce;animation-name:v-forward-exit-bounce}
.mcs-bounce.MagicScroll-vertical[data-mode="animation"] [data-forward] div[data-action="enter"]{-webkit-animation-name:v-forward-enter-bounce;animation-name:v-forward-enter-bounce}
.mcs-bounce.MagicScroll-vertical[data-mode="animation"] [data-forward] [data-entering]{-webkit-transform:translateY(100000px);transform:translateY(100000px)}
.mcs-bounce.MagicScroll-vertical[data-mode="animation"] [data-forward] [data-exited]{-webkit-transform:translateY(100000px);transform:translateY(100000px)}
@-webkit-keyframes v-forward-exit-bounce{0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}
    40%{opacity:0.6}
    100%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}
}
@keyframes v-forward-exit-bounce{0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}
    40%{opacity:0.6}
    100%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}
}
@-webkit-keyframes v-forward-enter-bounce{0%{opacity:0;-webkit-transform:translateY(3000px);transform:translateY(3000px)}
    60%{opacity:1;-webkit-transform:translateY(-30px);transform:translateY(-30px)}
    75%{-webkit-transform:translateY(10px);transform:translateY(10px)}
    90%{-webkit-transform:translateY(-5px);transform:translateY(-5px)}
    100%{-webkit-transform:translateY(0px);transform:translateY(0px)}
}
@keyframes v-forward-enter-bounce{0%{opacity:0;-webkit-transform:translateY(3000px);transform:translateY(3000px)}
    60%{opacity:1;-webkit-transform:translateY(-30px);transform:translateY(-30px)}
    75%{-webkit-transform:translateY(10px);transform:translateY(10px)}
    90%{-webkit-transform:translateY(-5px);transform:translateY(-5px)}
    100%{-webkit-transform:translateY(0px);transform:translateY(0px)}
}

/* Vertical Backward */
.mcs-bounce.MagicScroll-vertical[data-mode="animation"] [data-backward] div[data-action="exit"]{-webkit-animation-name:v-backward-exit-bounce;animation-name:v-backward-exit-bounce}
.mcs-bounce.MagicScroll-vertical[data-mode="animation"] [data-backward] div[data-action="enter"]{-webkit-animation-name:v-backward-enter-bounce;animation-name:v-backward-enter-bounce}
@-webkit-keyframes v-backward-exit-bounce{0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}
    40%{opacity:0.6}
    100%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}
}
@keyframes v-backward-exit-bounce{0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}
    40%{opacity:0.6}
    100%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}
}
@-webkit-keyframes v-backward-enter-bounce{0%{opacity:0;-webkit-transform:translateY(-3000px);transform:translateY(-3000px)}
    60%{opacity:1;-webkit-transform:translateY(30px);transform:translateY(30px)}
    75%{-webkit-transform:translateY(-10px);transform:translateY(-10px)}
    90%{-webkit-transform:translateY(5px);transform:translateY(5px)}
    100%{-webkit-transform:translateY(0px);transform:translateY(0px)}
}
@keyframes v-backward-enter-bounce{0%{opacity:0;-webkit-transform:translateY(-3000px);transform:translateY(-3000px)}
    60%{opacity:1;-webkit-transform:translateY(30px);transform:translateY(30px)}
    75%{-webkit-transform:translateY(-10px);transform:translateY(-10px)}
    90%{-webkit-transform:translateY(5px);transform:translateY(5px)}
    100%{-webkit-transform:translateY(0px);transform:translateY(0px)}
}