diff --git a/build/css/main.css b/build/css/main.css
new file mode 100644
index 00000000..0af33ff3
--- /dev/null
+++ b/build/css/main.css
@@ -0,0 +1,364 @@
+@font-face {
+  font-family: 'ascribe';
+  src: url("ascribe.eot?-6bb2dq");
+  src: url("ascribe.eot?#iefix-6bb2dq") format("embedded-opentype"), url("ascribe.woff?-6bb2dq") format("woff"), url("ascribe.ttf?-6bb2dq") format("truetype"), url("ascribe.svg?-6bb2dq#ascribe") format("svg");
+  font-weight: normal;
+  font-style: normal; }
+
+[class^="glyph-ascribe-"], [class*=" glyph-ascribe-"] {
+  font-family: 'ascribe';
+  speak: none;
+  font-style: normal;
+  font-weight: normal;
+  font-variant: normal;
+  text-transform: none;
+  line-height: 1;
+  /* Better Font Rendering =========== */
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale; }
+
+.glyph-ascribe-ascribe-spool:before {
+  content: "\e600"; }
+
+.glyph-ascribe-spool:before {
+  content: "\e601"; }
+
+.glyph-ascribe-ascribe-spool-chunked:before {
+  content: "\e602"; }
+
+.glyph-ascribe-spool-chunked:before {
+  content: "\e603"; }
+
+.glyph-ascribe-home:before {
+  content: "\e900"; }
+
+.glyph-ascribe-home2:before {
+  content: "\e901"; }
+
+.glyph-ascribe-home3:before {
+  content: "\e902"; }
+
+.glyph-ascribe-pencil:before {
+  content: "\e905"; }
+
+.glyph-ascribe-pencil2:before {
+  content: "\e906"; }
+
+.glyph-ascribe-quill:before {
+  content: "\e907"; }
+
+.glyph-ascribe-image:before {
+  content: "\e90d"; }
+
+.glyph-ascribe-camera:before {
+  content: "\e90f"; }
+
+.glyph-ascribe-music:before {
+  content: "\e911"; }
+
+.glyph-ascribe-play:before {
+  content: "\e912"; }
+
+.glyph-ascribe-film:before {
+  content: "\e913"; }
+
+.glyph-ascribe-credit-card:before {
+  content: "\e93f"; }
+
+.glyph-ascribe-pushpin:before {
+  content: "\e946"; }
+
+.glyph-ascribe-undo2:before {
+  content: "\e967"; }
+
+.glyph-ascribe-redo2:before {
+  content: "\e968"; }
+
+.glyph-ascribe-enlarge:before {
+  content: "\e989"; }
+
+.glyph-ascribe-shrink:before {
+  content: "\e98a"; }
+
+.glyph-ascribe-enlarge2:before {
+  content: "\e98b"; }
+
+.glyph-ascribe-shrink2:before {
+  content: "\e98c"; }
+
+.glyph-ascribe-share:before {
+  content: "\ea7d"; }
+
+.glyph-ascribe-new-tab:before {
+  content: "\ea7e"; }
+
+.glyph-ascribe-share2:before {
+  content: "\ea82"; }
+
+.glyph-ascribe-google:before {
+  content: "\ea87"; }
+
+.glyph-ascribe-google-plus:before {
+  content: "\ea88"; }
+
+.glyph-ascribe-google-plus2:before {
+  content: "\ea89"; }
+
+.glyph-ascribe-facebook:before {
+  content: "\ea8c"; }
+
+.glyph-ascribe-facebook2:before {
+  content: "\ea8d"; }
+
+.glyph-ascribe-twitter:before {
+  content: "\ea91"; }
+
+.glyph-ascribe-twitter2:before {
+  content: "\ea92"; }
+
+.glyph-ascribe-youtube3:before {
+  content: "\ea99"; }
+
+.glyph-ascribe-dropbox:before {
+  content: "\eaaf"; }
+
+.glyph-ascribe-file-pdf:before {
+  content: "\eada"; }
+
+.glyph-ascribe-chrome:before {
+  content: "\eae5"; }
+
+.glyph-ascribe-firefox:before {
+  content: "\eae6"; }
+
+.glyph-ascribe-IE:before {
+  content: "\eae7"; }
+
+.glyph-ascribe-opera:before {
+  content: "\eae8"; }
+
+.glyph-ascribe-safari:before {
+  content: "\eae9"; }
+
+.btn-glyph-ascribe {
+  font-size: 18px;
+  padding: 4px 12px 0 10px; }
+
+@font-face {
+  font-family: 'ascribe';
+  src: url("ascribe.eot?-oi6ttk");
+  src: url("ascribe.eot?#iefix-oi6ttk") format("embedded-opentype"), url("ascribe.woff?-oi6ttk") format("woff"), url("ascribe.ttf?-oi6ttk") format("truetype"), url("ascribe.svg?-oi6ttk#ascribe") format("svg");
+  font-weight: normal;
+  font-style: normal; }
+
+[class^="glyph-ascribe-"], [class*=" glyph-ascribe-"] {
+  font-family: 'ascribe';
+  speak: none;
+  font-style: normal;
+  font-weight: normal;
+  font-variant: normal;
+  text-transform: none;
+  line-height: 1;
+  /* Better Font Rendering =========== */
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale; }
+
+.glyph-ascribe-logo-spool:before {
+  content: "\e600"; }
+
+.glyph-ascribe-spool:before {
+  content: "\e601"; }
+
+.glyph-ascribe-logo-spool-chunked:before {
+  content: "\e602"; }
+
+.glyph-ascribe-spool-chunked:before {
+  content: "\e603"; }
+
+@font-face {
+  font-family: mercury_regular;
+  src: url(Mercury_Regular.otf); }
+
+@font-face {
+  font-family: mercury_medium;
+  src: url(Mercury_Medium.otf); }
+
+@font-face {
+  font-family: mercury_light;
+  src: url(Mercury_Light.otf); }
+
+#main {
+  padding-top: 70px; }
+
+.hidden {
+  display: none; }
+
+/* Taken from http://stackoverflow.com/a/20548578 */
+.vcenter {
+  display: inline-block;
+  vertical-align: middle;
+  float: none; }
+
+.ascribe-table-header-row {
+  border-bottom: 2px solid rgba(2, 182, 163, 0.5);
+  border-top: 2px solid rgba(2, 182, 163, 0.5);
+  padding: 0; }
+
+.ascribe-table-header-column {
+  display: table;
+  height: 3em;
+  padding: 0; }
+
+.ascribe-table-header-column > span {
+  display: table-cell;
+  vertical-align: middle;
+  font-family: 'Source Sans Pro';
+  font-weight: 600;
+  color: #02b6a3;
+  font-size: 1.4em; }
+
+.ascribe-table-header-column > span > .glyphicon {
+  font-size: .5em; }
+
+/*
+.ascribe-table-item:nth-child(even) {
+    background-color: #F5F5F5;
+}*/
+/*.ascribe-table-item:hover {
+    background-color: #EEEEEE; 
+}*/
+.ascribe-table-item-column {
+  display: table;
+  font-family: 'Source Sans Pro';
+  font-size: 1.2em;
+  height: 3em; }
+
+.ascribe-table-item-column > * {
+  display: table-cell;
+  vertical-align: middle; }
+
+.ascribe-table-item-selected {
+  background-color: rgba(2, 182, 163, 0.5); }
+
+.ascribe-table-item-selectable {
+  cursor: default; }
+
+.piece-list-toolbar {
+  height: 3em; }
+
+.no-margin {
+  margin-right: 0;
+  margin-left: 0; }
+
+.btn-ascribe, .btn-ascribe-inv {
+  border: 1px solid #444;
+  line-height: 2em;
+  margin-right: 1px;
+  margin-left: 0 !important;
+  font-family: sans-serif !important;
+  border-radius: 0 !important; }
+
+.btn-ascribe, .btn-ascribe-inv:active, .btn-ascribe-inv:hover {
+  color: #222 !important;
+  background-color: #FFF; }
+
+.btn-ascribe:active, .btn-ascribe:hover, .btn-ascribe-inv {
+  color: #FFF !important;
+  background-color: #444; }
+
+.btn-ascribe-inv:disabled, .btn-ascribe-inv:focus {
+  color: #444 !important;
+  background-color: #BBB !important;
+  border: 1px solid #444 !important; }
+
+.btn-ascribe-sm {
+  font-size: 12px;
+  line-height: 1.3em; }
+
+.btn-ascribe-green, .btn-ascribe-green-inv {
+  border: 1px solid #48DACB;
+  line-height: 2em;
+  margin-left: 0 !important;
+  font-family: sans-serif !important;
+  border-radius: 0 !important; }
+
+.btn-ascribe-green, .btn-ascribe-green-inv:active, .btn-ascribe-green-inv:hover {
+  background-color: #FFF;
+  border: 1px solid rgba(2, 182, 163, 0.5);
+  color: rgba(2, 182, 163, 0.5); }
+
+.btn-ascribe-green:active, .btn-ascribe-green:hover, .btn-ascribe-green-inv {
+  border: 1px solid rgba(2, 182, 163, 0.5);
+  color: white;
+  background-color: rgba(2, 182, 163, 0.5); }
+
+.ascribe-detail-header {
+  margin-top: 2em; }
+
+.ascribe-detail-title {
+  font-size: 2em;
+  margin-bottom: -0.2em; }
+
+.ascribe-detail-property {
+  padding-bottom: 0.4em; }
+
+.ascribe-detail-property > .row-same-height > .col-xs-2 {
+  text-transform: uppercase; }
+
+.input-text-ascribe {
+  border-bottom: 1px solid black;
+  border-top: 0;
+  border-left: 0;
+  border-right: 0;
+  background: transparent;
+  border-radius: 0 !important;
+  box-shadow: none; }
+
+.textarea-ascribe-message {
+  height: 13em !important; }
+
+/* columns of same height styles */
+/* http://www.minimit.com/articles/solutions-tutorials/bootstrap-3-responsive-columns-of-same-height */
+.row-full-height {
+  height: 100%; }
+
+.col-full-height {
+  height: 100%;
+  vertical-align: middle; }
+
+.row-same-height {
+  display: table;
+  width: 100%;
+  /* fix overflow */
+  table-layout: fixed; }
+
+.col-xs-height {
+  display: table-cell;
+  float: none !important; }
+
+@media (min-width: 768px) {
+  .col-sm-height {
+    display: table-cell;
+    float: none !important; } }
+
+@media (min-width: 992px) {
+  .col-md-height {
+    display: table-cell;
+    float: none !important; } }
+
+@media (min-width: 1200px) {
+  .col-lg-height {
+    display: table-cell;
+    float: none !important; } }
+
+/* vertical alignment styles */
+.col-top {
+  vertical-align: top; }
+
+.col-middle {
+  vertical-align: middle; }
+
+.col-bottom {
+  vertical-align: bottom; }
+
+/*# sourceMappingURL=maps/main.css.map */
\ No newline at end of file
diff --git a/build/css/maps/main.css.map b/build/css/maps/main.css.map
new file mode 100644
index 00000000..0f2c9001
--- /dev/null
+++ b/build/css/maps/main.css.map
@@ -0,0 +1 @@
+{"version":3,"sources":["ascribe-fonts/style.scss","ascribe-fonts/ascribe-fonts.scss","main.scss"],"names":[],"mappings":"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","file":"main.css","sourcesContent":["@font-face {\n\tfont-family: 'ascribe';\n\tsrc:url('ascribe.eot?-6bb2dq');\n\tsrc:url('ascribe.eot?#iefix-6bb2dq') format('embedded-opentype'),\n\t\turl('ascribe.woff?-6bb2dq') format('woff'),\n\t\turl('ascribe.ttf?-6bb2dq') format('truetype'),\n\t\turl('ascribe.svg?-6bb2dq#ascribe') format('svg');\n\tfont-weight: normal;\n\tfont-style: normal;\n}\n\n[class^=\"glyph-ascribe-\"], [class*=\" glyph-ascribe-\"] {\n\tfont-family: 'ascribe';\n\tspeak: none;\n\tfont-style: normal;\n\tfont-weight: normal;\n\tfont-variant: normal;\n\ttext-transform: none;\n\tline-height: 1;\n\n\t/* Better Font Rendering =========== */\n\t-webkit-font-smoothing: antialiased;\n\t-moz-osx-font-smoothing: grayscale;\n}\n\n.glyph-ascribe-ascribe-spool:before {\n\tcontent: \"\\e600\";\n}\n\n.glyph-ascribe-spool:before {\n\tcontent: \"\\e601\";\n}\n\n.glyph-ascribe-ascribe-spool-chunked:before {\n\tcontent: \"\\e602\";\n}\n\n.glyph-ascribe-spool-chunked:before {\n\tcontent: \"\\e603\";\n}\n\n.glyph-ascribe-home:before {\n\tcontent: \"\\e900\";\n}\n\n.glyph-ascribe-home2:before {\n\tcontent: \"\\e901\";\n}\n\n.glyph-ascribe-home3:before {\n\tcontent: \"\\e902\";\n}\n\n.glyph-ascribe-pencil:before {\n\tcontent: \"\\e905\";\n}\n\n.glyph-ascribe-pencil2:before {\n\tcontent: \"\\e906\";\n}\n\n.glyph-ascribe-quill:before {\n\tcontent: \"\\e907\";\n}\n\n.glyph-ascribe-image:before {\n\tcontent: \"\\e90d\";\n}\n\n.glyph-ascribe-camera:before {\n\tcontent: \"\\e90f\";\n}\n\n.glyph-ascribe-music:before {\n\tcontent: \"\\e911\";\n}\n\n.glyph-ascribe-play:before {\n\tcontent: \"\\e912\";\n}\n\n.glyph-ascribe-film:before {\n\tcontent: \"\\e913\";\n}\n\n.glyph-ascribe-credit-card:before {\n\tcontent: \"\\e93f\";\n}\n\n.glyph-ascribe-pushpin:before {\n\tcontent: \"\\e946\";\n}\n\n.glyph-ascribe-undo2:before {\n\tcontent: \"\\e967\";\n}\n\n.glyph-ascribe-redo2:before {\n\tcontent: \"\\e968\";\n}\n\n.glyph-ascribe-enlarge:before {\n\tcontent: \"\\e989\";\n}\n\n.glyph-ascribe-shrink:before {\n\tcontent: \"\\e98a\";\n}\n\n.glyph-ascribe-enlarge2:before {\n\tcontent: \"\\e98b\";\n}\n\n.glyph-ascribe-shrink2:before {\n\tcontent: \"\\e98c\";\n}\n\n.glyph-ascribe-share:before {\n\tcontent: \"\\ea7d\";\n}\n\n.glyph-ascribe-new-tab:before {\n\tcontent: \"\\ea7e\";\n}\n\n.glyph-ascribe-share2:before {\n\tcontent: \"\\ea82\";\n}\n\n.glyph-ascribe-google:before {\n\tcontent: \"\\ea87\";\n}\n\n.glyph-ascribe-google-plus:before {\n\tcontent: \"\\ea88\";\n}\n\n.glyph-ascribe-google-plus2:before {\n\tcontent: \"\\ea89\";\n}\n\n.glyph-ascribe-facebook:before {\n\tcontent: \"\\ea8c\";\n}\n\n.glyph-ascribe-facebook2:before {\n\tcontent: \"\\ea8d\";\n}\n\n.glyph-ascribe-twitter:before {\n\tcontent: \"\\ea91\";\n}\n\n.glyph-ascribe-twitter2:before {\n\tcontent: \"\\ea92\";\n}\n\n.glyph-ascribe-youtube3:before {\n\tcontent: \"\\ea99\";\n}\n\n.glyph-ascribe-dropbox:before {\n\tcontent: \"\\eaaf\";\n}\n\n.glyph-ascribe-file-pdf:before {\n\tcontent: \"\\eada\";\n}\n\n.glyph-ascribe-chrome:before {\n\tcontent: \"\\eae5\";\n}\n\n.glyph-ascribe-firefox:before {\n\tcontent: \"\\eae6\";\n}\n\n.glyph-ascribe-IE:before {\n\tcontent: \"\\eae7\";\n}\n\n.glyph-ascribe-opera:before {\n\tcontent: \"\\eae8\";\n}\n\n.glyph-ascribe-safari:before {\n\tcontent: \"\\eae9\";\n}\n\n.btn-glyph-ascribe{\n    font-size: 18px;\n    padding: 4px 12px 0 10px\n}","    @font-face {\n        font-family: 'ascribe';\n        src:url('ascribe.eot?-oi6ttk');\n        src:url('ascribe.eot?#iefix-oi6ttk') format('embedded-opentype'),\n            url('ascribe.woff?-oi6ttk') format('woff'),\n            url('ascribe.ttf?-oi6ttk') format('truetype'),\n            url('ascribe.svg?-oi6ttk#ascribe') format('svg');\n        font-weight: normal;\n        font-style: normal;\n    }\n\n    [class^=\"glyph-ascribe-\"], [class*=\" glyph-ascribe-\"] {\n        font-family: 'ascribe';\n        speak: none;\n        font-style: normal;\n        font-weight: normal;\n        font-variant: normal;\n        text-transform: none;\n        line-height: 1;\n\n        /* Better Font Rendering =========== */\n        -webkit-font-smoothing: antialiased;\n        -moz-osx-font-smoothing: grayscale;\n    }\n\n    .glyph-ascribe-logo-spool:before {\n        content: \"\\e600\";\n    }\n\n    .glyph-ascribe-spool:before {\n        content: \"\\e601\";\n    }\n\n    .glyph-ascribe-logo-spool-chunked:before {\n        content: \"\\e602\";\n    }\n\n    .glyph-ascribe-spool-chunked:before {\n        content: \"\\e603\";\n    }\n\n    @font-face {\n        font-family: mercury_regular;\n        src: url(Mercury_Regular.otf);\n    }\n\n    @font-face {\n        font-family: mercury_medium;\n        src: url(Mercury_Medium.otf);\n    }\n\n    @font-face {\n        font-family: mercury_light;\n        src: url(Mercury_Light.otf);\n    }","@import './ascribe-fonts/style';\n@import './ascribe-fonts/ascribe-fonts';\n\n#main {\n    padding-top: 70px;\n}\n\n.hidden {\n    display: none;\n}\n\n/* Taken from http://stackoverflow.com/a/20548578 */\n.vcenter {\n    display: inline-block;\n    vertical-align: middle;\n    float: none;\n}\n\n.ascribe-table-header-row {\n    border-bottom: 2px solid rgba(2, 182, 163, 0.5);\n    border-top: 2px solid rgba(2, 182, 163, 0.5);\n    padding: 0;\n}\n\n.ascribe-table-header-column {\n    display: table;\n    height:3em;\n    padding: 0;\n}\n\n.ascribe-table-header-column > span {\n    display: table-cell;\n    vertical-align: middle;\n    font-family: 'Source Sans Pro';\n    font-weight: 600;\n    color: rgba(2, 182, 163, 1);\n    font-size: 1.4em;\n}\n\n.ascribe-table-header-column > span > .glyphicon {\n    font-size: .5em;\n}\n/*\n.ascribe-table-item:nth-child(even) {\n    background-color: #F5F5F5;\n}*/\n\n/*.ascribe-table-item:hover {\n    background-color: #EEEEEE; \n}*/\n\n.ascribe-table-item-column {\n    display: table;\n    font-family: 'Source Sans Pro';\n    font-size: 1.2em;\n    height:3em;\n}\n\n.ascribe-table-item-column > * {\n    display: table-cell;\n    vertical-align: middle;\n}\n\n.ascribe-table-item-selected {\n    background-color: rgba(2, 182, 163, 0.5);\n}\n\n.ascribe-table-item-selectable {\n    cursor: default;\n}\n\n.piece-list-toolbar {\n    height:3em;\n}\n\n.no-margin {\n    margin-right: 0;\n    margin-left: 0;\n}\n\n.btn-ascribe, .btn-ascribe-inv {\n    border: 1px solid #444;\n    line-height: 2em;\n    margin-right: 1px;\n    margin-left: 0 !important;\n    font-family: sans-serif !important;\n    border-radius: 0 !important;\n\n}\n\n.btn-ascribe, .btn-ascribe-inv:active, .btn-ascribe-inv:hover {\n    color: #222 !important;\n    background-color: #FFF;\n}\n\n.btn-ascribe:active, .btn-ascribe:hover, .btn-ascribe-inv {\n    color: #FFF !important;\n    background-color: #444;\n}\n\n.btn-ascribe-inv:disabled, .btn-ascribe-inv:focus {\n    color: #444 !important;\n    background-color: #BBB !important;\n    border: 1px solid #444 !important;\n}\n\n.btn-ascribe-sm {\n    font-size: 12px;\n    line-height: 1.3em;\n}\n\n.btn-ascribe-green, .btn-ascribe-green-inv {\n    border: 1px solid #48DACB;\n    line-height: 2em;\n    margin-left: 0 !important;\n    font-family: sans-serif !important;\n    border-radius: 0 !important;\n\n}\n\n.btn-ascribe-green, .btn-ascribe-green-inv:active, .btn-ascribe-green-inv:hover {\n    background-color: #FFF;\n    border: 1px solid rgba(2, 182, 163, 0.5);\n    color: rgba(2, 182, 163, 0.5);\n}\n\n.btn-ascribe-green:active, .btn-ascribe-green:hover, .btn-ascribe-green-inv {\n    border: 1px solid rgba(2, 182, 163, 0.5);\n    color: white;\n    background-color: rgba(2, 182, 163, 0.5);\n}\n\n.ascribe-detail-header {\n    margin-top: 2em;\n}\n\n\n.ascribe-detail-title {\n    font-size: 2em;\n    margin-bottom: -0.2em;\n}\n\n.ascribe-detail-property {\n    padding-bottom: 0.4em;\n}\n.ascribe-detail-property > .row-same-height > .col-xs-2 {\n    text-transform: uppercase;\n}\n\n.input-text-ascribe {\n    border-bottom: 1px solid black;\n    border-top: 0;\n    border-left: 0;\n    border-right: 0;\n    background: transparent;\n    border-radius: 0 !important;\n    box-shadow: none;\n}\n\n.textarea-ascribe-message {\n    height: 13em !important;\n}\n\n/* columns of same height styles */\n/* http://www.minimit.com/articles/solutions-tutorials/bootstrap-3-responsive-columns-of-same-height */\n.row-full-height {\n    height: 100%;\n}\n\n.col-full-height {\n    height: 100%;\n    vertical-align: middle;\n}\n\n.row-same-height {\n    display: table;\n    width: 100%;\n    /* fix overflow */\n    table-layout: fixed;\n}\n\n.col-xs-height {\n    display: table-cell;\n    float: none !important;\n}\n\n@media (min-width: 768px) {\n    .col-sm-height {\n        display: table-cell;\n        float: none !important;\n    }\n}\n\n@media (min-width: 992px) {\n    .col-md-height {\n        display: table-cell;\n        float: none !important;\n    }\n}\n\n@media (min-width: 1200px) {\n    .col-lg-height {\n        display: table-cell;\n        float: none !important;\n    }\n}\n\n/* vertical alignment styles */\n\n.col-top {\n    vertical-align: top;\n}\n\n.col-middle {\n    vertical-align: middle;\n}\n\n.col-bottom {\n    vertical-align: bottom;\n}"],"sourceRoot":"/source/"}
\ No newline at end of file
diff --git a/gulpfile.js b/gulpfile.js
index 3b42e4de..8e1a32ea 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -9,13 +9,15 @@ var browserify = require('browserify');
 var browserSync = require('browser-sync');
 var babelify = require('babelify');
 var notify = require('gulp-notify');
+var sass = require('gulp-sass');
+var concat = require('gulp-concat');
 var _ = require('lodash');
  
 gulp.task('build', function() {
     bundle(false);
 });
  
-gulp.task('serve', ['browser-sync'], function() {
+gulp.task('serve', ['browser-sync', 'sass'], function() {
     bundle(true);
 });
 
@@ -28,6 +30,14 @@ gulp.task('browser-sync', function() {
     });
 });
 
+gulp.task('sass', function () {
+    gulp.src('./sass/**/main.scss')
+        .pipe(sourcemaps.init())
+        .pipe(sass().on('error', sass.logError))
+        .pipe(sourcemaps.write('./maps'))
+        .pipe(gulp.dest('./build/css'));
+});
+
 function bundle(watch) {
     var bro;
  
diff --git a/index.html b/index.html
index 21dac715..e4d95ded 100644
--- a/index.html
+++ b/index.html
@@ -6,9 +6,7 @@
         <title>ascribe</title>
         <meta name="viewport" content="width=device-width, initial-scale=1">
         <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
-        <link rel="stylesheet" href="css/main.css">
-        <link rel="stylesheet" href="css/ascribe-fonts/ascribe-fonts.css">
-        <link rel="stylesheet" href="css/ascribe-fonts/style.css">
+        <link rel="stylesheet" href="build/css/main.css">
         <link rel="stylesheet" href="//brick.a.ssl.fastly.net/Source+Sans+Pro:400,600,700,900">
     </head>
     <body>
diff --git a/js/constants/application_constants.js b/js/constants/application_constants.js
index c7d590d0..17a6d7df 100644
--- a/js/constants/application_constants.js
+++ b/js/constants/application_constants.js
@@ -1,5 +1,6 @@
 let constants = {
-    'baseUrl': 'http://localhost:8000/api/',
+    //'baseUrl': 'http://localhost:8000/api/',
+    'baseUrl': 'http://staging.ascribe.io/api/',
     'debugCredentialBase64': 'ZGltaUBtYWlsaW5hdG9yLmNvbTowMDAwMDAwMDAw', // dimi@mailinator:0000000000
     'aclList': ['edit', 'consign', 'transfer', 'loan', 'share', 'download', 'view', 'delete', 'del_from_collection', 'add_to_collection']
 };
diff --git a/package.json b/package.json
index 40277a40..c2557c4c 100644
--- a/package.json
+++ b/package.json
@@ -12,8 +12,10 @@
     "browserify": "^9.0.8",
     "envify": "^3.4.0",
     "gulp": "^3.8.11",
+    "gulp-concat": "^2.5.2",
     "gulp-if": "^1.2.5",
     "gulp-notify": "^2.2.0",
+    "gulp-sass": "^2.0.1",
     "gulp-sourcemaps": "^1.5.2",
     "gulp-util": "^3.0.4",
     "jest-cli": "^0.4.0",
diff --git a/css/ascribe-fonts/Mercury_Light.otf b/sass/ascribe-fonts/Mercury_Light.otf
similarity index 100%
rename from css/ascribe-fonts/Mercury_Light.otf
rename to sass/ascribe-fonts/Mercury_Light.otf
diff --git a/css/ascribe-fonts/Mercury_Medium.otf b/sass/ascribe-fonts/Mercury_Medium.otf
similarity index 100%
rename from css/ascribe-fonts/Mercury_Medium.otf
rename to sass/ascribe-fonts/Mercury_Medium.otf
diff --git a/css/ascribe-fonts/Mercury_Regular.otf b/sass/ascribe-fonts/Mercury_Regular.otf
similarity index 100%
rename from css/ascribe-fonts/Mercury_Regular.otf
rename to sass/ascribe-fonts/Mercury_Regular.otf
diff --git a/css/ascribe-fonts/ascribe-fonts.css b/sass/ascribe-fonts/ascribe-fonts.scss
similarity index 100%
rename from css/ascribe-fonts/ascribe-fonts.css
rename to sass/ascribe-fonts/ascribe-fonts.scss
diff --git a/css/ascribe-fonts/ascribe.eot b/sass/ascribe-fonts/ascribe.eot
similarity index 100%
rename from css/ascribe-fonts/ascribe.eot
rename to sass/ascribe-fonts/ascribe.eot
diff --git a/css/ascribe-fonts/ascribe.svg b/sass/ascribe-fonts/ascribe.svg
similarity index 100%
rename from css/ascribe-fonts/ascribe.svg
rename to sass/ascribe-fonts/ascribe.svg
diff --git a/css/ascribe-fonts/ascribe.ttf b/sass/ascribe-fonts/ascribe.ttf
similarity index 100%
rename from css/ascribe-fonts/ascribe.ttf
rename to sass/ascribe-fonts/ascribe.ttf
diff --git a/css/ascribe-fonts/ascribe.woff b/sass/ascribe-fonts/ascribe.woff
similarity index 100%
rename from css/ascribe-fonts/ascribe.woff
rename to sass/ascribe-fonts/ascribe.woff
diff --git a/css/ascribe-fonts/ascribe_logo.svg b/sass/ascribe-fonts/ascribe_logo.svg
similarity index 100%
rename from css/ascribe-fonts/ascribe_logo.svg
rename to sass/ascribe-fonts/ascribe_logo.svg
diff --git a/css/ascribe-fonts/ascribe_wortmarke_logo.svg b/sass/ascribe-fonts/ascribe_wortmarke_logo.svg
similarity index 100%
rename from css/ascribe-fonts/ascribe_wortmarke_logo.svg
rename to sass/ascribe-fonts/ascribe_wortmarke_logo.svg
diff --git a/css/ascribe-fonts/ascribe_wortmarke_logo_chunked.svg b/sass/ascribe-fonts/ascribe_wortmarke_logo_chunked.svg
similarity index 100%
rename from css/ascribe-fonts/ascribe_wortmarke_logo_chunked.svg
rename to sass/ascribe-fonts/ascribe_wortmarke_logo_chunked.svg
diff --git a/css/ascribe-fonts/style.css b/sass/ascribe-fonts/style.scss
similarity index 100%
rename from css/ascribe-fonts/style.css
rename to sass/ascribe-fonts/style.scss
diff --git a/css/main.css b/sass/main.scss
similarity index 98%
rename from css/main.css
rename to sass/main.scss
index 153b4533..bc5affb6 100644
--- a/css/main.css
+++ b/sass/main.scss
@@ -1,3 +1,6 @@
+@import './ascribe-fonts/style';
+@import './ascribe-fonts/ascribe-fonts';
+
 #main {
     padding-top: 70px;
 }