CSS from Gradient Animator not working

I was trying to apply some CSS from gradient-animator.com and it’s not working within the theme. If I switch to twenty twenty-two theme it works. Does anyone have a clue as to why it won’t work with Highend?

Here is sample code that goes in CSS, then you call the class from a row
.css-selector {
background: linear-gradient(141deg, #44b698, #d7811d, #221b85);
background-size: 600% 600%;

-webkit-animation: AnimationName 18s ease infinite;
-moz-animation: AnimationName 18s ease infinite;
animation: AnimationName 18s ease infinite;
}

@-webkit-keyframes AnimationName {
0%{background-position:11% 0%}
50%{background-position:90% 100%}
100%{background-position:11% 0%}
}
@-moz-keyframes AnimationName {
0%{background-position:11% 0%}
50%{background-position:90% 100%}
100%{background-position:11% 0%}
}
@keyframes AnimationName {
0%{background-position:11% 0%}
50%{background-position:90% 100%}
100%{background-position:11% 0%}
}