register: Fix for small widths.

templates/zerver/register.html

@@ -14,7 +14,7 @@ Form is validated both client-side using jquery-validation (see signup.js) and s
 
 {% block portico_content %}
 <div class="register-account flex full-page">
-    <div class="center-block new-style" style="padding: 20px 0px">
+    <div class="center-block new-style" style="padding: 20px 0px" id="create-account">
 
         <div class="pitch">
             {% if creating_new_realm %}

web/styles/portico/portico_signin.css

@@ -1340,10 +1340,19 @@ button#register_auth_button_gitlab {
         min-height: calc(100vh - 505px);
     }
 
+    #create-account,
     #new-realm-creation {
         margin: 0 -30px;
         transform: scale(0.9);
     }
+
+    #create-account {
+        margin: -70px;
+
+        #registration {
+            padding: 0;
+        }
+    }
 }
 
 @media (width <= 400px) {
@@ -1351,17 +1360,27 @@ button#register_auth_button_gitlab {
         min-height: calc(100vh - 560px);
     }
 
+    #create-account,
     #new-realm-creation {
         margin: -10px -40px;
         transform: scale(0.8);
     }
+
+    #create-account {
+        margin: -100px;
+    }
 }
 
 @media (width <= 340px) {
+    #create-account,
     #new-realm-creation {
         margin: -40px -60px;
         transform: scale(0.7);
     }
+
+    #create-account {
+        margin: -150px;
+    }
 }
 
 .account-creation .white-box .user_email {