diff --git a/app/assets/stylesheets/_variables.scss b/app/assets/stylesheets/_variables.scss
index f57f46c3..ec118189 100644
--- a/app/assets/stylesheets/_variables.scss
+++ b/app/assets/stylesheets/_variables.scss
@@ -1,3 +1,22 @@
+// Font settings
+@import url(https://fonts.googleapis.com/css?family=Lato:400,700);
+
+$font-family-sans-serif:  "Lato","Open Sans", "Helvetica Neue", Helvetica, "DejaVu Sans", Arial, sans-serif;
+$font-family-serif:       Georgia, "DejaVu Serif", "Times New Roman", Times, serif;
+$font-family-monospace:   "PragmataPro", Monaco, "Ubuntu Mono", Menlo, "DejaVu Sans Mono", monospace;
+$font-family-base:        $font-family-sans-serif;
+
+$font-size-base:          1rem;
+$font-size-large:         ceil(($font-size-base * 1.25)); // ~18px
+$font-size-small:         ceil(($font-size-base * 0.85)); // ~12px
+
+$font-size-h1:            floor(($font-size-base * 2.6)); // ~36px
+$font-size-h2:            floor(($font-size-base * 2.15)); // ~30px
+$font-size-h3:            ceil(($font-size-base * 1.7)); // ~24px
+$font-size-h4:            ceil(($font-size-base * 1.25)); // ~18px
+$font-size-h5:            $font-size-base;
+$font-size-h6:            ceil(($font-size-base * 0.85)); // ~12px
+
 // Color overrides for Bootstrap
 $primary: #5e35b1;
 
@@ -8,7 +27,7 @@ $card-border-width: 0;
 $list-group-border-width: 0;
 
 // nProgress
-$nprogress-color: lighten($navbar-inverse-bg, 25%);
+$nprogress-color: lighten($primary, 25%);
 
 // Color names for theme generation
 $color-names: (
@@ -64,4 +83,6 @@ $avatar-sizes: (
   --muted-text: 108, 117, 125;
 
   --input-text: 0, 0, 0;
-}
\ No newline at end of file
+}
+
+$gray: #e2e2e2;
\ No newline at end of file
diff --git a/app/assets/stylesheets/application.css.scss b/app/assets/stylesheets/application.css.scss
deleted file mode 100644
index b8f75233..00000000
--- a/app/assets/stylesheets/application.css.scss
+++ /dev/null
@@ -1,112 +0,0 @@
-/*
- *= require rails_bootstrap_forms
- *= require growl
- *= require jquery.guillotine
- *= require sweetalert
- *= require jquery.minicolors
- *= require flags
- *= require_self
- */
-
-@import url(https://fonts.googleapis.com/css?family=Lato:400,700);
-
-$font-family-sans-serif:  "Lato","Open Sans", "Helvetica Neue", Helvetica, "DejaVu Sans", Arial, sans-serif;
-$font-family-serif:       Georgia, "DejaVu Serif", "Times New Roman", Times, serif;
-//** Default monospace fonts for `<code>`, `<kbd>`, and `<pre>`.
-$font-family-monospace:   "PragmataPro", Monaco, "Ubuntu Mono", Menlo, "DejaVu Sans Mono", monospace;
-$font-family-base:        $font-family-sans-serif;
-
-$font-size-base:          1rem;
-$font-size-large:         ceil(($font-size-base * 1.25)); // ~18px
-$font-size-small:         ceil(($font-size-base * 0.85)); // ~12px
-
-$font-size-h1:            floor(($font-size-base * 2.6)); // ~36px
-$font-size-h2:            floor(($font-size-base * 2.15)); // ~30px
-$font-size-h3:            ceil(($font-size-base * 1.7)); // ~24px
-$font-size-h4:            ceil(($font-size-base * 1.25)); // ~18px
-$font-size-h5:            $font-size-base;
-$font-size-h6:            ceil(($font-size-base * 0.85)); // ~12px
-
-$gray: #e2e2e2;
-$brand-primary: #5e35b1;
-$navbar-inverse-bg: #5e35b1;
-$navbar-inverse-link-color: #ffffff;
-$navbar-inverse-link-hover-color: #ffffff;
-$navbar-inverse-link-hover-bg: transparent;
-$navbar-inverse-link-active-color: #ffffff;
-$navbar-inverse-link-active-bg: transparent;
-$navbar-inverse-link-active-bg-mobile: darken(#5e35b1, 7%);
-$navbar-inverse-link-disabled-color: darken(#fff, 12.5%);
-$navbar-inverse-link-disabled-bg: transparent;
-$navbar-inverse-brand-color: $navbar-inverse-link-color;
-$navbar-inverse-brand-hover-color: darken($navbar-inverse-link-color, 10%);
-$navbar-inverse-brand-hover-bg: transparent;
-$navbar-inverse-toggle-hover-bg: #512da8;
-$navbar-inverse-toggle-icon-bar-bg: #7e57c2;
-$navbar-inverse-toggle-border-color: #512da8;
-
-/**
- SETTINGS
- ----------------------------------------------
- Variable definitions, tools and mixins used
- across all styling definitions.
- */
-
-@import
-"variables";
-
-/**
- VENDOR
- ----------------------------------------------
- Imported vendor assets used by Retrospring.
- */
-
-@import
-"bootstrap",
-"bootstrap-datetimepicker",
-"font-awesome",
-"nprogress",
-"nprogress-bootstrap";
-
-/**
- OVERRIDES
- ----------------------------------------------
- The imports from "overrides/" define almost barely
- any style adjustments but rather override default
- Bootstrap behaviour.
-
- The largest change to regular bootstrap is the switch
- to using the available CSS variables for most elements
- used on the site, so theming can be done with changing
- only those.
- */
-
-@import
-"overrides/alerts",
-"overrides/bootstrap-datetimepicker",
-"overrides/buttons",
-"overrides/colors",
-"overrides/card",
-"overrides/dropdown",
-"overrides/inputs",
-"overrides/links",
-"overrides/list-group",
-"overrides/minicolors",
-"overrides/navbar";
-
-/**
- COMPONENTS
- ----------------------------------------------
- Custom components defined for Retrospring.
- */
-
-@import
-"components/avatars",
-"components/buttons",
-"components/entry",
-"components/jumbotron",
-"components/profile",
-"components/question",
-"components/userbox";
-
-@import "base";
diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss
new file mode 100644
index 00000000..e8e093af
--- /dev/null
+++ b/app/assets/stylesheets/application.scss
@@ -0,0 +1,75 @@
+/*
+ *= require rails_bootstrap_forms
+ *= require growl
+ *= require jquery.guillotine
+ *= require sweetalert
+ *= require jquery.minicolors
+ *= require flags
+ *= require_self
+ */
+
+/**
+ SETTINGS
+ ----------------------------------------------
+ Variable definitions, tools and mixins used
+ across all styling definitions.
+ */
+
+@import
+"variables";
+
+/**
+ VENDOR
+ ----------------------------------------------
+ Imported vendor assets used by Retrospring.
+ */
+
+@import
+"bootstrap",
+"bootstrap-datetimepicker",
+"font-awesome",
+"nprogress",
+"nprogress-bootstrap";
+
+/**
+ OVERRIDES
+ ----------------------------------------------
+ The imports from "overrides/" define almost barely
+ any style adjustments but rather override default
+ Bootstrap behaviour.
+
+ The largest change to regular bootstrap is the switch
+ to using the available CSS variables for most elements
+ used on the site, so theming can be done with changing
+ only those.
+ */
+
+@import
+"overrides/alerts",
+"overrides/bootstrap-datetimepicker",
+"overrides/buttons",
+"overrides/colors",
+"overrides/card",
+"overrides/dropdown",
+"overrides/inputs",
+"overrides/links",
+"overrides/list-group",
+"overrides/minicolors",
+"overrides/navbar";
+
+/**
+ COMPONENTS
+ ----------------------------------------------
+ Custom components defined for Retrospring.
+ */
+
+@import
+"components/avatars",
+"components/buttons",
+"components/entry",
+"components/jumbotron",
+"components/profile",
+"components/question",
+"components/userbox";
+
+@import "base";