.animated-bg {
align-items: center;
background: rgba(0, 0, 0, 0) url("http://lorempixel.com/600/300") no-repeat scroll center center;
display: flex;
height: 300px;
position: relative;
z-index: 2;
}
.animated-colors {
animation: 15s ease 0s normal none infinite running animated-colors;
background: rgba(0, 0, 0, 0) linear-gradient(0deg, #3498db, #2196f3, #3f51b5, #2196f3, #00bcd4, #009688) repeat scroll 0 0 / 350% 350%;
}
@keyframes animated-colors {
0% {
background-position: 0 90%;
}
50% {
background-position: 100% 11%;
}
100% {
background-position: 0 90%;
}
}
@keyframes animated-colors {
0% {
background-position: 0 90%;
}
50% {
background-position: 100% 11%;
}
