diff --git a/include/views/default/crunchbutton/frontend/restaurant.phtml b/include/views/default/crunchbutton/frontend/restaurant.phtml
index 90cc8c03e..bc42ed742 100644
--- a/include/views/default/crunchbutton/frontend/restaurant.phtml
+++ b/include/views/default/crunchbutton/frontend/restaurant.phtml
@@ -8,9 +8,6 @@
 	<h1><%= restaurant.name %></h1>
 </div>
 
-<div class="restaurant-gift">
-	<h1>You have a <%= (App.config.ab && App.config.ab.dollarSign == 'show') ? '$' : '' %><span class="restaurant-gift-value"></span> gift card!</h1>
-</div>
 <% if (restaurant.message) { %>
 	<div class="restaurant-message">
 		<%= restaurant.message %>
diff --git a/include/views/default/crunchbutton/layout/html.bottom.phtml b/include/views/default/crunchbutton/layout/html.bottom.phtml
index 4fbc3ffdc..0ffa133b2 100644
--- a/include/views/default/crunchbutton/layout/html.bottom.phtml
+++ b/include/views/default/crunchbutton/layout/html.bottom.phtml
@@ -22,6 +22,7 @@
 					<div class="signin-user"></div>
 					<div class="signin-icon"></div>
 				</div>
+				<div class="gift-card-message"></div>
 			</div>
 		</div>
 		<div class="body">
diff --git a/www/assets/css/style.css b/www/assets/css/style.css
index 30ce33d1d..59e2bbd8a 100644
--- a/www/assets/css/style.css
+++ b/www/assets/css/style.css
@@ -2931,7 +2931,29 @@ strong {
 		display: block;
 		max-width: 400px;
 	}
-
+.gift-card-message{
+	color: #FFF;
+	display: none;
+	font-size: 13px;
+	text-shadow: 1px 1px 0px rgba(0,0,0,.72);
+	float: right;
+	margin-top: 12px;
+	margin-right: -12px;
+	box-shadow: -1px 1px 5px rgba(0,0,0,.2);
+	border-radius: 3px;
+	border: 1px solid #ac2903;
+	color: #FFF;
+	padding:7px 8px;
+	text-align: center;
+	background-color: #f24812;
+	background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(255, 89, 31)), to(rgb(230, 55, 6)));
+	background-image: -webkit-linear-gradient(top, rgb(255, 89, 31), rgb(230, 55, 6));
+	background-image: -moz-linear-gradient(top, rgb(255, 89, 31), rgb(230, 55, 6));
+	background-image: -o-linear-gradient(top, rgb(255, 89, 31), rgb(230, 55, 6));
+	background-image: -ms-linear-gradient(top, rgb(255, 89, 31), rgb(230, 55, 6));
+	background-image: linear-gradient(top, rgb(255, 89, 31), rgb(230, 55, 6));
+	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#ff591f', EndColorStr='#e63706');
+}
 .order-restaurant{
 	cursor: pointer;
 }
\ No newline at end of file
diff --git a/www/assets/js/app.js b/www/assets/js/app.js
index 9691a86a6..5e6ce3226 100644
--- a/www/assets/js/app.js
+++ b/www/assets/js/app.js
@@ -116,8 +116,11 @@ App.render = function(template, data) {
 };
 
 App.showPage = function(params) {
-	// switch here for AB testing
 
+	// Hides the gift card message
+	App.credit.hide();
+
+	// switch here for AB testing
 	App.currentPage = params.page;
 	if (params.title) {
 		document.title = params.title;
diff --git a/www/assets/js/credit.js b/www/assets/js/credit.js
index 71ee2e8e6..92d16f05a 100644
--- a/www/assets/js/credit.js
+++ b/www/assets/js/credit.js
@@ -21,13 +21,21 @@ App.credit.getCredit = function( complete ){
 	}
 }
 
+App.credit.hide = function(){
+	$( '.gift-card-message' ).hide();
+}
+
 App.credit.show = function(){
 	var gift = App.credit.restaurant[App.restaurant.id];
+
 	if( parseFloat( gift ) ){
-		$( '.restaurant-gift-value' ).html( gift );
-		$( '.restaurant-gift' ).show();
+		var text = 'You have a '+ ( ( App.config.ab && App.config.ab.dollarSign == 'show') ? '$' : '' ) + App.ceil( gift ).toFixed( 2 ) + ' gift card!';
+		$( '.gift-card-message' ).html( text );
+		$( '.gift-card-message' ).css( 'opacity', 0 );
+		$( '.gift-card-message' ).show();
+		$( '.gift-card-message' ).animate( { 'opacity' : 1 }, 100 );
 	} else {
-		$( '.restaurant-gift' ).hide();
+		$( '.gift-card-message' ).hide();
 	}
 	
 }
\ No newline at end of file