英文单词跳动效果，时间差

<div class="imFixed-button">
	<a href="javascript:void(0);" class="im-close"><i class="iconfont icon-x"></i></a>
	<div class="download-bar">
		<div class="im-robot">
			<div class="im-eye">
				<div class="eye-top"></div>
				<div class="eye-bottom"></div>
			</div>
		</div>
		<a href="" class="dl-cont">
			<div class="dl-letters">
				<span class="letter">B</span><span class="letter">e</span><span class="letter">t</span><span class="letter">t</span><span class="letter">e</span><span class="letter">r</span>
				<span class="letter">E</span><span class="letter">x</span><span class="letter">p</span><span class="letter">e</span><span class="letter">r</span><span class="letter">i</span><span class="letter">e</span><span class="letter">n</span><span class="letter">c</span><span class="letter">e</span><span class="letter">!</span>
			</div>
		</a>
	</div>
</div>

.dl-cont .letter{
	letter-spacing: 0;
	display: inline-block;
	transform: translate3d(0, 0, 0);
	color: #272570;
	animation: letter 0.75s cubic-bezier(0.05, 0, 0.2, 1) infinite alternate;
}
@keyframes letter {
  0% {
    transform: translate3d(0, 2px, 0);
	text-shadow: rgba(255, 255, 255, 0.4) 0 0 0.05em;
  }
  100% {
    transform: translate3d(0, -2px, 0);
	text-shadow: rgba(255, 255, 255, 0.4) 0 8px 0.35em;
  }
}

.im-robot{
	position: absolute;
	bottom: -9px;
	left: -12px;
	background: url(../images/download-logo@2x.png) no-repeat;
	background-size: contain;
	width: 70px;
	height: 70px;
}
.im-eye{
	position: absolute;
	left: 50%;
	top: 32px;
	margin-left: -16px;
	background: url(../images/eye-dl.png) no-repeat center;
	width: 28px;
	height: 11px;
	background-size: contain;
}
.im-eye .eye-top{
	position: absolute;
	width: 28px;
	height: 4px;
	background: url(../images/eye-dl-top.png) no-repeat center;
	background-size: contain;
	top: 0;
	left: 0;
    animation: eye .6s linear infinite alternate;
}
.im-eye .eye-bottom{
	position: absolute;
	width: 28px;
	height: 2px;
	background: url(../images/eye-dl-bottom.png) no-repeat center;
	background-size: contain;
	bottom: 0;
	left: 0;
    animation: eye .6s linear infinite alternate;
}

.letter:nth-child(1) {
  animation-delay: 0s;
}
.letter:nth-child(2) {
  animation-delay: 0.08s;
}
.letter:nth-child(3) {
  animation-delay: 0.16s;
}
.letter:nth-child(4) {
  animation-delay: 0.25s;
}
.letter:nth-child(5) {
  animation-delay: 0.33s;
}
.letter:nth-child(6) {
  animation-delay: 0.41s;
}
.letter:nth-child(7) {
  animation-delay: 0.49s;
}
.letter:nth-child(8) {
  animation-delay: 0.57s;
}
.letter:nth-child(9) {
  animation-delay: 0.65s;
}
.letter:nth-child(10) {
  animation-delay: 0.73s;
}
.letter:nth-child(11) {
  animation-delay: 0.81s;
}
.letter:nth-child(12) {
  animation-delay: .9s;
}
.letter:nth-child(13) {
  animation-delay: .98s;
}
.letter:nth-child(14) {
  animation-delay: 1.07s;
}
.letter:nth-child(15) {
  animation-delay: 1.15s;
}
.letter:nth-child(16) {
  animation-delay: 1.23s;
}
.letter:nth-child(17) {
  animation-delay: 1.31s;
}
.letter:nth-child(18) {
  animation-delay: 1.39s;
}
.letter:nth-child(18) {
  animation-delay: 1.47s;
}
.letter:nth-child(20) {
  animation-delay: 1.55s;
}
.letter:nth-child(21) {
  animation-delay: 1.63s;
}