diff --git a/.env.defaults b/.env.defaults
index d6e8d77b1..0275b72af 100644
--- a/.env.defaults
+++ b/.env.defaults
@@ -22,12 +22,16 @@ SITE_DESCRIPTION=Meet LBRY, an open, free, and community-controlled content wond
 LOGO_TITLE=lbry.tv
 SIMPLE_SITE=false
 SHOW_ADS=true
-# OG
+YRBL_HAPPY_IMG_URL=https://cdn.lbryplayer.xyz/api/v3/streams/free/yrbl-happy/7aa50a7e5adaf48691935d55e45d697547392929/839d9a
+YRBL_SAD_IMG_URL=https://cdn.lbryplayer.xyz/api/v3/streams/free/yrbl-sad/c2d9649633d974e5ffb503925e1f17d951f1bd0f/f262dd
 
+
+# OG
 OG_TITLE_SUFFIX=| lbry.tv
 OG_HOMEPAGE_TITLE=lbry.tv
 OG_IMAGE_URL=
 SITE_CANONICAL_URL=https://lbry.tv
+
 # LOCALE
 DEFAULT_LANGUAGE=en
 
diff --git a/config.js b/config.js
index 44049558b..edc0a4eec 100644
--- a/config.js
+++ b/config.js
@@ -22,6 +22,8 @@ const config = {
   OG_TITLE_SUFFIX: process.env.OG_TITLE_SUFFIX,
   OG_HOMEPAGE_TITLE: process.env.OG_HOMEPAGE_TITLE,
   OG_IMAGE_URL: process.env.OG_IMAGE_URL,
+  YRBL_HAPPY_IMG_URL: process.env.YRBL_HAPPY_IMG_URL,
+  YRBL_SAD_IMG_URL: process.env.YRBL_SAD_IMG_URL,
   SITE_CANONICAL_URL: process.env.SITE_CANONICAL_URL,
   DEFAULT_LANGUAGE: process.env.DEFAULT_LANGUAGE,
   AUTO_FOLLOW_CHANNELS: process.env.AUTO_FOLLOW_CHANNELS,
diff --git a/static/app-strings.json b/static/app-strings.json
index 7a43f6c9d..feef7fd9d 100644
--- a/static/app-strings.json
+++ b/static/app-strings.json
@@ -1119,7 +1119,7 @@
   "Once the transaction is sent, it cannot be reversed.": "Once the transaction is sent, it cannot be reversed.",
   "Update Your Password": "Update Your Password",
   "Your Wallet is Empty": "Your Wallet is Empty",
-  "There are a lot of ways to get LBC! You can purchase your own, earn rewards, or have your friend send you a few.": "There are a lot of ways to get LBC! You can purchase your own, earn rewards, or have your friend send you a few.",
+  "Never fear though, there are tons of ways to earn LBC! You can earn or purchase LBC, or you can have your friends send you some.": "Never fear though, there are tons of ways to earn LBC! You can earn or purchase LBC, or you can have your friends send you some.",
   "Buy Credits": "Buy Credits",
   "Earn Rewards": "Earn Rewards",
   "Rewards are currently disabled for your account. Turn on diagnostic data sharing, in %settings%, to re-enable them.": "Rewards are currently disabled for your account. Turn on diagnostic data sharing, in %settings%, to re-enable them.",
diff --git a/ui/component/publishFile/view.jsx b/ui/component/publishFile/view.jsx
index 5a4b0a67d..79d515b33 100644
--- a/ui/component/publishFile/view.jsx
+++ b/ui/component/publishFile/view.jsx
@@ -337,7 +337,7 @@ function PublishFile(props: Props) {
 
   return (
     <Card
-      disabled={disabled || balance === 0}
+      className={disabled || balance === 0 ? 'card--disabled' : ''}
       title={
         <div>
           {header}
diff --git a/ui/component/userEmailVerify/view.jsx b/ui/component/userEmailVerify/view.jsx
index 3de909ddb..e00653636 100644
--- a/ui/component/userEmailVerify/view.jsx
+++ b/ui/component/userEmailVerify/view.jsx
@@ -77,11 +77,11 @@ class UserEmailVerify extends React.PureComponent<Props> {
               <div className="section__actions">
                 <Button
                   button="primary"
-                  label={__('Resend link')}
+                  label={__('Resend Link')}
                   onClick={this.handleResendVerificationEmail}
                   disabled={resendingEmail}
                 />
-                <UserSignOutButton label={__('Start over')} />
+                <UserSignOutButton label={__('Start Over')} />
               </div>
               <p className="help--card-actions">
                 <I18nMessage
diff --git a/ui/component/yrbl/gerbil-happy.png b/ui/component/yrbl/gerbil-happy.png
deleted file mode 100644
index 31b5143eb..000000000
Binary files a/ui/component/yrbl/gerbil-happy.png and /dev/null differ
diff --git a/ui/component/yrbl/gerbil-sad.png b/ui/component/yrbl/gerbil-sad.png
deleted file mode 100644
index db88cba74..000000000
Binary files a/ui/component/yrbl/gerbil-sad.png and /dev/null differ
diff --git a/ui/component/yrbl/index.jsx b/ui/component/yrbl/index.jsx
index 219f2ad15..94b700f3f 100644
--- a/ui/component/yrbl/index.jsx
+++ b/ui/component/yrbl/index.jsx
@@ -1,8 +1,7 @@
 // @flow
 import * as React from 'react';
 import classnames from 'classnames';
-import HappyYrbl from './gerbil-happy.png';
-import SadYrbl from './gerbil-sad.png';
+import { YRBL_HAPPY_IMG_URL, YRBL_SAD_IMG_URL } from 'config';
 
 type Props = {
   title?: string,
@@ -12,8 +11,8 @@ type Props = {
 };
 
 const yrblTypes = {
-  happy: HappyYrbl,
-  sad: SadYrbl,
+  happy: YRBL_HAPPY_IMG_URL,
+  sad: YRBL_SAD_IMG_URL,
 };
 
 export default class extends React.PureComponent<Props> {
@@ -31,8 +30,8 @@ export default class extends React.PureComponent<Props> {
         <img alt="Friendly gerbil" className={classnames('yrbl', className)} src={`${image}`} />
         {title && subtitle && (
           <div className="yrbl__content">
-            <h2 className="card__title card__title--deprecated">{title}</h2>
-            <p>{subtitle}</p>
+            <h2 className="section__title">{title}</h2>
+            <p className="section__subtitle">{subtitle}</p>
           </div>
         )}
       </div>
diff --git a/ui/page/buy/view.jsx b/ui/page/buy/view.jsx
index 9e5facf56..65bb9573c 100644
--- a/ui/page/buy/view.jsx
+++ b/ui/page/buy/view.jsx
@@ -88,7 +88,7 @@ export default function BuyPage(props: Props) {
   );
 
   return (
-    <Page noSideNavigation className="main--buy">
+    <Page noSideNavigation className="main--buy" backout={{ backoutLabel: __('Done'), title: __('Buy credits') }}>
       {!user && (
         <div className="main--empty">
           <Spinner delayed />
diff --git a/ui/page/channelNew/view.jsx b/ui/page/channelNew/view.jsx
index d40d02c13..2dd7588f3 100644
--- a/ui/page/channelNew/view.jsx
+++ b/ui/page/channelNew/view.jsx
@@ -1,10 +1,12 @@
 // @flow
+import * as PAGES from 'constants/pages';
+import * as ICONS from 'constants/icons';
 import React from 'react';
 import ChannelEdit from 'component/channelEdit';
 import Page from 'component/page';
 import Button from 'component/button';
 import { useHistory } from 'react-router';
-import * as PAGES from 'constants/pages';
+import Yrbl from 'component/yrbl';
 
 type Props = {
   balance: number,
@@ -18,17 +20,32 @@ function ChannelNew(props: Props) {
   const emptyBalance = balance === 0;
 
   return (
-    <Page noSideNavigation noFooter backout={{ title: __('Create A Channel'), backLabel: __('Cancel') }}>
+    <Page noSideNavigation noFooter backout={{ title: __('Create a channel'), backLabel: __('Cancel') }}>
       {emptyBalance && (
-        <div className="main--contained">
-          <div className="notice-message--above-content">
-            <h1 className="section__title">You need LBC for this</h1>
-            <h1 className="section__subtitle">Get sum coinz</h1>
-            <div className="section__actions">
-              <Button button="primary" label={__('Earn Rewards')} navigate={`/$/${PAGES.REWARDS}`} />
-              <Button button="primary" label={__('Purchase LBC')} navigate={`/$/${PAGES.BUY}`} />
-            </div>
-          </div>
+        <div className="main--empty">
+          <Yrbl
+            type="sad"
+            title={__('Your wallet is empty')}
+            subtitle={
+              <div>
+                <p>{__('You need LBC to create a channel and upload content.')}</p>
+                <p>
+                  {__(
+                    'Never fear though, there are tons of ways to earn LBC! You can earn or purchase LBC, or you can have your friends send you some.'
+                  )}
+                </p>
+                <div className="section__actions">
+                  <Button
+                    button="primary"
+                    icon={ICONS.REWARDS}
+                    label={__('Earn Rewards')}
+                    navigate={`/$/${PAGES.REWARDS}`}
+                  />
+                  <Button button="secondary" icon={ICONS.BUY} label={__('Buy Credits')} navigate={`/$/${PAGES.BUY}`} />
+                </div>
+              </div>
+            }
+          />
         </div>
       )}
 
diff --git a/ui/page/publish/view.jsx b/ui/page/publish/view.jsx
index dd2a0dda4..2324fd1bc 100644
--- a/ui/page/publish/view.jsx
+++ b/ui/page/publish/view.jsx
@@ -1,10 +1,11 @@
 // @flow
-import React, { Fragment } from 'react';
+import * as ICONS from 'constants/icons';
+import * as PAGES from 'constants/pages';
+import React from 'react';
 import PublishForm from 'component/publishForm';
 import Page from 'component/page';
 import Yrbl from 'component/yrbl';
-import LbcSymbol from 'component/common/lbc-symbol';
-import RewardAuthIntro from 'component/rewardAuthIntro';
+import Button from 'component/button';
 
 type Props = {
   balance: number,
@@ -23,40 +24,34 @@ function PublishPage(props: Props) {
 
   return (
     <Page>
-      {balance === 0 ? (
-        <Fragment>
-          <div className="section">
-            <Yrbl
-              title={__("You can't upload things quite yet")}
-              subtitle={
-                <Fragment>
-                  <p>
-                    {__(
-                      'LBRY uses a blockchain, which is a fancy way of saying that users (you) are in control of your data.'
-                    )}
-                  </p>
-                  <p>
-                    {__('Because of the blockchain, some actions require LBRY credits')} (
-                    <LbcSymbol />
-                    ).
-                  </p>
-                  <p>
-                    <LbcSymbol />{' '}
-                    {__(
-                      'allows you to do some neat things, like paying your favorite creators for their content. And no company can stop you.'
-                    )}
-                  </p>
-                </Fragment>
-              }
-            />
-          </div>
-          <div className="section">
-            <RewardAuthIntro />
-          </div>
-        </Fragment>
-      ) : (
-        <PublishForm scrollToTop={scrollToTop} disabled={balance === 0} />
+      {balance === 0 && (
+        <div className="main--empty">
+          <Yrbl
+            type="sad"
+            title={__('Your wallet is empty')}
+            subtitle={
+              <div>
+                <p>{__('You need LBC to create a channel and upload content.')}</p>
+                <p>
+                  {__(
+                    'Never fear though, there are tons of ways to earn LBC! You can earn or purchase LBC, or you can have your friends send you some.'
+                  )}
+                </p>
+                <div className="section__actions">
+                  <Button
+                    button="primary"
+                    icon={ICONS.REWARDS}
+                    label={__('Earn Rewards')}
+                    navigate={`/$/${PAGES.REWARDS}`}
+                  />
+                  <Button button="secondary" icon={ICONS.BUY} label={__('Buy Credits')} navigate={`/$/${PAGES.BUY}`} />
+                </div>
+              </div>
+            }
+          />
+        </div>
       )}
+      <PublishForm scrollToTop={scrollToTop} disabled={balance === 0} />
     </Page>
   );
 }
diff --git a/ui/page/wallet/view.jsx b/ui/page/wallet/view.jsx
index fe88062b2..1d1e1dd03 100644
--- a/ui/page/wallet/view.jsx
+++ b/ui/page/wallet/view.jsx
@@ -36,27 +36,29 @@ const WalletPage = (props: Props) => {
           {showIntro ? (
             <div className="main--empty">
               <Yrbl
-                title={__('Your Wallet is Empty')}
+                type="sad"
+                title={__('Your wallet is empty')}
                 subtitle={
                   <div>
+                    <p>{__('You need LBC to create a channel and upload content.')}</p>
                     <p>
                       {__(
-                        'There are a lot of ways to get LBC! You can purchase your own, earn rewards, or have your friend send you a few.'
+                        'Never fear though, there are tons of ways to earn LBC! You can earn or purchase LBC, or you can have your friends send you some.'
                       )}
                     </p>
                     <div className="section__actions">
                       <Button
                         button="primary"
-                        icon={ICONS.BUY}
-                        label={__('Buy Credits')}
-                        navigate={`/$/${PAGES.BUY}`}
-                      />
-                      <Button
-                        button="secondary"
                         icon={ICONS.REWARDS}
                         label={__('Earn Rewards')}
                         navigate={`/$/${PAGES.REWARDS}`}
                       />
+                      <Button
+                        button="secondary"
+                        icon={ICONS.BUY}
+                        label={__('Buy Credits')}
+                        navigate={`/$/${PAGES.BUY}`}
+                      />
                       <Button
                         icon={ICONS.RECEIVE}
                         button="secondary"
diff --git a/ui/scss/component/_main.scss b/ui/scss/component/_main.scss
index c478e606e..ef9d8d0ac 100644
--- a/ui/scss/component/_main.scss
+++ b/ui/scss/component/_main.scss
@@ -180,15 +180,18 @@
   display: flex;
   align-items: center;
   flex-direction: column;
-  margin-top: 100px;
-  margin-bottom: 100px;
   text-align: center;
+  padding: 0 var(--spacing-m);
+  margin-top: var(--spacing-l);
+  margin-bottom: var(--spacing-l);
+
   > .card {
     width: 100%;
   }
 
-  @media (max-width: $breakpoint-small) {
-    padding: 0 var(--spacing-m);
+  @media (min-width: $breakpoint-small) {
+    margin-top: 100px;
+    margin-bottom: 100px;
   }
 }
 
diff --git a/ui/scss/component/_yrbl.scss b/ui/scss/component/_yrbl.scss
index 53f8fcede..860108186 100644
--- a/ui/scss/component/_yrbl.scss
+++ b/ui/scss/component/_yrbl.scss
@@ -1,17 +1,31 @@
 .yrbl__wrap {
-  align-items: center;
   display: flex;
+  align-items: center;
+  flex-direction: column-reverse;
+  flex-wrap: wrap;
   justify-content: center;
-  vertical-align: middle;
   text-align: left;
+
+  .section__actions {
+    flex-wrap: wrap;
+
+    > * {
+      margin-bottom: var(--spacing-s);
+    }
+  }
+
+  @media (min-width: $breakpoint-small) {
+    flex-direction: row;
+  }
 }
 
 .yrbl {
-  height: 20rem;
-  margin-right: calc(var(--spacing-xl) * 2);
+  display: none;
 
-  @media (max-width: $breakpoint-small) {
-    display: none;
+  @media (min-width: $breakpoint-small) {
+    display: block;
+    height: 20rem;
+    margin-right: calc(var(--spacing-xl) * 2);
   }
 }