/* Folien-Uebergaenge.
   Wirken auf die Objekte der Folie: .slide-canvas.is-anim-<name> > * */

.slide-canvas.is-anim-fade > * { animation: tr-fade 0.45s ease both; }
.slide-canvas.is-anim-slide > * { animation: tr-slide 0.45s ease both; }
.slide-canvas.is-anim-slide-left > * { animation: tr-slide-left 0.45s ease both; }
.slide-canvas.is-anim-slide-right > * { animation: tr-slide-right 0.45s ease both; }
.slide-canvas.is-anim-slide-up > * { animation: tr-slide-up 0.45s ease both; }
.slide-canvas.is-anim-slide-down > * { animation: tr-slide-down 0.45s ease both; }
.slide-canvas.is-anim-zoom > * { animation: tr-zoom 0.45s ease both; }
.slide-canvas.is-anim-zoom-out > * { animation: tr-zoom-out 0.45s ease both; }
.slide-canvas.is-anim-rotate > * { animation: tr-rotate 0.5s ease both; }
.slide-canvas.is-anim-flip-x > * { animation: tr-flip-x 0.55s ease both; }
.slide-canvas.is-anim-flip-y > * { animation: tr-flip-y 0.55s ease both; }
.slide-canvas.is-anim-spin > * { animation: tr-spin 0.6s ease both; }
.slide-canvas.is-anim-bounce > * { animation: tr-bounce 0.6s ease both; }
.slide-canvas.is-anim-drop > * { animation: tr-drop 0.5s cubic-bezier(0.4, 1.5, 0.6, 1) both; }
.slide-canvas.is-anim-rise > * { animation: tr-rise 0.5s ease both; }
.slide-canvas.is-anim-sink > * { animation: tr-sink 0.5s ease both; }
.slide-canvas.is-anim-swing > * { animation: tr-swing 0.6s ease both; }
.slide-canvas.is-anim-pulse > * { animation: tr-pulse 0.55s ease both; }
.slide-canvas.is-anim-blur > * { animation: tr-blur 0.5s ease both; }
.slide-canvas.is-anim-skew > * { animation: tr-skew 0.5s ease both; }

@keyframes tr-fade {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes tr-slide {
    from { opacity: 0; transform: translateX(30%); }
    to { opacity: 1; transform: translateX(0); }
}

@keyframes tr-slide-left {
    from { opacity: 0; transform: translateX(45%); }
    to { opacity: 1; transform: translateX(0); }
}

@keyframes tr-slide-right {
    from { opacity: 0; transform: translateX(-45%); }
    to { opacity: 1; transform: translateX(0); }
}

@keyframes tr-slide-up {
    from { opacity: 0; transform: translateY(40%); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes tr-slide-down {
    from { opacity: 0; transform: translateY(-40%); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes tr-zoom {
    from { opacity: 0; transform: scale(0.86); }
    to { opacity: 1; transform: scale(1); }
}

@keyframes tr-zoom-out {
    from { opacity: 0; transform: scale(1.3); }
    to { opacity: 1; transform: scale(1); }
}

@keyframes tr-rotate {
    from { opacity: 0; transform: rotate(-16deg) scale(0.9); }
    to { opacity: 1; transform: rotate(0deg) scale(1); }
}

@keyframes tr-flip-x {
    from { opacity: 0; transform: perspective(900px) rotateY(85deg); }
    to { opacity: 1; transform: perspective(900px) rotateY(0deg); }
}

@keyframes tr-flip-y {
    from { opacity: 0; transform: perspective(900px) rotateX(85deg); }
    to { opacity: 1; transform: perspective(900px) rotateX(0deg); }
}

@keyframes tr-spin {
    from { opacity: 0; transform: rotate(180deg) scale(0.6); }
    to { opacity: 1; transform: rotate(360deg) scale(1); }
}

@keyframes tr-bounce {
    0% { opacity: 0; transform: translateY(-55%); }
    60% { opacity: 1; transform: translateY(7%); }
    100% { opacity: 1; transform: translateY(0); }
}

@keyframes tr-drop {
    from { opacity: 0; transform: translateY(-80%) scale(0.9); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes tr-rise {
    from { opacity: 0; transform: translateY(70%) scale(0.95); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes tr-sink {
    from { opacity: 0; transform: translateY(-45%) scale(1.05); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes tr-swing {
    0% { opacity: 0; transform: rotate(-14deg); }
    55% { opacity: 1; transform: rotate(9deg); }
    100% { opacity: 1; transform: rotate(0deg); }
}

@keyframes tr-pulse {
    0% { opacity: 0; transform: scale(0.65); }
    60% { opacity: 1; transform: scale(1.07); }
    100% { opacity: 1; transform: scale(1); }
}

@keyframes tr-blur {
    from { opacity: 0; filter: blur(12px); }
    to { opacity: 1; filter: blur(0); }
}

@keyframes tr-skew {
    from { opacity: 0; transform: skewX(20deg) translateX(25%); }
    to { opacity: 1; transform: skewX(0deg) translateX(0); }
}
