.para-bg {
    height: 100%;
    width: 100%;
    background-position: center bottom;
    background-repeat: repeat-x;
    position: fixed;
    bottom: 0px;
    width: calc(100% + 10px); /* to get rid of slight gap between tiled images */
    z-index: -1; /* keep the waves behind everything else*/
    pointer-events: none; /* don't let the waves take over the screen */
}

#para-bg-0 {
    background-image: url("../images/para-wave-0.0a6524ca016d.svg");
    animation: scroll-background 4s infinite linear;
}

#para-bg-1 {
    background-image: url("../images/para-wave-1.90e84093500e.svg");
    animation: scroll-background 9s infinite linear;
}

#para-bg-2 {
    background-image: url("../images/para-wave-2.edcd5bf24c6c.svg");
    animation: scroll-background 16s infinite linear;
}

#para-bg-3 {
    background-image: url("../images/para-wave-3.a0c65b56c54d.svg");
    animation: scroll-background 25s infinite linear;
}

#para-bg-4 {
    background-image: url("../images/para-wave-4.3a2ee49dec97.svg");
    animation: scroll-background 36s infinite linear;
}

#para-bg-5 {
    background-image: url("../images/para-wave-5.6327490dc86d.svg");
    animation: scroll-background 49s infinite linear;
}

@keyframes scroll-background {
    0% {
        background-position: 0px bottom;
    }
    100% {
        background-position: 100vw bottom;
    }
}