diff --git a/moneymgr_web/src/routes/BackupRoute.tsx b/moneymgr_web/src/routes/BackupRoute.tsx
index 5bb2adc..2f192ca 100644
--- a/moneymgr_web/src/routes/BackupRoute.tsx
+++ b/moneymgr_web/src/routes/BackupRoute.tsx
@@ -135,11 +135,18 @@ function ImportExportModal(p: {
   };
 
   return (
-    <Grid size={{ md: 6, lg: 3 }} style={{ height: "100%" }}>
+    <Grid
+      size={{ sm: 12, md: 6, lg: 4 }}
+      style={{ height: "100%", maxHeight: "250px" }}
+    >
       <Card
         elevation={3}
         variant="outlined"
-        style={{ height: "100%", display: "flex", flexDirection: "column" }}
+        style={{
+          height: "100%",
+          display: "flex",
+          flexDirection: "column",
+        }}
       >
         <CardHeader avatar={p.icon} title={p.label} />
         <CardContent style={{ flex: 1 }}>