Немного анимации в стиле CSS3

Создайте пару элементов div с идентификаторами gr и bc и таблицу стилей:


#gr {height: 100px; border: ridge 3px;
background-image: -webkit-linear-gradient(rgba(255,255,255,.9), rgba(0,0,255,0));
border-radius: 20px; text-align: center; display:table-cell; vertical-align:middle;
}

#bc { font: bold 18px sans-serif;
   height: 100px;
    -webkit-animation-name: 'bc';
    -webkit-animation-duration: 10s;
    -webkit-animation-iteration-count: infinite;
}
@-webkit-keyframes 'bc' {
    from {
       background-color: white;
    }
    50% {
       background-color: blue;
    }
    to {
       background-color: white;
    }  
}

Это будет работать в Chrome. Для работы в других браузерах:
-o-
-ms-
-moz-