diff --git a/refstack/templates/index.html b/refstack/templates/index.html
index 9cedd069..ac90688e 100644
--- a/refstack/templates/index.html
+++ b/refstack/templates/index.html
@@ -2,16 +2,17 @@
RefStack: What is it?
+
-Welcome to Refstack
-{% if name %}
- Hello {{ name }}!
-{% else %}
- Hello World!
-{% endif %}
-What is Refstack?
-Who knows.
+
+
+
+
What is Refstack?
+ Who knows.
+
+
+
\ No newline at end of file
diff --git a/static/toast.css b/static/toast.css
new file mode 100644
index 00000000..92aa5788
--- /dev/null
+++ b/static/toast.css
@@ -0,0 +1,152 @@
+/*-----------------------------------*\
+
+ Toast
+ A Simple CSS Framework
+ =================================
+
+ Values you may want to change:
+ - .container { max-width:; }
+ - p { margin-bottom:; }
+ - html { font:; }
+
+ Remember: no framework will be as
+ good as a custom built, per-
+ project one. Toast and other
+ frameworks are best used for
+ rapid prototyping.
+
+\*-----------------------------------*/
+
+/*-----------------------------------*\
+ $RESET
+\*-----------------------------------*/
+
+* {
+ margin: 0;
+ padding: 0;
+ position: relative;
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+}
+
+/*-----------------------------------*\
+ $GRID
+\*-----------------------------------*/
+
+.container {
+ /* Whatever you want. They’re your oats. */
+ max-width: 960px;
+ margin: 0 auto;
+ padding: 0 30px;
+ padding: 0 1.5rem;
+}
+
+.grid {
+ margin-left: -3%;
+ max-width: 105%;
+}
+
+.unit {
+ display: inline-block;
+ *display: inline;
+ *zoom: 1;
+ vertical-align: top;
+ margin-left: 3%;
+ margin-right: -.25em;
+ /* Clearfix */
+ overflow: hidden;
+ *overflow: visible;
+}
+
+ .unit.demo {
+ background-color: #fff8eb;
+ height: 48px;
+ height: 3rem;
+ margin-bottom: 24px;
+ margin-bottom: 1.5rem;
+ }
+
+.span-grid {
+ width: 97%;
+}
+
+.one-of-two { width: 47%; }
+
+.one-of-three { width: 30.36%; }
+.two-of-three { width: 63.666666666%; }
+
+.one-of-four { width: 22.05%; }
+.three-of-four { width: 72%; }
+
+.one-of-five { width: 17.07%; }
+.two-of-five { width: 37%; }
+.three-of-five { width: 57%; }
+.four-of-five { width: 77%; }
+
+@media screen and (max-width: 650px) {
+ .grid {
+ margin-left: 0;
+ max-width: none;
+ }
+
+ .unit {
+ width: auto;
+ margin-left: 0;
+ display: block;
+ }
+}
+
+/*-----------------------------------*\
+ $TYPE
+
+ Works off the assumption of a 1.5
+ line height @ 20px. Again, change
+ as necessary.
+\*-----------------------------------*/
+
+p, .p, ul, ol, hr, table, form, pre,
+h1, .alpha, h2, .beta {
+ margin-bottom: 30px;
+ margin-bottom: 1.5rem;
+}
+
+h1, .alpha {
+ font-size: 60px;
+ font-size: 3rem;
+ font-weight: 700;
+ line-height: 1;
+}
+
+h2, .beta {
+ font-size: 30px;
+ font-size: 1.5rem;
+ font-weight: 400;
+ line-height: 2;
+}
+
+h3, .gamma {
+ font-size: 20px;
+ font-size: 1rem;
+ font-weight: 700;
+}
+
+hr {
+ border: none;
+ border-bottom: 1px solid rgba(0,0,0,.1);
+ margin-top: -1px;
+}
+
+/*-----------------------------------*\
+ $MAIN
+\*-----------------------------------*/
+
+html {
+ font: 125%/1.5 Helvetica Neue, Helvetica, Arial, sans-serif;
+}
+
+@media screen and (max-width: 650px) {
+ html {
+ font-size: 100%;
+ }
+}