HTML

<div class="css3_pulsate pulsate">Saber y saberlo demostrar, es valer dos veces.Baltasar Graci&aacute;n</div>

CSS

 
@-webkit-keyframes pulsate {
  0% { width:200px; }
  5% { width:250px; left:-25px; }
  10% { width:200px; left:0px; }
  15% { width:250px; left:-25px; }
  20% { width:200px; left:0px; }
  40% { width:200px; background-color:#BEEBFE; }
  45% { width:250px; left:-25px; background-color:#BEEBFE; }
  50% { width:200px; left:0px; background-color:#BEEBFE; }
  55% { width:250px; left:-25px; background-color:#BEEBFE; }
  60% { width:200px; left:0px; background-color:#BEEBFE; }
  80% { width:200px; background-color:#82D9FC; }
  100% { width:200px; background-color:#82D9FC; }
}
.css3_pulsate:hover {
  -webkit-animation-name: pulsate;
  -webkit-animation-duration: 3s;
  -webkit-animation-timing-function: ease-in-out;
}