diff --git a/components/layout.tsx b/components/layout.tsx
index e2ccf10..ad6319e 100644
--- a/components/layout.tsx
+++ b/components/layout.tsx
@@ -6,7 +6,7 @@ export default function Home({ children }: { children: React.ReactNode }) {
   return (
     <>
       <Header />
-      <main className="main">{children}</main>
+      <main className="main max-w-7xl mx-auto px-4 sm:px-6">{children}</main>
       <Footer />
     </>
   )
diff --git a/styles/index.css b/styles/index.css
index 3c0640d..e2b716e 100644
--- a/styles/index.css
+++ b/styles/index.css
@@ -14,7 +14,7 @@
 }
 
 .main {
-  @apply flex-grow sm:w-10/12 sm:m-auto p-4 sm:p-6;
+  @apply flex-grow;
   hyphens: auto;
 }