Making WebGL the bg of a page?

I originally posted this in the js forums, but that I realised that that was a mistake on my part :blush:. It was because the js that made the webGL was working fine, but I was having problem positioning elements over the webGl, which seems more like a CSS issue now that I think about it.

I hope you guys can help me with this thing that I was trying:
I was playing with a webGl experiment I found that makes this cool clouds effect, here it is alone, and I wanted to make it look like the title scene to the tv show The Simspons.

So I used CSS3 fonts to display the text in said font from the simpsons and it works fine when supported as seen here with the webGL commented out.

However when combining them and uncommenting everything, I was unable to bring the simpsons text above the clouds no matter what I tried-- even z-index’s

Here is my attempt at them together. But it looks just like the clouds alone because I can’t get the font or any element to position above the webGl

Do you guys have any suggestions on how I could make the webGL be the background or just behind the text, or if I were to develop other webGL behind all other elements.

I would really appreciate any help and I hope to hear from you guys soon.
Thanks in Advance & Regards,
Team 1504.

P.S. This is a sample image of the Simpsons’ title image in the case you did not know.