CSS - Animated background gradient

stye.css

.all {
	overflow: hidden;
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
    animation: bodygradient 45s infinite;
	-webkit-animation: bodygradient 45s infinite;
	-moz-animation: bodygradient 45s infinite;
    border: 20px solid rgba(255, 255, 255, 0.5);
}

body.page-sign-out .wrapper {
    height: 100%;
	border: 20px solid rgba(255,255,255,0.5);
	animation: bodygradient 45s infinite;
	-webkit-animation: bodygradient 45s infinite;
	-moz-animation: bodygradient 45s infinite;
}

@keyframes bodygradient {
	0% {background-color: #1fcad4;}
	15% {background-color: #c3d600;}
	30% {background-color: #ffc600;}
	45% {background-color: #fd8200;}
	60% {background-color: #f6303e;}
	85% {background-color: #e74481;}
    100% {background-color: #1fcad4;}
}

@-webkit-keyframes bodygradient {
	0% {background-color: #1fcad4;}
	15% {background-color: #c3d600;}
	30% {background-color: #ffc600;}
	45% {background-color: #fd8200;}
	60% {background-color: #f6303e;}
	85% {background-color: #e74481;}
    100% {background-color: #1fcad4;}
}

@-moz-keyframes bodygradient {
	0% {background-color: #1fcad4;}
	15% {background-color: #c3d600;}
	30% {background-color: #ffc600;}
	45% {background-color: #fd8200;}
	60% {background-color: #f6303e;}
	85% {background-color: #e74481;}
    100% {background-color: #1fcad4;}
}

style.css

 background: linear-gradient(320deg, #29bf98, #6d28b0);
background-size: 400% 400%;

-webkit-animation: AnimationName 11s ease infinite;
-moz-animation: AnimationName 11s ease infinite;
-o-animation: AnimationName 11s ease infinite;
animation: AnimationName 11s ease infinite;

@-webkit-keyframes AnimationName {
    0%{background-position:5% 0%}
    50%{background-position:96% 100%}
    100%{background-position:5% 0%}
}
@-moz-keyframes AnimationName {
    0%{background-position:5% 0%}
    50%{background-position:96% 100%}
    100%{background-position:5% 0%}
}
@-o-keyframes AnimationName {
    0%{background-position:5% 0%}
    50%{background-position:96% 100%}
    100%{background-position:5% 0%}
}
@keyframes AnimationName {
    0%{background-position:5% 0%}
    50%{background-position:96% 100%}
    100%{background-position:5% 0%}
}