How do you make an inline SVG scale full-screen to background-size and still be able to be animated?

Question

It is possible to get an SVG or image to scale nicely with background css such as:

.svg_background {
    background: url("example.svg") no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height: 100vh;
    width: 100vw;
    position: absolute;
}

However, I don't think you can do CSS animations like this. I tried a partial workaround where I base64 encoded the SVG into the URL reference and was able to include inline CSS styling that way, but the trouble is that inline CSS styling doesn't seem to have a way to add the keyframes necessary for animation.

So, the simplest solution would be to keep the SVG completely inline and figure out a way to resize it without background related CSS.

That way, CSS animations can be done of the SVG.

Any ideas how to resize an inline SVG or image to adjust to fullscreen?

Thanks!