According to the spec [1], we have to set those CSS properties on the root node,
and then this root node would have a child node, background box [2], which would
contain all other child nodes.

In our case, the background box is `cueDiv` [3].

In theory, all those properties set on the root node should be inherited by the
background box. However, when the background box is a pseudo element `::cue`,
they won't be directly inherit from the the background box's parent, inherited
styles would acutally come from video instead.

Therefore, we have to directly set these properties on the pseudo element and
mark them as `!important` to avoid being overrided by user style script.

[1] https://www.w3.org/TR/webvtt1/#ref-for-list-of-webvtt-node-objects-9
[2] https://www.w3.org/TR/webvtt1/#webvtt-cue-background-box
[3] https://searchfox.org/mozilla-central/rev/11712bd3ce7454923e5931fa92eaf9c01ef35a0a/dom/media/webvtt/vtt.jsm#533-534

Differential Revision: https://phabricator.services.mozilla.com/D35694