UI changes
diff --git a/erpnext/public/js/pos/pos.html b/erpnext/public/js/pos/pos.html
index 8a08a8b..17d1a5f 100644
--- a/erpnext/public/js/pos/pos.html
+++ b/erpnext/public/js/pos/pos.html
@@ -1,109 +1,111 @@
 <div class="pos">
-    <div class="row">
-    	<div class="col-sm-6 pos-bill-wrapper">
-            <div class="pos-bill-toolbar" style="display: flex;">
-                <div class="party-area" style="flex: 1;"></div>
-				<button class="btn btn-default list-customers-btn" style="margin: 0 5px 0 15px;">
-					<i class="fa fa-list"></i>
-				</button>
-				<button class="btn btn-default add-customer-btn">
-					<i class="fa fa-plus"></i>
-				</button>
-				{% if (allow_delete) { %}
-					<button class="btn btn-default btn-danger" style="margin: 0 5px 0 5px;display:none">
-						<i class="octicon octicon-trashcan"></i>
-					</button>
-				{% } %}
-            </div>
-    		<div class="pos-bill">
-    			<div class="item-cart">
-                    <!-- <div class="row pos-bill-row pos-bill-header">
-                        <div class="col-xs-4"><h6>{%= __("Item") %}</h6></div>
-                        <div class="col-xs-3"><h6 class="text-right">{%= __("Quantity") %}</h6></div>
-						<div class="col-xs-2"><h6 class="text-right">{%= __("Discount") %}</h6></div>
-                        <div class="col-xs-3"><h6 class="text-right">{%= __("Rate") %}</h6></div>
-                    </div> -->
-                    <div class="items"></div>
-    			</div>
-    			<div class="totals-area">
-                    <div class="row pos-bill-row net-total-area">
-                        <div class="col-xs-6"><h6 class="text-muted">{%= __("Net Total") %}</h6></div>
-                        <div class="col-xs-6"><h6 class="net-total text-right"></h6></div>
-                    </div>
-                    <div class="row pos-bill-row tax-area hide">
-						<div class="col-xs-12 text-muted">
-	                        <h6>{%= __("Taxes") %}</h6>
-							<div class="tax-table small"></div>
-						</div>
-                    </div>
-					{% if (apply_discount_on) { %}
-	                    <div class="row pos-bill-row discount-amount-area">
-	                        <div class="col-xs-6"><h6 class="text-muted">{%= __("Discount") %}</h6></div>
-							<div class="col-xs-3 discount-field-col">
-								<div class="input-group input-group-sm">
-									<span class="input-group-addon">%</span>
-									<input type="text" class="form-control discount-percentage text-right">
-								</div>
-							</div>
-	                        <div class="col-xs-3 discount-field-col">
-								<div class="input-group input-group-sm">
-									<span class="input-group-addon">{%= get_currency_symbol(currency) %}</span>
-									<input type="text" class="form-control discount-amount text-right"
-								  		placeholder="{%= 0.00 %}">
-								</div>
-							</div>
-	                    </div>
-					{% } %} 
-                    <div class="row pos-bill-row grand-total-area" style="border-bottom:1px solid #d1d8dd;">
-                        <div class="col-xs-6"><h6>{%= __("Grand Total") %}</h6></div>
-                        <div class="col-xs-6"><h6 class="grand-total text-right"></h6></div>
-                    </div>
-    			</div>
-    		</div>
-			
-			<div class="list-customers" style = "display:none">
-
-			</div>
-			<div class="row">
-				<div class="col-xs-6 selected-item">
-					
-		        </div>
-				<div class="col-xs-6 numeric_keypad" style="display:none">
-					{% var chartData = ["Qty", "Disc", "Price"] %}
-					{% for(var i=0; i<3; i++) { %}
-						<div class="row text-right">
-							{% for(var j=i*3; j<(i+1)*3; j++) { %}
-								<button type="button"  class="btn btn-default numeric-keypad" val="{{j+1}}">{{j+1}}</button>
-							{% } %}
-							<button type="button" id = "pos-item-{{ chartData[i].toLowerCase() }}" class="btn text-center btn-default numeric-keypad pos-operation">{{ chartData[i] }}</button>
-						</div>
-					{% } %}
-					<div class="row text-right">
-						<button type="button"  class="btn btn-default numeric-keypad numeric-del">Del</button>
-						<button type="button"  class="btn btn-default numeric-keypad" val="0">0</button>
-						<button type="button"  class="btn btn-default numeric-keypad" val=".">.</button>
-						<button type="button" class="btn btn-primary pos-pay">Pay</button>
+	<div class="row">
+		<div class="col-sm-6 pos-bill-wrapper">
+			<div class="col-sm-12"><h6 class="form-section-heading uppercase">Item Cart</h6></div>
+			<div class="pos-bill">
+				<div class="item-cart">
+					<div class="pos-list-row pos-bill-header text-muted h6">
+						<span class="cell subject">
+							<!--<input class="list-select-all" type="checkbox" title="{%= __("Select All") %}">-->
+							{{ __("Item Name")}}
+						</span>
+						<span class="cell text-right">{{ __("Quantity") }}</span>
+						<span class="cell text-right">{{ __("Discount") }}</span>
+						<span class="cell text-right">{{ __("Rate") }}</span>
 					</div>
-		        </div>
+					<div class="item-cart-items">
+						<div class="no-items-message text-extra-muted">
+							<span class="text-center">
+								<i class="fa fa-4x fa-shopping-cart"></i>
+								<p>Tap items to add them here</p>
+							</span>
+						</div>
+						<div class="items">
+						</div>
+					</div>
+				</div>
 			</div>
-    	</div>
-    	<div class="col-sm-6 pos-items-section">
-			<div class="row pos-item-area">
+			<div class="totals-area">
+				<div class="pos-list-row net-total-area hide">
+					<div class="cell subject"></div>
+					<div class="cell"></div>
+					<div class="cell text-right">{%= __("Net Total") %}</div>
+					<div class="cell net-total text-right"></div>
+				</div>
+				<div class="pos-list-row tax-area">
+					<div class="cell subject"></div>
+					<div class="cell"></div>
+					<div class="cell text-muted">{%= __("Taxes") %}</div>
+					<div class="cell text-right tax-table"></div>
+				</div>
+				{% if (apply_discount_on) { %}
+				<div class="pos-list-row discount-amount-area hide">
+					<div class="cell text-muted">{%= __("Discount") %}</div>
+					<div class="cell discount-field-col">
+						<div class="input-group input-group-sm">
+							<span class="input-group-addon">%</span>
+							<input type="text" class="form-control discount-percentage text-right">
+						</div>
+					</div>
+					<div class="cell discount-field-col">
+						<div class="input-group input-group-sm">
+							<span class="input-group-addon">{%= get_currency_symbol(currency) %}</span>
+							<input type="text" class="form-control discount-amount text-right" placeholder="{%= 0.00 %}">
+						</div>
+					</div>
+				</div>
+				{% } %}
+				<div class="pos-list-row grand-total-area" style="border-bottom:1px solid #d1d8dd;">
+					<div class="cell subject"></div>
+					<div class="cell text-right bold">{%= __("Grand Total") %}</div>
+					<div class="cell grand-total text-right lead"></div>
+				</div>
+			</div>
+			<div class="list-customers" style="display:none">
 
 			</div>
-			<span id="customer-results" style="color:#68a;"></span>
-            <div class="row pos-item-toolbar">
-				<div class="search-item-group col-xs-5"></div>
-				<div class="search-item col-xs-7"></div>
-            </div>
-    		<div class="item-list-area" style="auto">
-				<div class="app-listing item-list"></ul>
-    		</div>
-    	</div>
-		<div class="row">
-			<div class="text-right list-paging-area">
-				<button class="btn btn-default btn-more btn-sm" style="margin:5px 20px">{{ __("More") }}</button>
+			<div class="row" style="margin-top: 15px">
+				<div class="col-xs-6 selected-item">
+
+				</div>
+				<div class="col-xs-6 numeric_keypad" style="display:none">
+					{% var chartData = ["Qty", "Disc", "Price"] %} {% for(var i=0; i
+					<3; i++) { %} <div class="row text-right">
+						{% for(var j=i*3; j
+						<(i+1)*3; j++) { %} <button type="button" class="btn btn-default numeric-keypad" val="{{j+1}}">{{j+1}}</button>
+							{% } %}
+							<button type="button" id="pos-item-{{ chartData[i].toLowerCase() }}" class="btn text-center btn-default numeric-keypad pos-operation">{{ chartData[i] }}</button>
+				</div>
+				{% } %}
+				<div class="row text-right">
+					<button type="button" class="btn btn-default numeric-keypad numeric-del">Del</button>
+					<button type="button" class="btn btn-default numeric-keypad" val="0">0</button>
+					<button type="button" class="btn btn-default numeric-keypad" val=".">.</button>
+					<button type="button" class="btn btn-primary numeric-keypad pos-pay">Pay</button>
+				</div>
 			</div>
 		</div>
-    </div>
-</div>
+	</div>
+	<div class="col-sm-6 pos-items-section">
+		<div class="col-sm-12"><h6 class="form-section-heading uppercase">Stock Items</h6></div>
+		<div class="row pos-item-area">
+
+		</div>
+		<span id="customer-results" style="color:#68a;"></span>
+		<div class="row pos-item-toolbar hide">
+			<div class="search-item-group col-xs-5 hide"></div>
+			<div class="search-item col-xs-7 hide"></div>
+		</div>
+		<div class="item-list-area">
+			<div class="pos-list-row pos-bill-header text-muted h6">
+				<div class="cell subject">All Item Groups</div>
+				<div class="cell"></div>
+				<div class="cell"></div>
+				<div class="cell"></div>
+			</div>
+			<div class="app-listing item-list image-view-container three-column">
+				
+			</div>
+		</div>
+	</div>
+</div>
\ No newline at end of file