diff --git a/packages/light-react/src/App/App.js b/packages/light-react/src/App/App.js
index 07aac79565da026d3bb653188b4f1c45471348fc..5715372c5ae9ecf66e2a0ff9a21bede2f0f4080c 100644
--- a/packages/light-react/src/App/App.js
+++ b/packages/light-react/src/App/App.js
@@ -39,7 +39,7 @@ class App extends Component {
                 <polygon points='0 30 60 30 30 0' />
               </svg>
             </div>
-            <div className='window'>{this.renderScreen()}</div>
+            {this.renderScreen()}
           </div>
         </div>
       </Router>
@@ -57,28 +57,27 @@ class App extends Component {
       }
     } = this.props;
 
-    // If we are onboarding, then never show the Overlay. On the other hand, if
-    // we're not onboarding, show the Overlay whenever we have an issue.
-    if (!isOnboarding && status !== STATUS.GOOD) {
-      return <Overlay />;
-    }
-
     return (
-      <Switch>
-        {/* We redirect to Onboarding if necessary, or by default to our
+      <div className='window'>
+        {/* If we are onboarding, then never show the Overlay. On the other hand, if
+            we're not onboarding, show the Overlay whenever we have an issue. */}
+        {!isOnboarding && status !== STATUS.GOOD && <Overlay />}
+        <Switch>
+          {/* We redirect to Onboarding if necessary, or by default to our
         homepage which is Tokens */}
-        <Redirect
-          exact
-          from='/'
-          to={isOnboarding ? '/onboarding' : '/tokens'}
-        />
-        <Route path='/accounts' component={Accounts} />
-        <Route path='/onboarding' component={Onboarding} />
-        <Route path='/send' component={Send} />
-        <Route path='/settings' component={Settings} />
-        <Route path='/tokens' component={Tokens} />
-        <Redirect from='*' to='/' />
-      </Switch>
+          <Redirect
+            exact
+            from='/'
+            to={isOnboarding ? '/onboarding' : '/tokens'}
+          />
+          <Route path='/accounts' component={Accounts} />
+          <Route path='/onboarding' component={Onboarding} />
+          <Route path='/send' component={Send} />
+          <Route path='/settings' component={Settings} />
+          <Route path='/tokens' component={Tokens} />
+          <Redirect from='*' to='/' />
+        </Switch>
+      </div>
     );
   }
 }
diff --git a/packages/light-react/src/Overlay/Overlay.js b/packages/light-react/src/Overlay/Overlay.js
index 735675243a3c96d909de04222299dfa6a58a94e5..2009e74984759f7676ba3385b8eda5ef5e1d13b1 100644
--- a/packages/light-react/src/Overlay/Overlay.js
+++ b/packages/light-react/src/Overlay/Overlay.js
@@ -13,19 +13,48 @@ import loading from '../assets/img/icons/loading.svg';
 @inject('healthStore')
 @observer
 class Overlays extends Component {
+  state = {
+    isVisible: false // Only make Overlay visible if the overlay error persists for 2s or more
+  };
+
+  componentDidUpdate () {
+    this.timeout = setTimeout(() => {
+      this.setState({ isVisible: true });
+    }, 3000);
+  }
+
+  componentWillUnmount () {
+    clearTimeout(this.timeout);
+  }
+
   render () {
+    const {
+      healthStore: {
+        health: { status }
+      }
+    } = this.props;
+
+    // isVisible is:
+    // - true if the status is anything but ClockNotSync or Syncing
+    // - or else this.state.isVisible
+    const isVisible =
+      ![STATUS.CLOCKNOTSYNC, STATUS.SYNCING].includes(status) ||
+      this.state.isVisible;
+
+    if (!isVisible) {
+      return null;
+    }
+
     return (
-      <div className='window_content'>
-        <div className='box -padded'>
-          <div className='alert-screen'>
-            <div className='alert-screen_content'>
-              <div className='alert-screen_image'>
-                <img alt='loading' src={loading} />
-              </div>
-              <div className='alert-screen_text'>
-                <h1>{this.renderTitle()}</h1>
-                <p>{this.renderDescription()}</p>
-              </div>
+      <div className='window_overlay'>
+        <div className='alert-screen'>
+          <div className='alert-screen_content'>
+            <div className='alert-screen_image'>
+              <img alt='loading' src={loading} />
+            </div>
+            <div className='alert-screen_text'>
+              <h1>{this.renderTitle()}</h1>
+              <p>{this.renderDescription()}</p>
             </div>
           </div>
         </div>
diff --git a/packages/light-react/src/assets/sass/components/_alert-screen.scss b/packages/light-react/src/assets/sass/components/_alert-screen.scss
index 4a4a4344a7696469709dea86e6b1f4dd5698ded7..5a54d387ac420a540e8c78414c683de3f16147d5 100644
--- a/packages/light-react/src/assets/sass/components/_alert-screen.scss
+++ b/packages/light-react/src/assets/sass/components/_alert-screen.scss
@@ -1,5 +1,5 @@
 .alert-screen {
-  height: 22rem;
+  height: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
@@ -18,7 +18,10 @@
   .alert-screen_text {
     margin-top: 1rem;
     text-align: center;
-    h1, h2, big, strong {
+    h1,
+    h2,
+    big,
+    strong {
       font-weight: 600;
       font-size: ms(1);
       line-height: ms(1) * 1.3;
diff --git a/packages/light-react/src/assets/sass/layouts/_wrapper.scss b/packages/light-react/src/assets/sass/layouts/_wrapper.scss
index 470ddbe578a0f1c16ecb3a2da9f213e8973503d3..a317fd2430f28db08b0f7bd750984f7fd202ceb7 100644
--- a/packages/light-react/src/assets/sass/layouts/_wrapper.scss
+++ b/packages/light-react/src/assets/sass/layouts/_wrapper.scss
@@ -6,7 +6,8 @@
   bottom: 0;
   overflow: hidden;
 
-  .content { // TODO: abstract this out
+  .content {
+    // TODO: abstract this out
     overflow: visible;
     max-width: 22rem;
     margin: 0 auto;
@@ -29,11 +30,23 @@
       background: $chrome;
       border-radius: 0.25rem;
       overflow: hidden;
-      box-shadow: 0 0.125rem 0.75rem rgba($black,0.175), 0 0.125rem 0.125rem rgba($black,0.100);
+      position: relative;
+      box-shadow: 0 0.125rem 0.75rem rgba($black, 0.175),
+        0 0.125rem 0.125rem rgba($black, 0.1);
 
       .window_content {
         min-height: 7.5rem;
       }
+
+      .window_overlay {
+        background-color: $chrome;
+        bottom: 0;
+        left: 0;
+        position: absolute;
+        right: 0;
+        top: 0;
+        z-index: 10;
+      }
     }
   }
 }
diff --git a/packages/light-ui/src/AccountHeader/AccountHeader.js b/packages/light-ui/src/AccountHeader/AccountHeader.js
index 29baa2e5352975fba0e213236e72c1f4804e62a1..706597d077ba6f41ecadb67d791292da576218d4 100644
--- a/packages/light-ui/src/AccountHeader/AccountHeader.js
+++ b/packages/light-ui/src/AccountHeader/AccountHeader.js
@@ -41,7 +41,7 @@ const AccountHeader = ({ address, copyAddress, name, ...otherProps }) => {
               <Blockies seed={address.toLowerCase()} scale={2} size={8} />{' '}
               {name}{' '}
               <span className='account_address'>
-                {address.slice(0, 4)}..{address.slice(-2)}
+                {address.slice(0, 4)}..{address.slice(-4)}
               </span>
             </Container>
           )