firework svg with animated css

firework.svg

fireworks.css

@-webkit-keyframes pulse {
    0% {  
        stroke: #FFF5A5;
        fill: #45CEEF; 
    }
    25% { 
        stroke: #FFD4DA;
        fill: #FFF5A5; 
    }
    50% { 
        stroke: #99D2E4;
        fill: #FFD4DA; 
    }
    75% { 
        stroke: #D8CAB4;
        fill: #99D2E4; }
    100% {
        stroke: #45CEEF;
        fill: #D8CAB4; 
    }
}
@keyframes pulse {
    0% {  
        stroke: #FFF5A5;
        fill: #45CEEF; 
    }
    25% { 
        stroke: #FFD4DA;
        fill: #FFF5A5; 
    }
    50% { 
        stroke: #99D2E4;
        fill: #FFD4DA; 
    }
    75% { 
        stroke: #D8CAB4;
        fill: #99D2E4; }
    100% {
        stroke: #45CEEF;
        fill: #D8CAB4; 
    }
}
.spark_1,
.spark_2,
.spark_3 {
    fill: #45CEEF;
    stroke: #FFF5A5;
    -webkit-animation-duration: 3s;
    -webkit-animation-name: pulse;
    -webkit-animation-iteration-count: infinite;
    animation-duration: 3s;
    animation-name: pulse;
    animation-iteration-count: infinite;
}
.spark_1 {
    -webkit-animation-delay: 0.11s;
    animation-delay: 0.11s;
}
.spark_2 {
    -webkit-animation-delay: 0.21s;
    animation-delay: 0.21s;
}
.spark_3 {
    -webkit-animation-delay: 0.31s;
    animation-delay: 0.31s;
}