diff --git a/app/assets/stylesheets/client_management/backend.css b/app/assets/stylesheets/client_management/backend.css
index ff208ff..9fbf5ca 100644
--- a/app/assets/stylesheets/client_management/backend.css
+++ b/app/assets/stylesheets/client_management/backend.css
@@ -8,8 +8,9 @@ h1, h2, h3, h4, h5, h6, label, legend {
   background: #fff;
   padding: 20px;
   border: 1px solid #ddd;
-  margin: 30px;
+  margin: 30px 0 30px 15px;
   max-width: 1000px;
+  position: relative;
 }
 .sub-title {
   color: #337ab7;
@@ -18,9 +19,36 @@ h1, h2, h3, h4, h5, h6, label, legend {
   margin: 50px 0 5px;
   padding: 0 0 0 8px;
 }
+.sub-title .label {
+  padding: 4px 10px 5px;
+  font-size: 12px;
+  margin: 0 0 0 10px;
+  vertical-align: text-top;
+}
 .page-client > div:first-child .sub-title {
   margin: 20px 0 5px;
 }
+.page-client > * {
+  margin: 0 0 30px;
+}
+.page-receipts .info-receipts {
+  overflow-x: auto;
+}
+.page-receipts table {
+  margin: 0 0 10px;
+}
+.page-receipts table .btn {
+  width: auto;
+  margin: 0;
+}
+.page-receipts table th {
+  width: 15%;
+  white-space: normal;
+  vertical-align: top;
+}
+.page-client > *:last-child {
+  margin: 0;
+}
 .line-content {
   width: 100%;
   margin: 0 0 15px;
@@ -52,6 +80,7 @@ div .line-content:nth-child(1) {
 }
 .line-content .header-line label {
   color: #000;
+  font-size: 15px;
   font-weight: 500;
   float: left;
   width: 200px;
@@ -82,6 +111,12 @@ div .line-content:nth-child(1) {
   margin: 10px 0;
   border-radius: 4px;
 }
+.line-content.qt div.requirement-text {
+  background: rgba(0,0,0,0.04);
+  padding: 10px;
+  margin: 10px 0;
+  border-radius: 4px;
+}
 .line-content.qt ol.custom-module li {
   margin: 5px 0;
 }
diff --git a/app/views/admin/client_managements/_purchase_form.html.erb b/app/views/admin/client_managements/_purchase_form.html.erb
index 2ced525..e75ec62 100644
--- a/app/views/admin/client_managements/_purchase_form.html.erb
+++ b/app/views/admin/client_managements/_purchase_form.html.erb
@@ -52,4 +52,9 @@
 <% if @receipt.new_record? %>
 	<%= f.hidden_field :contract_purchase_id, :value => @purchase.id.to_s %>
 <% end %>
-<%= f.submit "Submit", :class => "btn btn-primary" %>
\ No newline at end of file
+
+<div class="line-content">
+	<span class="header-line">
+		<%= f.submit "Submit", :class => "btn btn-primary" %>
+	</span>
+</div>
\ No newline at end of file
diff --git a/app/views/admin/client_managements/add_receipt.html.erb b/app/views/admin/client_managements/add_receipt.html.erb
index 9f719cd..0baec83 100644
--- a/app/views/admin/client_managements/add_receipt.html.erb
+++ b/app/views/admin/client_managements/add_receipt.html.erb
@@ -5,11 +5,14 @@
   <%= javascript_include_tag "lib/bootstrap-datetimepicker" %>
   <%= javascript_include_tag "lib/datetimepicker/datetimepicker.js" %>
 <% end %>
-<div class="info-detail">
-	<div class="info-spec">
-		<%= form_for @receipt, :url => {:action => :create_receipt}, :html => {:class => "form-horizontal contract-form"} do |f| %>
-			<h3 class="sub-title">Add Receipt</h3>
-			<%= render :partial => "purchase_form", :locals => {:f => f} %>
-		<% end %>
+
+<div class="page-contract page-client">
+	<div class="info-detail">
+		<div class="info-spec">
+			<%= form_for @receipt, :url => {:action => :create_receipt}, :html => {:class => "form-horizontal contract-form"} do |f| %>
+				<h3 class="sub-title">Add Receipt</h3>
+				<%= render :partial => "purchase_form", :locals => {:f => f} %>
+			<% end %>
+		</div>
 	</div>
 </div>
\ No newline at end of file
diff --git a/app/views/admin/client_managements/edit_receipt.html.erb b/app/views/admin/client_managements/edit_receipt.html.erb
index b94200b..a27c258 100644
--- a/app/views/admin/client_managements/edit_receipt.html.erb
+++ b/app/views/admin/client_managements/edit_receipt.html.erb
@@ -5,11 +5,13 @@
   <%= javascript_include_tag "lib/bootstrap-datetimepicker" %>
   <%= javascript_include_tag "lib/datetimepicker/datetimepicker.js" %>
 <% end %>
-<div class="info-detail">
-	<div class="info-spec">
-		<%= form_for @receipt, :url => {:action => :update_receipt}, :html => {:class => "form-horizontal contract-form"} do |f| %>
-			<h3 class="sub-title">Add Receipt</h3>
-			<%= render :partial => "purchase_form", :locals => {:f => f} %>
-		<% end %>
+<div class="page-contract page-client">
+	<div class="info-detail">
+		<div class="info-spec">
+			<%= form_for @receipt, :url => {:action => :update_receipt}, :html => {:class => "form-horizontal contract-form"} do |f| %>
+				<h3 class="sub-title">Add Receipt</h3>
+				<%= render :partial => "purchase_form", :locals => {:f => f} %>
+			<% end %>
+		</div>
 	</div>
 </div>
\ No newline at end of file
diff --git a/app/views/admin/client_managements/receipts.html.erb b/app/views/admin/client_managements/receipts.html.erb
index 001c5cf..8d140a4 100644
--- a/app/views/admin/client_managements/receipts.html.erb
+++ b/app/views/admin/client_managements/receipts.html.erb
@@ -2,15 +2,15 @@
   <%= stylesheet_link_tag "client_management/backend" %>
 <% end %>
 
-<div class="page-contract page-client">
+<div class="page-receipts page-client">
 	<div class="info-contract">
 		<h3 class="sub-title">
-			<% if @purchase.total_amount == (@total_received_amount + @total_adjustable_amount) %>
-				<span class="label label-success pull-right">Received</span>
-			<% else %>
-				<span class="label label-important pull-right">Pending</span>
-			<% end %>
 			Purchase Info
+			<% if @purchase.total_amount == (@total_received_amount + @total_adjustable_amount) %>
+				<span class="label label-success">Received</span>
+			<% else %>
+				<span class="label label-important">Pending</span>
+			<% end %>
 		</h3>
 		<div class="line-content">
 			<span class="header-line">Contract Id :</span>
@@ -37,45 +37,47 @@
 			<span class="content-line" style="color: red;"><%= @purchase.total_amount - (@total_received_amount + @total_adjustable_amount) %> NTD.</span>
 		</div>
 	</div>
-</div>
-<table class="table main-list">
-  <thead>
-    <tr class="sort-header">
-      <% ["client_management.receipt_number", "client_management.amount", "client_management.amount_received", "client_management.amount_pending", "client_management.receipt_status", :actions].each_with_index do |f,i| %>
-       <%= thead(f) %>
-      <% end %>
-    </tr>
-  </thead>
-  <tbody>
-  	<% if !@purchase.purchase_receipts.blank? %>
-			<% @purchase.purchase_receipts.each do |pr| %>
+	<div class="info-receipts">
+		<table class="table main-list">
+	  <thead>
+	    <tr class="sort-header">
+	      <% ["client_management.receipt_number", "client_management.amount", "client_management.amount_received", "client_management.amount_pending", "client_management.receipt_status", :actions].each_with_index do |f,i| %>
+	       <%= thead(f) %>
+	      <% end %>
+	    </tr>
+	  </thead>
+	  <tbody>
+	  	<% if !@purchase.purchase_receipts.blank? %>
+				<% @purchase.purchase_receipts.each do |pr| %>
+					<tr>
+						<td><%= pr.receipt_number %></td>
+						<td><%= pr.amount %></td>
+						<td style="color:green;"><%= pr.amount_received %></td>
+						<td style="color:red;"><%= pr.amount_pending %></td>
+						<td>
+							<% if pr.is_pending? %>
+								<span class="label label-important">Pending</span>
+							<% else %>
+								<span class="label label-success">Cleared</span>
+							<% end %>
+						</td>
+						<td><a href="<%= edit_receipt_admin_client_management_path(pr.id) %>" class="btn btn-warning">Edit</a></td>
+					</tr>
+				<% end %>
+			<% else %>
 				<tr>
-					<td><%= pr.receipt_number %></td>
-					<td><%= pr.amount %></td>
-					<td style="color:green;"><%= pr.amount_received %></td>
-					<td style="color:red;"><%= pr.amount_pending %></td>
-					<td>
-						<% if pr.is_pending? %>
-							<span class="label label-important">Pending</span>
-						<% else %>
-							<span class="label label-success">Cleared</span>
-						<% end %>
-					</td>
-					<td><a href="<%= edit_receipt_admin_client_management_path(pr.id) %>" class="btn btn-warning">Edit</a></td>
+					<td colspan="6" style="text-align: center;">No receipts issued.</td>
 				</tr>
 			<% end %>
-		<% else %>
-			<tr>
-				<td colspan="6" style="text-align: center;">No receipts issued.</td>
-			</tr>
+	  </tbody>
+	 </table>
+	</div>
+	<div class="info-contract-buttons">
+		<div class="line-content button">
+		<% if @purchase.total_amount > (@total_received_amount + @total_adjustable_amount) %>
+			<a class="btn btn-info" href="<%= add_receipt_admin_client_management_path(@purchase.id) %>">Add Receipt</a>
 		<% end %>
-  </tbody>
- </table>
-<div class="info-contract-buttons">
-	<div class="line-content button">
-	<% if @purchase.total_amount > (@total_received_amount + @total_adjustable_amount) %>
-		<a class="btn btn-info" href="<%= add_receipt_admin_client_management_path(@purchase.id) %>">Add Receipt</a>
-	<% end %>
-		<a class="btn" href="<%= see_contract_admin_client_management_path(@contract.id) %>">Back to Contract</a>
+			<a class="btn" href="<%= see_contract_admin_client_management_path(@contract.id) %>">Back to Contract</a>
+		</div>
 	</div>
 </div>
\ No newline at end of file
diff --git a/app/views/admin/client_managements/see_contract.html.erb b/app/views/admin/client_managements/see_contract.html.erb
index b0ac18a..e0ab3b2 100644
--- a/app/views/admin/client_managements/see_contract.html.erb
+++ b/app/views/admin/client_managements/see_contract.html.erb
@@ -108,8 +108,10 @@
 	 	<% if !@contract.other.nil? || @contract.other_cost > 0 %>
 	 		<div class="line-content qt">
 					<span class="header-line">
-						Other Requirements : <br>
-						<%= nl2br(@contract.other) %>
+						Other Requirements
+						<div class="requirement-text">
+							<%= nl2br(@contract.other) %>
+						</div>
 					</span>
 					<span class="content-line"><%= @contract.other_cost %></span>
 			</div>
diff --git a/app/views/client_managements/_user_site.html.erb b/app/views/client_managements/_user_site.html.erb
index 8f03db7..094af65 100644
--- a/app/views/client_managements/_user_site.html.erb
+++ b/app/views/client_managements/_user_site.html.erb
@@ -5,13 +5,13 @@
   	<span class="regdate-server"><i class="fa fa-calendar" aria-hidden="true"></i></i><%= user_site.created_at.strftime("%d %B %Y") %></span>
 	</div>
 	<% if !user_site.site_confirmed %>
-		<span class="status-server offline"><%= t("registered_sites.site_inactive") %></span><br />
+		<span class="status-server offline"><%= t("registered_sites.site_inactive") %></span>
 		<%= t("registered_sites.email_not_confirmed") %> 
 	<% elsif !user_site.access_granted %>
-		<span class="status-server offline"><%= t("registered_sites.site_inactive") %></span><br />
+		<span class="status-server offline"><%= t("registered_sites.site_inactive") %></span>
 		<%= t("registered_sites.site_permission_revoked") %>
 	<% else %>
-		<span class="status-server online"><%= t("registered_sites.site_active") %></span><br />
+		<span class="status-server online"><%= t("registered_sites.site_active") %></span>
 	<% end %>
 	<span class="action-server">
   	<a href="/cpanel/site/<%= user_site.uid %>" class="btn btn-info">Manage</a>
diff --git a/app/views/client_managements/addnewsite.html.erb b/app/views/client_managements/addnewsite.html.erb
index 7abb4bb..01c3169 100644
--- a/app/views/client_managements/addnewsite.html.erb
+++ b/app/views/client_managements/addnewsite.html.erb
@@ -37,12 +37,12 @@
             <%= f.select :site_id, @user_sites, {:prompt => "------Select or Create------"}, {:class => "form-control select-site"} %>
             <div class="box-check-host" id="maintenance-box">
               <div class="line-check-host">
-                <%= f.label :maintenance, "Renew my maintenance" %>
                 <%= f.check_box :maintenance %>
+                <%= f.label :maintenance, "Renew my maintenance" %>
               </div>
               <div class="line-check-host">
-                <%= f.label :maintenance_years, "Year(s): " %>
-                <%= f.select :maintenance_years, options_for_select((1..5).collect{|i|[i,i]}), :class=>"form-control" %>
+                <%= f.label :maintenance_years, "Year(s): ", :class=>"left" %>
+                <%= f.select :maintenance_years, options_for_select((1..5).collect{|i|[i,i]}),{},  {class: "form-control left"} %>
               </div>
             </div>
             <div class="box-check-host" id="new-site-box">
diff --git a/app/views/client_managements/see_contract.html.erb b/app/views/client_managements/see_contract.html.erb
index ec780dc..f4522a2 100644
--- a/app/views/client_managements/see_contract.html.erb
+++ b/app/views/client_managements/see_contract.html.erb
@@ -103,8 +103,10 @@
 		<% if !@contract.other.nil? || @contract.other_cost > 0 %>
 	 		<div class="line-contract qt">
 					<span class="header-detail">
-						Other Requirements : <br>
-						<%= nl2br(@contract.other) %>
+						Other Requirements
+						<div class="requirement-text">
+							<%= nl2br(@contract.other) %>
+						</div>
 					</span>
 					<span class="content-detail"><%= @contract.other_cost %></span>
 			</div>