diff --git a/src/components/WebexLocalMedia/WebexLocalMedia.js b/src/components/WebexLocalMedia/WebexLocalMedia.js
index 4a194f77b..c0f2310a7 100644
--- a/src/components/WebexLocalMedia/WebexLocalMedia.js
+++ b/src/components/WebexLocalMedia/WebexLocalMedia.js
@@ -4,7 +4,7 @@ import classNames from 'classnames';
import {Spinner} from '@momentum-ui/react';
import {WebexAvatar} from '../';
-import {useMe, useMeeting, useStream} from '../hooks';
+import {useElementDimensions, useMe, useMeeting, useStream} from '../hooks';
import './WebexLocalMedia.scss';
@@ -15,18 +15,24 @@ import './WebexLocalMedia.scss';
* @returns {Object} JSX of the component
*/
export default function WebexLocalMedia({meetingID}) {
+ const [mediaRef, {width}] = useElementDimensions();
const {localVideo} = useMeeting(meetingID);
const {ID} = useMe();
const videoRef = useStream(localVideo);
const cssClasses = classNames({
'local-media': true,
+ 'local-media-desktop': width >= 425, // Standard large phone width
'no-media': localVideo === null,
});
const disabledVideo = ID ?