diff --git a/css/main.css b/css/main.css
index 78ffce56..71159ea9 100644
--- a/css/main.css
+++ b/css/main.css
@@ -1,6 +1,6 @@
 body {
-	background-color: White;
-	font-family: sans-serif;
+	background-image: url(../img/honeycomb.png);
+    background-repeat: repeat;
 }
 
 #navbar {
@@ -40,16 +40,6 @@ body {
 	display: inline-block;
 }
 
-.wmd-button>span {
-	background-image: url(../img/wmd-buttons.png);
-	background-repeat: no-repeat;
-	background-position: 0px 0px;
-	width: 20px;
-	height: 20px;
-	display: inline-block;
-	border: 1px solid #f2f2f2;
-}
-
 .wmd-prompt-background {
 	background-color: Black;
 }
@@ -97,6 +87,15 @@ body {
 	height: 18px !important;
 }
 
+.ui-layout-toggler-south {
+	margin-top: 3px !important;
+	height: 18px !important;
+}
+
+.ui-layout-toggler-south .caret {
+  margin-top: 6px;
+}
+
 .ui-layout-toggler-north-open .caret,
 .ui-layout-toggler-south-closed .caret {
   border-bottom: 5px solid #525252;
@@ -119,13 +118,17 @@ body {
     width: 18px !important;
 }
 
+.ui-layout-toggler-east .caret,
+.ui-layout-toggler-west .caret {
+  margin-top: 40px;
+}
+
 .ui-layout-toggler-east-open .caret,
 .ui-layout-toggler-west-closed .caret {
   border-bottom: 5px solid transparent;
   border-top: 5px solid transparent;
   border-left: 5px solid #525252;
   border-right: 0;
-  margin-top: 40px;
 }
 
 .ui-layout-toggler-east-closed .caret,
@@ -134,5 +137,4 @@ body {
   border-top: 5px solid transparent;
   border-right: 5px solid #525252;
   border-left: 0;
-  margin-top: 40px;
 }
diff --git a/img/honeycomb.png b/img/honeycomb.png
new file mode 100644
index 00000000..97fd6fe2
Binary files /dev/null and b/img/honeycomb.png differ
diff --git a/index.html b/index.html
index e2cb8784..948b463b 100644
--- a/index.html
+++ b/index.html
@@ -82,7 +82,7 @@
 		</div>
 	</div>
 	<textarea id="wmd-input" class="ui-layout-center"></textarea>
-	<div id="wmd-preview" class="well ui-layout-east"></div>
+	<div class="ui-layout-east"></div>
 	<div class="ui-layout-south"></div>
 	<div id="remove-file-confirm" class="modal hide">
 		<div class="modal-header">
diff --git a/js/main.js b/js/main.js
index 820bdaad..18b19253 100644
--- a/js/main.js
+++ b/js/main.js
@@ -26,7 +26,7 @@ var fileManager = (function($) {
 		});
 		$("#file-title-input").blur(function() {
 			var title = $.trim($(this).val());
-			if(title) {
+			if (title) {
 				var fileIndex = localStorage["file.current"];
 				localStorage[fileIndex + ".title"] = title;
 			}
@@ -36,39 +36,39 @@ var fileManager = (function($) {
 			fileManager.updateFileTitleUI();
 		});
 	};
-	
+
 	fileManager.selectFile = function() {
 		// If file system does not exist
-		if(!localStorage["file.count"]) {
+		if (!localStorage["file.count"]) {
 			localStorage.clear();
 			localStorage["file.count"] = 0;
 		}
 		this.updateFileDescList();
 		// If no file create one
-		if(this.fileDescList.length === 0) {
+		if (this.fileDescList.length === 0) {
 			this.createFile();
 			this.updateFileDescList();
 		}
 		// If no default file take first one
-		if(!localStorage["file.current"]) {
+		if (!localStorage["file.current"]) {
 			localStorage["file.current"] = this.fileDescList[0].index;
 		}
 		// Update the editor and the file title
 		var fileIndex = localStorage["file.current"];
 		$("#wmd-input").val(localStorage[fileIndex + ".content"]);
 		createEditor();
-        this.updateFileTitleUI();
+		this.updateFileTitleUI();
 	};
 
 	fileManager.createFile = function(title) {
-		if(!title) {
+		if (!title) {
 			title = "Filename";
 		}
 		// Find a fileIndex
 		var fileCount = parseInt(localStorage["file.count"]);
 		var i;
-		for(i=0; i<fileCount; i++) {
-			if(!localStorage["file." + i + ".title"]) {
+		for (i = 0; i < fileCount; i++) {
+			if (!localStorage["file." + i + ".title"]) {
 				break;
 			}
 		}
@@ -77,29 +77,30 @@ var fileManager = (function($) {
 		localStorage[fileIndex + ".content"] = "";
 		localStorage[fileIndex + ".title"] = title;
 		localStorage["file.current"] = fileIndex;
-		if(i == fileCount) {
+		if (i == fileCount) {
 			localStorage["file.count"] = fileCount + 1;
 		}
 	};
-	
+
 	fileManager.deleteFile = function() {
 		var fileIndex = localStorage["file.current"];
 		localStorage.removeItem("file.current");
 		localStorage.removeItem(fileIndex + ".title");
 		localStorage.removeItem(fileIndex + ".content");
 	};
-	
+
 	fileManager.updateFileDescList = function() {
 		var fileCount = parseInt(localStorage["file.count"]);
 		var lastIndex = -1;
 		this.fileDescList = [];
 		$("#file-selector").empty();
-		for(var i=0; i<fileCount; i++) {
+		for ( var i = 0; i < fileCount; i++) {
 			var fileIndex = "file." + i;
 			var title = localStorage[fileIndex + ".title"];
-			if(title) {
+			if (title) {
 				lastIndex = i;
-				this.fileDescList.push({"index": fileIndex, "title": title});
+				this.fileDescList
+					.push({ "index" : fileIndex, "title" : title });
 			}
 		}
 		localStorage["file.count"] = lastIndex + 1;
@@ -111,41 +112,40 @@ var fileManager = (function($) {
 			return 0;
 		});
 	};
-    
-    fileManager.updateFileTitleUI = function() {
-        // Update the editor and the file title
+
+	fileManager.updateFileTitleUI = function() {
+		// Update the editor and the file title
 		var fileIndex = localStorage["file.current"];
 		var title = localStorage[fileIndex + ".title"];
 		document.title = "StackEdit - " + title;
 		$(".file-title").text(title);
 		$("#file-title-input").val(title);
 		$("#file-selector").empty();
-		
-		for(var i=0; i<this.fileDescList.length; i++) {
+
+		for ( var i = 0; i < this.fileDescList.length; i++) {
 			var fileDesc = this.fileDescList[i];
 			var a = $("<a>").text(fileDesc.title);
 			var li = $("<li>").append(a);
-			if(fileDesc.index == fileIndex) {
+			if (fileDesc.index == fileIndex) {
 				li.addClass("disabled");
-			}
-			else {
-				a.attr("href", "javascript:void(0);")
-                .click((function(fileIndex) {
-					return function() {
-						localStorage["file.current"] = fileIndex;
-						fileManager.selectFile();
-					};
-				})(fileDesc.index));
+			} else {
+				a.attr("href", "javascript:void(0);").click(
+					(function(fileIndex) {
+						return function() {
+							localStorage["file.current"] = fileIndex;
+							fileManager.selectFile();
+						};
+					})(fileDesc.index));
 			}
 			$("#file-selector").append(li);
 		}
-    };
+	};
 
 	fileManager.saveFile = function() {
 		var content = $("#wmd-input").val();
 		var fileIndex = localStorage["file.current"];
 		localStorage[fileIndex + ".content"] = content;
-		//insertFile(this.currentFile, this.content);
+		// insertFile(this.currentFile, this.content);
 	};
 
 	return fileManager;
@@ -168,7 +168,8 @@ var gdrive = (function($) {
 				var state = JSON.parse(decodeURI((/state=(.+?)(&|$)/
 					.exec(location.search) || [ , null ])[1]));
 				if (state.action == 'create') {
-					gdrive.createFile(state.folderId, fileManager.currentFile, fileManager.content);
+					gdrive.createFile(state.folderId, fileManager.currentFile,
+						fileManager.content);
 				}
 
 			} catch (e) {
@@ -197,7 +198,8 @@ var gdrive = (function($) {
 		var close_delim = "\r\n--" + boundary + "--";
 
 		var contentType = 'text/x-markdown';
-		var metadata = { 'title' : title, 'mimeType' : contentType, 'parents' : [ { 'kind' : 'drive#fileLink', 'id' : folderId } ] };
+		var metadata = { 'title' : title, 'mimeType' : contentType,
+			'parents' : [ { 'kind' : 'drive#fileLink', 'id' : folderId } ] };
 
 		var base64Data = btoa(content);
 		var multipartRequestBody = delimiter
@@ -222,23 +224,24 @@ var gdrive = (function($) {
 
 function createEditor() {
 	$("#wmd-button-bar").empty();
-    var converter = Markdown.getSanitizingConverter();
-    var editor = new Markdown.Editor(converter);
-    editor.run();
-    
-    $(".wmd-button-row").addClass("btn-group").find("li:not(.wmd-spacer)").addClass("btn").css("left", 0).find("span").hide();
-    $("#wmd-bold-button").append($("<i>").addClass("icon-bold"));
-    $("#wmd-italic-button").append($("<i>").addClass("icon-italic"));
-    $("#wmd-link-button").append($("<i>").addClass("icon-globe"));
-    $("#wmd-quote-button").append($("<i>").addClass("icon-indent-left"));
-    $("#wmd-code-button").append($("<i>").addClass("icon-code"));
-    $("#wmd-image-button").append($("<i>").addClass("icon-picture"));
-    $("#wmd-olist-button").append($("<i>").addClass("icon-numbered-list"));
-    $("#wmd-ulist-button").append($("<i>").addClass("icon-list"));
-    $("#wmd-heading-button").append($("<i>").addClass("icon-text-height"));
-    $("#wmd-hr-button").append($("<i>").addClass("icon-hr"));
-    $("#wmd-undo-button").append($("<i>").addClass("icon-undo"));
-    $("#wmd-redo-button").append($("<i>").addClass("icon-share-alt"));
+	var converter = Markdown.getSanitizingConverter();
+	var editor = new Markdown.Editor(converter);
+	editor.run();
+
+	$(".wmd-button-row").addClass("btn-group").find("li:not(.wmd-spacer)")
+		.addClass("btn").css("left", 0).find("span").hide();
+	$("#wmd-bold-button").append($("<i>").addClass("icon-bold"));
+	$("#wmd-italic-button").append($("<i>").addClass("icon-italic"));
+	$("#wmd-link-button").append($("<i>").addClass("icon-globe"));
+	$("#wmd-quote-button").append($("<i>").addClass("icon-indent-left"));
+	$("#wmd-code-button").append($("<i>").addClass("icon-code"));
+	$("#wmd-image-button").append($("<i>").addClass("icon-picture"));
+	$("#wmd-olist-button").append($("<i>").addClass("icon-numbered-list"));
+	$("#wmd-ulist-button").append($("<i>").addClass("icon-list"));
+	$("#wmd-heading-button").append($("<i>").addClass("icon-text-height"));
+	$("#wmd-hr-button").append($("<i>").addClass("icon-hr"));
+	$("#wmd-undo-button").append($("<i>").addClass("icon-undo"));
+	$("#wmd-redo-button").append($("<i>").addClass("icon-share-alt"));
 }
 
 var layoutOrientation = 0;
@@ -247,16 +250,27 @@ function createLayout() {
 	var layoutGlobalConfig = { closable : true, resizable : false,
 		slidable : false, livePaneResizing : true, spacing_open : 20,
 		spacing_closed : 20, togglerLength_open : 90,
-		togglerLength_closed : 90, center__minWidth : 200,
+		togglerLength_closed : 90, center__minWidth : 100, center__minHeight : 100,
 		stateManagement__enabled : false, };
 	if (layoutOrientation === 0) {
+		$(".ui-layout-east").addClass("well").attr("id", "wmd-preview");
 		layout = $('body').layout(
 			$.extend(layoutGlobalConfig,
 				{ east__resizable : true, east__size : .5, east__minSize : 200,
 					south__closable : false, }));
+	} else if (layoutOrientation === 1) {
+		$(".ui-layout-east").remove();
+		$(".ui-layout-south").addClass("well").attr("id", "wmd-preview");
+		layout = $('body').layout(
+			$.extend(layoutGlobalConfig, { south__resizable : true,
+				south__size : .5, south__minSize : 200, }));
 	}
-	$(".ui-layout-toggler-north").addClass("btn").append($("<b>").addClass("caret"));
-	$(".ui-layout-toggler-east").addClass("btn").append($("<b>").addClass("caret"));
+	$(".ui-layout-toggler-north").addClass("btn").append(
+		$("<b>").addClass("caret"));
+	$(".ui-layout-toggler-south").addClass("btn").append(
+		$("<b>").addClass("caret"));
+	$(".ui-layout-toggler-east").addClass("btn").append(
+		$("<b>").addClass("caret"));
 }
 
 (function($) {