Wrap terms to set width and top padding

src/containers/AuthenticationPage/AuthenticationPage.css

@@ -50,6 +50,18 @@
   text-align: left;
 }
 
+/* Terms of Service modal*/
+
+.termsWrapper {
+  width: 100%;
+  padding-top: 40px;
+
+  @media (--viewportMedium) {
+    width: 571px;
+    padding-top: 11px;
+  }
+}
+
 /* ================ Hide Top bar in screens smaller than 768px  ================ */
 
 .hideOnMobile {

src/containers/AuthenticationPage/AuthenticationPage.js

@@ -247,7 +247,9 @@ export class AuthenticationPageComponent extends Component {
               onClose={() => this.setState({ tosModalOpen: false })}
               onManageDisableScrolling={onManageDisableScrolling}
             >
-              <TermsOfService />
+              <div className={css.termsWrapper}>
+                <TermsOfService />
+              </div>
             </Modal>
           </LayoutWrapperMain>
           <LayoutWrapperFooter>

src/containers/AuthenticationPage/__snapshots__/AuthenticationPage.test.js.snap

@@ -88,10 +88,12 @@ exports[`AuthenticationPageComponent matches snapshot 1`] = `
         onClose={[Function]}
         onManageDisableScrolling={[Function]}
       >
-        <TermsOfService
+        <div>
-          className={null}
+          <TermsOfService
-          rootClassName={null}
+            className={null}
-        />
+            rootClassName={null}
+          />
+        </div>
       </InjectIntl(ModalComponent)>
     </LayoutWrapperMain>
     <LayoutWrapperFooter