Css 我想这2个动画作品在一起

嗨，我正在制作一个带有动画彩虹背景和简单动画的投票按钮，但是我只在第二个动画开始时播放它。有人能帮我吗？谢谢大家!

.btn投票{/*这是按钮*/
/*彩虹背景*/
背景：线性梯度（124deg，#ff2400，#e81d1d，#e8b71d，#e3e81d，#1de840，#1ddde8，#2b1de8，#dd00f3，#dd00f3）；
背景尺寸：1800%1800%；
-webkit动画：彩虹7s轻松无限；
-z动画：彩虹7s轻松无限；
-o-动画：彩虹7s轻松无限；
动画：彩虹7s轻松无限；
/*简单动画*/
动画：vota线性0.8s；
动画迭代次数：无限；
变换原点：50%50%；
-webkit动画：vota线性0.8s；
-webkit动画迭代计数：无限；
-webkit转换来源：50%50%；
-moz动画：vota线性0.8s；
-moz动画迭代次数：无限；
-moz变换原点：50%50%；
-o动画：vota线性0.8s；
-o-动画-迭代-计数：无限；
-o-变换原点：50%50%；
-ms动画：vota线性0.8s；
-ms动画迭代次数：无限；
-ms转换来源：50%50%；
宽度：100px；
}
/*这是彩虹动画*/
@-webkit关键帧彩虹{
0%{背景位置：0%82%}
50%{背景位置：100%19%}
100%{背景位置：0%82%}
}
@-moz为彩虹设置关键帧{
0%{背景位置：0%82%}
50%{背景位置：100%19%}
100%{背景位置：0%82%}
}
@-o-关键帧彩虹{
0%{背景位置：0%82%}
50%{背景位置：100%19%}
100%{背景位置：0%82%}
}
@彩虹{
0%{背景位置：0%82%}
50%{背景位置：100%19%}
100%{背景位置：0%82%}
}
/*这是一个简单的动画*/
@关键帧vota{
0% {
变换：旋转（0度）scaleX（1.00）scaleY（1.00）；
}
25% {
变换：旋转（10度）scaleX（1.10）scaleY（1.10）；
}
50% {
变换：旋转（0度）scaleX（1.00）scaleY（1.00）；
}
76% {
变换：旋转（-10度）scaleX（1.10）scaleY（1.10）；
}
100% {
变换：旋转（0度）scaleX（1.00）scaleY（1.00）；
}
}
@-moz关键帧vota{
0% {
-moz变换：旋转（0度）scaleX（1.00）scaleY（1.00）；
}
25% {
-moz变换：旋转（10度）scaleX（1.10）scaleY（1.10）；
}
50% {
-moz变换：旋转（0度）scaleX（1.00）scaleY（1.00）；
}
76% {
-moz变换：旋转（-10度）scaleX（1.10）scaleY（1.10）；
}
100% {
-moz变换：旋转（0度）scaleX（1.00）scaleY（1.00）；
}
}
@-webkit关键帧vota{
0% {
-webkit变换：旋转（0度）scaleX（1.00）scaleY（1.00）；
}
25% {
-webkit变换：旋转（10度）scaleX（1.10度）scaleY（1.10度）；
}
50% {
-webkit变换：旋转（0度）scaleX（1.00）scaleY（1.00）；
}
76% {
-webkit变换：旋转（-10度）scaleX（1.10）scaleY（1.10）；
}
100% {
-webkit变换：旋转（0度）scaleX（1.00）scaleY（1.00）；
}
}
@-o-关键帧vota{
0% {
-o变换：旋转（0度）scaleX（1.00）scaleY（1.00）；
}
25% {
-o变换：旋转（10度）scaleX（1.10度）scaleY（1.10度）；
}
50% {
-o变换：旋转（0度）scaleX（1.00）scaleY（1.00）；
}
76% {
-o变换：旋转（-10度）scaleX（1.10）scaleY（1.10）；
}
100% {
-o变换：旋转（0度）scaleX（1.00）scaleY（1.00）；
}
}
@-ms关键帧vota{
0% {
-ms变换：旋转（0度）scaleX（1.00）scaleY（1.00）；
}
25% {
-ms变换：旋转（10度）scaleX（1.10）scaleY（1.10）；
}
50% {
-ms变换：旋转（0度）scaleX（1.00）scaleY（1.00）；
}
76% {
-ms变换：旋转（-10度）scaleX（1.10）scaleY（1.10）；
}
100% {
-ms变换：旋转（0度）scaleX（1.00）scaleY（1.00）；
}
}

沃塔

动画应该用逗号分隔

animation: rainbow 7s ease infinite, vota linear 0.8s;

.btn投票{
/*这是按钮*/
/*彩虹背景*/
背景：线性梯度（124deg，#ff2400，#e81d1d，#e8b71d，#e3e81d，#1de840，#1ddde8，#2b1de8，#dd00f3，#dd00f3）；
背景尺寸：1800%1800%；
动画：彩虹7秒轻松无限，vota线性0.8秒；
动画迭代次数：无限；
变换原点：50%50%；
宽度：100px；
}
/*这是彩虹动画*/
@彩虹关键帧{
0% {
背景职位：0%82%
}
50% {
背景职位：100%19%
}
100% {
背景位置：0%82%
}
}
/*这是一个简单的动画*/
@关键帧vota{
0% {
变换：旋转（0度）scaleX（1.00）scaleY（1.00）；
}
25% {
变换：旋转（10度）scaleX（1.10）scaleY（1.10）；
}
50% {
变换：旋转（0度）scaleX（1.00）scaleY（1.00）；
}
76% {
变换：旋转（-10度）scaleX（1.10）scaleY（1.10）；
}
100% {
变换：旋转（0度）scaleX（1.00）scaleY（1.00）；
}
}

沃塔