diff --git a/app/assets/images/.DS_Store b/app/assets/images/.DS_Store
deleted file mode 100644
index 2bbe5f6a..00000000
Binary files a/app/assets/images/.DS_Store and /dev/null differ
diff --git a/app/assets/images/topright_sprite.png b/app/assets/images/topright_sprite.png
index 163dd6f7..4c969887 100644
Binary files a/app/assets/images/topright_sprite.png and b/app/assets/images/topright_sprite.png differ
diff --git a/app/assets/images/user_sprite.png b/app/assets/images/user_sprite.png
index a94a6961..045d48fd 100644
Binary files a/app/assets/images/user_sprite.png and b/app/assets/images/user_sprite.png differ
diff --git a/app/assets/stylesheets/application.scss.erb b/app/assets/stylesheets/application.scss.erb
index e68390ef..988b8241 100644
--- a/app/assets/stylesheets/application.scss.erb
+++ b/app/assets/stylesheets/application.scss.erb
@@ -826,7 +826,7 @@ label {
     position:absolute;
     pointer-events:none;
     background-repeat:no-repeat;
-    background-image: url(<%= asset_data_uri('user_sprite.png') %>);
+    background-image: url(<%= asset_path('user_sprite.png') %>);
 }
 .accountSettings .accountIcon {
     background-position: 0 0;
@@ -837,9 +837,6 @@ label {
 .accountApps .accountIcon {
     background-position: 0 -32px;
 }
-.accountNotifications .accountIcon {
-    background-position: 0 -128px;
-}
 .accountInvite .accountIcon {
     background-position: 0 -64px;
 }
@@ -854,12 +851,6 @@ label {
 .accountListItem:hover a {
     color: #424242;
 }
-.accountNotifications {
-    position: relative;
-}
-.accountNotifications.unread a {
-    font-weight: 900;
-}
 .accountListItem:hover .accountIcon {
     background-position-x: -32px;
 }
@@ -867,16 +858,6 @@ li.accountInvite span {
     display: block;
     padding: 9px 0 9px 62px;
 }
-$unread_notifications_dot_size: 8px;
-.unread-notifications-dot {
-  width: $unread_notifications_dot_size;
-  height: $unread_notifications_dot_size;
-  background-color: #e22;
-  border-radius: $unread_notifications_dot_size / 2;
-  position: absolute;
-  top: 0;
-  right: 0;
-}
 .accountImage {
     background-image: url(<%= asset_data_uri 'user.png' %>);
     background-size: 84px 84px;
diff --git a/app/assets/stylesheets/clean.css.erb b/app/assets/stylesheets/clean.css.erb
index 7902b580..b25816f0 100644
--- a/app/assets/stylesheets/clean.css.erb
+++ b/app/assets/stylesheets/clean.css.erb
@@ -210,7 +210,10 @@
 }
 .addMap {
     background-position: -96px 0;
-    margin-right:10px;
+}
+.notificationsIcon {
+    background-position: -128px 0;
+    margin-right: 10px; // make it look more natural next to the account menu icon
 }
 .importDialog:hover {
     background-position: 0 -32px;
@@ -758,7 +761,7 @@
 }
 
 .exploreMapsCenter .authedApps .exploreMapsIcon {
-    background-image: url(<%= asset_data_uri('user_sprite.png') %>);
+    background-image: url(<%= asset_path('user_sprite.png') %>);
     background-position: 0 -32px;
 }
 .exploreMapsCenter .myMaps .exploreMapsIcon {
diff --git a/app/assets/stylesheets/mobile.scss.erb b/app/assets/stylesheets/mobile.scss.erb
index 42576bb5..e7eb9a7d 100644
--- a/app/assets/stylesheets/mobile.scss.erb
+++ b/app/assets/stylesheets/mobile.scss.erb
@@ -213,7 +213,7 @@
   line-height: 50px;
 }
 
-#menu_icon .unread-notifications-dot {
+#mobile_header #menu_icon .unread-notifications-dot {
   top: 5px;
   left: 29px;
   width: 12px;
diff --git a/app/assets/stylesheets/notifications.scss b/app/assets/stylesheets/notifications.scss.erb
similarity index 73%
rename from app/assets/stylesheets/notifications.scss
rename to app/assets/stylesheets/notifications.scss.erb
index 95564a51..b25bf4e8 100644
--- a/app/assets/stylesheets/notifications.scss
+++ b/app/assets/stylesheets/notifications.scss.erb
@@ -1,3 +1,20 @@
+$unread_notifications_dot_size: 8px;
+.unread-notifications-dot {
+  width: $unread_notifications_dot_size;
+  height: $unread_notifications_dot_size;
+  background-color: #e22;
+  border-radius: $unread_notifications_dot_size / 2;
+  position: absolute;
+  top: 0;
+  right: 0;
+}
+
+.upperRightUI {
+  .notificationsIcon {
+    position: relative;
+  }
+}
+
 .controller-notifications {
   ul.notifications {
     list-style: none;
diff --git a/app/views/layouts/_account.html.erb b/app/views/layouts/_account.html.erb
index 1c1cddf0..3d66f687 100644
--- a/app/views/layouts/_account.html.erb
+++ b/app/views/layouts/_account.html.erb
@@ -8,16 +8,6 @@
   <%= image_tag account.image.url(:sixtyfour), :size => "48x48", :class => "sidebarAccountImage" %>
   <h3 class="accountHeader"><%= account.name.split[0...1][0] %></h3>
   <ul>
-    <% if current_user.present? %>
-      <li class="accountListItem accountNotifications <%= user_has_unread_notifications? ? 'unread' : 'read' %>">
-        <div class="accountIcon">
-          <% if user_has_unread_notifications? %>
-            <div class="unread-notifications-dot"></div>
-          <% end %>
-        </div>
-        <%= link_to "Notifications", notifications_path %>
-      </li>
-    <% end %>
     <li class="accountListItem accountSettings">
       <div class="accountIcon"></div>
       <%= link_to "Account", edit_user_url(account) %>
diff --git a/app/views/layouts/_upperelements.html.erb b/app/views/layouts/_upperelements.html.erb
index e560eadf..cc484272 100644
--- a/app/views/layouts/_upperelements.html.erb
+++ b/app/views/layouts/_upperelements.html.erb
@@ -71,12 +71,20 @@
   </a><!-- end addMap -->
   <% end %>
 
+  <% if current_user.present? %>
+    <%= link_to notifications_path, target: '_blank', class: "notificationsIcon upperRightEl upperRightIcon #{user_has_unread_notifications? ? 'unread' : 'read'}" do %>
+      <div class="tooltipsUnder">
+        Notifications
+      </div>
+      <% if user_has_unread_notifications? %>
+        <div class="unread-notifications-dot"></div>
+      <% end %>
+    <% end %>
+  <% end %>
+
   <!-- Account / Sign in -->
   <% if !(controller_name == "sessions" && action_name == "new") %>
   <div class="sidebarAccount upperRightEl">
-    <% if user_has_unread_notifications? %>
-      <div class="unread-notifications-dot"></div>
-    <% end %>
     <div class="sidebarAccountIcon"><div class="tooltipsUnder">Account</div>
       <% if current_user && current_user.image %>
         <%= image_tag current_user.image.url(:thirtytwo), :size => "32x32" %>