创建动画图像叠加CSS

Question

我想知道如何在图像上创建这种动画，多色叠加效果。这是我要复制的示例：http://elegantthemes.com/preview/Bloom/

这是关闭，因为我已经在另一个网站上使用了代码测试。见下面的代码。它使用了添加的文字但我无法成功整合所需的图像。

#colorCycle { background-color: #C30;
padding-top: 5px; padding-right: 7px; padding-bottom: 7px; padding-left: 7px;
color: #FFF;
text-align: center;
animation-name: homeCycle;
animation-duration:6s;
animation-direction:alternate;
animation-iteration-count:infinite;

-webkit-animation-name: homeCycle;
-webkit-animation-duration:6s;
-webkit-animation-direction:alternate;
-webkit-animation-iteration-count:infinite; }

@keyframes homeCycle
{
0% {background-color:#006;}
25% {background-color:#060;}
50% {background-color:#CC3200;}
75% {background-color:#603;}
}

@-webkit-keyframes homeCycle
{
0% {background-color:#006;}
25% {background-color:#060;}
50% {background-color:#CC3200;}
75% {background-color:#603;}
}