.element-animation{
animation: animationFrames ease 3s;
animation-iteration-count: 1;
transform-origin: 50% 50%;
animation-fill-mode:forwards; -webkit-animation: animationFrames ease 3s;
-webkit-animation-iteration-count: 1;
-webkit-transform-origin: 50% 50%;
-webkit-animation-fill-mode:forwards; -moz-animation: animationFrames ease 3s;
-moz-animation-iteration-count: 1;
-moz-transform-origin: 50% 50%;
-moz-animation-fill-mode:forwards; -o-animation: animationFrames ease 3s;
-o-animation-iteration-count: 1;
-o-transform-origin: 50% 50%;
-o-animation-fill-mode:forwards; -ms-animation: animationFrames ease 3s;
-ms-animation-iteration-count: 1;
-ms-transform-origin: 50% 50%;
-ms-animation-fill-mode:forwards; }
@keyframes animationFrames{
0% {
opacity:0;
transform:  translate(-50px,0px)  ;
}
100% {
opacity:1;
transform:  translate(0px,0px)  ;
}
}
@-moz-keyframes animationFrames{
0% {
opacity:0;
-moz-transform:  translate(-50px,-0px)  ;
}
100% {
opacity:1;
-moz-transform:  translate(0px,0px)  ;
}
}
@-webkit-keyframes animationFrames {
0% {
opacity:0;
-webkit-transform:  translate(0px,-25px)  ;
}
100% {
opacity:1;
-webkit-transform:  translate(0px,0px)  ;
}
}
@-o-keyframes animationFrames {
0% {
opacity:0;
-o-transform:  translate(0px,-25px)  ;
}
100% {
opacity:1;
-o-transform:  translate(0px,0px)  ;
}
}
@-ms-keyframes animationFrames {
0% {
opacity:0;
-ms-transform:  translate(0px,-25px)  ;
}
100% {
opacity:1;
-ms-transform:  translate(0px,0px)  ;
}
}