diff --git a/Makefile.dryice.js b/Makefile.dryice.js
index 94d1ad9c..e641a045 100755
--- a/Makefile.dryice.js
+++ b/Makefile.dryice.js
@@ -201,7 +201,7 @@ console.log('# ace modes ---------');
 project.assumeAllFilesLoaded();
 [
     "css", "html", "javascript", "php", "python", "xml", "ruby", "java", "c_cpp",
-    "coffee", "perl", "csharp", "svg", "clojure"
+    "coffee", "perl", "csharp", "svg", "clojure", "scss"
 ].forEach(function(mode) {
     console.log("mode " + mode);
     copy({
diff --git a/index.html b/index.html
index f299d636..57f6333a 100644
--- a/index.html
+++ b/index.html
@@ -11,17 +11,6 @@
 <body>
   <img id="logo" src="demo/logo.png">
   <table id="controls">
-    <tr>
-      <td>
-        <label for="split">Split</label>
-      </td><td>
-        <select id="split" size="1">
-          <option value="none">None</option>
-          <option value="below">Below</option>
-          <option value="beside">Beside</option>
-        </select>
-      </td>
-    </tr>
     <tr>
       <td>
         <label for="doc">Document</label>
@@ -72,6 +61,17 @@
         </select>
       </td>
     </tr>
+    <tr>
+      <td>
+        <label for="split">Split</label>
+      </td><td>
+        <select id="split" size="1">
+          <option value="none">None</option>
+          <option value="below">Below</option>
+          <option value="beside">Beside</option>
+        </select>
+      </td>
+    </tr>
     <tr>
       <td >
         <label for="theme">Theme</label>
@@ -213,18 +213,25 @@
     cursor: text;
 }</script>
 
-    <script type="text/editor" id="scsstext">@import 'compass/css3';
+    <script type="text/editor" id="scsstext">/* style.scss */
 
-$stdFont: Monaco, "Courier New", monospace;
+#navbar {
+    $navbar-width: 800px;
+    $items: 5;
+    $navbar-color: #ce4dd6;
 
-.text-layer {
-    font-family: $stdFont;
-    font-size: 12px + 4px;
-}
+    width: $navbar-width;
+    border-bottom: 2px solid $navbar-color;
 
-header {
-    @extend .text-layer;
-	color: hsla(120,40%,40%,0.5);	
+    li {
+        float: left;
+        width: $navbar-width/$items - 10px;
+
+        background-color: lighten($navbar-color, 20%);
+        &:hover {
+            background-color: lighten($navbar-color, 10%);
+        }
+    }
 }</script>
 
     <script type="text/editor" id="htmltext"><html>

- Split -	- -
Document @@ -72,6 +61,17 @@
+ Split +	+ +
Theme @@ -213,18 +213,25 @@ cursor: text; } -