﻿/* Copyright © Microsoft Corporation. All Rights Reserved. */
/* Demo Author: Charilaos "Harris" Papadopoulos, Microsoft Corporation */
/* Modifikation Yu Yang */

/*
    Predefined full-page animations for the CSS Animation/Transform IE Test Drive Demo
    Please check FullPageAnimations.js for more information  
*/
	
@-moz-keyframes ypushFromTop {
    from {
        -moz-transform-origin: 0% 0%;
        -moz-transform: translateY(-1000px);
        animation-timing-function: ease;
		opacity: 0;
    }

    25% {
        -moz-transform-origin: 0% 0%;
        -moz-transform: translateY(-300px);
        animation-timing-function: ease;
		opacity: 0.1;
    }

    50% {
        -moz-transform-origin: 0% 0%;
        -moz-transform: translateY(-100px);
        animation-timing-function: ease;
		opacity: 0.3;
    }
	75% {
        -moz-transform-origin: 0% 0%;
        -moz-transform: translateY(-50px);
        animation-timing-function: ease;
		opacity: 0.55;
    }

    95% {
        -moz-transform-origin: 0% 0%;
        -moz-transform: translateY(-20px);
        animation-timing-function: ease;
		opacity: 0.95;
    }
	98% {
        -moz-transform-origin: 0% 0%;
        -moz-transform: translateY(-5px);
        animation-timing-function: ease;
		opacity: 0.98;
    }
    to {
        -moz-transform-origin: 0% 0%;
        -moz-transform: translateY(0px);
        animation-timing-function: ease;
		opacity: 1;
    }    
}
@-moz-keyframes rotateInLeft {

    from {
        -moz-transform-origin: 0% 0%;
        -moz-transform: rotateY(180deg);
    }

    to {    
        -moz-transform-origin: 0% 0%;    
        -moz-transform: rotateY(0deg);
    }
}

@-moz-keyframes rotateOutLeft {

    from {
        -moz-transform-origin: 0% 0%;
    }

    to {
        -moz-transform-origin: 0% 0%;
        -moz-transform: rotateY(180deg);
    }
}

@-moz-keyframes rotateInRight {

    from {
        -moz-transform-origin: 100% 0%;
        -moz-transform: rotateY(-180deg);
        
    }

    to {
        -moz-transform-origin: 100% 0%;
    }    
}

@-moz-keyframes rotateInRightWithoutToKeyframe {

    from {
        -moz-transform-origin: 100% 0%;
        -moz-transform: rotateY(-180deg);
    }
}

@-moz-keyframes rotateOutRight {

    from {
        -moz-transform-origin: 100% 0%;
    }

    to {
        -moz-transform-origin: 100% 0%;
        -moz-transform: rotateY(-180deg);
    }
}

@-moz-keyframes fadeIn {
    from {
        opacity: 0;
    }
}

@-moz-keyframes fadeOut {    
    to {
        opacity: 0;
    }        
}

@-moz-keyframes whirlIn {
    from {
        -moz-transform-origin: 50% 50%;
        -moz-transform: scale(0) rotateZ(1260deg);
    }
    
    to {
        -moz-transform-origin: 50% 50%;
    }
    
}

@-moz-keyframes whirlOut {
    from {
        -moz-transform-origin: 50% 50%;
    }
    
    to {
        -moz-transform-origin: 50% 50%;
        -moz-transform: scale(0) rotateZ(1260deg);
    }
    
}

/*@-moz-keyframes whirlOut {
    from {
        -moz-transform-origin: 50% 50%;
    }
    
    to {
        -moz-transform-origin: 50% 50%;
        -moz-transform: scale(0.8) rotateZ(1440deg);
    }
    
}*/

@-moz-keyframes fallFromTop {
    from {
        -moz-transform-origin: 0% 0%;
        -moz-transform: rotateX(-180deg);
        animation-timing-function: ease;
    }

    50% {
        -moz-transform-origin: 0% 0%;
        -moz-transform: rotateX(30deg);
        animation-timing-function: ease;
    }

    85% {
        -moz-transform-origin: 0% 0%;
        -moz-transform: rotateX(-10deg);
        animation-timing-function: ease;
    }
        
    to {
        -moz-transform-origin: 0% 0%;
        -moz-transform: rotateX(0deg);
        animation-timing-function: ease;
    }    
}

@-moz-keyframes dropToBottom {
    from {
        -moz-transform-origin: 0% 100%;
    }
        
    to {
        -moz-transform-origin: 0% 100%;
        -moz-transform: rotateX(180deg);
    }    
}
@-moz-keyframes ydropToBottom {
    from {
        -moz-transform-origin: 0% 100%;
    }
	
	50% {
        -moz-transform-origin: 0% 100%;
        -moz-transform: rotateX(180deg);
    }

    90% {
        -moz-transform-origin: 0% 100%;
        -moz-transform: rotateX(310deg);
    }
        
    to {
        -moz-transform-origin: 0% 100%;
        -moz-transform: rotateX(360deg);
    }    
}
@-moz-keyframes slideInSkew {
    from {
        -moz-transform-origin: 0% 100%;
        -moz-transform: translateX(-200%) skewX(-45deg);
    }

    50% {
        -moz-transform-origin: 0% 100%;
        -moz-transform: translateX(0%) skewX(-45deg);
    }

    90% {
        -moz-transform-origin: 0% 100%;
        -moz-transform: translateX(0%) skewX(10deg);
    }
    
    to {
        -moz-transform-origin: 0% 100%;
        -moz-transform:translateX(0%) skewX(0deg);
    }
}

@-moz-keyframes slideOutSkew {    
    from {
        -moz-transform-origin: 0% 100%;
        -moz-transform: translateX(0%);
    }
    
    to {
        -moz-transform-origin: 0% 100%;
        -moz-transform: skewX(-45deg) translateX(200%) ;
    }
}

@-moz-keyframes tumbleIn {
    from {
        -moz-transform-origin: 0% 100%;
        -moz-transform: rotateZ(-180deg);        
    }

    to {
        -moz-transform-origin: 0% 100%;
    }
    
}

@-moz-keyframes tumbleOut {
    from {
        -moz-transform-origin: 100% 100%;       
    }

    to {
        -moz-transform-origin: 100% 100%;
        -moz-transform: rotateZ(180deg); 
    }    
    
}


@-moz-keyframes expandIn {
    from {
        -moz-transform: scale(0);
    }

    50% {
        
        -moz-transform: scale(1);
    }

    75% {
        -moz-transform: scale(1.2);
    }

    to {
        -moz-transform: scale(1);
    }
}

@-moz-keyframes collapseOut {
    to {
        -moz-transform: scale(0);
    }
}