problema con marquee

ho un problema con questo marquee ma non riesco a capire perchè non mi legge la terza, in pratica quando scorre il primo si vede, anche il secondo ma la terza no, vorrei capire il perchè. grazie ragazzi

vi metto il codice html e il css

html

Codice HTML:

---

<!-- inizio notizie --><div class="tickertape">  <strong class="title">Notizie</strong>  <span class="marquee"><span><strong>1:</strong> 1</span><span><strong>2</strong> 2</span><span><strong>3:</strong> 3</span></span></div>    <!--fine notizie-->

---

questo il css

Codice:

---

.hideText {
text-indent: -999em;
letter-spacing: -999em;
overflow: hidden;
}


*,
a:focus {
outline: none !important;
}
button:focus {
outline: none !important;
}


#content {
margin: 0 !important;
padding: 0 !important;
}
#tlyPageGuideWrapper,
.filter-bar {
display: none !important;
}


.table td,
.table th {
vertical-align: middle;
}
.table th {
padding: 3px;
text-align: center;
}
.table img {
float: left;
}
}


.widget-messages ul li .glyphicons.single.bin i:before {
color: #cccccc;
position: relative;
line-height: 20px;
left: auto;
top: auto;
}
.widget-messages ul li:last-child {
margin: 0;
}
.tickertape {
height: 32px;
line-height: 32px;
padding: 0 10px 0 0;
position: relative;
margin: 0 0 15px;
background-color: #f9f9f9;
background-image: -moz-linear-gradient(top, #fdfdfd, #f4f4f4);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fdfdfd), to(#f4f4f4));
background-image: -webkit-linear-gradient(top, #fdfdfd, #f4f4f4);
background-image: -o-linear-gradient(top, #fdfdfd, #f4f4f4);
background-image: linear-gradient(to bottom, #fdfdfd, #f4f4f4);
background-repeat: repeat-x;
filter: progidXImageTransform.Microsoft.gradient(startColorstr=' #fffdfdfd', endColorstr='#fff4f4f4', GradientType=0);
border: 1px solid #d8d8d8;
color: #7c7c7c;
box-shadow: 0 1px 0 0 #f7f7f7, 0 5px 4px -4px #d8d8d8;
-moz-box-shadow: 0 1px 0 0 #f7f7f7, 0 5px 4px -4px #d8d8d8;
-webkit-box-shadow: 0 1px 0 0 #f7f7f7, 0 5px 4px -4px #d8d8d8;
}
.tickertape .title {
padding: 0 10px;
float: left;
width: 80px;
display: block;
position: absolute;
top: 0;
left: 0;
height: 32px;
}


.tickertape .marquee {
height: 20px;
line-height: 20px;
font-size: 11px;
background: #ffffff;
border: 1px solid #d8d8d8;
box-shadow: -2px 0 5px -4px #d8d8d8 inset, 2px 0 5px -4px #d8d8d8 inset;
padding: 0 5px;
display: block;
margin-left: 90px;
margin-top: 6px;
overflow: hidden;
white-space: nowrap;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
position: relative;
}
.tickertape .marquee span {
display: block;
position: absolute;
width: 100%;
height: 100%;
overflow: hidden;
white-space: nowrap;
text-align: center;
transform: translateX(100%);
-moz-transform: translateX(100%);
-webkit-transform: translateX(100%);
}
.tickertape .marquee span:nth-child(1) {
animation: marquee-one 20s ease infinite;
-moz-animation: marquee-one 20s ease infinite;
-webkit-animation: marquee-one 20s ease infinite;
}


.tickertape .marquee span:nth-child(2) {
animation: marquee-two 20s ease infinite;
-moz-animation: marquee-two 20s ease infinite;
-webkit-animation: marquee-two 20s ease infinite;
}


.tickertape .marquee span:nth-child(3) {
animation: marquee-three 20s ease infinite;
-moz-animation: marquee-three 20s ease infinite;
-webkit-animation: marquee-three 20s ease infinite;
}
@keyframes marquee-one {
0% {
transform: translateX(105%);
}
10% {
transform: translateX(0);
}
40% {
transform: translateX(0);
}
50% {
transform: translateX(-105%);
}
100% {
transform: translateX(-105%);
}
}
@-moz-keyframes marquee-one {
0% {
-moz-transform: translateX(105%);
}
10% {
-moz-transform: translateX(0);
}
40% {
-moz-transform: translateX(0);
}
50% {
-moz-transform: translateX(-105%);
}
100% {
-moz-transform: translateX(-105%);
}
}
@-webkit-keyframes marquee-one {
0% {
-webkit-transform: translateX(105%);
}
10% {
-webkit-transform: translateX(0);
}
40% {
-webkit-transform: translateX(0);
}
50% {
-webkit-transform: translateX(-105%);
}
100% {
-webkit-transform: translateX(-105%);
}
}
@keyframes marquee-two {
0% {
transform: translateX(105%);
}
50% {
transform: translateX(105%);
}
60% {
transform: translateX(0);
}
90% {
transform: translateX(0);
}
100% {
transform: translateX(-105%);
}
}
@-moz-keyframes marquee-two {
0% {
-moz-transform: translateX(105%);
}
50% {
-moz-transform: translateX(105%);
}
60% {
-moz-transform: translateX(0);
}
90% {
-moz-transform: translateX(0);
}
100% {
-moz-transform: translateX(-105%);
}
}
@-webkit-keyframes marquee-two {
0% {
-webkit-transform: translateX(105%);
}
50% {
-webkit-transform: translateX(105%);


}
60% {
-webkit-transform: translateX(0);
}
90% {
-webkit-transform: translateX(0);
}
100% {
-webkit-transform: translateX(-105%);
}


@keyframes marquee-three {
0% {
transform: translateX(105%);
}
50% {
transform: translateX(105%);
}
60% {
transform: translateX(0);
}
90% {
transform: translateX(0);
}
100% {
transform: translateX(-105%);
}


@-moz-keyframes marquee-three {
0% {
-moz-transform: translateX(105%);
}
50% {
-moz-transform: translateX(105%);
}
60% {
-moz-transform: translateX(0);
}
90% {
-moz-transform: translateX(0);
}
100% {
-moz-transform: translateX(-105%);
}
@-webkit-keyframes marquee-three {
0% {
-webkit-transform: translateX(105%);
}
50% {
-webkit-transform: translateX(105%);


}
60% {
-webkit-transform: translateX(0);
}
90% {
-webkit-transform: translateX(0);
}
100% {
-webkit-transform: translateX(-105%);
}
.widget-timeline .widget-body {
padding: 15px;
position: relative;
}

---