Бегущая строка на CSS3

CSS:

.marquee {
   width: 100%;
   margin: 0 auto;
   font-size:26px;
   color:#14f77e;
   white-space: nowrap;
   overflow: hidden;
   border-radius:4px;
   box-shadow: 0 0 10px rgba(0,0,0,0.5);
}

.marquee p {
   display: inline-block;
   padding-left: 100%;
   animation: marquee 10s linear infinite;
}

.marquee p:hover {
   animation-play-state: paused;
}

@keyframes marquee {
 0%   { transform: translate(0, 0); }
 100% { transform: translate(-100%, 0); }
}

HTML:

<div class="marquee"><p>Какой-то текст</p></div>