Fix video caption centering

Description

There was an issue where, when videos were fullscreen with captions on and transcripts off, the captions were horribly off center:
<img width="1440" alt="screen shot 2017-07-13 at 12 18 15 pm" src="https://user-images.githubusercontent.com/1097075/28188841-67fac5ae-67d8-11e7-8df2-f7e688c88a64.png">
You can see this on edx.org, [here](https://courses.edx.org/courses/course-v1:W3Cx+HTML5.0x+1T2017/courseware/76828eeb1b274f478c1dce2b9ef2148e/be863694ac4b45e492eae4c82576acc5/), or with any video. Just make it fullscreen, turn on captions, and turn off scrolling transcripts.

This fix makes them centered like this:
<img width="1440" alt="screen shot 2017-07-13 at 1 28 35 pm" src="https://user-images.githubusercontent.com/1097075/28188974-dededfe8-67d8-11e7-844c-0ced30fcc3ef.png">

In general, however, the captions were never perfectly centered. The proper width for the caption box was really only estimated (better at some video sizes than others). I fix that here. The difference is small, but you can see it in the following screenshots:
off center:
<img width="878" alt="screen shot 2017-07-13 at 1 38 12 pm" src="https://user-images.githubusercontent.com/1097075/28189082-60d30b46-67d9-11e7-835a-84d67366de5d.png">

fixed:
<img width="876" alt="screen shot 2017-07-13 at 1 29 09 pm" src="https://user-images.githubusercontent.com/1097075/28189090-66dbf4b2-67d9-11e7-9e7b-b7b8db72bcaf.png">

@stvstnfrd @caesar2164

Done

Assignee

Muzaffar Yousaf

Reporter

Open Source Pull Request Bot

Contributor Name

Joshua Spayd

Repo

edx/edx-platform

Customer

None

Epic Link

None

OSCM Assignee

None

Platform Map Area (Levels 1 &amp; 2)

None

Platform Map Area (Levels 3 &amp; 4)

None

Blended Hour Utilization Percentage

None

edX Theme

None

edX Squad

None

Github Lines Added

None

Github Lines Deleted

None

Story Points

1

Priority

Unset