How do I confine CSS/JS files to a page's content only, not the entire page??

Hi all,

I’m desperately trying to get this to work. Basically I want one of my pages to have a HTML5 video gallery, and I need to load in the html into the page content for this to display. Normally a bit of html isn’t an issue, but this gallery’s index.html file contains linkages with numerous CSS and JS files. When I simply enter the index.html’s code directly into the WP page’s content, it messes up the page entirely because the theme is taking on these CSS/JS files. I need to isolate this content. I can use an iFrame to bring in the index.html file, but this presents other annoying issues, such as the ‘absolute’ overlay for the videos not appearing where it should (i.e. constrained to the iFrame, not the actual browser window).

Note – this is not a WordPress plugin.

Here is the code I need to insert into my WordPress page, but NOT affect the layout of the entire page:

[code moderated - please use the http://pastebin.com/ and follow the forum guidelines for posting code]

Help with this problem is GREATLY appreciated!