Animation delay in Safari - safari

Question

I am trying to get the footer animation to come in one right after another. It works fine in everything but Safari where they all come it at once. Any ideas on what to add?
The site is: http://inventivewebdesign.com/ndr/
HTML
<div id="ftr-tagline">
<div class="slideLeft" id="ftr1-animation">
<div class="one-third first">
<div class="one-call">
One Call...
</div><!-- .one-call -->
</div><!-- .one-third -->
</div><!-- #ftr1-animation -->
<div class="slideLeft" id="ftr2-animation">
<div class="one-third">
<div class="one-contact">
One Contact...
</div><!-- .one-contact -->
</div><!-- .one-third -->
</div><!-- #ftr2-animation -->
<div class="slideLeft" id="ftr3-animation">
<div class="one-third last">
<div class="one-culture">
One Culture...
</div> <!-- .one-contact -->
</div><!-- .one-third -->
</div> <!-- #ftr3-animation -->
</div>
CSS
/*
==============================================
slideLeft
==============================================
*/
.page-id-4 #ftr1-animation, .page-id-4 #ftr2-animation, .page-id-4 #ftr3-animation{
visibility: hidden;
}
.page-id-4 .slideLeft{
animation-name: slideLeft;
-webkit-animation-name: slideLeft;
animation-duration: 1s;
-webkit-animation-duration: 1s;
animation-timing-function: ease-in-out;
-webkit-animation-timing-function: ease-in-out;
/* Keep animation visible after animation finishes */
animation-fill-mode: forwards;
-webkit-animation-fill-mode: forwards;
}
#keyframes slideLeft {
0% {transform: translateX(150%);}
100% {transform: translateX(0%);
visibility: visible;}
}
#-webkit-keyframes slideLeft {
0% {-webkit-transform: translateX(150%);}
100% {-webkit-transform: translateX(0%);
visibility: visible;}
}
.page-id-4 #ftr1-animation{
-webkit-animation-delay: 2s; /* Safari and Chrome */
animation-delay: 2s;
}
.page-id-4 #ftr2-animation{
-webkit-animation-delay: 3s; /* Safari and Chrome */
animation-delay: 3s;
}
.page-id-4 #ftr3-animation{
-webkit-animation-delay: 4s; /* Safari and Chrome */
animation-delay: 4s;
}

Answer 1

This question is old, but I'm assuming you were running iOS 7.X.X and therefore Safari of the same version. It seems that that version of Safari blocked animation execution until the user lifted their finger off the page.
I just ran into an issue where my animations weren't being fired in Safari 7.X.X until after the user lifted their finger from scrolling. iOS/Safari 8.X.X had no such issues and fired off animations as expected.