I have two Edge animations (both with their width and height in pixels and responsive scaling set to width only) and I would like for one of them to play for screens in portrait and the other to play for screens in landscape. I am able to load both animations on the same html page by copying and pasting the Edge Runtime and stage divs and I can hide the content of one or the other using media queries.
The problem is that both animations are inside .flow-wrapper and .center-wrapper divs that are always visible and cannot be edited so I basically end up with a blank space where the animation would be. I can’t edit the name or assign an ID to the flow divs so changing the display properties for one affects the other.
Is there any way to edit the wrapper divs or even a way to use media queries on the animations themselves?