Customize HTML5 output or project structure?

I am trying to solve a problem where a header and footer need to be added to my published project outside of my Captivate project. They are being inserted w/ javascript once the project is published.  We don't want to put them directly into our captivate projects in case links are updated/changed. etc. Easier to manage from one place.

Since Captivate adds inline styles to so many elements when publishing as HTML5, the header and footers are overlapping my project when the viewport is re-scaled or changes from landscape to portrait.  We can override some styles but it is really inefficient to override every single one.  There are 2 ways I can think of to solve this but I can't figure them out:

1. Is there a way to get the TOC bar calculated as part of the project width/height?  When I publish my project at a height of say, 715px, the content is actually taller because of the TOC bar at the bottom, but the inline height applied matches the 715px, so the TOC bar gets cut off.

OR

2. Is there a way I can modify the folder/build structure when publishing a project as HTML5 so that the published project goes to project.html instead of index.html? I do not see a setting anywhere to do this.  This route would allow us to keep our URLs and pull project.html into index.html as an iFrame.

Thanks for any help.