Bootstrap CSS affecting embedded report on a HTML page

Bootstrap CSS affecting embedded report on a HTML page

I am trying to style a custom page in creator with an embedded report. When I embed the report with no style then the report comes in as expected. However when I add the bootstrap 4 CSS file in the overall report area remains as expected but the content is compressed against the left hand side.

I dont see any parameters within the zc-component that allow for sizing of the report area so wondering how the CSS is impacting this?

I have attached two screenshots - one with the bootstrap.css applied and one without.