CSS for color fade gradient as background

animGradient.css

background: linear-gradient(325deg, #3498db, #242c66);
background-size: 400% 400%;
-webkit-animation: AnimationName 14s ease infinite;
-moz-animation: AnimationName 14s ease infinite;
-o-animation: AnimationName 14s ease infinite;
animation: AnimationName 14s ease infinite;
@-webkit-keyframes AnimationName {
    0%{background-position:10% 0%}
    50%{background-position:91% 100%}
    100%{background-position:10% 0%}
}
@-moz-keyframes AnimationName {
    0%{background-position:10% 0%}
    50%{background-position:91% 100%}
    100%{background-position:10% 0%}
}
@-o-keyframes AnimationName {
    0%{background-position:10% 0%}
    50%{background-position:91% 100%}
    100%{background-position:10% 0%}
}
@keyframes AnimationName {
    0%{background-position:10% 0%}
    50%{background-position:91% 100%}
    100%{background-position:10% 0%}
}

animGradient3.css

background: linear-gradient(325deg, #3498db, #242c66, #73128b);
background-size: 600% 600%;
-webkit-animation: AnimationName 7s ease infinite;
-moz-animation: AnimationName 7s ease infinite;
-o-animation: AnimationName 7s ease infinite;
animation: AnimationName 7s ease infinite;
@-webkit-keyframes AnimationName {
    0%{background-position:10% 0%}
    50%{background-position:91% 100%}
    100%{background-position:10% 0%}
}
@-moz-keyframes AnimationName {
    0%{background-position:10% 0%}
    50%{background-position:91% 100%}
    100%{background-position:10% 0%}
}
@-o-keyframes AnimationName {
    0%{background-position:10% 0%}
    50%{background-position:91% 100%}
    100%{background-position:10% 0%}
}
@keyframes AnimationName {
    0%{background-position:10% 0%}
    50%{background-position:91% 100%}
    100%{background-position:10% 0%}
}