CSS3 animation: blinking overlay box

http://stackoverflow.com/questions/6390639/css3-animation-blinking-overlay-box

HTML

<script src="http://www.modernizr.com/downloads/modernizr-2.0.4.js"></script>
<div id="animate"></div>

CSS

body { background: #0ff; }

@-webkit-keyframes 'blink' {
    0% { background: rgba(255,0,0,0.5); }
    50% { background: rgba(255,0,0,0); }
    100% { background: rgba(255,0,0,0.5); }
}

@keyframes 'blink' {
    0% { background: rgba(255,0,0,0.5); }
    50% { background: rgba(255,0,0,0); }
    100% { background: rgba(255,0,0,0.5); }
}

#animate { 
    height: 100px; 
    width: 100px;
}
#animate {
    -webkit-animation-direction: normal;
    -webkit-animation-duration: 5s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-name: blink;
    -webkit-animation-timing-function: ease;   
    
    animation-direction: normal;
    animation-duration: 5s;
    animation-iteration-count: infinite;
    animation-name: blink;
    animation-timing-function: ease;       
}