gistfile1.css

//Animating a user in
.carousel-animate-in {
    .round-pic-frame { /* Bubble displaying the users photo */
        -webkit-animation: carousel-user-photo-in .6s ease-out forwards;
        -moz-animation: carousel-user-photo-in .6s ease-out forwards;
        -o-animation: carousel-user-photo-in .6s ease-out forwards;
        animation: carousel-user-photo-in .6s ease-out forwards;
    }
    //... more animations
}

@-webkit-keyframes carousel-user-photo-in {
    0% {
        -webkit-transform: translate(-150%, 25%) scale(.1);
    }
    
    100% {
        -webkit-transform: translate(0, 0) scale(1);
    }
}

//Animating a user out
.carousel-animate-out {
    .round-pic-frame { /* Bubble displaying the users photo */
        -webkit-animation: carousel-user-photo-out .2s ease-in .05s forwards;
        -moz-animation: carousel-user-photo-out .2s ease-in .05s forwards;
        -o-animation: carousel-user-photo-out .2s ease-in .05s forwards;
        animation: carousel-user-photo-out .2s ease-in .05s forwards;
    }
}