Brillo de efecto automáticamente con css

Estoy tratando de hacer que este efecto de brillo opere automáticamente (sin a: suspender) cada 5 segundos.

http://jsfiddle.net/AntonTrollback/nqQc7/

.icon:after { content: ""; position: absolute; top: -110%; left: -210%; width: 200%; height: 200%; opacity: 0; transform: rotate(30deg); background: rgba(255, 255, 255, 0.13); background: linear-gradient( to right, rgba(255, 255, 255, 0.13) 0%, rgba(255, 255, 255, 0.13) 77%, rgba(255, 255, 255, 0.5) 92%, rgba(255, 255, 255, 0.0) 100% ); } .icon:hover:after { opacity: 1; top: -30%; left: -30%; transition-property: left, top, opacity; transition-duration: 0.7s, 0.7s, 0.15s; transition-timing-function: ease; } 

Puedes crear animaciones CSS como esta DEMO

  @keyframes shine{ 10% { opacity: 1; top: -30%; left: -30%; transition-property: left, top, opacity; transition-duration: 0.7s, 0.7s, 0.15s; transition-timing-function: ease; } 100% { opacity: 0; top: -30%; left: -30%; transition-property: left, top, opacity; } }