diff --git a/packages/web/src/pages/oauth-login-page/OAuthLoginPage.module.css b/packages/web/src/pages/oauth-login-page/OAuthLoginPage.module.css
index 45399983639..999dff33709 100644
--- a/packages/web/src/pages/oauth-login-page/OAuthLoginPage.module.css
+++ b/packages/web/src/pages/oauth-login-page/OAuthLoginPage.module.css
@@ -5,6 +5,7 @@
   right: 0;
   bottom: 0;
   justify-content: center;
+  align-items: center;
   display: flex;
   overflow: scroll;
 }
@@ -43,13 +44,14 @@
 }
 
 .container {
-  width: 375px;
+  width: 100%;
+  max-width: 375px;
   display: flex;
   flex-direction: column;
   gap: 24px;
   padding: 32px 24px;
   justify-content: center;
-  flex: 1;
+  flex: 0 1 auto;
 }
 
 @media (max-width: 375px) {
diff --git a/packages/web/src/pages/oauth-login-page/components/ContentWrapper.tsx b/packages/web/src/pages/oauth-login-page/components/ContentWrapper.tsx
index 08ec97e667a..f2942613e10 100644
--- a/packages/web/src/pages/oauth-login-page/components/ContentWrapper.tsx
+++ b/packages/web/src/pages/oauth-login-page/components/ContentWrapper.tsx
@@ -20,9 +20,8 @@ export const ContentWrapper = ({
       <Paper
         shadow='mid'
         w='375px'
+        css={{ maxWidth: '100%' }}
         direction='column'
-        mv='3xl'
-        alignSelf='flex-start'
         border='strong'
         borderRadius='xl'
       >