diff --git a/rpg-docs/Routes/Routes.js b/rpg-docs/Routes/Routes.js
index 7a9c2f2f..7a26c2cc 100644
--- a/rpg-docs/Routes/Routes.js
+++ b/rpg-docs/Routes/Routes.js
@@ -4,18 +4,9 @@ Router.configure({
 });
 
 Router.plugin("ensureSignedIn", {
-	except: [
-		"home",
-		"characterSheet",
-		"atSignIn",
-		"atSignUp",
-		"atForgotPassword",
-		"atResetPwd",
-		"atEnrollAccount",
-		"atVerifyEmail",
-		"atResendVerificationEmail",
-		"loginButtons",
-		"notFound",
+	only: [
+		"profile",
+		"characterList",
 	]
 });
 
@@ -94,4 +85,11 @@ Router.map(function() {
 			document.title = appName;
 		},
 	});
+
+	this.route("/guide", {
+		name: "guide",
+		onAfterAction: function() {
+			document.title = appName;
+		},
+	});
 });
diff --git a/rpg-docs/client/style/colors.scss b/rpg-docs/client/style/colors.scss
index f98b53d3..6f501aa9 100644
--- a/rpg-docs/client/style/colors.scss
+++ b/rpg-docs/client/style/colors.scss
@@ -70,8 +70,8 @@
 	background-color: #9E9E9E;
 }
 
-.blue-grey {
-	background-color: #607D8B;
+.app-grey {
+	background-color: #424242;
 }
 
 .white {
diff --git a/rpg-docs/client/style/main.scss b/rpg-docs/client/style/main.scss
index a282ab4f..77a3172f 100644
--- a/rpg-docs/client/style/main.scss
+++ b/rpg-docs/client/style/main.scss
@@ -19,6 +19,16 @@ body {
 	background-color: #E0E0E0;
 }
 
+//fix tabs and core-toolbar having box shadow
+core-toolbar {
+	box-shadow: none;
+}
+
+//give drawer panel a shadow always
+core-header-panel[drawer] {
+	box-shadow: 2px 0px 5px 0px rgba(0,0,0,0.2);
+}
+
 //Horizontal rule
 hr {
 	background-color: #444;
diff --git a/rpg-docs/client/views/characterList/characterList.html b/rpg-docs/client/views/characterList/characterList.html
index e3a89a6f..66923574 100644
--- a/rpg-docs/client/views/characterList/characterList.html
+++ b/rpg-docs/client/views/characterList/characterList.html
@@ -1,5 +1,5 @@
 <template name="characterList">
-	<core-toolbar class="blue-grey white-text">
+	<core-toolbar class="app-grey white-text">
 		<core-icon-button icon="menu" core-drawer-toggle></core-icon-button>
 		<div flex>
 			Characters
diff --git a/rpg-docs/client/views/guide/guide.html b/rpg-docs/client/views/guide/guide.html
index 0abc0378..c03e65bb 100644
--- a/rpg-docs/client/views/guide/guide.html
+++ b/rpg-docs/client/views/guide/guide.html
@@ -1,4 +1,8 @@
 <template name="guide">
+	<core-toolbar class="app-grey white-text">
+		<core-icon-button icon="menu" core-drawer-toggle></core-icon-button>
+		<div flex>Guide</div>
+	</core-toolbar>
 	<div layout vertical center>
 		<paper-shadow class="wallOfText card" style="padding: 32px; max-width: 800px;">
 			<h2>Character Sheet Philosophy</h2>
diff --git a/rpg-docs/client/views/home/home.html b/rpg-docs/client/views/home/home.html
index 8ecbd6d4..053a016d 100644
--- a/rpg-docs/client/views/home/home.html
+++ b/rpg-docs/client/views/home/home.html
@@ -1,28 +1,9 @@
-<template name="home">	
-	<core-toolbar class="medium-tall {{colorClass}}">
+<template name="home">
+	<core-toolbar class="app-grey white-text">
 		<core-icon-button icon="menu" core-drawer-toggle></core-icon-button>
 		<div flex>
-			DiceCloud
-		</div>
-		<div class="bottom fit" horizontal layout>
-			<paper-tabs flex horizontal center layout selected={{selectedTab}} class="grey white-text homeTabs">
-				<paper-tab name="stats">Home</paper-tab>
-				<paper-tab name="features">Guide</paper-tab>
-			</paper-tabs>
+			Home
 		</div>
 	</core-toolbar>
-	<div fit>
-		<core-animated-pages class="tabPages" selected={{selectedTab}} transitions="slide-from-right" fit>
-			<section flex name="stats">
-				<div class="scroll-y" fit>
-					{{> intro}}
-				</div>
-			</section>
-			<section flex name="features">
-				<div class="scroll-y" fit>
-					{{> guide}}
-				</div>
-			</section>
-		</core-animated-pages>
-	</div>
+	{{> intro}}
 </template>
\ No newline at end of file
diff --git a/rpg-docs/client/views/home/intro/intro.html b/rpg-docs/client/views/home/intro/intro.html
index 998492be..10166e47 100644
--- a/rpg-docs/client/views/home/intro/intro.html
+++ b/rpg-docs/client/views/home/intro/intro.html
@@ -1,53 +1,89 @@
 <template name="intro">
 	<div class="intro">
-		<div class="fullwidth">
-			<h1>
-				Online, realtime, unofficial D&amp;D 5e app.
-			</h1>
-			<p>
+		<div class="section white-text" style="background: #282828">
+			<div class="display2">
+				Dice Cloud
+			</div>
+			<img style="width:130px; height:130px; background-color: #282828;"
+						src="/crown-dice-logo-cropped-transparent.png">
+			<div class="display1">
+				Unofficial Online Realtime D&amp;D 5e App
+			</div>
+			<h2>
 				Spend less time shuffling paper and more time playing the game
-			</p>
+			</h2>
+			{{#unless currentUser}}
+			<div layout horizontal around-justified wrap>
+				<paper-button class="red white-text signInButton"
+							  style="margin: 16px;"
+							  raised>
+					Sign In
+				</paper-button>
+				<paper-button class="red white-text signUpButton"
+							  style="margin: 16px;"
+							  raised>
+					Sign Up
+				</paper-button>
+			</div>
+			{{else}}
+			<div style="padding-bottom: 0;"></div>
+			{{/unless}}
 		</div>
-		<div class="fullwidth">
-			<h1>Open Beta</h1>
-			<p>Free to use, updates almost every week</p>
+		<div class="section" style="background-color: #e9e9e9;">
+			<div>
+				<div class="display1">Character Sheet Open Beta</div>
+				<h2 style="margin-bottom: 16px;">
+					Check out the example characters
+				</h2>
+				<div layout horizontal around-justified wrap>
+					<paper-shadow class="card characterCard ssArcher clickable"
+								  z="2">
+						<div class="top subhead green white-text">
+							<div class="subhead" flex>
+								Starter Set Archer
+							</div>
+						</div>
+						<div class="bottom text">Lawful Good Human</div>
+					</paper-shadow>
+				</div>
+			</div>
 		</div>
-		<div class="fullwidth">
-			<h1>See it in action</h1>
-			<a href="/character/yBWwt5XQTTHZiRQxq">Starter Set Archer</a>
-		</div>
-		<div class="fullwidth">
-			<h1>Check out the guide</h1>
-			<p>Learn how your class gives you features, those features have effects, and those effects determine your stats.</p>
-		</div>
-		<div class="fullwidth">
-			<h1>
-				Discuss
-			</h1>
-			<p>
-				On the official 
-				<a href="http://reddit.com/r/dicecloud">
-					DiceCloud subreddit
-				</a>
-			</p>
-		</div>
-		<div class="fullwidth">
-			<h1>
-				Get involved
-			</h1>
-			<p>Shape upcoming features and track bugs on the 
-				<a href="https://trello.com/b/94M0SCnq/dicecloud-roadmap">
-					DiceCloud Trello board
-				</a>
-			</p>
-		</div>
-		<div class="fullwidth">
-			<h1>
-				Send feedback instantly
-			</h1>
-			<p>
-				Use the feedback button in the sidebar to drop the developer a direct message
-			</p>
+		<div class="section white-text" style="background: #282828">
+			<div class="columns" layout horizontal around-justified wrap>
+				<div>
+					<h1>Check out the guide</h1>
+					<p>
+						Learn how your class gives you features, those features have effects,
+						and those effects determine your stats.
+						<paper-button class="guideButton">View Guide</paper-button>
+					</p>
+				</div>
+				<div>
+					<h1>
+						Discuss
+					</h1>
+					<p>
+						On the official subreddit
+						<paper-button class="redditButton">
+							<a href="http://www.reddit.com/r/dicecloud/">
+								/r/dicecloud
+							</a>
+						</paper-button>
+					</p>
+				</div>
+				<div>
+					<h1>
+						Get involved
+					</h1>
+					<p>Shape upcoming features and track bugs on the Dice Cloud Trello board
+						<paper-button class="trelloButton">
+							<a href="https://trello.com/b/94M0SCnq/dicecloud-roadmap">
+								Trello Roadmap
+							</a>
+						</paper-button>
+					</p>
+				</div>
+			</div>
 		</div>
 	</div>
 </template>
diff --git a/rpg-docs/client/views/home/intro/intro.js b/rpg-docs/client/views/home/intro/intro.js
new file mode 100644
index 00000000..75d5e01f
--- /dev/null
+++ b/rpg-docs/client/views/home/intro/intro.js
@@ -0,0 +1,14 @@
+Template.intro.events({
+	"tap .signInButton": function() {
+		Router.go("/sign-in");
+	},
+	"tap .signUpButton": function() {
+		Router.go("/sign-up");
+	},
+	"tap .ssArcher": function() {
+		Router.go("/character/yBWwt5XQTTHZiRQxq");
+	},
+	"tap .guideButton": function() {
+		Router.go("/guide");
+	},
+});
diff --git a/rpg-docs/client/views/home/intro/intro.scss b/rpg-docs/client/views/home/intro/intro.scss
index 135f4a93..0ce93765 100644
--- a/rpg-docs/client/views/home/intro/intro.scss
+++ b/rpg-docs/client/views/home/intro/intro.scss
@@ -1,12 +1,33 @@
 .intro {
-	.fullwidth {
+	.section {
 		width: 100%;
-		padding: 16px;
+		min-height: 200px;
 		display: flex;
 		align-items: center;
+		justify-content: center;
 		flex-direction: column;
-		p, h1 {
-			max-width: 450px;
+		padding-top: 24px;
+		padding-bottom: 24px;
+		& > div, & > h2 {
+			padding: 32px;
+			.display1 {
+				margin-bottom: 16px;
+			}
+		}
+		.columns > div{
+			max-width: 300px;
+			padding: 16px;
+			text-align: center;
+			paper-button {
+				color: #FF5252;
+			}
+		}
+	}
+	paper-button {
+		min-width: 200px;
+		a {
+			color: inherit;
+			text-decoration: inherit;
 		}
 	}
 }
diff --git a/rpg-docs/client/views/layout/imports.html b/rpg-docs/client/views/layout/imports.html
index 9d25c4e2..911456ec 100644
--- a/rpg-docs/client/views/layout/imports.html
+++ b/rpg-docs/client/views/layout/imports.html
@@ -8,6 +8,7 @@
 <link rel="import" href="/components/core-icons/editor-icons.html">
 <link rel="import" href="/components/core-icons/image-icons.html">
 <link rel="import" href="/components/core-icons/social-icons.html">
+<link rel="import" href="/components/core-image/core-image.html">
 <link rel="import" href="/components/core-item/core-item.html">
 <link rel="import" href="/components/core-menu/core-menu.html">
 <link rel="import" href="/components/core-scaffold/core-scaffold.html">
diff --git a/rpg-docs/client/views/layout/layout.html b/rpg-docs/client/views/layout/layout.html
index 78802f05..a6e40935 100644
--- a/rpg-docs/client/views/layout/layout.html
+++ b/rpg-docs/client/views/layout/layout.html
@@ -3,7 +3,8 @@
 		<core-header-panel drawer navigation flex mode="seamed" class="white">
 			<div id="accountSummary">
 				{{#if currentUser}}
-					<div id="profileLink" style="text-decoration: underline; cursor: pointer;">
+					<div id="profileLink"
+						 style="text-decoration: underline; cursor: pointer; font-size: 16px;">
 						{{profileLink}}
 					</div>
 				{{else}}
@@ -13,6 +14,7 @@
 			<div id="navPanel">
 				<core-item id="homeNav" icon="home" label="Home"></core-item>
 				{{> characterSideList}}
+				<core-item id="guide" icon="social:school" label="Guide"></core-item>
 				<core-item id="feedback" icon="bug-report" label="Send Feedback"></core-item>
 				<core-item id="changeLog" icon="list" label="Change Log"></core-item>
 			</div>
@@ -23,7 +25,7 @@
 							 transitions="hero-transition cross-fade"
 							 selected={{globalDetailSelected}}>
 			<section id="mainContentSection" class={{notSelected}}>
-				<core-header-panel fit mode="seamed">
+				<core-header-panel fit mode="standard">
 					{{> yield}}
 				</core-header-panel>
 				<div>
diff --git a/rpg-docs/client/views/layout/layout.js b/rpg-docs/client/views/layout/layout.js
index 1edce62f..bc49e5b5 100644
--- a/rpg-docs/client/views/layout/layout.js
+++ b/rpg-docs/client/views/layout/layout.js
@@ -41,4 +41,8 @@ Template.layout.events({
 		Router.go("changeLog");
 		instance.find("core-drawer-panel").closeDrawer();
 	},
+	"tap #guide": function(event, instance) {
+		Router.go("guide");
+		instance.find("core-drawer-panel").closeDrawer();
+	},
 });
diff --git a/rpg-docs/client/views/loading/loading.css b/rpg-docs/client/views/loading/loading.css
index 520c4b53..0203493a 100644
--- a/rpg-docs/client/views/loading/loading.css
+++ b/rpg-docs/client/views/loading/loading.css
@@ -1,4 +1,5 @@
 .bigSpinner {
 	width: 100px;
 	height: 100px;
+	margin-bottom: 16px;
 }
diff --git a/rpg-docs/client/views/loading/loading.html b/rpg-docs/client/views/loading/loading.html
index c767b37f..2f75e1f7 100644
--- a/rpg-docs/client/views/loading/loading.html
+++ b/rpg-docs/client/views/loading/loading.html
@@ -1,5 +1,5 @@
 <template name="loading">
-	<core-toolbar class="blue-grey white-text">
+	<core-toolbar class="app-grey white-text">
 		<core-icon-button icon="menu" core-drawer-toggle></core-icon-button>
 	</core-toolbar>
     <div fit layout vertical center center-justified>
diff --git a/rpg-docs/client/views/meta/changeLog/changeLog.html b/rpg-docs/client/views/meta/changeLog/changeLog.html
index d8acd4f6..6c4d5270 100644
--- a/rpg-docs/client/views/meta/changeLog/changeLog.html
+++ b/rpg-docs/client/views/meta/changeLog/changeLog.html
@@ -1,5 +1,5 @@
 <template name="changeLog">
-	<core-toolbar class="blue-grey white-text">
+	<core-toolbar class="app-grey white-text">
 		<core-icon-button icon="menu" core-drawer-toggle></core-icon-button>
 		<div flex>
 			Change Log
diff --git a/rpg-docs/client/views/user/titledAtForm/titledAtForm.html b/rpg-docs/client/views/user/titledAtForm/titledAtForm.html
index d436ff09..ef62b371 100644
--- a/rpg-docs/client/views/user/titledAtForm/titledAtForm.html
+++ b/rpg-docs/client/views/user/titledAtForm/titledAtForm.html
@@ -1,5 +1,5 @@
 <template name="titledAtForm">
-	<core-toolbar class="blue-grey white-text">
+	<core-toolbar class="app-grey white-text">
 		<core-icon-button icon="menu" core-drawer-toggle></core-icon-button>
 		<div flex>
 			
diff --git a/rpg-docs/public/crown-dice-logo-cropped-transparent.png b/rpg-docs/public/crown-dice-logo-cropped-transparent.png
new file mode 100644
index 00000000..34c19a1e
Binary files /dev/null and b/rpg-docs/public/crown-dice-logo-cropped-transparent.png differ
diff --git a/rpg-docs/public/png/paper-dice-crown.png b/rpg-docs/public/png/paper-dice-crown.png
index 616aeb46..acdfc8eb 100644
Binary files a/rpg-docs/public/png/paper-dice-crown.png and b/rpg-docs/public/png/paper-dice-crown.png differ