diff --git a/components/FlipPanel.module.css b/components/FlipPanel.module.css
index 727e03c..474a254 100644
--- a/components/FlipPanel.module.css
+++ b/components/FlipPanel.module.css
@@ -1,6 +1,16 @@
-.flipPanelContainer {
-    max-width: 476px;
+@media (max-width: 492px) {
+    .flipPanelContainer {
+        max-width: 100%;
+    }
+}
 
+@media (min-width: 492px) {
+    .flipPanelContainer {
+        max-width: 476px;
+    }
+}
+
+.flipPanelContainer {
     display: flex;
     justify-content: stretch;
     align-items: stretch;
diff --git a/components/ProjectsList.module.css b/components/ProjectsList.module.css
index 33df148..5cf5787 100644
--- a/components/ProjectsList.module.css
+++ b/components/ProjectsList.module.css
@@ -1,6 +1,6 @@
 .projectsList {
-    max-height: 500px;
-    flex-grow: 0;
+    flex-basis: 500px;
+    flex-grow: 1;
     flex-shrink: 1;
     overflow-y: scroll;
 
diff --git a/pages/_app.css b/pages/_app.css
index 367aa30..d1591fd 100644
--- a/pages/_app.css
+++ b/pages/_app.css
@@ -7,8 +7,16 @@
 @import 'node_modules/@steffo/bluelib/dist/fonts-fira-ghpages.root.css';
 @import 'node_modules/@fortawesome/fontawesome-svg-core/styles.css';
 
-.panel {
-    max-width: 476px;
+@media (max-width: 492px) {
+    .panel {
+        max-width: 100%;
+    }
+}
+
+@media (min-width: 492px) {
+    .panel {
+        max-width: 476px;
+    }
 }
 
 .panel .panel {