diff --git a/src/pages/login.tsx b/src/pages/login.tsx
index 9c7f5d6..ac56032 100644
--- a/src/pages/login.tsx
+++ b/src/pages/login.tsx
@@ -20,8 +20,8 @@ const Login: NextPage = () => {
   }
 
   return (
-    <div className={"mt-10 flex h-full items-center justify-center"}>
-      <Card className={"w-96"}>
+    <div className={"mt-10 flex h-full items-center justify-center p-4"}>
+      <Card className={"w-full max-w-96"}>
         <CardHeader>
           <CardTitle>Sign In</CardTitle>
         </CardHeader>
diff --git a/src/pages/sign-up.tsx b/src/pages/sign-up.tsx
index c7e374b..3d9f056 100644
--- a/src/pages/sign-up.tsx
+++ b/src/pages/sign-up.tsx
@@ -20,8 +20,8 @@ const Login: NextPage = () => {
   }
 
   return (
-    <div className={"mt-10 flex h-full items-center justify-center"}>
-      <Card className={"w-96"}>
+    <div className={"mt-10 flex h-full items-center justify-center p-4"}>
+      <Card className={"w-full max-w-96"}>
         <CardHeader>
           <CardTitle>Sign up</CardTitle>
         </CardHeader>