diff --git a/frappe/core/doctype/data_import/test_exporter_new.py b/frappe/core/doctype/data_import/test_exporter_new.py
index d17cef390b..faa48a35f4 100644
--- a/frappe/core/doctype/data_import/test_exporter_new.py
+++ b/frappe/core/doctype/data_import/test_exporter_new.py
@@ -20,7 +20,7 @@ class TestExporter(unittest.TestCase):
 		e = Exporter('Web Page', export_fields='All')
 		csv_array = e.get_csv_array()
 		header = csv_array[0]
-		self.assertEqual(len(header), 35)
+		self.assertEqual(len(header), 36)
 
 
 	def test_exports_selected_fields(self):
diff --git a/frappe/public/tailwind.css b/frappe/public/tailwind.css
index 270b70a2fc..89595f95ba 100644
--- a/frappe/public/tailwind.css
+++ b/frappe/public/tailwind.css
@@ -13,11 +13,10 @@ details.hide-summary-arrow summary::-webkit-details-marker {
 }
 
 .from-markdown {
-	@apply text-gray-900;
 	@apply leading-relaxed;
 
 	> * + * {
-		@apply mt-6;
+		@apply mt-4;
 	}
 
 	> :first-child {
@@ -50,28 +49,45 @@ details.hide-summary-arrow summary::-webkit-details-marker {
 		@apply px-4 py-3 text-sm font-medium text-gray-900 border border-gray-400 rounded-md bg-gray-50;
 	}
 
-	> h1 {
-		@apply text-4xl;
-		@apply mt-16;
-		@apply mb-4;
-		@apply leading-none;
-		@apply font-bold;
+	h1 {
+		@apply mt-16 mb-4 text-3xl font-extrabold leading-tight tracking-tight;
+		@screen sm {
+			@apply text-4xl leading-10;
+		}
+		@screen xl {
+			@apply text-5xl leading-none;
+		}
 	}
 
-	> h2 {
-		@apply mt-16;
-		@apply mb-4;
-		@apply leading-none;
-		@apply font-bold;
-		@apply text-3xl;
+	h1 + p {
+		@apply max-w-2xl mt-3 text-base text-gray-900;
+
+		@screen sm {
+			@apply mt-5 text-lg;
+		}
+		@screen md {
+			@apply mt-5 text-xl;
+		}
 	}
 
-	> h3 {
-		@apply mt-16;
-		@apply mb-4;
-		@apply leading-none;
-		@apply font-bold;
-		@apply text-2xl;
+	h2 {
+		@apply mb-4 text-2xl font-bold leading-tight mt-14;
+	}
+
+	h3 {
+		@apply mt-12 mb-4 text-xl font-semibold leading-tight;
+	}
+
+	h4 {
+		@apply mt-10 mb-4 text-lg font-semibold leading-tight;
+	}
+
+	h5 {
+		@apply mt-8 mb-4 text-base font-semibold leading-tight;
+	}
+
+	h6 {
+		@apply mt-6 mb-4 text-sm font-semibold leading-tight;
 	}
 
 	> a,
@@ -84,9 +100,17 @@ details.hide-summary-arrow summary::-webkit-details-marker {
 		}
 	}
 
+	table {
+		@apply w-full my-8 border-t;
+	}
+
+	tbody {
+		@apply border-t;
+	}
+
 	tr > td,
 	tr > th {
-		@apply px-4 py-2 border border-gray-400;
+		@apply py-4 pr-6 text-sm leading-6 text-left border-b;
 	}
 
 	th:empty {
diff --git a/frappe/templates/components/web_block.html b/frappe/templates/components/web_block.html
index d898417970..f0ed8f2df4 100644
--- a/frappe/templates/components/web_block.html
+++ b/frappe/templates/components/web_block.html
@@ -7,6 +7,7 @@
 	web_block.css_class
 ]) -%}
 
+{%- if not web_block.hide_block -%}
 <{{htmltag}} class="{{ classes }}" data-section-idx="{{ web_block.idx | e }}"
 	data-section-template="{{ web_block.web_template | e }}">
 	{%- if web_block.add_container -%}
@@ -17,3 +18,4 @@
 	</div>
 	{%- endif -%}
 </{{htmltag}}>
+{%- endif -%}
diff --git a/frappe/website/doctype/web_page_block/web_page_block.json b/frappe/website/doctype/web_page_block/web_page_block.json
index b415567bd0..77f2e25469 100644
--- a/frappe/website/doctype/web_page_block/web_page_block.json
+++ b/frappe/website/doctype/web_page_block/web_page_block.json
@@ -12,7 +12,8 @@
   "column_break_5",
   "add_container",
   "add_padding",
-  "add_shade"
+  "add_shade",
+  "hide_block"
  ],
  "fields": [
   {
@@ -54,18 +55,24 @@
    "default": "0",
    "fieldname": "add_shade",
    "fieldtype": "Check",
-   "label": "Shaded Section"
+   "label": "Add Gray Background"
   },
   {
    "default": "1",
    "fieldname": "add_container",
    "fieldtype": "Check",
    "label": "Add Container"
+  },
+  {
+   "default": "0",
+   "fieldname": "hide_block",
+   "fieldtype": "Check",
+   "label": "Hide Block"
   }
  ],
  "istable": 1,
  "links": [],
- "modified": "2020-04-19 16:16:44.524042",
+ "modified": "2020-04-29 15:08:25.976179",
  "modified_by": "Administrator",
  "module": "Website",
  "name": "Web Page Block",
diff --git a/frappe/website/doctype/web_template_field/web_template_field.json b/frappe/website/doctype/web_template_field/web_template_field.json
index 09335adf3a..900655e207 100644
--- a/frappe/website/doctype/web_template_field/web_template_field.json
+++ b/frappe/website/doctype/web_template_field/web_template_field.json
@@ -31,7 +31,7 @@
    "fieldtype": "Select",
    "in_list_view": 1,
    "label": "Fieldtype",
-   "options": "Attach Image\nCheck\nData\nInt\nSelect\nSmall Text\nText\nMarkdown Editor",
+   "options": "Attach Image\nCheck\nData\nInt\nSelect\nSmall Text\nText\nMarkdown Editor\nSection Break\nColumn Break",
    "reqd": 1
   },
   {
@@ -48,7 +48,7 @@
  ],
  "istable": 1,
  "links": [],
- "modified": "2020-04-24 17:05:25.322767",
+ "modified": "2020-04-29 14:53:23.192395",
  "modified_by": "Administrator",
  "module": "Website",
  "name": "Web Template Field",
diff --git a/frappe/website/web_template/hero/hero.html b/frappe/website/web_template/hero/hero.html
index a3fb4aa466..e7b69ab782 100644
--- a/frappe/website/web_template/hero/hero.html
+++ b/frappe/website/web_template/hero/hero.html
@@ -9,22 +9,12 @@
 	</p>
 	{%- endif -%}
 	{%- if primary_action or secondary_action -%}
-	<div class="mt-5 sm:mt-8 sm:flex sm:justify-center lg:justify-start">
+	<div class="mt-5 sm:mt-8">
 		{%- if primary_action -%}
-		<div class="rounded-md shadow">
-			<a href="{{ primary_action }}"
-				class="flex items-center justify-center w-full px-8 py-3 text-base font-medium leading-6 text-white transition duration-150 ease-in-out border border-transparent rounded-md bg-primary-500 hover:bg-primary-400 focus:outline-none focus:shadow-outline md:py-4 md:text-lg md:px-10">
-				{{ primary_action_label }}
-			</a>
-		</div>
+		{{ c('button', label=primary_action_label, url=primary_action, variant="primary", size="large") }}
 		{%- endif -%}
 		{%- if secondary_action -%}
-		<div class="mt-3 sm:mt-0 sm:ml-3">
-			<a href="{{ secondary_action }}"
-				class="flex items-center justify-center w-full px-8 py-3 text-base font-medium leading-6 transition duration-150 ease-in-out border border-transparent rounded-md text-primary-700 bg-primary-100 hover:text-primary-600 hover:bg-primary-50 focus:outline-none focus:shadow-outline focus:border-primary-300 md:py-4 md:text-lg md:px-10">
-				{{ secondary_action_label }}
-			</a>
-		</div>
+		{{ c('button', label=secondary_action_label, url=secondary_action, variant="secondary", size="large", class="ml-4") }}
 		{%- endif -%}
 	</div>
 	{%- endif -%}
diff --git a/frappe/website/web_template/hero_with_right_image/hero_with_right_image.html b/frappe/website/web_template/hero_with_right_image/hero_with_right_image.html
index 57a1a02af7..8efc46a1b7 100644
--- a/frappe/website/web_template/hero_with_right_image/hero_with_right_image.html
+++ b/frappe/website/web_template/hero_with_right_image/hero_with_right_image.html
@@ -1,5 +1,5 @@
 <div class="relative flex">
-	<div class="relative flex items-center flex-shrink-0 w-full sm:w-7/12">
+	<div class="relative flex items-center flex-shrink-0 w-full md:w-6/12">
 		<div>
 			<h1
 				class="text-3xl font-extrabold leading-tight tracking-tight sm:leading-10 sm:text-4xl xl:leading-none xl:text-5xl">
@@ -22,8 +22,16 @@
 		</div>
 	</div>
 	{%- if image -%}
-	<div class="hidden sm:block lg:w-5/12">
-		<img class="object-cover w-full h-56 lg:h-full lg:w-full md:h-96 sm:h-72" src="{{ image }}" alt="">
-	</div>
+	{{ c('image_with_blur',
+		class=["hidden md:block max-h-144", "w-full md:w-6/12" if contain_image else "md:max-w-md lg:max-w-lg xl:max-w-xl xxl:max-w-2xl"],
+		src=image,
+		alt="")
+	}}
 	{%- endif -%}
 </div>
+
+{%- if not contain_image -%}
+<script>
+	document.addEventListener('DOMContentLoaded', () => document.body.classList.add('overflow-x-hidden'));
+</script>
+{%- endif -%}
diff --git a/frappe/website/web_template/hero_with_right_image/hero_with_right_image.json b/frappe/website/web_template/hero_with_right_image/hero_with_right_image.json
index bb841a3156..3cb4701e7c 100644
--- a/frappe/website/web_template/hero_with_right_image/hero_with_right_image.json
+++ b/frappe/website/web_template/hero_with_right_image/hero_with_right_image.json
@@ -21,6 +21,12 @@
    "label": "Image",
    "reqd": 0
   },
+  {
+   "fieldname": "contain_image",
+   "fieldtype": "Check",
+   "label": "Restrict Image inside Container",
+   "reqd": 0
+  },
   {
    "fieldname": "primary_action_label",
    "fieldtype": "Data",
@@ -47,7 +53,7 @@
   }
  ],
  "idx": 0,
- "modified": "2020-04-26 15:08:26.937576",
+ "modified": "2020-04-29 14:12:31.613545",
  "modified_by": "Administrator",
  "name": "Hero with Right Image",
  "owner": "Administrator",
diff --git a/frappe/website/web_template/navbar_with_links_on_right/navbar_with_links_on_right.html b/frappe/website/web_template/navbar_with_links_on_right/navbar_with_links_on_right.html
index ffa8be24da..01652f8c80 100644
--- a/frappe/website/web_template/navbar_with_links_on_right/navbar_with_links_on_right.html
+++ b/frappe/website/web_template/navbar_with_links_on_right/navbar_with_links_on_right.html
@@ -6,8 +6,8 @@
 			</a>
 		</div>
 		<details class="z-10 flex items-center sm:hidden hide-summary-arrow">
-			<summary>
-				<button>
+			<summary class="block h-6 list-none cursor-pointer focus:outline-none focus:shadow-outline">
+				<button class="pointer-events-none">
 					<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
 						stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
 						class="feather feather-menu">
diff --git a/frappe/website/web_template/section_with_cards/section_with_cards.html b/frappe/website/web_template/section_with_cards/section_with_cards.html
index 9eb79e7131..d408275b44 100644
--- a/frappe/website/web_template/section_with_cards/section_with_cards.html
+++ b/frappe/website/web_template/section_with_cards/section_with_cards.html
@@ -5,9 +5,9 @@
 	'p-8': card_size == 'Large'
 }) -%}
 {%- set title_classes = resolve_class({
-	'text-base': card_size == 'Small',
-	'text-lg md:text-xl': card_size == 'Medium',
-	'text-xl md:text-2xl': card_size == 'Large'
+	'text-base font-semibold': card_size == 'Small',
+	'text-lg md:text-xl font-semibold': card_size == 'Medium',
+	'text-xl md:text-2xl font-bold': card_size == 'Large'
 }) -%}
 {%- set content_classes = resolve_class({
 	'text-sm': card_size == 'Small',
@@ -16,8 +16,8 @@
 }) -%}
 
 <a href="{{ url or '#' }}"
-	class="block bg-white border rounded-xl hover:shadow-lg {{ card_classes }}">
-	<h3 class="font-semibold {{ title_classes }}">{{ title }}</h3>
+	class="block bg-white border rounded-xl hover:border-gray-600 {{ card_classes }}">
+	<h3 class="leading-none {{ title_classes }}">{{ title }}</h3>
 	<p class="mt-4 text-gray-900 {{ content_classes }}">{{ content or '' }}</p>
 </a>
 {%- endmacro -%}
diff --git a/frappe/website/web_template/section_with_cards/section_with_cards.json b/frappe/website/web_template/section_with_cards/section_with_cards.json
index 89426651ad..9ec430ae60 100644
--- a/frappe/website/web_template/section_with_cards/section_with_cards.json
+++ b/frappe/website/web_template/section_with_cards/section_with_cards.json
@@ -22,153 +22,201 @@
    "options": "Small\nMedium\nLarge",
    "reqd": 0
   },
+  {
+   "fieldname": "card_1",
+   "fieldtype": "Section Break",
+   "label": "Card 1",
+   "reqd": 0
+  },
   {
    "fieldname": "card_1_title",
    "fieldtype": "Data",
-   "label": "Card 1 Title",
+   "label": "Title",
    "reqd": 0
   },
   {
    "fieldname": "card_1_content",
    "fieldtype": "Small Text",
-   "label": "Card 1 Content",
+   "label": "Content",
    "reqd": 0
   },
   {
    "fieldname": "card_1_url",
    "fieldtype": "Data",
-   "label": "Card 1 URL",
+   "label": "URL",
+   "reqd": 0
+  },
+  {
+   "fieldname": "card_2",
+   "fieldtype": "Section Break",
+   "label": "Card 2",
    "reqd": 0
   },
   {
    "fieldname": "card_2_title",
    "fieldtype": "Data",
-   "label": "Card 2 Title",
+   "label": "Title",
    "reqd": 0
   },
   {
    "fieldname": "card_2_content",
    "fieldtype": "Small Text",
-   "label": "Card 2 Content",
+   "label": "Content",
    "reqd": 0
   },
   {
    "fieldname": "card_2_url",
    "fieldtype": "Data",
-   "label": "Card 2 URL",
+   "label": "URL",
+   "reqd": 0
+  },
+  {
+   "fieldname": "card_3",
+   "fieldtype": "Section Break",
+   "label": "Card 3",
    "reqd": 0
   },
   {
    "fieldname": "card_3_title",
    "fieldtype": "Data",
-   "label": "Card 3 Title",
+   "label": "Title",
    "reqd": 0
   },
   {
    "fieldname": "card_3_content",
    "fieldtype": "Small Text",
-   "label": "Card 3 Content",
+   "label": "Content",
    "reqd": 0
   },
   {
    "fieldname": "card_3_url",
    "fieldtype": "Data",
-   "label": "Card 3 URL",
+   "label": "URL",
+   "reqd": 0
+  },
+  {
+   "fieldname": "card_4",
+   "fieldtype": "Section Break",
+   "label": "Card 4",
    "reqd": 0
   },
   {
    "fieldname": "card_4_title",
    "fieldtype": "Data",
-   "label": "Card 4 Title",
+   "label": "Title",
    "reqd": 0
   },
   {
    "fieldname": "card_4_content",
    "fieldtype": "Small Text",
-   "label": "Card 4 Content",
+   "label": "Content",
    "reqd": 0
   },
   {
    "fieldname": "card_4_url",
    "fieldtype": "Data",
-   "label": "Card 4 URL",
+   "label": "URL",
+   "reqd": 0
+  },
+  {
+   "fieldname": "card_5",
+   "fieldtype": "Section Break",
+   "label": "Card 5",
    "reqd": 0
   },
   {
    "fieldname": "card_5_title",
    "fieldtype": "Data",
-   "label": "Card 5 Title",
+   "label": "Title",
    "reqd": 0
   },
   {
    "fieldname": "card_5_content",
    "fieldtype": "Small Text",
-   "label": "Card 5 Content",
+   "label": "Content",
    "reqd": 0
   },
   {
    "fieldname": "card_5_url",
    "fieldtype": "Data",
-   "label": "Card 5 URL",
+   "label": "URL",
+   "reqd": 0
+  },
+  {
+   "fieldname": "card_6",
+   "fieldtype": "Section Break",
+   "label": "Card 6",
    "reqd": 0
   },
   {
    "fieldname": "card_6_title",
    "fieldtype": "Data",
-   "label": "Card 6 Title",
+   "label": "Title",
    "reqd": 0
   },
   {
    "fieldname": "card_6_content",
    "fieldtype": "Small Text",
-   "label": "Card 6 Content",
+   "label": "Content",
    "reqd": 0
   },
   {
    "fieldname": "card_6_url",
    "fieldtype": "Data",
-   "label": "Card 6 URL",
+   "label": "URL",
+   "reqd": 0
+  },
+  {
+   "fieldname": "card_7",
+   "fieldtype": "Section Break",
+   "label": "Card 7",
    "reqd": 0
   },
   {
    "fieldname": "card_7_title",
    "fieldtype": "Data",
-   "label": "Card 7 Title",
+   "label": "Title",
    "reqd": 0
   },
   {
    "fieldname": "card_7_content",
    "fieldtype": "Small Text",
-   "label": "Card 7 Content",
+   "label": "Content",
    "reqd": 0
   },
   {
    "fieldname": "card_7_url",
    "fieldtype": "Data",
-   "label": "Card 7 URL",
+   "label": "URL",
+   "reqd": 0
+  },
+  {
+   "fieldname": "card_8",
+   "fieldtype": "Section Break",
+   "label": "Card 8",
    "reqd": 0
   },
   {
    "fieldname": "card_8_title",
    "fieldtype": "Data",
-   "label": "Card 8 Title",
+   "label": "Title",
    "reqd": 0
   },
   {
    "fieldname": "card_8_content",
    "fieldtype": "Small Text",
-   "label": "Card 8 Content",
+   "label": "Content",
    "reqd": 0
   },
   {
    "fieldname": "card_8_url",
    "fieldtype": "Data",
-   "label": "Card 8 URL",
+   "label": "URL",
    "reqd": 0
   }
  ],
  "idx": 0,
- "modified": "2020-04-21 21:24:04.192839",
+ "modified": "2020-04-29 22:40:03.362229",
  "modified_by": "Administrator",
  "name": "Section with Cards",
  "owner": "Administrator",
diff --git a/frappe/website/web_template/section_with_cta/section_with_cta.html b/frappe/website/web_template/section_with_cta/section_with_cta.html
index e577aa7235..415392f751 100644
--- a/frappe/website/web_template/section_with_cta/section_with_cta.html
+++ b/frappe/website/web_template/section_with_cta/section_with_cta.html
@@ -1,12 +1,12 @@
 <div class="relative">
 	<div class="px-8 py-12 text-center sm:px-12 md:py-20 bg-primary-100 rounded-xl">
-		<h2 class="max-w-xl mx-auto text-2xl font-bold leading-tight md:text-3xl xl:text-4xl">{{ title }}</h2>
-		<p class="max-w-xl mx-auto mt-2 text-base text-gray-900 sm:text-lg">{{ subtitle }}</p>
+		<h2 class="max-w-xl mx-auto text-2xl font-extrabold leading-tight md:text-4xl">{{ title }}</h2>
+		<p class="max-w-xl mx-auto mt-2 text-base text-gray-900 md:text-lg">{{ subtitle }}</p>
 		<p class="mt-8">
 			{{ c('button', label=cta_label, url=cta_url, variant="primary", size="large") }}
 		</p>
 		{%- if cta_description -%}
-		<div class="max-w-xl mx-auto mt-2 text-sm text-gray-900">
+		<div class="max-w-xl mx-auto mt-2 text-xs text-gray-900">
 			{{ cta_description }}
 		</div>
 		{%- endif -%}
diff --git a/frappe/website/website_theme/standard/standard.json b/frappe/website/website_theme/standard/standard.json
index ca9e81bf27..1729e4616a 100644
--- a/frappe/website/website_theme/standard/standard.json
+++ b/frappe/website/website_theme/standard/standard.json
@@ -10,7 +10,7 @@
  "font_properties": "300,600",
  "footer": [],
  "idx": 26,
- "modified": "2020-04-24 23:52:27.211811",
+ "modified": "2020-04-29 12:26:48.399125",
  "modified_by": "Administrator",
  "module": "Website",
  "name": "Standard",
diff --git a/tailwind.config.js b/tailwind.config.js
index e75ff16e85..03678ee166 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -46,6 +46,9 @@ module.exports = {
 			borderRadius: {
 				xl: '0.75rem'
 			},
+			maxHeight: {
+				'144': '36rem'
+			},
 			boxShadow: theme => ({
 				'outline-primary': `0 0 0 3px ${rgba(theme('colors.blue.300'), 0.45)}`
 			}),