diff --git a/src/components/WelcomeText.js b/src/components/WelcomeText.js
new file mode 100644
index 000000000000..e41550d86c16
--- /dev/null
+++ b/src/components/WelcomeText.js
@@ -0,0 +1,26 @@
+import React from 'react';
+import {Text, View} from 'react-native';
+import styles from '../styles/styles';
+import withWindowDimensions, {windowDimensionsPropTypes} from './withWindowDimensions';
+
+const propTypes = {
+    ...windowDimensionsPropTypes,
+};
+
+const WelcomeText = props => (
+    <View style={props.isSmallScreenWidth ? [] : [styles.mb6, styles.mt6]}>
+        <Text style={[props.isSmallScreenWidth ? styles.textLabel : styles.textP, styles.textStrong, styles.mb1]}>
+            With Expensify.cash, chat and payments are the same thing.
+        </Text>
+        <Text style={[props.isSmallScreenWidth ? styles.textLabel : styles.textP]}>
+            Money talks. And now that chat and payments are in one place, it&apos;s also easy.
+            {' '}
+            Your payments get to you as fast as you can get your point across.
+        </Text>
+    </View>
+);
+
+WelcomeText.propTypes = propTypes;
+WelcomeText.displayName = 'WelcomeText';
+
+export default withWindowDimensions(WelcomeText);
diff --git a/src/pages/SetPasswordPage.js b/src/pages/SetPasswordPage.js
index 79679dca6141..906cb86ee0b7 100644
--- a/src/pages/SetPasswordPage.js
+++ b/src/pages/SetPasswordPage.js
@@ -1,20 +1,24 @@
 import React, {Component} from 'react';
 import {
+    Image,
     SafeAreaView,
     Text,
     TextInput,
     View,
 } from 'react-native';
 import PropTypes from 'prop-types';
+import lodashGet from 'lodash/get';
 import {withOnyx} from 'react-native-onyx';
 import _ from 'underscore';
-import lodashGet from 'lodash/get';
 import styles from '../styles/styles';
-import ExpensifyCashLogo from '../../assets/images/expensify-cash.svg';
-import {setPassword} from '../libs/actions/Session';
+import SignInPageLayout from './signin/SignInPageLayout';
+import welcomeScreenshot from '../../assets/images/welcome-screenshot.png';
+import withWindowDimensions, {windowDimensionsPropTypes} from '../components/withWindowDimensions';
+import WelcomeText from '../components/WelcomeText';
 import ONYXKEYS from '../ONYXKEYS';
-import variables from '../styles/variables';
+import {setPassword} from '../libs/actions/Session';
 import ButtonWithLoader from '../components/ButtonWithLoader';
+import compose from '../libs/compose';
 
 const propTypes = {
     /* Onyx Props */
@@ -42,8 +46,8 @@ const propTypes = {
             validateCode: PropTypes.string,
         }),
     }),
+    ...windowDimensionsPropTypes,
 };
-
 const defaultProps = {
     account: {},
     credentials: {},
@@ -83,45 +87,38 @@ class SetPasswordPage extends Component {
 
     render() {
         return (
-            <>
-                <SafeAreaView style={[styles.signInPage]}>
-                    <View style={[styles.signInPageInner]}>
-                        <View style={[styles.signInPageLogo]}>
-                            <ExpensifyCashLogo
-                                width={variables.componentSizeLarge}
-                                height={variables.componentSizeLarge}
-                            />
-                        </View>
-                        <View style={[styles.mb4]}>
-                            <Text style={[styles.formLabel]}>Enter a password</Text>
-                            <TextInput
-                                style={[styles.textInput]}
-                                secureTextEntry
-                                autoCompleteType="password"
-                                textContentType="password"
-                                value={this.state.password}
-                                onChangeText={text => this.setState({password: text})}
-                                onSubmitEditing={this.submitForm}
-                            />
-                        </View>
-                        <ButtonWithLoader
-                            text="Set Password"
-                            onClick={this.submitForm}
-                            isLoading={this.props.account.loading}
+            <SafeAreaView style={[styles.signInPage]}>
+                <SignInPageLayout>
+                    <View style={[styles.mb4]}>
+                        <Text style={[styles.formLabel]}>Enter a password:</Text>
+                        <TextInput
+                            style={[styles.textInput]}
+                            secureTextEntry
+                            autoCompleteType="password"
+                            textContentType="password"
+                            value={this.state.password}
+                            onChangeText={text => this.setState({password: text})}
+                            onSubmitEditing={this.submitForm}
+                            autoFocus
                         />
-                        {this.state.formError && (
-                            <Text style={[styles.formError]}>
-                                {this.state.formError}
-                            </Text>
-                        )}
-                        {!_.isEmpty(this.props.account.error) && (
-                            <Text style={[styles.formError]}>
-                                {this.props.account.error}
-                            </Text>
-                        )}
                     </View>
-                </SafeAreaView>
-            </>
+                    <ButtonWithLoader
+                        text="Set Password"
+                        onClick={this.submitForm}
+                        isLoading={this.props.account.loading}
+                    />
+                    {this.state.formError && (
+                        <Text style={[styles.formError]}>
+                            {this.state.formError}
+                        </Text>
+                    )}
+                    {!_.isEmpty(this.props.account.error) && (
+                        <Text style={[styles.formError]}>
+                            {this.props.account.error}
+                        </Text>
+                    )}
+                </SignInPageLayout>
+            </SafeAreaView>
         );
     }
 }
@@ -129,7 +126,10 @@ class SetPasswordPage extends Component {
 SetPasswordPage.propTypes = propTypes;
 SetPasswordPage.defaultProps = defaultProps;
 
-export default withOnyx({
-    credentials: {key: ONYXKEYS.CREDENTIALS},
-    account: {key: ONYXKEYS.ACCOUNT},
-})(SetPasswordPage);
+export default compose(
+    withOnyx({
+        credentials: {key: ONYXKEYS.CREDENTIALS},
+        account: {key: ONYXKEYS.ACCOUNT},
+    }),
+    withWindowDimensions,
+)(SetPasswordPage);
diff --git a/src/pages/signin/LoginForm/LoginFormNarrow.js b/src/pages/signin/LoginForm/LoginFormNarrow.js
index 50b5c72341bd..dd90c85e7fb1 100644
--- a/src/pages/signin/LoginForm/LoginFormNarrow.js
+++ b/src/pages/signin/LoginForm/LoginFormNarrow.js
@@ -11,6 +11,7 @@ import ButtonWithLoader from '../../../components/ButtonWithLoader';
 import {fetchAccountDetails} from '../../../libs/actions/Session';
 import welcomeScreenshot from '../../../../assets/images/welcome-screenshot.png';
 import ONYXKEYS from '../../../ONYXKEYS';
+import WelcomeText from '../../../components/WelcomeText';
 
 const propTypes = {
     /* Onyx Props */
@@ -60,7 +61,7 @@ class LoginFormNarrow extends React.Component {
 
     render() {
         return (
-            <View style={[styles.loginFormContainer]}>
+            <>
                 <View style={[styles.mb4]}>
                     <Text style={[styles.formLabel]}>Enter your phone or email:</Text>
                     <TextInput
@@ -94,26 +95,7 @@ class LoginFormNarrow extends React.Component {
                         {this.props.account.error}
                     </Text>
                 )}
-
-                <View style={[styles.mt5, styles.mb5]}>
-                    <Image
-                        resizeMode="contain"
-                        style={[styles.signinWelcomeScreenshot]}
-                        source={welcomeScreenshot}
-                    />
-                </View>
-
-                <View>
-                    <Text style={[styles.textLabel, styles.textStrong, styles.mb1]}>
-                        With Expensify.cash, chat and payments are the same thing.
-                    </Text>
-                    <Text style={[styles.textLabel]}>
-                        Money talks. And now that chat and payments are in one place, it&apos;s also easy.
-                        {' '}
-                        Your payments get to you as fast as you can get your point across.
-                    </Text>
-                </View>
-            </View>
+            </>
         );
     }
 }
diff --git a/src/pages/signin/LoginForm/LoginFormWide.js b/src/pages/signin/LoginForm/LoginFormWide.js
index 070c77c5c1b9..90620568e6ea 100644
--- a/src/pages/signin/LoginForm/LoginFormWide.js
+++ b/src/pages/signin/LoginForm/LoginFormWide.js
@@ -7,6 +7,7 @@ import {fetchAccountDetails} from '../../../libs/actions/Session';
 import styles from '../../../styles/styles';
 import ButtonWithLoader from '../../../components/ButtonWithLoader';
 import ONYXKEYS from '../../../ONYXKEYS';
+import WelcomeText from '../../../components/WelcomeText';
 
 const propTypes = {
     /* Onyx Props */
@@ -92,19 +93,7 @@ class LoginFormWide extends React.Component {
                         </Text>
                     )}
                 </View>
-
-                <View style={[styles.mt6]}>
-                    <View style={[styles.mb6]}>
-                        <Text style={[styles.textP, styles.textStrong, styles.mb1]}>
-                            With Expensify.cash, chat and payments are the same thing.
-                        </Text>
-                        <Text style={[styles.textP]}>
-                            Money talks. And now that chat and payments are in one place, it&apos;s also easy.
-                            {' '}
-                            Your payments get to you as fast as you can get your point across.
-                        </Text>
-                    </View>
-                </View>
+                <WelcomeText />
             </>
         );
     }
diff --git a/src/pages/signin/PasswordForm.js b/src/pages/signin/PasswordForm.js
index 8c9b95b9f284..8f2bb3e86d62 100644
--- a/src/pages/signin/PasswordForm.js
+++ b/src/pages/signin/PasswordForm.js
@@ -64,7 +64,7 @@ class PasswordForm extends React.Component {
 
     render() {
         return (
-            <View style={[styles.loginFormContainer]}>
+            <>
                 <View style={[styles.mb4]}>
                     <Text style={[styles.formLabel]}>Password</Text>
                     <TextInput
@@ -105,7 +105,7 @@ class PasswordForm extends React.Component {
                         {this.state.formError}
                     </Text>
                 )}
-            </View>
+            </>
         );
     }
 }
diff --git a/src/pages/signin/ResendValidationForm.js b/src/pages/signin/ResendValidationForm.js
index 19ea6c5e41a9..f2763669f518 100644
--- a/src/pages/signin/ResendValidationForm.js
+++ b/src/pages/signin/ResendValidationForm.js
@@ -57,7 +57,7 @@ class ResendValidationForm extends React.Component {
 
     render() {
         return (
-            <View style={[styles.loginFormContainer]}>
+            <>
                 <View>
                     <Text style={[styles.textP]}>
                         Please validate your account by clicking on the link we just sent you.
@@ -77,7 +77,7 @@ class ResendValidationForm extends React.Component {
                         {this.state.formSuccess}
                     </Text>
                 )}
-            </View>
+            </>
         );
     }
 }
diff --git a/src/pages/signin/SignInPage.js b/src/pages/signin/SignInPage.js
index bcc0b34157d1..292f59383661 100644
--- a/src/pages/signin/SignInPage.js
+++ b/src/pages/signin/SignInPage.js
@@ -13,6 +13,8 @@ import LoginForm from './LoginForm';
 import PasswordForm from './PasswordForm';
 import ResendValidationForm from './ResendValidationForm';
 import TermsAndLicenses from './TermsAndLicenses';
+import withWindowDimensions, {windowDimensionsPropTypes} from '../../components/withWindowDimensions';
+import compose from '../../libs/compose';
 
 const propTypes = {
     /* Onyx Props */
@@ -38,6 +40,8 @@ const propTypes = {
         // Error to display when there is a session error returned
         authToken: PropTypes.string,
     }),
+
+    ...windowDimensionsPropTypes,
 };
 
 const defaultProps = {
@@ -94,7 +98,9 @@ class SignInPage extends Component {
                             </View>
                         )}
 
-                        <TermsAndLicenses />
+                        {/* Because the Terms and Licenses need to be placed in different parts of the DOM
+                            to display correctly between wide/narrow screens */}
+                        {!this.props.isSmallScreenWidth && <TermsAndLicenses />}
                     </SignInPageLayout>
                 </SafeAreaView>
             </>
@@ -105,8 +111,11 @@ class SignInPage extends Component {
 SignInPage.propTypes = propTypes;
 SignInPage.defaultProps = defaultProps;
 
-export default withOnyx({
-    account: {key: ONYXKEYS.ACCOUNT},
-    credentials: {key: ONYXKEYS.CREDENTIALS},
-    session: {key: ONYXKEYS.SESSION},
-})(SignInPage);
+export default compose(
+    withOnyx({
+        account: {key: ONYXKEYS.ACCOUNT},
+        credentials: {key: ONYXKEYS.CREDENTIALS},
+        session: {key: ONYXKEYS.SESSION},
+    }),
+    withWindowDimensions,
+)(SignInPage);
diff --git a/src/pages/signin/SignInPageLayout/SignInPageLayoutNarrow.js b/src/pages/signin/SignInPageLayout/SignInPageLayoutNarrow.js
index e3e70ea20b57..725b3d8f4422 100644
--- a/src/pages/signin/SignInPageLayout/SignInPageLayoutNarrow.js
+++ b/src/pages/signin/SignInPageLayout/SignInPageLayoutNarrow.js
@@ -1,11 +1,15 @@
 import React from 'react';
 import {
+    Image,
     ScrollView, Text, View,
 } from 'react-native';
 import PropTypes from 'prop-types';
 import styles from '../../../styles/styles';
 import variables from '../../../styles/variables';
 import ExpensifyCashLogo from '../../../../assets/images/expensify-cash.svg';
+import welcomeScreenshot from '../../../../assets/images/welcome-screenshot.png';
+import WelcomeText from '../../../components/WelcomeText';
+import TermsAndLicenses from '../TermsAndLicenses';
 
 const propTypes = {
     // The children to show inside the layout
@@ -26,7 +30,18 @@ const SignInPageLayoutNarrow = ({children}) => (
                     </Text>
                 </View>
 
-                {children}
+                <View style={[styles.loginFormContainer]}>
+                    {children}
+                    <View style={[styles.mt5, styles.mb5]}>
+                        <Image
+                            resizeMode="contain"
+                            style={[styles.signinWelcomeScreenshot]}
+                            source={welcomeScreenshot}
+                        />
+                    </View>
+                    <WelcomeText />
+                </View>
+                <TermsAndLicenses />
             </View>
         </View>
     </ScrollView>
diff --git a/src/pages/signin/SignInPageLayout/SignInPageLayoutWide.js b/src/pages/signin/SignInPageLayout/SignInPageLayoutWide.js
index d2bfce6cdb44..0bc4df2f90c4 100644
--- a/src/pages/signin/SignInPageLayout/SignInPageLayoutWide.js
+++ b/src/pages/signin/SignInPageLayout/SignInPageLayoutWide.js
@@ -7,6 +7,7 @@ import styles from '../../../styles/styles';
 import ExpensifyCashLogo from '../../../../assets/images/expensify-cash.svg';
 import welcomeScreenshot from '../../../../assets/images/welcome-screenshot-wide.png';
 import variables from '../../../styles/variables';
+import TermsAndLicenses from '../TermsAndLicenses';
 
 const propTypes = {
     // The children to show inside the layout
@@ -35,7 +36,6 @@ const SignInPageLayoutWide = ({children}) => (
                         Expensify.cash
                     </Text>
                 </View>
-
                 {children}
             </View>
         </View>
diff --git a/src/styles/styles.js b/src/styles/styles.js
index c21bffe0ff83..13e1a3c3c402 100644
--- a/src/styles/styles.js
+++ b/src/styles/styles.js
@@ -349,6 +349,7 @@ const styles = {
         backgroundColor: themeColors.sidebar,
         padding: 20,
         minHeight: '100%',
+        flex: 1,
     },
 
     signInPageLogo: {