diff --git a/app/views/header.blade.php b/app/views/header.blade.php
index 5d95f8b7e830..6df84c67fbee 100755
--- a/app/views/header.blade.php
+++ b/app/views/header.blade.php
@@ -46,30 +46,9 @@
 
 </style>
 
-<script type="text/javascript">
+@include('script')
 
-  var currencies = {{ Currency::remember(120)->get(); }};
-  var currencyMap = {};
-  for (var i=0; i<currencies.length; i++) {
-    var currency = currencies[i];
-    currencyMap[currency.id] = currency;
-  }				
-  var NINJA = NINJA || {};
-  @if (Auth::check())
-    NINJA.primaryColor = "{{ Auth::user()->account->primary_color }}";
-    NINJA.secondaryColor = "{{ Auth::user()->account->secondary_color }}";
-  @endif
-  NINJA.parseFloat = function(str) {
-    if (!str) return '';
-    str = (str+'').replace(/[^0-9\.\-]/g, '');
-    return window.parseFloat(str);
-  }
-  function formatMoney(value, currency_id, hide_symbol) {
-    value = NINJA.parseFloat(value);
-    if (!currency_id) currency_id = {{ Session::get(SESSION_CURRENCY, DEFAULT_CURRENCY); }};
-    var currency = currencyMap[currency_id];
-    return accounting.formatMoney(value, hide_symbol ? '' : currency.symbol, currency.precision, currency.thousand_separator, currency.decimal_separator);
-  }
+<script type="text/javascript">
 
   /* Set the defaults for DataTables initialisation */
   $.extend( true, $.fn.dataTable.defaults, {
diff --git a/app/views/invoices/view.blade.php b/app/views/invoices/view.blade.php
index a9ff416d43c9..42995e7cbe87 100755
--- a/app/views/invoices/view.blade.php
+++ b/app/views/invoices/view.blade.php
@@ -1,29 +1,48 @@
-@extends('header')
+@extends('public.header')
 
 @section('head')
 	@parent
 
+		@include('script')		
+		
+		<link href="{{ asset('vendor/bootstrap/dist/css/bootstrap.min.css') }}" rel="stylesheet" type="text/css"/> 
+
 		<script src="{{ asset('js/pdf_viewer.js') }}" type="text/javascript"></script>
 		<script src="{{ asset('js/compatibility.js') }}" type="text/javascript"></script>
+
+		<style type="text/css">
+			body {
+				background-color: #f8f8f8;		
+			}
+		</style>
 @stop
 
 @section('content')
 
-	@if ($invoice->client->account->isGatewayConfigured() && !$invoice->isPaid())
-		<div class="pull-right" style="width:270px">
-			{{ Button::normal(trans('texts.download_pdf'), array('onclick' => 'onDownloadClick()', 'class' => 'btn-lg')) }}
-			{{ Button::primary_link(URL::to('payment/' . $invitation->invitation_key), trans('texts.pay_now'), array('class' => 'btn-lg pull-right')) }}
-		</div>		
-	@else 
-		<div class="pull-right">
-			{{ Button::primary('Download PDF', array('onclick' => 'onDownloadClick()', 'class' => 'btn-lg')) }}
-		</div>		
-	@endif
-	
-	<div class="clearfix"></div><p>&nbsp;</p>
+	<div class="container">
 
-	<iframe id="theFrame" frameborder="1" width="100%" height="1180" style="display:none;margin: 0 auto"></iframe>
-	<canvas id="theCanvas" style="display:none;width:100%;border:solid 1px #CCCCCC;"></canvas>
+		<p>&nbsp;</p>
+
+		@if ($invoice->client->account->isGatewayConfigured() && !$invoice->isPaid())
+			<div class="pull-right" style="width:270px">			
+				{{ Button::normal(trans('texts.download_pdf'), array('onclick' => 'onDownloadClick()', 'class' => 'btn-lg')) }}
+				{{ Button::success_link(URL::to('payment/' . $invitation->invitation_key), trans('texts.pay_now'), array('class' => 'btn-lg pull-right')) }}
+			</div>		
+		@else 
+			<div class="pull-right">
+				{{ Button::primary('Download PDF', array('onclick' => 'onDownloadClick()', 'class' => 'btn-lg')) }}
+			</div>		
+		@endif
+		
+		<div class="clearfix"></div><p>&nbsp;</p>
+
+		<iframe id="theFrame" frameborder="1" width="100%" height="1180" style="display:none;margin: 0 auto"></iframe>
+		<canvas id="theCanvas" style="display:none;width:100%;border:solid 1px #CCCCCC;"></canvas>
+
+		<p>&nbsp;</p>
+		<p>&nbsp;</p>
+
+	</div>
 
 	<script type="text/javascript">
 
diff --git a/app/views/payments/payment.blade.php b/app/views/payments/payment.blade.php
index c01f19ae7f61..8939c4fe0118 100755
--- a/app/views/payments/payment.blade.php
+++ b/app/views/payments/payment.blade.php
@@ -1,86 +1,173 @@
-@extends('header')
+@extends('public.header')
 
 @section('content')
 
-  <style type="text/css">
+<style type="text/css">
   div > label.control-label
   {
     font-weight: bold !important;    
     /* text-transform:uppercase; */
   }
-  </style>
+</style>
 
-  {{ Former::vertical_open('payment/' . $invitationKey)->rules(array(
-      'first_name' => 'required',
-      'last_name' => 'required',   
-      'card_number' => 'required',
-      'expiration_month' => 'required',
-      'expiration_year' => 'required',
-      'cvv' => 'required',
-      'address1' => 'required',
-      'city' => 'required',
-      'state' => 'required',
-      'postal_code' => 'required',
-      'country' => 'required',
-      'phone' => 'required',
-      'email' => 'required'   
-  )) }}
+{{ Former::vertical_open('payment/' . $invitationKey)->rules(array(
+    'first_name' => 'required',
+    'last_name' => 'required',   
+    'card_number' => 'required',
+    'expiration_month' => 'required',
+    'expiration_year' => 'required',
+    'cvv' => 'required',
+    'address1' => 'required',
+    'city' => 'required',
+    'state' => 'required',
+    'postal_code' => 'required',
+    'country' => 'required',
+    'phone' => 'required',
+    'email' => 'required'   
+)) }}
 
-  {{ Former::populate($client) }}
-  {{ Former::populateField('first_name', $contact->first_name) }}
-  {{ Former::populateField('last_name', $contact->last_name) }}
-  
-  <p>&nbsp;<p/>
-  <p>&nbsp;<p/>
+{{ Former::populate($client) }}
+{{ Former::populateField('first_name', $contact->first_name) }}
+{{ Former::populateField('last_name', $contact->last_name) }}
 
-  <div class="row">
-    <div class="col-md-6" style="padding-top:16px">
 
-      <div class="row">
-        <div class="col-md-6">
-          {{ Former::text('first_name') }}
+<section class="hero background hero-secure center" data-speed="2" data-type="background">
+  <div class="container">
+    <div class="row">
+      <h1>Secure Payment</h1>
+      <p class="thin"><img src="{{ asset('images/icon-secure-pay.png') }}">256-BiT Encryption</p>
+      <!-- <img src="{{ asset('images/providers.png') }}"> -->
+    </div>
+  </div>
+</section>
+
+<section class="secure">
+  <div class="container">
+    <div id="secure-form" class="row">          
+      <div class="col-md-7 info">
+        <form>
+          <div class="row">
+            <div class="form-group col-md-6">
+              {{ Former::text('first_name') }}
+            </div>
+            <div class="form-group col-md-6">
+              {{ Former::text('last_name') }}
+            </div>
+          </div>
+
+          <div class="row">
+            <div class="form-group col-md-12">
+              {{ Former::text('address1')->label('Street') }}
+            </div>
+          </div>
+
+          <div class="row">
+            <div class="form-group col-md-3">
+              {{ Former::text('address2')->label('Apt/Suite') }}      
+            </div>
+
+            <div class="form-group col-md-3">
+              {{ Former::text('city') }}          
+            </div>
+
+            <div class="form-group col-md-3">
+              {{ Former::text('state')->label('State/Province') }}          
+            </div>
+
+            <div class="form-group col-md-3">
+              {{ Former::text('postal_code') }}                      
+            </div>
+          </div>
         </div>
-        <div class="col-md-6">
-          {{ Former::text('last_name') }}
+
+
+        @if(strtolower($gateway->name) == 'beanstream')
+          <div class="row">
+            <div class="form-group col-md-4">
+              {{ Former::text('phone') }}
+            </div>
+            <div class="form-group col-md-4">
+              {{ Former::text('email') }}
+            </div>
+            <div class="form-group col-md-4">
+              {{ Former::select('country')->addOption('','')->label('Country')
+                   ->fromQuery($countries, 'name', 'iso_3166_2') }}        
+            </div>
+          </div>                
+        @endif
+
+
+        <div class="col-md-5">
+          <div class="card">
+            <div class="row">
+              <div class="form-group col-md-12">
+                {{ Former::text('card_number') }}  
+                <!-- <span class="glyphicon glyphicon-lock"></span> -->
+              </div>
+            </div>
+            <div class="row">
+              <div class="form-group col-md-6">
+                {{ Former::select('expiration_month')->addOption('','')
+                      ->addOption('01 - January', '1')
+                      ->addOption('02 - February', '2')
+                      ->addOption('03 - March', '3')
+                      ->addOption('04 - April', '4')
+                      ->addOption('05 - May', '5')
+                      ->addOption('06 - June', '6')
+                      ->addOption('07 - July', '7')
+                      ->addOption('08 - August', '8')
+                      ->addOption('09 - September', '9')
+                      ->addOption('10 - October', '10')
+                      ->addOption('11 - November', '11')
+                      ->addOption('12 - December', '12')
+                }}
+
+              </div>
+              <div class="form-group col-md-6">
+                {{ Former::select('expiration_year')->addOption('','')
+                      ->addOption('2014', '2014')
+                      ->addOption('2015', '2015')
+                      ->addOption('2016', '2016')
+                      ->addOption('2017', '2017')
+                      ->addOption('2018', '2018')
+                      ->addOption('2019', '2019')
+                      ->addOption('2020', '2020')
+                }}          
+
+              </div>
+            </div>
+
+
+            <div class="row">
+              <div class="form-group col-md-6">
+                {{ Former::text('cvv') }}                        
+              </div>
+
+              <div class="col-md-6">
+                <!-- <p><span class="glyphicon glyphicon-credit-card" style="margin-right: 10px;"></span><a href="#">Where Do I find CVV?</a></p> -->
+              </div>
+            </div>
+          </div>
+
+
         </div>
       </div>
-
       <div class="row">
         <div class="col-md-12">
-          {{ Former::text('address1')->label('Street') }}
+          {{ Button::block_primary_submit_lg(strtoupper(trans('texts.pay_now')) . ' - ' . Utils::formatMoney($invoice->amount, $client->currency_id) ) }}
         </div>
-      </div>
+      </form>
+    </div>
+  </div>
+</div>
 
-      <div class="row">
-        <div class="col-md-3">
-          {{ Former::text('address2')->label('Apt/Suite') }}      
-        </div>
-        <div class="col-md-3">
-          {{ Former::text('city') }}          
-        </div>
-        <div class="col-md-3">
-          {{ Former::text('state')->label('State/Province') }}          
-        </div>
-        <div class="col-md-3">
-          {{ Former::text('postal_code') }}          
-        </div>
-      </div>
 
-      @if(strtolower($gateway->name) == 'beanstream')
-        <div class="row">
-          <div class="col-md-4">
-            {{ Former::text('phone') }}
-          </div>
-          <div class="col-md-4">
-            {{ Former::text('email') }}
-          </div>
-          <div class="col-md-4">
-            {{ Former::select('country')->addOption('','')->label('Country')
-                 ->fromQuery($countries, 'name', 'iso_3166_2') }}        
-          </div>
-        </div>                
-      @endif
+</section>
 
+
+
+
+  <!--
     </div>
 
     <div class="col-md-5 col-md-offset-1" style="background-color:#DDD;padding-top:16px">
@@ -94,31 +181,8 @@
 
       <div class="row">
         <div class="col-md-6">
-          {{ Former::select('expiration_month')->addOption('','')
-                ->addOption('01 - January', '1')
-                ->addOption('02 - February', '2')
-                ->addOption('03 - March', '3')
-                ->addOption('04 - April', '4')
-                ->addOption('05 - May', '5')
-                ->addOption('06 - June', '6')
-                ->addOption('07 - July', '7')
-                ->addOption('08 - August', '8')
-                ->addOption('09 - September', '9')
-                ->addOption('10 - October', '10')
-                ->addOption('11 - November', '11')
-                ->addOption('12 - December', '12')
-          }}
         </div>
         <div class="col-md-6">
-          {{ Former::select('expiration_year')->addOption('','')
-                ->addOption('2014', '2014')
-                ->addOption('2015', '2015')
-                ->addOption('2016', '2016')
-                ->addOption('2017', '2017')
-                ->addOption('2018', '2018')
-                ->addOption('2019', '2019')
-                ->addOption('2020', '2020')
-          }}          
         </div>
       </div>
 
@@ -143,11 +207,11 @@
     </div>    
 
   </div>
+-->
 
 
-      
 
 
-  {{ Former::close() }}
+{{ Former::close() }}
 
 @stop
\ No newline at end of file
diff --git a/app/views/public/header.blade.php b/app/views/public/header.blade.php
index a7ea5b8bd820..fed3fb26861b 100644
--- a/app/views/public/header.blade.php
+++ b/app/views/public/header.blade.php
@@ -93,8 +93,7 @@
 <div class="navbar" style="margin-bottom:0px">
   <div class="container">
     <div class="navbar-inner">
-      <a class="brand" href="{{ URL::to('/') }}"><img src=
-        "images/invoiceninja-logo.png"></a>
+      <a class="brand" href="{{ URL::to('/') }}"><img src="{{ asset('images/invoiceninja-logo.png') }}"></a>
         <ul class="navbar-list">
           <!-- <li>{{ link_to('features', 'Features' ) }}</li> -->
           <!-- <li>{{ link_to('faq', 'FAQ' ) }}</li> -->
@@ -112,7 +111,6 @@
   @yield('content')   
 
 
-
   <footer class="footer">
       <div class="container">
         <div class="row">
@@ -213,9 +211,11 @@
 </footer>
 
 <script type="text/javascript">
-jQuery(document).ready(function($) { 
-	$('.valign').vAlign();
+
+jQuery(document).ready(function($) {   
+	$('.valign').vAlign();  
 });
+
 </script>
 
 <!--
diff --git a/app/views/script.blade.php b/app/views/script.blade.php
new file mode 100644
index 000000000000..f1a5c1a29f05
--- /dev/null
+++ b/app/views/script.blade.php
@@ -0,0 +1,26 @@
+<script type="text/javascript">
+
+  var currencies = {{ Currency::remember(120)->get(); }};
+  var currencyMap = {};
+  for (var i=0; i<currencies.length; i++) {
+    var currency = currencies[i];
+    currencyMap[currency.id] = currency;
+  }       
+  var NINJA = NINJA || {};
+  @if (Auth::check())
+    NINJA.primaryColor = "{{ Auth::user()->account->primary_color }}";
+    NINJA.secondaryColor = "{{ Auth::user()->account->secondary_color }}";
+  @endif
+  NINJA.parseFloat = function(str) {
+    if (!str) return '';
+    str = (str+'').replace(/[^0-9\.\-]/g, '');
+    return window.parseFloat(str);
+  }
+  function formatMoney(value, currency_id, hide_symbol) {
+    value = NINJA.parseFloat(value);
+    if (!currency_id) currency_id = {{ Session::get(SESSION_CURRENCY, DEFAULT_CURRENCY); }};
+    var currency = currencyMap[currency_id];
+    return accounting.formatMoney(value, hide_symbol ? '' : currency.symbol, currency.precision, currency.thousand_separator, currency.decimal_separator);
+  }
+
+</script>
\ No newline at end of file
diff --git a/app/views/secure_payment.blade.php b/app/views/secure_payment.blade.php
index 88e13c7565e7..30f10c5fc50d 100644
--- a/app/views/secure_payment.blade.php
+++ b/app/views/secure_payment.blade.php
@@ -3,127 +3,127 @@
 @section('content')
 
 <section class="hero background hero-secure center" data-speed="2" data-type="background">
-<div class="container">
+  <div class="container">
     <div class="row">
-          <h1>Secure Payment</h1>
-            <p class="thin"><img src="{{ asset('images/icon-secure-pay.png') }}">256-BiT Encryption</p>
-            <img src="{{ asset('images/providers.png') }}">
-        </div>
-      </div>
-    </section>
+      <h1>Secure Payment</h1>
+      <p class="thin"><img src="{{ asset('images/icon-secure-pay.png') }}">256-BiT Encryption</p>
+      <img src="{{ asset('images/providers.png') }}">
+    </div>
+  </div>
+</section>
 
 <section class="secure">
   <div class="container">
     <div id="secure-form" class="row">          
-        <div class="col-md-7 info">
+      <div class="col-md-7 info">
         <form>
-            <div class="row">
-          <div class="form-group col-md-6">
-              <label for="firstname">First Name</label>
-            <input type="text" class="form-control" id="firstname" name="firstname">
-            <span class="help-block" style="display: none;">Please enter your first name.</span>
-            
-          </div>
-        <div class="form-group col-md-6">
-              <label for="lastname">Last name</label>
-            <input type="text" class="form-control" id="lastname" name="lastname">
-            <span class="help-block" style="display: none;">Please enter your last name.</span>
-          </div>
-          </div>
-            
-             <div class="row">
-          <div class="form-group col-md-12">
-              <label for="streetadress">Street Address</label>
-            <input type="text" class="form-control" id="streetadress" name="streetadress">
-            <span class="help-block" style="display: none;">Please enter addess.</span>
-            
-          </div>
-          </div>
-            
-             <div class="row">
-        <div class="form-group col-md-3">
-              <label for="apt">Apt/Ste</label>
-            <input type="text" class="form-control" id="apt" name="apt">
-            <span class="help-block" style="display: none;">Please enter your Apt/Ste.</span>
-          </div>
-                 
-                  <div class="form-group col-md-3">
-              <label for="apt">City</label>
-            <input type="text" class="form-control" id="city" name="city">
-            <span class="help-block" style="display: none;">Please enter your city.</span>
-          </div>
-            
-               <div class="form-group col-md-3">
-              <label for="apt">State/Province</label>
-            <input type="text" class="form-control" id="state" name="state">
-            <span class="help-block" style="display: none;">Please enter your State/Province.</span>
-          </div>
-                 
-                  <div class="form-group col-md-3">
-              <label for="apt">Postal Code</label>
-            <input type="text" class="form-control" id="postal" name="postal">
-            <span class="help-block" style="display: none;">Please enter your Postal Code.</span>
-          </div>
-          </div>
-         
-            </div>
-            <div class="col-md-5">
-                <div class="card">
-                          <div class="row">
-          <div class="form-group col-md-12">
-              <label for="streetadress">Card number</label>
-            <input type="text" class="form-control with-icon" id="cardnumber" name="cardnumber">
-              <span class="glyphicon glyphicon-lock"></span>
-            <span class="help-block" style="display: none;">Please enter your card number.</span>
-            
-          </div>
-          </div>
-            <div class="row">
-          <div class="form-group col-md-6">
-              <label for="firstname">Expiration Month</label>
-            <select class="form-control" id="month" name="month">
-                <option>January</option>
-              </select>
-            <span class="help-block" style="display: none;">Please select the month.</span>
-            
-          </div>
-          <div class="form-group col-md-6">
-              <label for="firstname">Expiration year</label>
-            <select class="form-control" id="year" name="year">
-                <option>2016</option>
-              </select>
-            <span class="help-block" style="display: none;">Please select the year.</span>
-            
-          </div>
-          </div>
-            
-            
-             <div class="row">
-        <div class="form-group col-md-6">
-              <label for="apt">CVV</label>
-            <input type="text" class="form-control" id="cvv" name="cvv">
-            <span class="help-block" style="display: none;">Please enter the CVV.</span>
-          </div>
-                 
-                  <div class="col-md-6">
-             <p><span class="glyphicon glyphicon-credit-card" style="margin-right: 10px;"></span><a href="#">Where Do I find CVV?</a></p>
-          </div>
-          </div>
-             </div>
-          
-            
-          </div>
-          </div>
           <div class="row">
-            <div class="col-md-12">
-              <button type="submit" id="feedbackSubmit" class="btn btn-primary btn-lg green">PAY NOW - $2.00</button>
+            <div class="form-group col-md-6">
+              <label for="firstname">First Name</label>
+              <input type="text" class="form-control" id="firstname" name="firstname">
+              <span class="help-block" style="display: none;">Please enter your first name.</span>
+
+            </div>
+            <div class="form-group col-md-6">
+              <label for="lastname">Last name</label>
+              <input type="text" class="form-control" id="lastname" name="lastname">
+              <span class="help-block" style="display: none;">Please enter your last name.</span>
             </div>
-              </form>
-                </div>
-          </div>
           </div>
 
-          
+          <div class="row">
+            <div class="form-group col-md-12">
+              <label for="streetadress">Street Address</label>
+              <input type="text" class="form-control" id="streetadress" name="streetadress">
+              <span class="help-block" style="display: none;">Please enter addess.</span>
+
+            </div>
+          </div>
+
+          <div class="row">
+            <div class="form-group col-md-3">
+              <label for="apt">Apt/Ste</label>
+              <input type="text" class="form-control" id="apt" name="apt">
+              <span class="help-block" style="display: none;">Please enter your Apt/Ste.</span>
+            </div>
+
+            <div class="form-group col-md-3">
+              <label for="apt">City</label>
+              <input type="text" class="form-control" id="city" name="city">
+              <span class="help-block" style="display: none;">Please enter your city.</span>
+            </div>
+
+            <div class="form-group col-md-3">
+              <label for="apt">State/Province</label>
+              <input type="text" class="form-control" id="state" name="state">
+              <span class="help-block" style="display: none;">Please enter your State/Province.</span>
+            </div>
+
+            <div class="form-group col-md-3">
+              <label for="apt">Postal Code</label>
+              <input type="text" class="form-control" id="postal" name="postal">
+              <span class="help-block" style="display: none;">Please enter your Postal Code.</span>
+            </div>
+          </div>
+
+        </div>
+        <div class="col-md-5">
+          <div class="card">
+            <div class="row">
+              <div class="form-group col-md-12">
+                <label for="streetadress">Card number</label>
+                <input type="text" class="form-control with-icon" id="cardnumber" name="cardnumber">
+                <span class="glyphicon glyphicon-lock"></span>
+                <span class="help-block" style="display: none;">Please enter your card number.</span>
+
+              </div>
+            </div>
+            <div class="row">
+              <div class="form-group col-md-6">
+                <label for="firstname">Expiration Month</label>
+                <select class="form-control" id="month" name="month">
+                  <option>January</option>
+                </select>
+                <span class="help-block" style="display: none;">Please select the month.</span>
+
+              </div>
+              <div class="form-group col-md-6">
+                <label for="firstname">Expiration year</label>
+                <select class="form-control" id="year" name="year">
+                  <option>2016</option>
+                </select>
+                <span class="help-block" style="display: none;">Please select the year.</span>
+
+              </div>
+            </div>
+
+
+            <div class="row">
+              <div class="form-group col-md-6">
+                <label for="apt">CVV</label>
+                <input type="text" class="form-control" id="cvv" name="cvv">
+                <span class="help-block" style="display: none;">Please enter the CVV.</span>
+              </div>
+
+              <div class="col-md-6">
+                <p><span class="glyphicon glyphicon-credit-card" style="margin-right: 10px;"></span><a href="#">Where Do I find CVV?</a></p>
+              </div>
+            </div>
+          </div>
+
+
+        </div>
+      </div>
+      <div class="row">
+        <div class="col-md-12">
+          <button type="submit" id="feedbackSubmit" class="btn btn-primary btn-lg green">PAY NOW - $2.00</button>
+        </div>
+      </form>
+    </div>
+  </div>
+</div>
+
+
 </section>