diff --git a/src/components/extended-video-player.tsx b/src/components/extended-video-player.tsx
index e0512588c..23d8a35cb 100644
--- a/src/components/extended-video-player.tsx
+++ b/src/components/extended-video-player.tsx
@@ -42,10 +42,11 @@ const ExtendedVideoPlayer: React.FC<IExtendedVideoPlayer> = ({ src, alt, time, c
   }
 
   return (
-    <div className='extended-video-player'>
+    <div className='flex size-full items-center justify-center'>
       <video
         ref={video}
         src={src}
+        className='max-h-[80%] max-w-full'
         autoPlay
         role='button'
         tabIndex={0}
diff --git a/src/features/ui/components/modals/media-modal.tsx b/src/features/ui/components/modals/media-modal.tsx
index 5d7ffaec4..86ec556b2 100644
--- a/src/features/ui/components/modals/media-modal.tsx
+++ b/src/features/ui/components/modals/media-modal.tsx
@@ -233,7 +233,7 @@ const MediaModal: React.FC<IMediaModal> = (props) => {
   };
 
   return (
-    <div className='media-modal pointer-events-auto fixed inset-0 z-[9999] h-full bg-gray-900/90'>
+    <div className='pointer-events-auto fixed inset-0 z-[9999] h-full bg-gray-900/90'>
       <div
         className='absolute inset-0'
         role='presentation'