diff --git a/dashboard-ui/css/mediaplayer.css b/dashboard-ui/css/mediaplayer.css
index b8d7d645b..e332d06f4 100644
--- a/dashboard-ui/css/mediaplayer.css
+++ b/dashboard-ui/css/mediaplayer.css
@@ -77,7 +77,7 @@
     position: fixed;
     top: 50%;
     left: 50%;
-    width: 1080px;
+    width: 320px;
 }
 
 .fullscreenVideo {
@@ -284,24 +284,30 @@ input[type="range"]::-ms-fill-upper {
     padding-left: 5px;
 }
 
-@media (min-width: 50px) {
-    .itemVideo:not(.fullscreenVideo) {
-        width: 320px;
-    }
-}
-
-@media (min-width: 750px) {
+@media (min-width: 640px) {
     .itemVideo:not(.fullscreenVideo) {
         width: 480px;
     }
 }
 
-@media (min-width: 1200px) {
+@media (min-width: 800px) {
+    .itemVideo:not(.fullscreenVideo) {
+        width: 640px;
+    }
+}
+
+@media (min-width: 960px) {
     .itemVideo:not(.fullscreenVideo) {
         width: 720px;
     }
 }
 
+@media (min-width: 1200px) {
+    .itemVideo:not(.fullscreenVideo) {
+        width: 1080px;
+    }
+}
+
 @media (min-width: 1440px) {
     .itemVideo:not(.fullscreenVideo) {
         width: 1080px;