diff --git a/public/css/chat.css b/public/css/chat.css
index 6c6799b..aef5584 100644
--- a/public/css/chat.css
+++ b/public/css/chat.css
@@ -110,8 +110,10 @@ a {
 }
 
 #wrapper {
-  display: grid;
-  grid-gap: 10px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  flex-wrap: wrap;
   justify-content: center;
   padding: 0;
   margin: 0;
@@ -142,12 +144,33 @@ a {
   border-radius: 0 0 10px 10px;
   padding: 10px;
 }
+#remote-video:first-child:nth-last-child(1) {
+/* -or- li:only-child { */
+  max-height: 80vh;
+}
+
+/* two items */
+#remote-video:first-child:nth-last-child(2),
+#remote-video:first-child:nth-last-child(2) ~ #remote-video {
+  max-height: 40vh;
+}
+
+/* three items */
+#remote-video:first-child:nth-last-child(3),
+#remote-video:first-child:nth-last-child(3) ~ #remote-video {
+  max-height: 40vh;
+}
+
+/* four items */
+#remote-video:first-child:nth-last-child(4),
+#remote-video:first-child:nth-last-child(4) ~ #remote-video {
+  max-height: 40vh;
+}
 
 #remote-video {
   padding: 0;
-  margin: 0;
-  width: 100%;
-  height: auto;
+  margin: 10px;
+  width: auto;
   border-radius: 10px;
   background-image: url(../images/loader.gif);
   background-size: 400px auto;