diff --git a/accounts/page/accounts_browser/accounts_browser.html b/accounts/page/accounts_browser/accounts_browser.html
index 91a1e26..0107930 100644
--- a/accounts/page/accounts_browser/accounts_browser.html
+++ b/accounts/page/accounts_browser/accounts_browser.html
@@ -1,4 +1,4 @@
-<div class="layout-wrapper layout-wrapper-background">
+<div class="appframe col-span-12">
 	<div class="appframe-area"></div>
 	<div class="layout-main">
 		<div class="tree-area"></div>
diff --git a/accounts/page/accounts_browser/accounts_browser.js b/accounts/page/accounts_browser/accounts_browser.js
index 2e8cc82..ede10e6 100644
--- a/accounts/page/accounts_browser/accounts_browser.js
+++ b/accounts/page/accounts_browser/accounts_browser.js
@@ -23,7 +23,7 @@
 pscript['onload_Accounts Browser'] = function(wrapper){
 	wrapper.appframe = new wn.ui.AppFrame($(wrapper).find('.appframe-area'));
 	wrapper.appframe.add_home_breadcrumb()
-	wrapper.appframe.add_module_breadcrumb("Accounts")
+	wrapper.appframe.add_module_icon("Accounts")
 	
 	if (wn.boot.profile.can_create.indexOf("Company") !== -1) {
 		wrapper.appframe.add_button('New Company', function() { newdoc('Company'); },
diff --git a/accounts/page/financial_analytics/financial_analytics.js b/accounts/page/financial_analytics/financial_analytics.js
index f714549..aac7076 100644
--- a/accounts/page/financial_analytics/financial_analytics.js
+++ b/accounts/page/financial_analytics/financial_analytics.js
@@ -25,7 +25,7 @@
 	erpnext.trial_balance = new erpnext.FinancialAnalytics(wrapper, 'Financial Analytics');
 	
 	wrapper.appframe.add_home_breadcrumb()
-	wrapper.appframe.add_module_breadcrumb("Accounts")
+	wrapper.appframe.add_module_icon("Accounts")
 	wrapper.appframe.add_breadcrumb("icon-bar-chart")
 }
 
diff --git a/accounts/page/financial_statements/financial_statements.html b/accounts/page/financial_statements/financial_statements.html
index e6735fa..c68ab1a 100644
--- a/accounts/page/financial_statements/financial_statements.html
+++ b/accounts/page/financial_statements/financial_statements.html
@@ -1,28 +1,5 @@
-<div class="layout_wrapper">
+<div class="appframe col-span-12">
 <div id="fs_header"></div>
-<!--  table.statement td {    vertical-align: middle;  }  table.statement td select {    width: 100px;  }  table.stmt_table {    table-layout: fixed;    border-collapse: collapse;  }  table.stmt_table td {    vertical-align: middle;    padding: 2px;  }  td.stmt_level0 {    font-weight: bold;    font-size: 14px;    border-bottom: 1px solid #AAA;  }  td.stmt_level1 {    font-weight: bold;    font-size: 12px;  }  td.stmt_level2 {    font-size: 11px;  }  td.stmt_level3 {    font-size: 11px;  }  td.stmt_level4 {    font-size: 12px;    font-weight: bold;    border-bottom: 1px solid #000;  }  td.stmt_level5 {    color: BLUE;    font-size: 11px;  }  --> <!--
-<div style="border: 1px solid #cccccc; padding: 4px; margin-top: 8px; background-color: #eeeeee; width: 98%;">
-<table class="statement" border="0" cellspacing="2px">
-<tbody>
-<tr>
-<td>Statement:</td>
-<td style="padding-right: 8px;" mce_style="padding-right: 8px;"><select id="stmt_type"></select></td>
-<td>Company:</td>
-<td style="padding-right: 8px;" mce_style="padding-right: 8px;"><select id="stmt_company"></select></td>
-<td>Period Type:</td>
-<td style="padding-right: 8px;" mce_style="padding-right: 8px;"><select id="stmt_period"></select></td>
-<td>Fiscal Year:</td>
-<td style="padding-right: 8px;" mce_style="padding-right: 8px;"><select id="stmt_fiscal_year"></select></td>
-<td style="padding-right: 8px;" mce_style="padding-right: 8px;">
-<div id="stmt_new"></div>
-</td>
-</tr>
-</tbody>
-</table>
-</div>
---> <!--
-<div style="margin:10px 0px 10px 0px" mce_style="margin:10px 0px 10px 0px"><button class="button" onclick="pscript.print_statement();">Print</button></div>
--->
 <div id="print_html">
 	<div id="stmt_title1" style="margin:16px 0px 4px 0px; font-size: 16px; font-weight: bold; color: #888;"></div>
 	<div id="stmt_title2" style="margin:0px 0px 8px 0px; font-size: 16px; font-weight: bold;"></div>
diff --git a/accounts/page/general_ledger/general_ledger.js b/accounts/page/general_ledger/general_ledger.js
index a462b70..6a7d604 100644
--- a/accounts/page/general_ledger/general_ledger.js
+++ b/accounts/page/general_ledger/general_ledger.js
@@ -24,7 +24,7 @@
 	erpnext.general_ledger = new erpnext.GeneralLedger(wrapper);
 	
 	wrapper.appframe.add_home_breadcrumb()
-	wrapper.appframe.add_module_breadcrumb("Accounts")
+	wrapper.appframe.add_module_icon("Accounts")
 	wrapper.appframe.add_breadcrumb("icon-bar-chart")
 
 }
diff --git a/accounts/page/trial_balance/trial_balance.js b/accounts/page/trial_balance/trial_balance.js
index c64075f..9c4c50a 100644
--- a/accounts/page/trial_balance/trial_balance.js
+++ b/accounts/page/trial_balance/trial_balance.js
@@ -59,6 +59,6 @@
 	erpnext.trial_balance = new TrialBalance(wrapper, 'Trial Balance');
 	
 	wrapper.appframe.add_home_breadcrumb()
-	wrapper.appframe.add_module_breadcrumb("Accounts")
+	wrapper.appframe.add_module_icon("Accounts")
 	wrapper.appframe.add_breadcrumb("icon-bar-chart")
 }
\ No newline at end of file
diff --git a/buying/page/purchase_analytics/purchase_analytics.js b/buying/page/purchase_analytics/purchase_analytics.js
index fc082ea..857a335 100644
--- a/buying/page/purchase_analytics/purchase_analytics.js
+++ b/buying/page/purchase_analytics/purchase_analytics.js
@@ -24,7 +24,7 @@
 	new erpnext.PurchaseAnalytics(wrapper);
 	
 	wrapper.appframe.add_home_breadcrumb()
-	wrapper.appframe.add_module_breadcrumb("Buying")
+	wrapper.appframe.add_module_icon("Buying")
 	wrapper.appframe.add_breadcrumb("icon-bar-chart")
 }
 
diff --git a/home/page/activity/activity.html b/home/page/activity/activity.html
index 9fb910c..ac369c3 100644
--- a/home/page/activity/activity.html
+++ b/home/page/activity/activity.html
@@ -1,4 +1,4 @@
-<div class="layout-wrapper layout-wrapper-appframe">
+<div class="appframe col-span-12">
 	<div class="layout-appframe"></div>
 	<div class="layout-main">
 		<div id="activity-list">
diff --git a/home/page/attributions/attributions.html b/home/page/attributions/attributions.html
index 99deea4..3b35283 100644
--- a/home/page/attributions/attributions.html
+++ b/home/page/attributions/attributions.html
@@ -1,4 +1,4 @@
-<div class="layout-wrapper layout-wrapper-appframe layout-attributions">
+<div class="appframe col-span-12 layout-attributions">
 	<div class="layout-appframe"></div>
 	<div class="layout-main">
 	<h3>ERPNext is made using these Awesome Open Source Projects <i class="icon-heart" style="color: red"></i></h3>
diff --git a/hr/doctype/job_applicant/job_applicant.js b/hr/doctype/job_applicant/job_applicant.js
index c301250..220ff18 100644
--- a/hr/doctype/job_applicant/job_applicant.js
+++ b/hr/doctype/job_applicant/job_applicant.js
@@ -3,7 +3,7 @@
 cur_frm.cscript = {
 	onload: function(doc, dt, dn) {
 		if(in_list(user_roles,'System Manager')) {
-			cur_frm.page_layout.footer.help_area.innerHTML = '<hr>\
+			cur_frm.footer.help_area.innerHTML = '<hr>\
 				<p><a href="#Form/Jobs Email Settings">Jobs Email Settings</a><br>\
 				<span class="help">Automatically extract Job Applicants from a mail box e.g. "jobs@example.com"</span></p>';
 		}
diff --git a/public/js/conf.js b/public/js/conf.js
index 522de0a..de8c7f7 100644
--- a/public/js/conf.js
+++ b/public/js/conf.js
@@ -15,7 +15,7 @@
 
 // add toolbar icon
 $(document).bind('toolbar_setup', function() {
-	$('.brand').html((wn.boot.website_settings.brand_html || 'erpnext') +
+	$('.navbar-brand').html((wn.boot.website_settings.brand_html || 'erpnext') +
 	' <i class="icon-home icon-white navbar-icon-home" ></i>')
 	.css('max-width', '200px').css('overflow', 'hidden')
 	.hover(function() {
diff --git a/public/js/startup.css b/public/js/startup.css
index 88ebedd..bfcbe84 100644
--- a/public/js/startup.css
+++ b/public/js/startup.css
@@ -4,7 +4,6 @@
 
 body {
 	font-family: Arial, Helvetica, sans-serif;
-	font-size: 13px;
 }
 
 span, div, td, input, textarea, button, select {
diff --git a/public/js/toolbar.js b/public/js/toolbar.js
index 03d7d0a..1d3d1e7 100644
--- a/public/js/toolbar.js
+++ b/public/js/toolbar.js
@@ -18,75 +18,26 @@
 wn.provide('erpnext.toolbar');
 
 erpnext.toolbar.setup = function() {
-	// modules 
-	erpnext.toolbar.add_modules();
-	
 	// profile
-	$('#toolbar-user').append('<li><a href="#Form/Profile/'+user+'">'
+	var $user = $('#toolbar-user');
+	$user.append('<li><a href="#Form/Profile/'+user+'">'
 		+wn._("My Settings")+'...</a></li>');
+	$user.append('<li class="divider"></li>');
+	$user.append('<li><a href="https://erpnext.com/manual" target="_blank">'
+		+wn._('Documentation')+'</a></li>')
+	$user.append('<li><a href="http://groups.google.com/group/erpnext-user-forum" target="_blank">'
+		+wn._('Forum')+'</a></li>')
+	$user.append('<li><a href="http://www.providesupport.com?messenger=iwebnotes" target="_blank">\
+		'+wn._('Live Chat')+'</a></li>')
+	
 
 	$('.navbar .pull-right').append('\
 		<li><a href="#!messages" title="'+wn._('Unread Messages')
 			+'"><span class="navbar-new-comments"></span></a></li>');
 
-	// help
-	$('.navbar .pull-right').prepend('<li class="dropdown">\
-		<a class="dropdown-toggle" data-toggle="dropdown" href="#" \
-			onclick="return false;">'+wn._('Help')+'<b class="caret"></b></a>\
-		<ul class="dropdown-menu" id="toolbar-help">\
-		</ul></li>')
-
-	$('#toolbar-help').append('<li><a href="https://erpnext.com/manual" target="_blank">'
-		+wn._('Documentation')+'</a></li>')
-
-	$('#toolbar-help').append('<li><a href="http://groups.google.com/group/erpnext-user-forum" target="_blank">'
-		+wn._('Forum')+'</a></li>')
-
-	$('#toolbar-help').append('<li><a href="http://www.providesupport.com?messenger=iwebnotes" target="_blank">\
-		'+wn._('Live Chat')+'</a></li>')
-
 	erpnext.toolbar.set_new_comments();
 }
 
-erpnext.toolbar.add_modules = function() {
-	$('<li class="dropdown">\
-		<a class="dropdown-toggle" data-toggle="dropdown" href="#"\
-			title="'+wn._("Modules")+'"\
-			onclick="return false;"><i class="icon-th"></i></a>\
-		<ul class="dropdown-menu modules">\
-		</ul>\
-		</li>').prependTo('.navbar .nav:first');
-	
-	var modules_list = wn.user.get_desktop_items().sort();
-	
-	var _get_list_item = function(m) {
-		args = {
-			module: m,
-			module_page: wn.modules[m].link,
-			module_label: wn._(wn.modules[m].label || m),
-			icon: wn.modules[m].icon
-		}
-		
-		return repl('<li><a href="#!%(module_page)s" \
-			data-module="%(module)s"><i class="%(icon)s" style="display: inline-block; \
-				width: 21px; margin-top: -2px; margin-left: -7px;"></i>\
-			%(module_label)s</a></li>', args);
-	}
-
-	// add to dropdown
-	$.each(modules_list,function(i, m) {
-		if(m!='Setup') {
-			$('.navbar .modules').append(_get_list_item(m));			
-		}
-	})
-	
-	// setup for system manager
-	if(user_roles.indexOf("System Manager")!=-1) {
-		$('.navbar .modules').append('<li class="divider">' + _get_list_item("Setup"));
-	}
-	
-}
-
 erpnext.toolbar.set_new_comments = function(new_comments) {
 	var navbar_nc = $('.navbar-new-comments');
 	if(cint(new_comments)) {
diff --git a/selling/doctype/lead/lead.js b/selling/doctype/lead/lead.js
index d8d322d..0d30674 100644
--- a/selling/doctype/lead/lead.js
+++ b/selling/doctype/lead/lead.js
@@ -50,7 +50,7 @@
 	}
 
 	if(in_list(user_roles,'System Manager')) {
-		cur_frm.page_layout.footer.help_area.innerHTML = '<hr>\
+		cur_frm.footer.help_area.innerHTML = '<hr>\
 			<p><a href="#Form/Sales Email Settings">Sales Email Settings</a><br>\
 			<span class="help">Automatically extract Leads from a mail box e.g. "sales@example.com"</span></p>';
 	}
diff --git a/selling/page/sales_analytics/sales_analytics.js b/selling/page/sales_analytics/sales_analytics.js
index 0b35af5..7fdc3ac 100644
--- a/selling/page/sales_analytics/sales_analytics.js
+++ b/selling/page/sales_analytics/sales_analytics.js
@@ -23,7 +23,7 @@
 	new erpnext.SalesAnalytics(wrapper);
 	
 	wrapper.appframe.add_home_breadcrumb()
-	wrapper.appframe.add_module_breadcrumb("Selling")
+	wrapper.appframe.add_module_icon("Selling")
 	wrapper.appframe.add_breadcrumb("icon-bar-chart")
 }
 
diff --git a/selling/page/sales_browser/sales_browser.html b/selling/page/sales_browser/sales_browser.html
index 4683a07..ab89816 100644
--- a/selling/page/sales_browser/sales_browser.html
+++ b/selling/page/sales_browser/sales_browser.html
@@ -1,4 +1,4 @@
-<div class="layout-wrapper layout-wrapper-background">
+<div class="appframe col-span-12">
 	<div class="appframe-area"></div>
 	<div class="layout-main-section">
 		<div class="tree-area"></div>
diff --git a/selling/page/sales_browser/sales_browser.js b/selling/page/sales_browser/sales_browser.js
index 4622f24..60bb1fd 100644
--- a/selling/page/sales_browser/sales_browser.js
+++ b/selling/page/sales_browser/sales_browser.js
@@ -17,7 +17,7 @@
 pscript['onload_Sales Browser'] = function(wrapper){
 	wrapper.appframe = new wn.ui.AppFrame($(wrapper).find('.appframe-area'));
 	wrapper.appframe.add_home_breadcrumb()
-	wrapper.appframe.add_module_breadcrumb("Selling")
+	wrapper.appframe.add_module_icon("Selling")
 	
 	wrapper.appframe.add_button('Refresh', function() {  
 			wrapper.make_tree();
diff --git a/stock/doctype/item/item.txt b/stock/doctype/item/item.txt
index 274719e..d6eaf34 100644
--- a/stock/doctype/item/item.txt
+++ b/stock/doctype/item/item.txt
@@ -1,6 +1,6 @@
 [
  {
-  "creation": "2013-04-25 10:56:55", 
+  "creation": "2013-03-28 10:35:28", 
   "docstatus": 0, 
   "modified": "2013-05-02 15:10:53", 
   "modified_by": "Administrator", 
@@ -884,47 +884,9 @@
   "read_only": 0
  }, 
  {
-  "cancel": 0, 
-  "create": 0, 
-  "doctype": "DocPerm", 
-  "permlevel": 1, 
-  "report": 0, 
-  "role": "Material Manager", 
-  "write": 0
- }, 
- {
-  "cancel": 0, 
-  "create": 0, 
-  "doctype": "DocPerm", 
-  "permlevel": 0, 
-  "report": 1, 
-  "role": "Material Manager", 
-  "write": 0
- }, 
- {
-  "cancel": 0, 
-  "create": 0, 
-  "doctype": "DocPerm", 
-  "permlevel": 1, 
-  "report": 0, 
-  "role": "Material User", 
-  "write": 0
- }, 
- {
-  "cancel": 0, 
-  "create": 0, 
-  "doctype": "DocPerm", 
-  "permlevel": 0, 
-  "report": 1, 
-  "role": "Material User", 
-  "write": 0
- }, 
- {
   "cancel": 1, 
   "create": 1, 
   "doctype": "DocPerm", 
-  "permlevel": 0, 
-  "report": 1, 
   "role": "Material Master Manager", 
   "write": 1
  }, 
@@ -932,27 +894,7 @@
   "cancel": 0, 
   "create": 0, 
   "doctype": "DocPerm", 
-  "permlevel": 1, 
-  "report": 0, 
-  "role": "Material Master Manager", 
-  "write": 0
- }, 
- {
-  "cancel": 1, 
-  "create": 1, 
-  "doctype": "DocPerm", 
-  "permlevel": 0, 
-  "report": 1, 
-  "role": "System Manager", 
-  "write": 1
- }, 
- {
-  "cancel": 0, 
-  "create": 0, 
-  "doctype": "DocPerm", 
-  "permlevel": 1, 
-  "report": 0, 
-  "role": "System Manager", 
+  "role": "Material User", 
   "write": 0
  }
 ]
\ No newline at end of file
diff --git a/stock/doctype/material_request/material_request.txt b/stock/doctype/material_request/material_request.txt
index eb788e4..545d40f 100644
--- a/stock/doctype/material_request/material_request.txt
+++ b/stock/doctype/material_request/material_request.txt
@@ -2,7 +2,7 @@
  {
   "creation": "2013-03-07 14:48:38", 
   "docstatus": 0, 
-  "modified": "2013-02-25 15:38:02", 
+  "modified": "2013-04-24 10:47:50", 
   "modified_by": "Administrator", 
   "owner": "Administrator"
  }, 
@@ -72,7 +72,7 @@
   "oldfieldtype": "Section Break"
  }, 
  {
-  "allow_on_submit": 1, 
+  "allow_on_submit": 0, 
   "doctype": "DocField", 
   "fieldname": "indent_details", 
   "fieldtype": "Table", 
diff --git a/stock/page/stock_ageing/stock_ageing.js b/stock/page/stock_ageing/stock_ageing.js
index 456f5f1..b9b4c80 100644
--- a/stock/page/stock_ageing/stock_ageing.js
+++ b/stock/page/stock_ageing/stock_ageing.js
@@ -25,7 +25,7 @@
 	new erpnext.StockAgeing(wrapper);
 	
 	wrapper.appframe.add_home_breadcrumb()
-	wrapper.appframe.add_module_breadcrumb("Stock")
+	wrapper.appframe.add_module_icon("Stock")
 	wrapper.appframe.add_breadcrumb("icon-bar-chart")
 }
 
diff --git a/stock/page/stock_analytics/stock_analytics.js b/stock/page/stock_analytics/stock_analytics.js
index a003963..a52cb7d 100644
--- a/stock/page/stock_analytics/stock_analytics.js
+++ b/stock/page/stock_analytics/stock_analytics.js
@@ -25,7 +25,7 @@
 	new erpnext.StockAnalytics(wrapper);
 
 	wrapper.appframe.add_home_breadcrumb()
-	wrapper.appframe.add_module_breadcrumb("Stock")
+	wrapper.appframe.add_module_icon("Stock")
 	wrapper.appframe.add_breadcrumb("icon-bar-chart")
 }
 
diff --git a/stock/page/stock_balance/stock_balance.js b/stock/page/stock_balance/stock_balance.js
index 163b74f..4467b98 100644
--- a/stock/page/stock_balance/stock_balance.js
+++ b/stock/page/stock_balance/stock_balance.js
@@ -26,7 +26,7 @@
 	new erpnext.StockBalance(wrapper);
 	
 	wrapper.appframe.add_home_breadcrumb()
-	wrapper.appframe.add_module_breadcrumb("Stock")
+	wrapper.appframe.add_module_icon("Stock")
 	wrapper.appframe.add_breadcrumb("icon-bar-chart")
 }
 
diff --git a/stock/page/stock_ledger/stock_ledger.js b/stock/page/stock_ledger/stock_ledger.js
index a37ea1c..438f132 100644
--- a/stock/page/stock_ledger/stock_ledger.js
+++ b/stock/page/stock_ledger/stock_ledger.js
@@ -24,7 +24,7 @@
 	new erpnext.StockLedger(wrapper);
 	
 	wrapper.appframe.add_home_breadcrumb()
-	wrapper.appframe.add_module_breadcrumb("Stock")
+	wrapper.appframe.add_module_icon("Stock")
 	wrapper.appframe.add_breadcrumb("icon-bar-chart")
 }
 
diff --git a/stock/page/stock_level/stock_level.js b/stock/page/stock_level/stock_level.js
index 75819a5..5f129c3 100644
--- a/stock/page/stock_level/stock_level.js
+++ b/stock/page/stock_level/stock_level.js
@@ -24,7 +24,7 @@
 	new erpnext.StockLevel(wrapper);
 
 	wrapper.appframe.add_home_breadcrumb()
-	wrapper.appframe.add_module_breadcrumb("Stock")
+	wrapper.appframe.add_module_icon("Stock")
 	wrapper.appframe.add_breadcrumb("icon-bar-chart");
 }
 
diff --git a/support/doctype/support_ticket/support_ticket.js b/support/doctype/support_ticket/support_ticket.js
index 4ee4c1d..aee364e 100644
--- a/support/doctype/support_ticket/support_ticket.js
+++ b/support/doctype/support_ticket/support_ticket.js
@@ -19,7 +19,7 @@
 $.extend(cur_frm.cscript, {
 	onload: function(doc, dt, dn) {
 		if(in_list(user_roles,'System Manager')) {
-			cur_frm.page_layout.footer.help_area.innerHTML = '<hr>\
+			cur_frm.footer.help_area.innerHTML = '<hr>\
 				<p><a href="#Form/Email Settings/Email Settings">Email Settings</a><br>\
 				<span class="help">Integrate incoming support emails to Support Ticket</span></p>';
 		}
diff --git a/support/page/support_analytics/support_analytics.js b/support/page/support_analytics/support_analytics.js
index 60384bb..9b46e6d 100644
--- a/support/page/support_analytics/support_analytics.js
+++ b/support/page/support_analytics/support_analytics.js
@@ -8,7 +8,7 @@
 	new erpnext.SupportAnalytics(wrapper);
 	
 	wrapper.appframe.add_home_breadcrumb()
-	wrapper.appframe.add_module_breadcrumb("Support")
+	wrapper.appframe.add_module_icon("Support")
 	wrapper.appframe.add_breadcrumb("icon-bar-chart")
 }
 
diff --git a/utilities/page/markdown_reference/markdown_reference.html b/utilities/page/markdown_reference/markdown_reference.html
index cdf646c..5ec813b 100644
--- a/utilities/page/markdown_reference/markdown_reference.html
+++ b/utilities/page/markdown_reference/markdown_reference.html
@@ -1,4 +1,4 @@
-<div class="layout-wrapper layout-wrapper-background">
+<div class="appframe col-span-12">
 	<div class="layout-appframe">
 		<div class="appframe-titlebar">
 			<span class="appframe-title">Markdown Reference</span>
diff --git a/utilities/page/question_view/question_view.html b/utilities/page/question_view/question_view.html
index b091d95..13f96a3 100644
--- a/utilities/page/question_view/question_view.html
+++ b/utilities/page/question_view/question_view.html
@@ -1,4 +1,4 @@
-<div class="layout-wrapper layout-wrapper-appframe">
+<div class="appframe col-span-12">
 	<div class="layout-appframe"></div>
 	<div class="layout-main" style="min-height: 400px">
 		<div class="qv-question-wrapper">
diff --git a/utilities/page/question_view/question_view.js b/utilities/page/question_view/question_view.js
index e479e13..8672350 100644
--- a/utilities/page/question_view/question_view.js
+++ b/utilities/page/question_view/question_view.js
@@ -18,7 +18,7 @@
 	wrapper.appframe = new wn.ui.AppFrame($(wrapper).find('.layout-appframe'));
 	wrapper.appframe.title('Question');
 	wrapper.appframe.add_home_breadcrumb();
-	wrapper.appframe.add_module_breadcrumb("Knowledge Base");
+	wrapper.appframe.add_module_icon("Knowledge Base");
 	wrapper.appframe.add_breadcrumb("icon-file");
 
 	wrapper.add_answer_area = $('.add-answer-area').get(0);
diff --git a/utilities/page/questions/questions.html b/utilities/page/questions/questions.html
index bec483e..bd003ce 100644
--- a/utilities/page/questions/questions.html
+++ b/utilities/page/questions/questions.html
@@ -1,4 +1,4 @@
-<div class="layout-wrapper layout-wrapper-background">
+<div class="appframe col-span-12">
 	<div class="layout-appframe"></div>
 	<div class="layout-main-section">
 		<div class="kb-search-wrapper">
diff --git a/utilities/page/trash/__init__.py b/utilities/page/trash/__init__.py
deleted file mode 100644
index baffc48..0000000
--- a/utilities/page/trash/__init__.py
+++ /dev/null
@@ -1 +0,0 @@
-from __future__ import unicode_literals
diff --git a/utilities/page/trash/trash.html b/utilities/page/trash/trash.html
deleted file mode 100644
index b17e475..0000000
--- a/utilities/page/trash/trash.html
+++ /dev/null
@@ -1,4 +0,0 @@
-<div class="layout_wrapper">
-<div id="trash_header"></div>
-<div id="trash_div" style="margin: 0px;"></div>
-</div>
\ No newline at end of file
diff --git a/utilities/page/trash/trash.js b/utilities/page/trash/trash.js
deleted file mode 100644
index b30626d..0000000
--- a/utilities/page/trash/trash.js
+++ /dev/null
@@ -1,144 +0,0 @@
-// ERPNext - web based ERP (http://erpnext.com)
-// Copyright (C) 2012 Web Notes Technologies Pvt Ltd
-// 
-// This program is free software: you can redistribute it and/or modify
-// it under the terms of the GNU General Public License as published by
-// the Free Software Foundation, either version 3 of the License, or
-// (at your option) any later version.
-// 
-// This program is distributed in the hope that it will be useful,
-// but WITHOUT ANY WARRANTY; without even the implied warranty of
-// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
-// GNU General Public License for more details.
-// 
-// You should have received a copy of the GNU General Public License
-// along with this program.  If not, see <http://www.gnu.org/licenses/>.
-
-pscript['onload_Trash'] = function() {
-
-  // header and toolbar
-  var h = new PageHeader('trash_header','Trash Bin','Restore the documents that you have trashed')
-  
-  if(!pscript.trash_bin) pscript.trash_bin = new pscript.Trash();
-}
-
-pscript.Trash = function() {
-  // create UI elements
-  this.wrapper = $i('trash_div');
-  
-  this.head = $a(this.wrapper, 'div');
-  this.body = $a(this.wrapper, 'div');
-  $y(this.body, {margin:'8px'})
-
-  this.make_head();
-  this.load_masters();
-}
-
-// Make Button
-// ------------
-pscript.Trash.prototype.make_button = function(label, area){
-  var me = this;
-  var w = $a(area, 'div', '', {margin:'8px'});
-  var t = make_table(w,1,1,'400px',['50%','50%']);
-  var s = $a($td(t,0,0),'button');
-  s.innerHTML = label;
-  s.wrapper = w;
-  return s;
-}
-
-
-// Make Head
-// -------------
-pscript.Trash.prototype.make_head = function() {
-  var me = this;
-  
-  var make_select = function(label) {
-    var w = $a(me.head, 'div', '', {margin:'8px'});
-    var t = make_table(w,1,2,'400px',['50%','50%']);
-    $td(t,0,0).innerHTML = label;
-    var s = $a($td(t,0,1),'select','',{width:'140px'});
-    s.wrapper = w;
-    return s;
-  }
-  
-  // Select Master Name
-  this.master_select = make_select('Select Master');
-    
-  var me = this;
-  // Get Records
-  this.get_records_button = me.make_button('Get Records', me.head);
-  this.get_records_button.onclick = function() {
-    me.get_records();
-  }
-}
-
-
-// Load Masters
-// -------------
-pscript.Trash.prototype.load_masters = function(){
-  var me = this;
-  var callback = function(r, rt){
-    // Masters
-    empty_select(me.master_select);
-    add_sel_options(me.master_select,add_lists(['All'], r.message), 'All');
-  }
-  $c_obj('Trash Control','get_masters','',callback);
-}
-
-
-// Get Records
-// -----------
-pscript.Trash.prototype.get_records = function(){
-  var me = this;
-  me.body.innerHTML = '';
-  var callback = function(r, rt){
-    if(r.message) me.generate_trash_records(r.message);
-    else msgprint("No Records Found");
-  }
-  $c_obj('Trash Control','get_trash_records',sel_val(me.master_select),callback);
-}
-
-
-// Generate Trash Records
-// -----------------------
-pscript.Trash.prototype.generate_trash_records = function(rec_dict){
-  var me = this;
-  pscript.all_checkboxes = [];
-  mnames = keys(rec_dict).sort();
-  for(var i = 0; i < mnames.length; i ++){
-    var head = $a(me.body, 'h3'); head.innerHTML = mnames[i];
-    var rec_table = make_table(me.body,rec_dict[mnames[i]].length,2,'375px',['350px','25px'],{border:'1px solid #AAA',padding:'2px'});
-    for(var j = 0; j < rec_dict[mnames[i]].length; j++){
-      $a_input($td(rec_table,j,0), 'data');
-      $td(rec_table,j,0).innerHTML = rec_dict[mnames[i]][j];
-      var chk = $a_input($td(rec_table,j,1), 'checkbox');
-      chk.master = mnames[i];
-      chk.record = rec_dict[mnames[i]][j];
-      pscript.all_checkboxes.push(chk);
-    }
-  }
-  this.restore_button = me.make_button('Restore Selected', me.body);
-  this.restore_button.onclick = function() {
-    me.restore_records(0);
-  }
-  this.restore_all_button = me.make_button('Restore All', me.body);
-  this.restore_all_button.onclick = function() {
-    me.restore_records(1);
-  }
-}
-
-
-// Restore Records
-// ---------------
-pscript.Trash.prototype.restore_records = function(restore_all){
-  var me = this;
-  var out = {};
-  for(i in pscript.all_checkboxes) {
-    c = pscript.all_checkboxes[i];
-    if (restore_all || (!restore_all && c.checked)) {
-      if(!out[c.master]) out[c.master] = [c.record];
-      else {out[c.master].push(c.record);}
-    }
-  }
-  $c_obj('Trash Control','restore_records',JSON.stringify(out),function(r, rt){me.get_records();})
-}
\ No newline at end of file
diff --git a/utilities/page/trash/trash.txt b/utilities/page/trash/trash.txt
deleted file mode 100644
index a13e1b6..0000000
--- a/utilities/page/trash/trash.txt
+++ /dev/null
@@ -1,47 +0,0 @@
-[
- {
-  "owner": "Administrator", 
-  "docstatus": 0, 
-  "creation": "2010-10-12 15:19:32", 
-  "modified_by": "Administrator", 
-  "modified": "2010-12-30 11:44:36"
- }, 
- {
-  "name": "__common__", 
-  "module": "Utilities", 
-  "page_name": "Trash", 
-  "doctype": "Page", 
-  "standard": "Yes"
- }, 
- {
-  "name": "__common__", 
-  "parent": "Trash", 
-  "doctype": "Page Role", 
-  "parenttype": "Page", 
-  "parentfield": "roles"
- }, 
- {
-  "name": "Trash", 
-  "doctype": "Page"
- }, 
- {
-  "role": "Administrator", 
-  "doctype": "Page Role"
- }, 
- {
-  "role": "Sales Master Manager", 
-  "doctype": "Page Role"
- }, 
- {
-  "role": "Material Master Manager", 
-  "doctype": "Page Role"
- }, 
- {
-  "role": "Purchase Master Manager", 
-  "doctype": "Page Role"
- }, 
- {
-  "role": "Accounts Manager", 
-  "doctype": "Page Role"
- }
-]
\ No newline at end of file
diff --git a/website/doctype/website_settings/website_settings.txt b/website/doctype/website_settings/website_settings.txt
index 615c0a5..ed3380f 100644
--- a/website/doctype/website_settings/website_settings.txt
+++ b/website/doctype/website_settings/website_settings.txt
@@ -2,7 +2,7 @@
  {
   "creation": "2013-03-26 06:51:18", 
   "docstatus": 0, 
-  "modified": "2013-04-17 11:51:30", 
+  "modified": "2013-04-17 11:51:24", 
   "modified_by": "Administrator", 
   "owner": "Administrator"
  }, 
diff --git a/website/helpers/blog.py b/website/helpers/blog.py
index 386c4b7..9da2062 100644
--- a/website/helpers/blog.py
+++ b/website/helpers/blog.py
@@ -63,15 +63,20 @@
 	"""
 	import webnotes
 	import webnotes.utils, markdown2
-	import webnotes.widgets.form.comments	
 	
 	if not args: args = webnotes.form_dict
 	args['comment'] = unicode(markdown2.markdown(args.get('comment') or ''))
+	args['doctype'] = "Comment"
 	
-	comment = webnotes.widgets.form.comments.add_comment(args)
+	page_name = args.get("page_name")
+	if "page_name" in args:
+		del args["page_name"]
+		
+	comment = webnotes.bean(args)
+	comment.insert()
 	
 	# since comments are embedded in the page, clear the web cache
-	webnotes.webutils.clear_cache(args.get('page_name'))
+	webnotes.webutils.clear_cache(page_name)
 	
 	comment['comment_date'] = webnotes.utils.global_date_format(comment['creation'])
 	template_args = { 'comment_list': [comment], 'template': 'app/website/templates/html/comment.html' }
diff --git a/website/templates/html/blog_footer.html b/website/templates/html/blog_footer.html
index e439d14..ecb463c 100644
--- a/website/templates/html/blog_footer.html
+++ b/website/templates/html/blog_footer.html
@@ -1,4 +1,4 @@
-<div class="span12">
+<div class="col-span-12">
 	<hr />
 	{% if categories %}
 	<h5>Explore posts by categories</h5>
diff --git a/website/templates/html/blog_page.html b/website/templates/html/blog_page.html
index cf1f00e..0cabe6d 100644
--- a/website/templates/html/blog_page.html
+++ b/website/templates/html/blog_page.html
@@ -9,7 +9,7 @@
 {% endblock %}
 
 {% block content %}
-<div class="span12" itemscope itemtype="http://schema.org/BlogPost">
+<div class="col-span-12" itemscope itemtype="http://schema.org/BlogPost">
 	<h2 itemprop="name headline">{{ title }}</h2>
 
 	<!-- begin blog content -->
diff --git a/website/templates/html/blogger.html b/website/templates/html/blogger.html
index e18f86a..878caad 100644
--- a/website/templates/html/blogger.html
+++ b/website/templates/html/blogger.html
@@ -1,10 +1,10 @@
 <div class="row">
-	<div class="span2">
+	<div class="col-span-2">
 		<div class="avatar avatar-large">
 			<img itemprop="thumbnailUrl" src="{{ blogger_info.avatar }}" />
 		</div>
 	</div>
-	<div class="span10">
+	<div class="col-span-10">
 		<h4>{{ blogger_info.full_name }}</h4>
 		<p style="color: #999">{{ blogger_info.bio }}</p>
 		<p><a href="blog?by={{ blogger_info.name }}&by_name={{ blogger_info.full_name }}">
diff --git a/website/templates/html/footer.html b/website/templates/html/footer.html
index 2f1c7fe..7260fa5 100644
--- a/website/templates/html/footer.html
+++ b/website/templates/html/footer.html
@@ -38,7 +38,7 @@
 	{{ address }}
 	{% endif %}
 	<p><div class="input-append" style="text-align: center; margin:30px 0px;">
-	  <input class="span3" id="footer-subscribe-email" type="text" placeholder="Your email address...">
+	  <input class="col-span-3" id="footer-subscribe-email" type="text" placeholder="Your email address...">
 	  <button class="btn" type="button" id="footer-subscribe-button">Stay Updated</button>
 	</div></p>
 	<script>
diff --git a/website/templates/html/outer.html b/website/templates/html/outer.html
index 570c769..1eaa2ab 100644
--- a/website/templates/html/outer.html
+++ b/website/templates/html/outer.html
@@ -7,7 +7,7 @@
 		</div>
 		<div class="clearfix"></div>
 		{% if banner_html %}<div class="row" style="margin-top: 30px;">
-			<div class="span12">{{ banner_html }}</div>
+			<div class="col-span-12">{{ banner_html }}</div>
 		</div>{% endif %}
 		<div class="outer">
 			{% include "app/website/templates/html/navbar.html" %}
diff --git a/website/templates/html/product_breadcrumbs.html b/website/templates/html/product_breadcrumbs.html
index 0b026e7..f3661ce 100644
--- a/website/templates/html/product_breadcrumbs.html
+++ b/website/templates/html/product_breadcrumbs.html
@@ -1,5 +1,5 @@
 {% if obj.parent_groups and len(obj.parent_groups) > 1 %}
-<div class="span12">
+<div class="col-span-12">
 	<div class="clearfix">
 		<ul class="breadcrumb">
 			{% for ig in obj.parent_groups[:-1] %}
diff --git a/website/templates/html/product_group.html b/website/templates/html/product_group.html
index b3c8511..23ecbc8 100644
--- a/website/templates/html/product_group.html
+++ b/website/templates/html/product_group.html
@@ -3,7 +3,7 @@
 {% block content %}
 {% include 'app/website/templates/html/product_search_box.html' %}
 {% include 'app/website/templates/html/product_breadcrumbs.html' %}
-<div class="span12">
+<div class="col-span-12">
 	{% if slideshow %}<!-- slideshow -->
 	{% include "app/website/templates/html/slideshow.html" %}
 	{% endif %}
@@ -16,7 +16,7 @@
 	<hr />
 	<div class="row">
 	{% for d in sub_groups %}
-		<div class="span4">
+		<div class="col-span-4">
 			<a href="{{ d.page_name }}">{{ d.name }} ({{ d.count }})</a>
 		</div>
 	{% endfor %}
diff --git a/website/templates/html/product_in_list.html b/website/templates/html/product_in_list.html
index 5cd9eac..7a47006 100644
--- a/website/templates/html/product_in_list.html
+++ b/website/templates/html/product_in_list.html
@@ -1,4 +1,4 @@
-<div class="span3">
+<div class="col-span-3">
 	<div style="height: 120px; overflow: hidden;">
 		<a href="{{ page_name }}">
 		{%- if website_image -%}
diff --git a/website/templates/html/product_page.html b/website/templates/html/product_page.html
index 23091ad..9353ce8 100644
--- a/website/templates/html/product_page.html
+++ b/website/templates/html/product_page.html
@@ -11,9 +11,9 @@
 {% block content %}
 	{% include 'app/website/templates/html/product_search_box.html' %}
 	{% include 'app/website/templates/html/product_breadcrumbs.html' %}
-	<div class="span12 product-page-content" itemscope itemtype="http://schema.org/Product">
+	<div class="col-span-12 product-page-content" itemscope itemtype="http://schema.org/Product">
 		<div class="row">
-			<div class="span6">
+			<div class="col-span-6">
 				{% if slideshow %}
 					{% include "app/website/templates/html/slideshow.html" %}
 				{% else %}
@@ -27,7 +27,7 @@
 					{% endif %}
 				{% endif %}
 			</div>
-			<div class="span6">
+			<div class="col-span-6">
 				<h3 itemprop="name" style="margin-top: 0px;">{{ item_name }}</h3>
 				<p class="help">Item Code: {{ name }}</p>
 				<h4>Product Description</h4>
diff --git a/website/templates/html/product_search_box.html b/website/templates/html/product_search_box.html
index 3b3a95a..db1b1d0 100644
--- a/website/templates/html/product_search_box.html
+++ b/website/templates/html/product_search_box.html
@@ -1,8 +1,8 @@
-<div class="span12 clearfix">
+<div class="col-span-12 clearfix">
 	<div class="pull-right" style="margin-top: 15px;">
 		<form class="form-search">
 			<div class="input-append">
-				<input type="text" class="span2 search-query" 
+				<input type="text" class="col-span-2 search-query" 
 					id="product-search" placeholder="Product Search..." />
 				<button class="btn" id="btn-product-search">
 					<i class="icon-search"></i></button>
diff --git a/website/templates/html/web_page.html b/website/templates/html/web_page.html
index 6b8c914..884e7cb 100644
--- a/website/templates/html/web_page.html
+++ b/website/templates/html/web_page.html
@@ -7,7 +7,7 @@
 {% endblock %}
 
 {% block content %}
-<div class="span12" style="margin-top: 15px;">
+<div class="col-span-12" style="margin-top: 15px;">
 	{% include "app/website/templates/html/slideshow.html" %}
 	{{ main_section }}
 </div>
diff --git a/website/templates/js/blog.js b/website/templates/js/blog.js
index fd5a156..053eae0 100644
--- a/website/templates/js/blog.js
+++ b/website/templates/js/blog.js
@@ -69,12 +69,12 @@
 			b.page_name = encodeURIComponent(b.page_name);
 			
 			$(repl('<div class="row">\
-					<div class="span1">\
+					<div class="col-span-1">\
 						<div class="avatar avatar-medium" style="margin-top: 6px;">\
 							<img src="%(avatar)s" />\
 						</div>\
 					</div>\
-					<div class="span11">\
+					<div class="col-span-11">\
 						<h4><a href="%(page_name)s">%(title)s</a></h4>\
 						<p>%(content)s</p>\
 						<p style="color: #aaa; font-size: 90%">\
diff --git a/website/templates/pages/about.html b/website/templates/pages/about.html
index 0cbd562..71ffd33 100644
--- a/website/templates/pages/about.html
+++ b/website/templates/pages/about.html
@@ -3,14 +3,14 @@
 {% set title="About Us" %}
 
 {% block content %}
-<div class="span12">
+<div class="col-span-12">
 	{{ obj.doc.company_introduction or "<h2>About Us</h2><p>Some Introduction about your company that you would like your website visitor to know. More people than you think will read your About page. People always like to know who the are doing business with. Be authentic and avoid using jargon like 'value added services' etc. Be sure to update your company history and list of key team members in Website > About Us Settings</p>" }}
 	{% if obj.doclist.get({"doctype":"Company History"}) %}
 	<h3>{{ obj.doc.company_history_heading or "Company History" }}</h3>
 	{% for d in obj.doclist.get({"doctype":"Company History"}) %}
 	<div class="row">
-		<span class="span2"><h4 style="margin:0px;">{{ d.year }}</h4></span>
-		<span class="span10"><p>{{ d.highlight }}</p></span>
+		<span class="col-span-2"><h4 style="margin:0px;">{{ d.year }}</h4></span>
+		<span class="col-span-10"><p>{{ d.highlight }}</p></span>
 	</div>
 	{% endfor %}
 	{% endif %}
@@ -18,12 +18,12 @@
 	<h3>{{ obj.doc.team_members_heading or "Team Members" }}</h3>
 	{% for d in obj.doclist.get({"doctype":"About Us Team Member"}) %}
 	<div class="row" itemscope itemtype="http://schema.org/Person">
-		<span class="span2">
+		<span class="col-span-2">
 			<div class="avatar avatar-large">
 				<img class="avatar" src="{{ d.image_link }}" style="" itemprop="image">
 			</div>
 		</span>
-		<span class="span10"><h4 itemprop="name">{{ d.full_name }}</h4>
+		<span class="col-span-10"><h4 itemprop="name">{{ d.full_name }}</h4>
 			<p itemprop="description">{{ d.bio }}</p>
 		</span>
 	</div>
diff --git a/website/templates/pages/account.html b/website/templates/pages/account.html
index fe2b858..b9f2f4a 100644
--- a/website/templates/pages/account.html
+++ b/website/templates/pages/account.html
@@ -3,7 +3,7 @@
 {% set title="My Account" %}
 
 {% block content %}
-<div class="span12">
+<div class="col-span-12">
     <ul class="breadcrumb">
     	<li><a href="index">Home</a> <span class="divider">/</span></li>
     	<li class="active">My Account</li>
diff --git a/website/templates/pages/attributions.html b/website/templates/pages/attributions.html
index 05e8e88..d07cf52 100644
--- a/website/templates/pages/attributions.html
+++ b/website/templates/pages/attributions.html
@@ -11,7 +11,7 @@
 {% set title="ERPNext - Web Based, Open Source ERP" %}
 
 {% block content %}
-<div class="layout-attributions span12">
+<div class="layout-attributions col-span-12">
 	<h3>This website is made using these awesome Open Source projects <i class="icon-heart" style="color: red"></i></h3>
 	<hr>
 	<table class="table table-bordered table-striped">
diff --git a/website/templates/pages/blog.html b/website/templates/pages/blog.html
index 7483c7c..c9879fe 100644
--- a/website/templates/pages/blog.html
+++ b/website/templates/pages/blog.html
@@ -11,7 +11,7 @@
 {% set title="Blog" %}
 
 {% block content %}
-<div class="span12">
+<div class="col-span-12">
 	<h2 id="blog-title">{{ blog_title }}</h2>
 	{% if blog_introduction %}
 	<p>{{ blog_introduction }}</p>
diff --git a/website/templates/pages/contact.html b/website/templates/pages/contact.html
index b9b3cd7..f2eca0a 100644
--- a/website/templates/pages/contact.html
+++ b/website/templates/pages/contact.html
@@ -7,28 +7,28 @@
 {% set title="Contact Us" %}
 
 {% block content %}
-<div class="span12">
+<div class="col-span-12">
 	<h3>{{ obj.doc.heading or "Contact Us"}}</h3>
 	<div class="row">
-		<div class="web-form span8">
+		<div class="web-form col-span-8">
 			<div class="row">
-			<div class="span6">
+			<div class="col-span-6">
 				<p id="contact-alert" class="alert" 
 					style="display: none;">&nbsp;</p>
 			</div>
 			</div>
 			<div class="clearfix"></div>
-			<p><select class="span6" name="subject">
+			<p><select class="col-span-6" name="subject">
 				{% for option in obj.query_options %}
 					<option value="{{ option }}">{{ option }}</option>
 				{% endfor %}
 			</select></p>
-			<p><input class="span6" name="email" type="text" placeholder="Your Email Address" /></p>
-			<p><textarea class="span6" rows="10" name="message"></textarea></p>
+			<p><input class="col-span-6" name="email" type="text" placeholder="Your Email Address" /></p>
+			<p><textarea class="col-span-6" rows="10" name="message"></textarea></p>
 			<p><button class="btn btn-primary btn-send">Send</button></p>
 		</div>
 		{% if obj.doc.address %}
-		<div class="span3 alert" style="margin-top: 20px;" itemscope itemtype="http://schema.org/PostalAddress">
+		<div class="col-span-3 alert" style="margin-top: 20px;" itemscope itemtype="http://schema.org/PostalAddress">
 			<h4><i class="icon-map-marker"></i> {{ obj.address.address_title }}</h4>
 			{% if obj.address.address_line1 %}
 				<span itemprop="streetAddress">{{ obj.address.address_line1 }}</span><br>
diff --git a/website/templates/pages/order.html b/website/templates/pages/order.html
index 8e7bfe7..8a5db32 100644
--- a/website/templates/pages/order.html
+++ b/website/templates/pages/order.html
@@ -3,7 +3,7 @@
 {% set title=doc.name %}
 
 {% block content %}
-<div class="span12">
+<div class="col-span-12">
     <ul class="breadcrumb">
     	<li><a href="index">Home</a> <span class="divider">/</span></li>
     	<li><a href="account">My Account</a> <span class="divider">/</span></li>
@@ -15,16 +15,16 @@
 	{%- if doc.status -%}
 	<div style="font-size: 13px;">
 	<div class="row">
-		<div class="span2">
+		<div class="col-span-2">
 			<div class="label">{{ doc.status }}</div>
 		</div>
-		<div class="span4">
+		<div class="col-span-4">
 			{{ utils.formatdate(doc.transaction_date) }}
 		</div>
 	</div>
 	<br>
 	<div class="row">
-		<div class="span12">
+		<div class="col-span-12">
 		<table class="table table-bordered">
 			<tbody>
 				<tr>
@@ -52,8 +52,8 @@
 		</div>
 	</div>
 	<div class="row">
-		<div class="span6"></div>
-		<div class="span6">
+		<div class="col-span-6"></div>
+		<div class="col-span-6">
 		<table cellspacing=0 width=100%>
 		<tbody>
 			<tr>
diff --git a/website/templates/pages/orders.html b/website/templates/pages/orders.html
index 0c93a68..d52087f 100644
--- a/website/templates/pages/orders.html
+++ b/website/templates/pages/orders.html
@@ -8,7 +8,7 @@
 currency = "{{ currency }}";
 wn.currency_symbols = {{ currency_symbols }};
 </script>
-<div class="span12">
+<div class="col-span-12">
     <ul class="breadcrumb">
     	<li><a href="index">Home</a> <span class="divider">/</span></li>
     	<li><a href="account">My Account</a> <span class="divider">/</span></li>
@@ -44,8 +44,8 @@
 				
 				// parent
 				var $order = $(repl('<div class="row">\
-					<div class="span3"><a href="order?name=%(name)s">%(name)s</a></div>\
-					<div class="span9"></div>\
+					<div class="col-span-3"><a href="order?name=%(name)s">%(name)s</a></div>\
+					<div class="col-span-9"></div>\
 				</div>', order)).appendTo($list);
 				
 				// items
@@ -53,12 +53,12 @@
 					item.export_rate = format_currency(item.export_rate, order.currency);
 					item.export_amount = format_currency(item.export_amount, order.currency);
 					var $item = $(repl('<div class="row">\
-							<div class="span3">%(item_name)s</div>\
-							<div class="span2" style="text-align: right;">%(export_rate)s</div>\
-							<div class="span2" style="text-align: right;">%(qty)s %(stock_uom)s</div>\
-							<div class="span2" style="text-align: right;">%(export_amount)s</div>\
+							<div class="col-span-3">%(item_name)s</div>\
+							<div class="col-span-2" style="text-align: right;">%(export_rate)s</div>\
+							<div class="col-span-2" style="text-align: right;">%(qty)s %(stock_uom)s</div>\
+							<div class="col-span-2" style="text-align: right;">%(export_amount)s</div>\
 						</div>\
-					</div>', item)).appendTo($order.find(".span9"));
+					</div>', item)).appendTo($order.find(".col-span-9"));
 				});
 				
 				$("<hr>").appendTo($list);
diff --git a/website/templates/pages/product_search.html b/website/templates/pages/product_search.html
index 2dab6ff..ce5cd39 100644
--- a/website/templates/pages/product_search.html
+++ b/website/templates/pages/product_search.html
@@ -18,7 +18,7 @@
 </script>
 
 {% include 'app/website/templates/html/product_search_box.html' %}
-<div class="span12">
+<div class="col-span-12">
 	<h3 class="search-results">Search Results</h3>
 	<div id="search-list" class="row">
 		
diff --git a/website/templates/pages/profile.html b/website/templates/pages/profile.html
index d689cfb..1b7729f 100644
--- a/website/templates/pages/profile.html
+++ b/website/templates/pages/profile.html
@@ -3,7 +3,7 @@
 {% set title="My Profile" %}
 
 {% block content %}
-<div class="span12">
+<div class="col-span-12">
     <ul class="breadcrumb">
     	<li><a href="index">Home</a> <span class="divider">/</span></li>
     	<li><a href="account">My Account</a> <span class="divider">/</span></li>
diff --git a/website/templates/pages/ticket.html b/website/templates/pages/ticket.html
index 858dd3b..d154d16 100644
--- a/website/templates/pages/ticket.html
+++ b/website/templates/pages/ticket.html
@@ -3,7 +3,7 @@
 {% set title=doc.name %}
 
 {% block content %}
-<div class="span12">
+<div class="col-span-12">
     <ul class="breadcrumb">
     	<li><a href="index">Home</a> <span class="divider">/</span></li>
     	<li><a href="account">My Account</a> <span class="divider">/</span></li>
@@ -14,13 +14,13 @@
 	<hr>
 	{%- if doc.status -%}
 	<div class="row">
-		<div class="span2">
+		<div class="col-span-2">
 			<div class="label">{{ doc.status }}</div>
 		</div>
-		<div class="span7">
+		<div class="col-span-7">
 			{{ doc.subject }}
 		</div>
-		<div class="span3">
+		<div class="col-span-3">
 			{{ utils.formatdate(doc.transaction_date) }}
 		</div>
 	</div>
diff --git a/website/templates/pages/tickets.html b/website/templates/pages/tickets.html
index 843d10e..0ea534b 100644
--- a/website/templates/pages/tickets.html
+++ b/website/templates/pages/tickets.html
@@ -3,7 +3,7 @@
 {% set title="My Tickets" %}
 
 {% block content %}
-<div class="span12">
+<div class="col-span-12">
     <ul class="breadcrumb">
     	<li><a href="index">Home</a> <span class="divider">/</span></li>
     	<li><a href="account">My Account</a> <span class="divider">/</span></li>
@@ -39,9 +39,9 @@
 				
 				// parent
 				var $ticket = $(repl('<div class="row">\
-					<div class="span2"><span class="label">%(status)s</span></div>\
-					<div class="span3"><a href="ticket?name=%(name)s">%(name)s</a></div>\
-					<div class="span7">%(subject)s</div>\
+					<div class="col-span-2"><span class="label">%(status)s</span></div>\
+					<div class="col-span-3"><a href="ticket?name=%(name)s">%(name)s</a></div>\
+					<div class="col-span-7">%(subject)s</div>\
 				</div>', ticket)).appendTo($list);
 				
 				$("<hr>").appendTo($list);
diff --git a/website/templates/pages/writers.html b/website/templates/pages/writers.html
index 67c0b7e..5f0836d 100644
--- a/website/templates/pages/writers.html
+++ b/website/templates/pages/writers.html
@@ -3,7 +3,7 @@
 {% set title="Blog Writers" %}
 
 {% block content %}
-<div class="span12">
+<div class="col-span-12">
 	<h2 id="blog-title">Blog Writers</h2>
 	{% if writers_introduction %}
 	<p>{{ writers_introduction }}</p>