﻿

/* Safari 4.0 - 8.0 
@-webkit-keyframes example {
    from {background-color: red;}
    to {background-color: green;}
}
*/

/* Standard syntax */
@keyframes example {
    0% {
        top: 50px;
    }

    100% {
        top: 50px;
    }
}

/*.animation_running {
    animation-play-state: running;
}*/

.bouncing_text {
    color: #DBDBDB;
    z-index: 130;
    position: relative;
    grid-column-start: 1;
    grid-row-start: 1;
    animation-play-state: paused;
    animation-iteration-count: infinite;
    animation-timing-function:  ease-in-out;
}


/*=================bouncing_ball========*/
.bouncing_ball {
    position: relative;
    animation-name: bouncing_x, bouncing_y;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in;
}

@keyframes bouncing_x {
    from, to { padding-left: 9px;}
    25% { padding-left: 3px; }
    50% { padding-left: 0px; }
    75% { padding-left: 4px; }
}

@keyframes bouncing_y {
    from, to { padding-top: 0px;}
    25% {padding-top: 3px; }
    50% {padding-top: 10px;}
    75% {padding-left: 6px;}
}
/*=====================================*/