CSS Animation Transform - css

Question

I am creating an animation that rotate text that's based on this website: https://tympanus.net/Tutorials/CSS3RotatingWords/
I would like to make the text stay longer and support unknow number of sentences:
<div style="height:25px;margin-bottom:5px;">
<div class="rw-words rw-words-1">
<span style="-webkit-animation-delay: 0s; -ms-animation-delay: 0s; animation-delay: 0s; ">This is sentence one</span>
<span style="-webkit-animation-delay: 6s; -ms-animation-delay: 6s; animation-delay: 6s; ">This is sentence two</span>
<span style="-webkit-animation-delay: 12s; -ms-animation-delay: 12s; animation-delay: 12s; ">This is sentence three</span>
</div>
</div>
<style>
.rw-words-1 span {
position: absolute;
opacity: 0;
overflow: hidden;
-webkit-animation: rotateWord 18s linear infinite 0s;
-ms-animation: rotateWord 18s linear infinite 0s;
animation: rotateWord 18s linear infinite 0s;
}
#-webkit-keyframes rotateWord {
0% {
opacity: 0;
}
2% {
opacity: 0;
-webkit-transform: translateY(-30px);
}
5% {
opacity: 1;
-webkit-transform: translateY(0px);
}
17% {
opacity: 1;
-webkit-transform: translateY(0px);
}
20% {
opacity: 1;
-webkit-transform: translateY(30px);
}
80% {
opacity: 0;
}
100% {
opacity: 0;
}
}
#-ms-keyframes rotateWord {
0% {
opacity: 0;
}
2% {
opacity: 0;
-ms-transform: translateY(-30px);
}
5% {
opacity: 1;
-ms-transform: translateY(0px);
}
17% {
opacity: 1;
-ms-transform: translateY(0px);
}
20% {
opacity: 1;
-ms-transform: translateY(30px);
}
80% {
opacity: 0;
}
100% {
opacity: 0;
}
}
#keyframes rotateWord {
0% {
opacity: 0;
}
2% {
opacity: 0;
-webkit-transform: translateY(-30px);
transform: translateY(-30px);
}
5% {
opacity: 1;
-webkit-transform: translateY(0px);
transform: translateY(0px);
}
17% {
opacity: 1;
-webkit-transform: translateY(0px);
transform: translateY(0px);
}
20% {
opacity: 0;
-webkit-transform: translateY(30px);
transform: translateY(30px);
}
80% {
opacity: 0;
}
100% {
opacity: 0;
}
}
</style>
Above codes work well but I would like the text to stay longer before rotating to the next. I've tried to change the keyframes % values but that only messes up the animation. What do I need to do to say keep each sentence up for 10 seconds before next? Thanks!