Improve styles of multiview demo

Incorporates layout styles from the version on dgrid.io

demos/multiview/multiview.js

@@ -12,15 +12,19 @@ define([
 	"dojo/text!./resources/description.html"
 ], function(Grid, Selection, Keyboard, declare, domConstruct, on, query, Memory, Observable, put, descriptionHtml){
 	// Render DOM
-	domConstruct.place(descriptionHtml, document.body);
-	var switchNode = put("p", "Switch View: "),
+	var containerNode = put(document.body, "div"),
+		switchNode = put("div.controls", "Select View: "),
 		tableButton = put(switchNode, "button[type=button]", "Table"),
 		detailsButton = put(switchNode, "button[type=button]", "Details"),
 		galleryButton = put(switchNode, "button[type=button]", "Gallery"),
+		contentNode = put("div.content"),
 		gridNode;
 
-	put(document.body, switchNode);
-	gridNode = put(document.body, "div#grid.table");
+	put(containerNode, switchNode);
+
+	gridNode = put(contentNode, "div#grid.table");
+	domConstruct.place(descriptionHtml, contentNode);
+	put(containerNode, contentNode);
 
 	var grid, store, origRenderRow, expandoListener, expandedNode,
 		renderers = {

demos/multiview/resources/description.html

@@ -1,3 +1,4 @@
+<h3>About</h3>
 <p>
 	This page demonstrates presenting several different views within a single
 	Grid instance, by swapping out the <code>renderRow</code> function.

demos/multiview/resources/multiview.css

@@ -1,9 +1,32 @@
+.content h3 {
+	margin: 1em 0 0.5em;
+}
+
 #grid {
 	width: 80%;
 	margin: auto;
 	height: 332px; /* tall enough for 2 rows in gallery view */
 }
 
+.controls,
+.content {
+	width: 944px;
+	margin: 0 auto;
+	padding: 2em;
+}
+
+.controls {
+	background: #000;
+	padding: 1.25em 2em;
+	color: #fff;
+	text-align: center;
+}
+
+.controls button {
+	margin: 0 0.5em;
+	padding: 0 1em;
+}
+
 /* styles for icon node in various views */
 
 .icon {
@@ -46,7 +69,14 @@
 
 .table .expando {
 	/* style of area containing summary, expanded on click */
-	padding-left: 40px;
+	border-bottom: 1px solid #ccc !important;
+	padding: 0.7em 1em 0.5em 3em;
+	background: #fff;
+	background: -moz-linear-gradient(top,  rgba(255,255,255,1) 24%, rgba(237,237,237,1) 100%);
+	background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 24%,rgba(237,237,237,1) 100%);
+	background: -ms-linear-gradient(top,  rgba(255,255,255,1) 24%,rgba(237,237,237,1) 100%);
+	background: linear-gradient(top,  rgba(255,255,255,1) 24%,rgba(237,237,237,1) 100%);
+	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 );
 }
 
 .table .collapsed .expando {