diff --git a/src/routes/Player/Player.js b/src/routes/Player/Player.js
index b23ec7805..d5e8d426c 100644
--- a/src/routes/Player/Player.js
+++ b/src/routes/Player/Player.js
@@ -28,6 +28,7 @@ const Player = ({ urlParams }) => {
             selectedSubtitlesTrackId: null,
             subtitlesSize: null,
             subtitlesDelay: null,
+            subtitlesOffset: null,
             subtitlesTextColor: null,
             subtitlesBackgroundColor: null,
             subtitlesOutlineColor: null
@@ -74,6 +75,9 @@ const Player = ({ urlParams }) => {
     const onSubtitlesTrackSelected = React.useCallback((trackId) => {
         dispatch({ propName: 'selectedSubtitlesTrackId', propValue: trackId });
     }, []);
+    const onSubtitlesOffsetChanged = React.useCallback((offset) => {
+        dispatch({ propName: 'subtitlesOffset', propValue: offset });
+    }, []);
     const onContainerMouseDown = React.useCallback((event) => {
         if (!event.nativeEvent.subtitlesPickerClosePrevented) {
             closeSubtitlesPicker();
@@ -129,12 +133,6 @@ const Player = ({ urlParams }) => {
                 volume={state.volume}
                 muted={state.muted}
                 subtitlesTracks={state.subtitlesTracks}
-                selectedSubtitlesTrackId={state.selectedSubtitlesTrackId}
-                subtitlesSize={state.subtitlesSize}
-                subtitlesDelay={state.subtitlesDelay}
-                subtitlesTextColor={state.subtitlesTextColor}
-                subtitlesBackgroundColor={state.subtitlesBackgroundColor}
-                subtitlesOutlineColor={state.subtitlesOutlineColor}
                 onPlayRequested={onPlayRequested}
                 onPauseRequested={onPauseRequested}
                 onMuteRequested={onMuteRequested}
@@ -149,12 +147,14 @@ const Player = ({ urlParams }) => {
                         className={classnames(styles['layer'], styles['menu-layer'])}
                         subtitlesTracks={state.subtitlesTracks}
                         selectedSubtitlesTrackId={state.selectedSubtitlesTrackId}
+                        subtitlesOffset={state.subtitlesOffset}
                         subtitlesSize={state.subtitlesSize}
                         subtitlesDelay={state.subtitlesDelay}
                         subtitlesTextColor={state.subtitlesTextColor}
                         subtitlesBackgroundColor={state.subtitlesBackgroundColor}
                         subtitlesOutlineColor={state.subtitlesOutlineColor}
                         onSubtitlesTrackSelected={onSubtitlesTrackSelected}
+                        onSubtitlesOffsetChanged={onSubtitlesOffsetChanged}
                     />
                     :
                     null
diff --git a/src/routes/Player/SubtitlesPicker/SubtitlesPicker.js b/src/routes/Player/SubtitlesPicker/SubtitlesPicker.js
index b2115d176..fef047614 100644
--- a/src/routes/Player/SubtitlesPicker/SubtitlesPicker.js
+++ b/src/routes/Player/SubtitlesPicker/SubtitlesPicker.js
@@ -50,13 +50,16 @@ const SubtitlesPicker = (props) => {
             null;
     }, [props.subtitlesTracks, props.selectedSubtitlesTrackId]);
     const tracksForLanguage = React.useMemo(() => {
-        return Array.isArray(props.subtitlesTracks) && selectedLanguage !== null ?
+        return Array.isArray(props.subtitlesTracks) && typeof selectedLanguage === 'string' ?
             props.subtitlesTracks.filter(({ lang }) => {
                 return lang === selectedLanguage;
             })
             :
             [];
     }, [props.subtitlesTracks, selectedLanguage]);
+    const subtitlesOffsetDisabled = React.useMemo(() => {
+        return props.subtitlesOffset === null || isNaN(props.subtitlesOffset);
+    }, [props.subtitlesOffset]);
     const onMouseDown = React.useCallback((event) => {
         event.nativeEvent.subtitlesPickerClosePrevented = true;
     }, []);
@@ -76,6 +79,14 @@ const SubtitlesPicker = (props) => {
     const trackOnClick = React.useCallback((event) => {
         props.onSubtitlesTrackSelected(event.currentTarget.dataset.trackId);
     }, [props.onSubtitlesTrackSelected]);
+    const onOffsetButtonClicked = React.useCallback((event) => {
+        if (props.subtitlesOffset !== null && !isNaN(props.subtitlesOffset)) {
+            const offset = props.subtitlesOffset + parseInt(event.currentTarget.dataset.offset);
+            if (typeof props.onSubtitlesOffsetChanged === 'function') {
+                props.onSubtitlesOffsetChanged(offset);
+            }
+        }
+    }, [props.subtitlesOffset, props.onSubtitlesOffsetChanged]);
     return (
         <div className={classnames(props.className, styles['subtitles-picker-container'])} onMouseDown={onMouseDown}>
             <div className={styles['languages-container']}>
@@ -84,7 +95,7 @@ const SubtitlesPicker = (props) => {
                     <Button title={'Off'} className={classnames(styles['language-option'], { 'selected': selectedLanguage === null })} onClick={languageOnClick}>
                         <div className={styles['language-label']}>Off</div>
                         {
-                            selectedLanguage === null ?
+                            typeof selectedLanguage !== 'string' ?
                                 <div className={styles['icon']} />
                                 :
                                 null
@@ -151,12 +162,14 @@ const SubtitlesPicker = (props) => {
                     </Button>
                 </div>
                 <div className={styles['option-header']}>Vertical position</div>
-                <div className={styles['option-container']}>
-                    <Button className={styles['button-container']}>
+                <div className={classnames(styles['option-container'], { 'disabled': subtitlesOffsetDisabled })} title={subtitlesOffsetDisabled ? 'Vertical position is not configurable' : null}>
+                    <Button className={classnames(styles['button-container'], { 'disabled': subtitlesOffsetDisabled })} data-offset={-1} onClick={onOffsetButtonClicked}>
                         <Icon className={styles['icon']} icon={'ic_minus'} />
                     </Button>
-                    <div className={styles['option-label']} title={'18%'}>18%</div>
-                    <Button className={styles['button-container']}>
+                    <div className={styles['option-label']} title={!subtitlesOffsetDisabled ? `${props.subtitlesOffset}%` : null}>
+                        {!subtitlesOffsetDisabled ? `${props.subtitlesOffset}%` : '--'}
+                    </div>
+                    <Button className={classnames(styles['button-container'], { 'disabled': subtitlesOffsetDisabled })} data-offset={1} onClick={onOffsetButtonClicked}>
                         <Icon className={styles['icon']} icon={'ic_plus'} />
                     </Button>
                 </div>
@@ -175,12 +188,14 @@ SubtitlesPicker.propTypes = {
         origin: PropTypes.string.isRequired
     })),
     selectedSubtitlesTrackId: PropTypes.string,
+    subtitlesOffset: PropTypes.number,
     subtitlesSize: PropTypes.number,
     subtitlesDelay: PropTypes.number,
     subtitlesTextColor: PropTypes.string,
     subtitlesBackgroundColor: PropTypes.string,
     subtitlesOutlineColor: PropTypes.string,
-    onSubtitlesTrackSelected: PropTypes.func
+    onSubtitlesTrackSelected: PropTypes.func,
+    onSubtitlesOffsetChanged: PropTypes.func
 };
 
 module.exports = SubtitlesPicker;
diff --git a/src/routes/Player/SubtitlesPicker/styles.less b/src/routes/Player/SubtitlesPicker/styles.less
index 94bfde0c0..37c3d2175 100644
--- a/src/routes/Player/SubtitlesPicker/styles.less
+++ b/src/routes/Player/SubtitlesPicker/styles.less
@@ -109,6 +109,10 @@
             align-items: center;
             background: @color-background-dark1;
 
+            &:global(.disabled) {
+                opacity: 0.4;
+            }
+
             .button-container {
                 flex: none;
                 width: 3rem;