HG-269 Smart resizing for Ooyala player

https://wikia-inc.atlassian.net/browse/HG-269
This overwrites style of the container div for Ooyala video that comes from the API. Size is calculated from viewport size and video's aspect ratio; recalculated on window resize.
Yes, it's a div created by Ooyala script that can't be modified. From #mercury:

> I need to modify z-index for Ooyala player so it doesn't overlap lightbox's close button. I found two ways to do this but none of them is clean. What do you think - which is better? Or maybe you have some better idea?

> 1. `.lightbox-content-inner .innerWrapper { z-index: $z-1 !important; }` - this sucks because there is no `ooyala` class and it might break some other `.innerWrapper` one day

> 2. `.lightbox-header { z-index: 10001 }` - this sucks because in `public/styles/_wikia-variables.scss` we have `$z-max: 10000;` and we're not supposed to go higher

I picked the first solution and added `.video-provider-ooyala` class to the parent div. I'll modify the comment to be more descriptive.