[BUG] CC widget is not aligned on mobile devices #586

Describe the bug
The CC widget is not properly aligned in the center of the green underline that displays when captions are turned on in Ramp. This is not an issue on Chrome / Safari on desktop, but is noticeable in Android and iOS
To Reproduce
Steps to reproduce the behavior:

1. Go to any item with captions on avalon-staging (ex: https://avalon-staging.dlib.indiana.edu/media_objects/9c67wm82b, third section) on iPhone, iPad, or Android device.
2. Turn captions on if they are not already on.
3. The CC icon is not centered above the green underline. On iPad (Safari) for example, it is right-aligned with the green underline, but is significantly narrower (see screenshot).

Expected behavior
Across all device contexts, the CC icon should be centered above the green underline when captions are turned on.

Screenshots

Smartphone (please complete the following information):

• Device: iPhone, iPad, Android Pixel
• Browser: Safari on iOS; Chrome on Android