diff --git a/frappe/desk/page/activity/activity.js b/frappe/desk/page/activity/activity.js
index ed4860e694..bc74860998 100644
--- a/frappe/desk/page/activity/activity.js
+++ b/frappe/desk/page/activity/activity.js
@@ -9,18 +9,20 @@ frappe.pages['activity'].onload = function(wrapper) {
 	frappe.require('assets/frappe/js/lib/flot/jquery.flot.js');
 	frappe.require('assets/frappe/js/lib/flot/jquery.flot.downsample.js');
 
-	var page = frappe.ui.make_app_page({
+	frappe.ui.make_app_page({
 		parent: wrapper,
 		single_column: true
 	});
 
-	page.set_title(__("Activty"), frappe.get_module("Activity").icon);
+	this.page = wrapper.page;
+
+	this.page.set_title(__("Activty"), frappe.get_module("Activity").icon);
 
 	this.page.list = new frappe.ui.Listing({
 		hide_refresh: true,
-		page: wrapper.page,
+		page: this.page,
 		method: 'frappe.desk.page.activity.activity.get_feed',
-		parent: $(wrapper).find(".layout-main"),
+		parent: $("<div></div>").appendTo(this.page.main),
 		render_row: function(row, data) {
 			new frappe.activity.Feed(row, data);
 		}
@@ -28,7 +30,7 @@ frappe.pages['activity'].onload = function(wrapper) {
 
 	this.page.list.run();
 
-	frappe.activity.render_plot(page);
+	frappe.activity.render_plot(this.page);
 
 	this.page.main.on("click", ".activity-message", function() {
 		var doctype = $(this).attr("data-doctype"),
@@ -38,11 +40,11 @@ frappe.pages['activity'].onload = function(wrapper) {
 		}
 	});
 
-	wrapper.page.set_primary_action(__("Refresh"), function() { me.page.list.run(); });
+	this.page.set_primary_action(__("Refresh"), function() { me.page.list.run(); }, "octicon octicon-sync");
 
 	// Build Report Button
 	if(frappe.boot.user.can_get_report.indexOf("Feed")!=-1) {
-		wrapper.page.set_secondary_action(__('Build Report'), function() {
+		this.page.set_secondary_action(__('Build Report'), function() {
 			frappe.set_route('Report', "Feed");
 		}, 'icon-th');
 	}
diff --git a/frappe/public/build.json b/frappe/public/build.json
index e35b2a3776..f73d97f863 100644
--- a/frappe/public/build.json
+++ b/frappe/public/build.json
@@ -32,6 +32,7 @@
 		"public/css/font-awesome.css",
 		"public/css/octicons/octicons.css",
 		"public/css/desk.css",
+		"public/css/mobile.css",
 		"public/css/app_icon.css",
 		"public/css/avatar.css",
 		"public/css/navbar.css",
@@ -108,9 +109,10 @@
 		"public/js/frappe/views/container.js",
 		"public/js/frappe/views/factory.js",
 		"public/js/frappe/views/pageview.js",
-		"public/js/frappe/views/module_section.html",
-		"public/js/frappe/views/module_sidebar.html",
-		"public/js/frappe/views/moduleview.js",
+		"public/js/frappe/views/module/module_title.html",
+		"public/js/frappe/views/module/module_section.html",
+		"public/js/frappe/views/module/module_sidebar.html",
+		"public/js/frappe/views/module/moduleview.js",
 		"public/js/frappe/views/formview.js",
 		"public/js/frappe/views/reportview.js",
 		"public/js/frappe/views/calendar.js",
diff --git a/frappe/public/css/desk.css b/frappe/public/css/desk.css
index 8d780786ee..f2541ec8f4 100644
--- a/frappe/public/css/desk.css
+++ b/frappe/public/css/desk.css
@@ -7,6 +7,9 @@ body {
   margin: 0px;
   padding-top: 44px;
 }
+.page-body {
+  overflow-x: hidden;
+}
 a {
   cursor: pointer;
 }
@@ -21,15 +24,15 @@ a {
   font-size: 12px;
   font-weight: bold;
 }
+.navbar .breadcrumb-divider {
+  margin-top: 8px;
+}
 a.disabled,
 a.disabled:hover {
   color: #888;
   cursor: default;
   text-decoration: none;
 }
-.page-container {
-  padding-bottom: 15px;
-}
 a.grey,
 .sidebar-section a,
 .nav-pills a,
@@ -98,20 +101,17 @@ em.link-option {
   padding: 7px;
   border-radius: 3px;
 }
-@media (max-width: 767px) {
-  .layout-side-section {
-    border-top: 1px solid #d1d8dd;
-  }
-}
 /* page */
 .page-head {
   border-bottom: 1px solid #d1d8dd;
   min-height: 70px;
 }
 .page-title h6 {
-  margin: 0px;
   margin-top: -8px;
 }
+.page-title .title-text {
+  margin-right: 7px;
+}
 .page-actions {
   padding-top: 20px;
   padding-bottom: 20px;
@@ -157,7 +157,7 @@ em.link-option {
   color: #6c7680;
 }
 .indicator::before {
-  margin: 0 4px 0 8px;
+  margin: 0 4px 0 0px;
   content: '';
   display: inline-block;
   height: 8px;
@@ -201,8 +201,9 @@ em.link-option {
   margin-right: 10px;
 }
 .list-row {
-  padding: 7px 15px 10px 15px;
+  padding: 7px 15px;
   border-bottom: 1px solid #d1d8dd;
+  cursor: pointer;
 }
 .list-row:hover,
 .grid-row:hover {
@@ -279,11 +280,17 @@ em.link-option {
 }
 .list-info-row {
   float: left;
-  margin-top: -3px;
+  margin-top: 1px;
 }
-.list-row-right {
-  margin-top: 8px;
-  margin-bottom: -8px;
+.list-row-left {
+  margin-top: 5px;
+}
+.list-row-right .modified {
+  margin-top: 3px;
+}
+.list-row-right .indicator {
+  margin-left: 10px;
+  margin-right: -5px;
 }
 .side-panel {
   border-bottom: 1px solid #d1d8dd;
@@ -302,6 +309,7 @@ em.link-option {
 }
 .module-item h4 {
   margin-bottom: 2px;
+  display: inline-block;
 }
 .module-item .badge {
   margin-top: -2px;
@@ -318,6 +326,9 @@ em.link-option {
   margin-top: 2px;
   display: block !important;
 }
+.module-sidebar-nav {
+  margin-right: -15px;
+}
 .alert-badge {
   margin: 4px 0px;
 }
@@ -579,7 +590,7 @@ ul.linked-with-list li {
 }
 /* form footer */
 .form-footer {
-  padding-bottom: 30px;
+  padding-bottom: 60px;
   /*box-shadow: 0px -1px 6px rgba(0,0,0,0.3);*/
 }
 .form-footer h5 {
diff --git a/frappe/public/css/mobile.css b/frappe/public/css/mobile.css
new file mode 100644
index 0000000000..cb15562795
--- /dev/null
+++ b/frappe/public/css/mobile.css
@@ -0,0 +1,69 @@
+@media (max-width: 767px) {
+  .layout-main > div[class^="col-sm-"],
+  .form-section {
+    padding-left: 0px;
+    padding-right: 0px;
+  }
+  .module-sidebar-nav {
+    margin-right: 0px;
+  }
+  .list-sidebar {
+    padding-left: 15px;
+    padding-right: 15px;
+  }
+  .layout-main-section {
+    border-left: none;
+    border-right: none;
+  }
+  .form-intro-area {
+    padding: 15px 0px;
+  }
+  .form-grid {
+    margin-left: -15px;
+    margin-right: -15px;
+    border-left: none;
+    border-right: none;
+    border-radius: none;
+  }
+  .grid-row-open {
+    top: 0;
+  }
+  .page-title h1 {
+    margin-top: 15px;
+  }
+  .page-actions {
+    padding-top: 15px;
+    padding-bottom: 15px;
+  }
+  .page-title .indicator {
+    display: block;
+    margin-top: 5px;
+    margin-bottom: 3px;
+  }
+  .page-title .sub-heading {
+    float: left;
+  }
+  .page-head {
+    min-height: 1px;
+  }
+  .navbar-brand .octicon-home {
+    margin-top: 4px;
+  }
+  .navbar .breadcrumb-divider {
+    margin-top: 14px;
+  }
+  #navbar-breadcrumbs {
+    margin: 0px;
+  }
+  #navbar-breadcrumbs > li {
+    float: left;
+    display: block;
+  }
+  #navbar-breadcrumbs li:not(:nth-last-child(-n+2)) {
+    display: none;
+  }
+  .mobile-module-icon {
+    padding: 17px 15px 0px;
+    margin-bottom: -15px;
+  }
+}
diff --git a/frappe/public/js/frappe/form/layout.js b/frappe/public/js/frappe/form/layout.js
index 331bd4c289..ed5ea59ffd 100644
--- a/frappe/public/js/frappe/form/layout.js
+++ b/frappe/public/js/frappe/form/layout.js
@@ -98,7 +98,7 @@ frappe.ui.form.Layout = Class.extend({
 		var colspan = cint(12 / this.section.find(".form-column").length);
 		this.section.find(".form-column").removeClass()
 			.addClass("form-column")
-			.addClass("col-md-" + colspan);
+			.addClass("col-sm-" + colspan);
 	},
 	make_field: function(df, colspan) {
 		!this.section && this.make_section();
@@ -160,12 +160,12 @@ frappe.ui.form.Layout = Class.extend({
 		section.df = df;
 		if(df) {
 			if(df.description) {
-				$('<div class="col-md-12 small text-muted">' + __(df.description) + '</div>')
+				$('<div class="col-sm-12 small text-muted">' + __(df.description) + '</div>')
 				.appendTo(this.section);
 			}
 			if(df.label || df.description) {
 				// spacer
-				$('<div class="col-md-12"></div>')
+				$('<div class="col-sm-12"></div>')
 					.appendTo(this.section)
 					.css({"height": "10px"});
 			}
diff --git a/frappe/public/js/frappe/form/toolbar.js b/frappe/public/js/frappe/form/toolbar.js
index 103fb9ca53..0f906e2549 100644
--- a/frappe/public/js/frappe/form/toolbar.js
+++ b/frappe/public/js/frappe/form/toolbar.js
@@ -181,9 +181,9 @@ frappe.ui.form.Toolbar = Class.extend({
 				if(status == "Cancel") {
 					this.page.set_secondary_action(__(status), function() {
 						me.frm.savecancel(this);
-					});
+					}, "octicon octicon-circle-slash");
 				} else {
-					this.page.set_primary_action(__(status), {
+					var click = {
 						"Save": function() {
 							me.frm.save('Save', null, this);
 						},
@@ -196,7 +196,16 @@ frappe.ui.form.Toolbar = Class.extend({
 						"Amend": function() {
 							me.frm.amend_doc();
 						}
-					}[status]);
+					}[status];
+
+					var icon = {
+						"Save": "octicon octicon-check",
+						"Submit": "octicon octicon-lock",
+						"Update": "octicon octicon-check",
+						"Amend": "octicon octicon-split"
+					}[status];
+
+					this.page.set_primary_action(__(status), click, icon);
 				}
 
 				this.current_status = status;
diff --git a/frappe/public/js/frappe/list/doclistview.js b/frappe/public/js/frappe/list/doclistview.js
index 1d7ee10124..d2fe4a897a 100644
--- a/frappe/public/js/frappe/list/doclistview.js
+++ b/frappe/public/js/frappe/list/doclistview.js
@@ -117,7 +117,18 @@ frappe.views.DocListView = frappe.ui.Listing.extend({
 					f[0], f[1], f.slice(2).join(","));
 			});
 			added && me.run();
-		})
+		});
+		this.$page.on("click", ".list-row", function(e) {
+			var checkbox = $(this).find("input[type='checkbox']");
+			var star = $(this).find(".icon-star");
+			if ((checkbox.length && e.target === checkbox.get(0)) || (star.length && e.target===star.get(0))) {
+				return;
+			}
+
+			var link = $(this).find("a.list-id").get(0);
+			window.location.href = link.href;
+			return false;
+		});
 	},
 
 	init_filters: function() {
@@ -291,7 +302,7 @@ frappe.views.DocListView = frappe.ui.Listing.extend({
 
 		this.page.set_secondary_action(__("Refresh"), function() {
 			me.run();
-		});
+		}, "octicon octicon-sync");
 
 		if(this.can_delete || this.listview.settings.selectable) {
 			this.page.add_menu_item(__('Select All'), function() {
diff --git a/frappe/public/js/frappe/list/list_item_row.html b/frappe/public/js/frappe/list/list_item_row.html
index 02cfb81ac5..7aaaa7f1d7 100644
--- a/frappe/public/js/frappe/list/list_item_row.html
+++ b/frappe/public/js/frappe/list/list_item_row.html
@@ -1,34 +1,39 @@
 <div class="row doclist-row">
-    <div class="col-sm-10 col-xs-8">
+    <div class="col-sm-10 col-xs-9 list-row-left">
         {%= main %}
+
+		<div class="text-muted list-info-row small"
+		    style="padding-left: {% if(data._checkbox) { %}55{% } else { %}31{% } %}px;">
+
+		    {% if (data._full_title !== data.name) { %}
+		    <a class="text-muted" href="#Form/{%= data._doctype_encoded %}/{%= data._name_encoded %}">#{%= data.name %}</a>
+		    {% } %}
+
+			{% if (data._tags && data._tags.length) { %}
+		    	<span style="margin-right: 10px;" class="list-tag-preview">
+		            {% for (var i=0, l=data._tags.length; i < l; i++) { %}
+		    		    <span class="label label-info filterable"
+		                    data-filter="_user_tags,like,%{%= data._tags[i] %}%">{%= data._tags[i] %}</span>
+		            {% } %}
+		        </span>
+		    {% } %}
+		</div>
     </div>
-    <div class="col-sm-2 col-xs-4 text-right list-row-right">
-        {% if (data._assign_list.length) { %}
-    		<span class="filterable"
-                data-filter="_assign,like,%{%= data._assign_list[data._assign_list.length - 1] %}%">
-    			{%= frappe.avatar(data._assign_list[data._assign_list.length - 1]) %}</span>
-        {% } else { %}
-            <span class="avatar avatar-small avatar-empty"></span>
-        {% } %}
-    	<span class="h6 {% if(!data._comments_list.length) { %}text-extra-muted{% } %}">
-    		<i class="octicon octicon-comment-discussion"></i>
-                {%= data._comments_list.length || 0 %}
-        </span>
+    <div class="col-sm-2 col-xs-3 text-right list-row-right">
+		<div class="visible-xs pull-right">{%= me.get_indicator_dot(data) %}</div>
+		<div class="pull-right">
+	        {% if (data._assign_list.length) { %}
+	    		<span class="filterable"
+	                data-filter="_assign,like,%{%= data._assign_list[data._assign_list.length - 1] %}%">
+	    			{%= frappe.avatar(data._assign_list[data._assign_list.length - 1]) %}</span>
+	        {% } else { %}
+	            <span class="avatar avatar-small avatar-empty"></span>
+	        {% } %}
+	    	<span class="h6 {% if(!data._comments_list.length) { %}text-extra-muted{% } %}">
+	    		<i class="octicon octicon-comment-discussion"></i>
+	                {%= data._comments_list.length || 0 %}
+	        </span>
+			<div class="text-muted small modified">{%= comment_when(data.modified) %}</div>
+		</div>
     </div>
 </div>
-<div class="text-muted list-info-row small"
-    style="padding-left: {% if(data._checkbox) { %}55{% } else { %}31{% } %}px;">
-    {% if (data._full_title !== data.name) { %}
-    <a class="text-muted" href="#Form/{%= data._doctype_encoded %}/{%= data._name_encoded %}">#{%= data.name %}</a>
-    {% } %}
-    {%= comment_when(data.modified) %}
-    {% if (data._tags && data._tags.length) { %}
-    	<span style="margin-right: 10px;" class="list-tag-preview">
-            {% for (var i=0, l=data._tags.length; i < l; i++) { %}
-    		    <span class="label label-info filterable"
-                    data-filter="_user_tags,like,%{%= data._tags[i] %}%">{%= data._tags[i] %}</span>
-            {% } %}
-        </span>
-    {% } %}
-</div>
-<div class="clearfix"></div>
diff --git a/frappe/public/js/frappe/list/list_item_standard.html b/frappe/public/js/frappe/list/list_item_standard.html
index da3947f603..5a011812b3 100644
--- a/frappe/public/js/frappe/list/list_item_standard.html
+++ b/frappe/public/js/frappe/list/list_item_standard.html
@@ -3,7 +3,17 @@
         var col = columns[i], value=data[col.fieldname]; total_cols += parseInt(col.colspan); %}
         {% if (total_cols <= 12) { %}
         <div class="col-sm-{%= col.colspan %} text-ellipsis
-            {% if(col.type==="Subject") { %}col-xs-12{% } else { %}hidden-xs{% } %}"
+            {% if(col.type==="Subject") {
+				if (right_column) { %}
+					col-xs-9
+				{% } else { %}
+					col-xs-12
+				{% } %}
+			{% } else if(right_column && col.fieldname===right_column) { %}
+				col-xs-3
+			{% } else { %}
+				hidden-xs
+			{% } %}"
             {% if(col.title) { %}title="{%= col.title + ": " + value %}"{% } %}>
             {% if (col.type==="Subject") { %}
                 {%= subject %}
diff --git a/frappe/public/js/frappe/list/list_sidebar.html b/frappe/public/js/frappe/list/list_sidebar.html
index 0c2f4655cd..0fc995f06c 100644
--- a/frappe/public/js/frappe/list/list_sidebar.html
+++ b/frappe/public/js/frappe/list/list_sidebar.html
@@ -1,4 +1,4 @@
-<div class="list-sidebar">
+<div class="list-sidebar hidden-xs">
     <div class="sidebar-section">
         <ul class="user-actions list-unstyled hide">
         </ul>
diff --git a/frappe/public/js/frappe/list/listview.js b/frappe/public/js/frappe/list/listview.js
index f3f6d21395..30650bed1f 100644
--- a/frappe/public/js/frappe/list/listview.js
+++ b/frappe/public/js/frappe/list/listview.js
@@ -202,15 +202,17 @@ frappe.views.ListView = Class.extend({
 				list: this
 			});
 		} else {
+			console.log(this);
 			var main = frappe.render_template("list_item_standard", {
 				data: data,
 				columns: this.columns,
 				subject: this.get_avatar_and_id(data, true),
-				me: this
+				me: this,
+				right_column: this.settings.right_column
 			});
 		}
 
-		$(frappe.render_template("list_item_row", {data: data, main: main})).appendTo(row);
+		$(frappe.render_template("list_item_row", {data: data, main: main, me: this})).appendTo(row);
 
 		this.render_tags(row, data);
 
@@ -257,6 +259,14 @@ frappe.views.ListView = Class.extend({
 			+indicator[2]+'">'+indicator[0]+'<span>';
 	},
 
+	get_indicator_dot: function(doc) {
+		var indicator = frappe.get_indicator(doc, this.doctype);
+		if (!indicator) {
+			return "";
+		}
+		return '<span class="indicator '+indicator[1]+'" title="'+indicator[0]+'"></span>';
+	},
+
 	prepare_data: function(data) {
 		if(data.modified)
 			this.prepare_when(data, data.modified);
diff --git a/frappe/public/js/frappe/ui/filters.js b/frappe/public/js/frappe/ui/filters.js
index 81363d041d..256f3158b4 100644
--- a/frappe/public/js/frappe/ui/filters.js
+++ b/frappe/public/js/frappe/ui/filters.js
@@ -205,9 +205,8 @@ frappe.ui.Filter = Class.extend({
 		} : {}
 
 		var original_docfield = me.fieldselect.fields_by_name[doctype][fieldname];
-
 		if(!original_docfield) {
-			msgprint(__("Field {0} is not selectable.", [df.label]));
+			msgprint(__("Field {0} is not selectable.", [fieldname]));
 			return;
 		}
 
diff --git a/frappe/public/js/frappe/ui/listing.js b/frappe/public/js/frappe/ui/listing.js
index eb260dca6c..eb2bf535b2 100644
--- a/frappe/public/js/frappe/ui/listing.js
+++ b/frappe/public/js/frappe/ui/listing.js
@@ -110,7 +110,7 @@ frappe.ui.Listing = Class.extend({
 		// new
 		if(this.new_doctype) {
 			var make_new_doc = function() { (me.custom_new_doc || me.make_new_doc).apply(me, [me.new_doctype]); };
-			this.page.set_primary_action(__("New"), function() { make_new_doc(); });
+			this.page.set_primary_action(__("New"), function() { make_new_doc(); }, "octicon octicon-plus");
 		}
 
 		if(me.no_toolbar || me.hide_toolbar) {
diff --git a/frappe/public/js/frappe/ui/page.html b/frappe/public/js/frappe/ui/page.html
index 613bfd4511..8b5caa3ea2 100644
--- a/frappe/public/js/frappe/ui/page.html
+++ b/frappe/public/js/frappe/ui/page.html
@@ -1,19 +1,20 @@
 <div class="page-head">
 	<div class="container">
 		<div class="row">
-			<div class="page-title col-sm-8">
-                <h1>
+			<div class="page-title col-sm-8 col-xs-7">
+                <h1 class="text-ellipsis">
                     <span class="title-text"></span>
                     <span class="indicator hide"></span>
                 </h1>
-                <h6 class="hide text-extra-muted"></h6>
+                <h6 class="sub-heading hide text-extra-muted"></h6>
 			</div>
-			<div class="page-actions text-right col-sm-4">
-                <span class="page-icon-group hide"></span>
+			<div class="page-actions text-right col-sm-4 col-xs-5">
+                <span class="page-icon-group hide hidden-xs"></span>
                 <div class="btn-group menu-btn-group hide">
                     <button type="button" class="btn btn-default btn-sm dropdown-toggle"
                         data-toggle="dropdown" aria-expanded="false">
-                    {%= __("Menu") %} <span class="caret"></span>
+                    <span class="hidden-xs">{%= __("Menu") %} <span class="caret"></span></span>
+					<span class="visible-xs"><i class="octicon octicon-three-bars"></i></span>
                     </button>
                     <ul class="dropdown-menu" role="menu">
                     </ul>
@@ -32,7 +33,7 @@
 		</div>
 	</div>
 </div>
-<div class="page-body container">
+<div class="container page-body">
 	<div class="page-toolbar hide">
 		<div class="container">
 		</div>
diff --git a/frappe/public/js/frappe/ui/page.js b/frappe/public/js/frappe/ui/page.js
index 9c295471cb..599ee73c12 100644
--- a/frappe/public/js/frappe/ui/page.js
+++ b/frappe/public/js/frappe/ui/page.js
@@ -38,7 +38,10 @@ frappe.ui.Page = Class.extend({
 		$(frappe.render_template("page", {})).appendTo(this.wrapper);
 
 		if(this.single_column) {
-			this.add_view("main", '<div class="layout-main layout-main-section">');
+			// nesting under col-sm-12 for consistency
+			this.add_view("main", '<div class="row layout-main">\
+					<div class="col-sm-12"><div class="layout-main-section"></div></div>\
+				</div>');
 		} else {
 			var main = this.add_view("main", '<div class="row layout-main">\
 				<div class="col-sm-2 layout-side-section"></div>\
@@ -94,11 +97,23 @@ frappe.ui.Page = Class.extend({
 		return this.indicator.removeClass().addClass("indicator hide");
 	},
 
-	set_primary_action: function(label, click) {
+	get_icon_label: function(icon, label) {
+		return '<i class="visible-xs ' + icon + '"></i><span class="hidden-xs">' + label + '</span>'
+	},
+
+	set_primary_action: function(label, click, icon) {
+		if (icon) {
+			label = this.get_icon_label(icon, label);
+		}
+
 		this.btn_primary.removeClass("hide").prop("disabled", false).html(label).on("click", click);
 	},
 
-	set_secondary_action: function(label, click) {
+	set_secondary_action: function(label, click, icon) {
+		if (icon) {
+			label = this.get_icon_label(icon, label);
+		}
+
 		this.btn_secondary.removeClass("hide").prop("disabled", false).html(label).on("click", click);
 	},
 
@@ -189,7 +204,7 @@ frappe.ui.Page = Class.extend({
 		this.title = txt;
 		document.title = txt.replace(/<[^>]*>/g, "");
 		if(icon) {
-			txt = '<span class="'+ icon +' text-muted" style="font-size: 24px;"></span> ' + txt;
+			txt = '<span class="'+ icon +' text-muted" style="font-size: inherit;"></span> ' + txt;
 		}
 		this.$title_area.find(".title-text").html(txt);
 	},
diff --git a/frappe/public/js/frappe/ui/toolbar/navbar.html b/frappe/public/js/frappe/ui/toolbar/navbar.html
index 009fb58d16..7c3bbe3ed0 100644
--- a/frappe/public/js/frappe/ui/toolbar/navbar.html
+++ b/frappe/public/js/frappe/ui/toolbar/navbar.html
@@ -7,11 +7,14 @@
 				<span class="icon-bar"></span>
 				<span class="icon-bar"></span>
 			</button>
-			<a class="navbar-brand" href="#">Home</a>
-		</div>
-		<div class="collapse navbar-collapse navbar-responsive-collapse">
+			<a class="navbar-brand" href="#">
+				<i class="octicon octicon-home visible-xs"></i>
+				<span class="hidden-xs">Home</span>
+			</a>
 			<ul class="nav navbar-nav navbar-left" id="navbar-breadcrumbs">
 			</ul>
+		</div>
+		<div class="collapse navbar-collapse navbar-responsive-collapse">
 			<ul class="nav navbar-nav navbar-right">
 				<li class="dropdown">
 					<a class="dropdown-toggle" data-toggle="dropdown" href="#"
diff --git a/frappe/public/js/frappe/views/container.js b/frappe/public/js/frappe/views/container.js
index 5672dd2761..4b8fddcd3d 100644
--- a/frappe/public/js/frappe/views/container.js
+++ b/frappe/public/js/frappe/views/container.js
@@ -83,7 +83,10 @@ frappe.views.Container = Class.extend({
 		if(!breadcrumbs) return;
 
 		var divider = function() {
-			$('<li style="padding: 8px 0px" class="hidden-xs"><i class="icon-chevron-right text-muted"></i></li>').appendTo($breadcrumbs);
+			$('<li class="breadcrumb-divider">\
+				<i class="icon-chevron-right hidden-xs text-muted"></i>\
+				<i class="icon-chevron-left visible-xs text-muted"></i>\
+			</li>').appendTo($breadcrumbs);
 		}
 
 		if(breadcrumbs.module && breadcrumbs.module != "Desk") {
diff --git a/frappe/public/js/frappe/views/module/module_section.html b/frappe/public/js/frappe/views/module/module_section.html
new file mode 100644
index 0000000000..395ea5b4a6
--- /dev/null
+++ b/frappe/public/js/frappe/views/module/module_section.html
@@ -0,0 +1,24 @@
+<div class="module-section">
+	{% for(var i=0, j= data.items.length; i < j; i++) { var item = data.items[i]; %}
+	<div class="row module-item" data-item-index={%= i %}>
+		{% if (item.description) { %}
+		<div class="col-xs-8">
+			<h4>{%= item.label || item.name %}</h4>
+			{% if (item.type==="doctype") { %}
+			<span class="open-notification hide" data-doctype="{%= item.name %}"></span>
+			{% } %}
+			<p class="text-muted small">{%= item.description %}</p>
+		</div>
+		<div class="col-xs-4 text-muted text-right small" style="padding-top: 5px;">
+			{% if (item.last_modified) { %}
+			{%= comment_when(item.last_modified) %}
+			{% } %}
+		</div>
+		{% } else { %}
+		<div class="col-xs-12">
+			<h5>{%= item.label || item.name %}</h5>
+		</div>
+		{% } %}
+	</div>
+	{% } %}
+</div>
diff --git a/frappe/public/js/frappe/views/module_sidebar.html b/frappe/public/js/frappe/views/module/module_sidebar.html
similarity index 83%
rename from frappe/public/js/frappe/views/module_sidebar.html
rename to frappe/public/js/frappe/views/module/module_sidebar.html
index 61d0372468..58cd2c7c01 100644
--- a/frappe/public/js/frappe/views/module_sidebar.html
+++ b/frappe/public/js/frappe/views/module/module_sidebar.html
@@ -1,4 +1,4 @@
-<ul class="nav nav-pills nav-stacked" style="margin-right: -15px;">
+<ul class="nav nav-pills nav-stacked module-sidebar-nav hidden-xs">
     {% for (var i=0, l= data.data.length; i < l; i++) { var item = data.data[i]; %}
     <li data-label="{%= item.label %}" class="h6 module-sidebar-item">
         <a class="module-link">
diff --git a/frappe/public/js/frappe/views/module/module_title.html b/frappe/public/js/frappe/views/module/module_title.html
new file mode 100644
index 0000000000..53e9c90665
--- /dev/null
+++ b/frappe/public/js/frappe/views/module/module_title.html
@@ -0,0 +1,20 @@
+<div class="mobile-module-icon pull-right small visible-xs">{%= title %}</div>
+<div class="mobile-title col-sm-8 col-xs-7 visible-xs">
+	<div class="dropdown">
+		<h2 class="dropdown-toggle" id="dropdownMenu1" data-toggle="dropdown" aria-expanded="true"
+			style="cursor: pointer; margin: 15px 0px;">
+			<span class="active-section">{%= section_name %}</span>
+			<span class="caret"></span>
+		</h2>
+		<ul class="dropdown-menu" role="menu" aria-labelledby="ModuleSections">
+			{% for (var i=0, l= data.data.length; i < l; i++) {
+				var item = data.data[i];
+				if (item.label !== section_name) { %}
+					<li role="presentation" data-label="{%= item.label %}">
+						<a role="menuitem" tabindex="-1" class="module-link">{%= item.label %}</a>
+					</li>
+				{% }
+			} %}
+		</ul>
+	</div>
+</div>
diff --git a/frappe/public/js/frappe/views/moduleview.js b/frappe/public/js/frappe/views/module/moduleview.js
similarity index 88%
rename from frappe/public/js/frappe/views/moduleview.js
rename to frappe/public/js/frappe/views/module/moduleview.js
index 941eba1f84..d0c8fee439 100644
--- a/frappe/public/js/frappe/views/moduleview.js
+++ b/frappe/public/js/frappe/views/module/moduleview.js
@@ -95,11 +95,22 @@ frappe.views.moduleview.ModuleView = Class.extend({
 		this.activate(this.data.data[0].label);
 	},
 
-	make_sidebar: function() {
+	make_title: function(name) {
+		this.page_title = this.page.wrapper.find(".page-title").addClass("hidden-xs");
+		this.page.wrapper.find(".mobile-title, .mobile-module-icon").remove();
+
+		$(frappe.render_template("module_title", {
+			title: this.page_title.find("h1").html(),
+			section_name: name,
+			data: this.data
+		})).insertAfter(this.page_title);
+	},
+
+	make_sidebar: function(name) {
 		var me = this;
 		$(frappe.render_template("module_sidebar", {data:this.data})).appendTo(this.page.sidebar);
 
-		this.page.sidebar.find(".module-link").on("click", function() {
+		this.page.wrapper.on("click", ".module-link", function() {
 			me.activate($(this).parent().attr("data-label"));
 		});
 	},
@@ -127,6 +138,9 @@ frappe.views.moduleview.ModuleView = Class.extend({
 		this.page.sidebar.find("li.active").removeClass("active");
 		this.page.sidebar.find('[data-label="'+ name +'"]').addClass("active");
 
+		// make mobile title
+		this.make_title(name);
+
 		frappe.app.update_notification_count_in_modules();
 	},
 
diff --git a/frappe/public/js/frappe/views/module_section.html b/frappe/public/js/frappe/views/module_section.html
deleted file mode 100644
index d7bfe23720..0000000000
--- a/frappe/public/js/frappe/views/module_section.html
+++ /dev/null
@@ -1,24 +0,0 @@
-<div class="module-section">
-    {% for(var i=0, j= data.items.length; i < j; i++) { var item = data.items[i]; %}
-    <div class="row module-item" data-item-index={%= i %}>
-        <div class="col-md-9">
-            {% if (item.description) { %}<h4>{% } else { %}<h5>{% } %}
-            {%= item.label || item.name %}
-            {% if (item.type==="doctype") { %}
-            <span class="open-notification hide"
-                data-doctype="{%= item.name %}">
-            </span>
-            {% } %}
-            {% if (item.description) { %}
-                </h4>
-                <p class="text-muted small">{%= item.description %}</p>
-            {% } else { %}</h5>{% } %}
-        </div>
-        <div class="col-md-3 text-muted text-right small" style="padding-top: 5px;">
-            {% if (item.last_modified) { %}
-            {%= comment_when(item.last_modified) %}
-            {% } %}
-        </div>
-    </div>
-    {% } %}
-</div>
diff --git a/frappe/public/less/desk.less b/frappe/public/less/desk.less
index 69681343f1..161b580325 100644
--- a/frappe/public/less/desk.less
+++ b/frappe/public/less/desk.less
@@ -11,6 +11,10 @@ body {
 	padding-top: 44px;
 }
 
+.page-body {
+	overflow-x: hidden;
+}
+
 a {
 	cursor: pointer;
 }
@@ -23,20 +27,25 @@ a {
 .navbar-brand {
 	font-size: inherit;
 }
+
 .navbar a {
 	font-size: 12px;
 	font-weight: bold;
 }
 
+.navbar .breadcrumb-divider {
+	margin-top: 8px;
+}
+
 a.disabled, a.disabled:hover {
 	color: #888;
 	cursor: default;
 	text-decoration: none;
 }
 
-.page-container {
-	padding-bottom: 15px;
-}
+// .page-container {
+// 	padding-bottom: 15px;
+// }
 
 a.grey, .sidebar-section a, .nav-pills a, .control-value a, .data-row a {
 	color: inherit;
@@ -111,12 +120,6 @@ em.link-option {
 	border-radius: 3px;
 }
 
-@media (max-width: 767px) {
-	.layout-side-section {
-		border-top: 1px solid @border-color;
-	}
-}
-
 /* page */
 
 .page-head {
@@ -125,10 +128,13 @@ em.link-option {
 }
 
 .page-title h6 {
-	margin: 0px;
 	margin-top: -8px;
 }
 
+.page-title .title-text {
+	margin-right: 7px;
+}
+
 .page-actions {
 	padding-top: 20px;
 	padding-bottom: 20px;
@@ -184,7 +190,7 @@ em.link-option {
     color:#6c7680;
 }
 .indicator::before {
-    margin:0 4px 0 8px;
+    margin:0 4px 0 0px;
     content:'';
     display:inline-block;
     height:8px;
@@ -237,8 +243,9 @@ em.link-option {
 }
 
 .list-row {
-	padding: 7px 15px 10px 15px;
+	padding: 7px 15px;
 	border-bottom: 1px solid @border-color;
+	cursor: pointer;
 }
 
 .list-row:hover, .grid-row:hover {
@@ -332,12 +339,20 @@ em.link-option {
 
 .list-info-row {
 	float: left;
-	margin-top: -3px;
+	margin-top: 1px;
 }
 
-.list-row-right {
-	margin-top: 8px;
-	margin-bottom: -8px;
+.list-row-left {
+	margin-top: 5px;
+}
+
+.list-row-right .modified {
+	margin-top: 3px;
+}
+
+.list-row-right .indicator {
+	margin-left: 10px;
+	margin-right: -5px;
 }
 
 .side-panel {
@@ -361,6 +376,7 @@ em.link-option {
 
 .module-item h4 {
 	margin-bottom: 2px;
+	display: inline-block;
 }
 
 .module-item .badge {
@@ -381,6 +397,10 @@ em.link-option {
 	display: block !important;
 }
 
+.module-sidebar-nav {
+	margin-right: -15px;
+}
+
 .alert-badge {
 	margin: 4px 0px;
 }
@@ -704,7 +724,7 @@ ul.linked-with-list li {
 /* form footer */
 
 .form-footer {
-	padding-bottom: 30px;
+	padding-bottom: 60px;
 	/*box-shadow: 0px -1px 6px rgba(0,0,0,0.3);*/
 }
 
@@ -982,3 +1002,4 @@ th.fc-widget-header {
 .padding {
 	padding: 15px;
 }
+
diff --git a/frappe/public/less/mobile.less b/frappe/public/less/mobile.less
new file mode 100644
index 0000000000..9bfb844f8d
--- /dev/null
+++ b/frappe/public/less/mobile.less
@@ -0,0 +1,88 @@
+@media (max-width: 767px) {
+	.layout-main > div[class^="col-sm-"],
+	.form-section {
+		padding-left: 0px;
+		padding-right: 0px;
+	}
+
+	.module-sidebar-nav {
+		margin-right: 0px;
+	}
+
+	.list-sidebar {
+		padding-left: 15px;
+		padding-right: 15px;
+	}
+
+	.layout-main-section {
+		border-left: none;
+		border-right: none;
+	}
+
+	.form-intro-area {
+		padding: 15px 0px;
+	}
+
+	.form-grid {
+		margin-left: -15px;
+		margin-right: -15px;
+		border-left: none;
+		border-right: none;
+		border-radius: none;
+	}
+
+	.grid-row-open {
+		top: 0;
+	}
+
+	.page-title h1 {
+		margin-top: 15px;
+	}
+
+	.page-actions {
+		padding-top: 15px;
+		padding-bottom: 15px;
+	}
+
+	.page-title .indicator {
+		display: block;
+		margin-top: 5px;
+		margin-bottom: 3px;
+	}
+
+	.page-title .sub-heading {
+		float: left;
+	}
+
+	.page-head {
+		min-height: 1px;
+	}
+
+	// navbar & breadcrumbs
+	.navbar-brand .octicon-home {
+		margin-top: 4px;
+	}
+
+	.navbar .breadcrumb-divider {
+		margin-top: 14px;
+	}
+
+	#navbar-breadcrumbs {
+		margin: 0px;
+	}
+
+	#navbar-breadcrumbs > li {
+		float: left;
+		display: block;
+	}
+
+	// select all except last 2
+	#navbar-breadcrumbs li:not(:nth-last-child(-n+2)) {
+		display: none;
+	}
+
+	.mobile-module-icon {
+		padding: 17px 15px 0px;
+		margin-bottom: -15px;
+	}
+}