/*
---------------form animations------------------
1. Fade In animation
2. Slide In Up animation
3. Pulse animation
*/

//----1. fade in----
@-webkit-keyframes mrmFadeIn {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

@keyframes mrmFadeIn {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}


//----2. slide in up----
@-webkit-keyframes mrmSlideInUp {
    0% {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        visibility: visible;
        opacity: 0;
    }

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        opacity: 1;
    }
}

@keyframes mrmSlideInUp {
    0% {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        visibility: visible;
        opacity: 0;
    }

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        opacity: 1;
    }
}


//----3. Pulse----
@-webkit-keyframes mrmPulse {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
    }
    50% {
        -webkit-transform: scale3d(1.05, 1.05, 1.05);
        transform: scale3d(1.05, 1.05, 1.05);
    }
    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
    }
}

@keyframes mrmPulse {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
    }
    50% {
        -webkit-transform: scale3d(1.05, 1.05, 1.05);
        transform: scale3d(1.05, 1.05, 1.05);
    }
    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
    }
}
