diff --git a/package.json b/package.json
index 8dc4619..9cdd937 100644
--- a/package.json
+++ b/package.json
@@ -32,7 +32,8 @@
   },
   "homepage": "https://github.com/lolmaus/breakpoint-slicer#readme",
   "eyeglass": {
-    "exports": "eyeglass-exports.js"
+    "exports": "eyeglass-exports.js",
+    "needs": "^0.8.3"
   },
   "devDependencies": {
     "breakpoint-sass": "^2.6.1"
diff --git a/stylesheets/_breakpoint-slicer.sass b/stylesheets/_breakpoint-slicer.sass
deleted file mode 100644
index f6ef635..0000000
--- a/stylesheets/_breakpoint-slicer.sass
+++ /dev/null
@@ -1,8 +0,0 @@
-// Default values
-@import breakpoint-slicer/variables
-
-// Helper functions
-@import breakpoint-slicer/helper-functions
-
-// The magic!
-@import breakpoint-slicer/mixins
\ No newline at end of file
diff --git a/stylesheets/_breakpoint-slicer.scss b/stylesheets/_breakpoint-slicer.scss
new file mode 100644
index 0000000..7e738a9
--- /dev/null
+++ b/stylesheets/_breakpoint-slicer.scss
@@ -0,0 +1,8 @@
+// Default values
+@import "breakpoint-slicer/variables";
+
+// Helper functions
+@import "breakpoint-slicer/helper-functions";
+
+// The magic!
+@import "breakpoint-slicer/mixins";
diff --git a/stylesheets/breakpoint-slicer/_helper-functions.sass b/stylesheets/breakpoint-slicer/_helper-functions.scss
similarity index 57%
rename from stylesheets/breakpoint-slicer/_helper-functions.sass
rename to stylesheets/breakpoint-slicer/_helper-functions.scss
index d562081..cbb6525 100644
--- a/stylesheets/breakpoint-slicer/_helper-functions.sass
+++ b/stylesheets/breakpoint-slicer/_helper-functions.scss
@@ -1,155 +1,166 @@
-// Returns a correction value for the given breakpoint
-// to prevent media query overlapping.
-//
-// Relies on the global variable $slicer-anti-overlap-corrections
-// that should contain a list of allowed correction values.
-//
-// Returns either only positive or only negative value.
-//
-// anti-overlap-correction($bp, $positive: true)
-//   - $bp       : a breakpoint, e. g. 800px or 20em
-//   - $positive : whether to return only positive or only negative values
-//                 * true - return only positive correction value (default)
-//                 * false - return only negative correction value
-@function anti-overlap-correction($bp, $positive: true)
-  @each $correction in $slicer-anti-overlap-corrections
-    @if (unit($bp) == unit($correction)) and (($correction > 0) == $positive)
-      @return $correction
-  @return 0
-
-
-// total-slices()
-//
-// Accepts no arguments.
-//
-// Returns total number of slices
-// (which is equal to total number of breakpoints).
-@function total-slices()
-  @return length($slicer-breakpoints)
-
-  
-// left-bp-of-slice($slice)
-// - $slice : <slice number> A number of a slice. Should be positive integer.
-//
-// Returns the left breakpoint of an Nth slice, e. g. `600px`.
-@function left-bp-of-slice($slice)
-  $slice: get-slice-id($slice)
-  $min: 1
-  $max: total-slices()
-
-  // Making sure that the slice provided is valid
-  @if ($slice < $min) or ($slice > $max)
-
-    @warn "Wrong Slice number provided: #{$slice}. Should be between #{$min} and #{$max}."
-
-  @else
-
-    $left: i am declared
-
-    // Special treatment of the first slice...
-    @if $slice == 1
-      // ...to prevent a meaningless `min-width: 0` meida query
-      $left:  max-width // This is Breakpoint's syntax
-
-    @else
-      // Returning the left edge of the slice
-      $left:  nth($slicer-breakpoints, $slice)
-      $left:  $left + anti-overlap-correction($left, true)
-
-    @return $left
-
-
-// right-bp-of-slice($slice)
-// - $slice : <slice number> A number of a slice. Should be positive integer.
-//
-// Returns the right breakpoint of an Nth slice, e. g. `800px`.
-@function right-bp-of-slice($slice)
-  $slice: get-slice-id($slice)
-  $min: 1
-  $max: total-slices() - 1
-
-  // Making sure that the slice provided is valid
-  @if $max == total-slices()
-    @warn "Slice number provided: #{$slice}. It's the last slice, it has no right edge."
-  @else if ($slice < $min) or ($slice > $max)
-    @warn "Wrong column number provided: #{$slice}. Should be between #{$min} and #{$max}."
-  @else
-    // Reading the right edge of the slice
-    $right-bp: nth($slicer-breakpoints, $slice + 1)
-    @return $right-bp + anti-overlap-correction($right-bp, false)
-
-
-// bp($slice)
-//
-// A shortcut for nth($slicer-breakpoints, $slice)
-@function bp($slice)
-  @return nth($slicer-breakpoints, $slice)
-
-
-// lbp($slice)
-//
-// A shortcut for left-bp-of-slice($slice)
-@function lbp($slice)
-  @return left-bp-of-slice($slice)
-
-
-// rbp($slice)
-//
-// A shortcut for right-bp-of-slice($slice)
-@function rbp($slice)
-  @return right-bp-of-slice($slice)
-
-
-// get-slice-id($slice-id-or-name)
-//
-// Returns a slice number corresponding to a slice name
-//
-// - $slice-id-or-name: <slice number or name> Should be either a number of a slice (positive integer)
-//                                             or a name of the slice from $slicer-breakpoint-names (string)
-@function get-slice-id($slice-id-or-name)
-
-  // Treating the argument as a slice name.
-  // Retrieving slice id for given slice name
-  $slice-id: index($slicer-breakpoint-names, $slice-id-or-name)
-
-  // Checking whether a slice with the given name exists
-  @if $slice-id
-    //@warn "slice-id is truthful"
-
-    // Return the id found
-    @return $slice-id
-  @else
-    //@warn "slice-id is falsy"
-
-    // Assume an id was given in the first place
-    @return $slice-id-or-name
-
-
-// prev-slice($slice-id-or-name)
-//
-// Returns previous slice id for the given slice
-@function prev-slice($slice-id-or-name)
-
-  $slice-id: get-slice-id($slice-id-or-name)
-
-  @if $slice-id > 1
-    $slice-id: $slice-id - 1
-  @else
-    @warn "Previous slice for the first slice requested"
-
-  @return $slice-id
-
-
-// next-slice($slice-id-or-name)
-//
-// Returns next slice id for the given slice
-@function next-slice($slice-id-or-name)
-
-  $slice-id: get-slice-id($slice-id-or-name)
-
-  @if $slice-id < total-slices()
-    $slice-id: $slice-id + 1
-  @else
-    @warn "Previous slice for the first slice requested"
-
-  @return $slice-id
+// Returns a correction value for the given breakpoint
+// to prevent media query overlapping.
+//
+// Relies on the global variable $slicer-anti-overlap-corrections
+// that should contain a list of allowed correction values.
+//
+// Returns either only positive or only negative value.
+//
+// anti-overlap-correction($bp, $positive: true)
+//   - $bp       : a breakpoint, e. g. 800px or 20em
+//   - $positive : whether to return only positive or only negative values
+//                 * true - return only positive correction value (default)
+//                 * false - return only negative correction value
+@function anti-overlap-correction($bp, $positive: true) {
+  @each $correction in $slicer-anti-overlap-corrections {
+    @if unit($bp) == unit($correction) and $correction > 0 == $positive {
+      @return $correction;
+    }
+  }
+
+  @return 0;
+}
+
+// total-slices()
+//
+// Accepts no arguments.
+//
+// Returns total number of slices
+// (which is equal to total number of breakpoints).
+@function total-slices() {
+  @return length($slicer-breakpoints);
+}
+
+// left-bp-of-slice($slice)
+// - $slice : <slice number> A number of a slice. Should be positive integer.
+//
+// Returns the left breakpoint of an Nth slice, e. g. `600px`.
+@function left-bp-of-slice($slice) {
+  $slice: get-slice-id($slice);
+  $min: 1;
+  $max: total-slices();
+
+  // Making sure that the slice provided is valid
+  @if $slice < $min or $slice > $max {
+    @warn "Wrong Slice number provided: #{$slice}. Should be between #{$min} and #{$max}.";
+  }
+  @else {
+    $left: i am declared;
+
+    // Special treatment of the first slice...
+    @if $slice == 1 {
+      // ...to prevent a meaningless `min-width: 0` meida query
+      $left: max-width;
+    }
+    @else {
+      // Returning the left edge of the slice
+      $left: nth($slicer-breakpoints, $slice);
+      $left: $left + anti-overlap-correction($left, true);
+    }
+
+    @return $left;
+  }
+}
+
+// right-bp-of-slice($slice)
+// - $slice : <slice number> A number of a slice. Should be positive integer.
+//
+// Returns the right breakpoint of an Nth slice, e. g. `800px`.
+@function right-bp-of-slice($slice) {
+  $slice: get-slice-id($slice);
+  $min: 1;
+  $max: total-slices() - 1;
+
+  // Making sure that the slice provided is valid
+  @if $max == total-slices() {
+    @warn "Slice number provided: #{$slice}. It's the last slice, it has no right edge.";
+  }
+  @else if $slice < $min or $slice > $max {
+    @warn "Wrong column number provided: #{$slice}. Should be between #{$min} and #{$max}.";
+  }
+  @else {
+    // Reading the right edge of the slice
+    $right-bp: nth($slicer-breakpoints, $slice + 1);
+
+    @return $right-bp + anti-overlap-correction($right-bp, false);
+  }
+}
+
+// bp($slice)
+//
+// A shortcut for nth($slicer-breakpoints, $slice)
+@function bp($slice) {
+  @return nth($slicer-breakpoints, $slice);
+}
+
+// lbp($slice)
+//
+// A shortcut for left-bp-of-slice($slice)
+@function lbp($slice) {
+  @return left-bp-of-slice($slice);
+}
+
+// rbp($slice)
+//
+// A shortcut for right-bp-of-slice($slice)
+@function rbp($slice) {
+  @return right-bp-of-slice($slice);
+}
+
+// get-slice-id($slice-id-or-name)
+//
+// Returns a slice number corresponding to a slice name
+//
+// - $slice-id-or-name: <slice number or name> Should be either a number of a slice (positive integer)
+//                                             or a name of the slice from $slicer-breakpoint-names (string)
+@function get-slice-id($slice-id-or-name) {
+  // Treating the argument as a slice name.
+  // Retrieving slice id for given slice name
+  $slice-id: index($slicer-breakpoint-names, $slice-id-or-name);
+
+  // Checking whether a slice with the given name exists
+  @if $slice-id {
+    //@warn "slice-id is truthful"
+
+    // Return the id found
+    @return $slice-id;
+  }
+  @else {
+    //@warn "slice-id is falsy"
+
+    // Assume an id was given in the first place
+    @return $slice-id-or-name;
+  }
+}
+
+// prev-slice($slice-id-or-name)
+//
+// Returns previous slice id for the given slice
+@function prev-slice($slice-id-or-name) {
+  $slice-id: get-slice-id($slice-id-or-name);
+
+  @if $slice-id > 1 {
+    $slice-id: $slice-id - 1;
+  }
+  @else {
+    @warn "Previous slice for the first slice requested";
+  }
+
+  @return $slice-id;
+}
+
+// next-slice($slice-id-or-name)
+//
+// Returns next slice id for the given slice
+@function next-slice($slice-id-or-name) {
+  $slice-id: get-slice-id($slice-id-or-name);
+
+  @if $slice-id < total-slices() {
+    $slice-id: $slice-id + 1;
+  }
+  @else {
+    @warn "Previous slice for the first slice requested";
+  }
+
+  @return $slice-id;
+}
diff --git a/stylesheets/breakpoint-slicer/_mixins.sass b/stylesheets/breakpoint-slicer/_mixins.scss
similarity index 71%
rename from stylesheets/breakpoint-slicer/_mixins.sass
rename to stylesheets/breakpoint-slicer/_mixins.scss
index 3cd9911..7449a9b 100644
--- a/stylesheets/breakpoint-slicer/_mixins.sass
+++ b/stylesheets/breakpoint-slicer/_mixins.scss
@@ -1,77 +1,77 @@
-////////////////////////////////////////////////
-// If you don't understand what's going on here,
-// please read the README first.
-////////////////////////////////////////////////
-
-// Wraps the content block provided with a media query
-// with min-width equal to the left edge of the left slice
-// and max-width equal to the right edge of the right slice
-//
-// between($slice-left, $slice-right, $no-query: false)
-// - $slice-left  : <slice number> A number of the left slice. Should be a positive integer.
-// - $slice-right : <slice number> A number of the left slice. Should be a positive integer.
-// - $no-query    : [<.class>]     A class to provide the no-query fallback (see Breakpoint docs).
-=between($slice-left, $slice-right, $no-query: false)
-
-  // Parsing slice names.
-  $slice-left: get-slice-id($slice-left)
-  $slice-right: get-slice-id($slice-right)
-
-  // If the slices provided are the first and the last one,
-  // the breakpoint becomes meaningless
-  @if ($slice-left == 1) and ($slice-right == total-slices())
-    //Thus, don't wrap the code block with a media query
-    @content
-
-  @else
-
-    // Retrieving the left edge of the left slice
-    $context:   left-bp-of-slice($slice-left)
-
-    // Retrieving the right edge of the slice
-    // unless the slice is the last one
-    @if $slice-right < total-slices()
-      $right:   right-bp-of-slice($slice-right)
-      $context: append($context, $right)
-
-    // Setting the breakpoint
-    +breakpoint($context, $no-query)
-      @content
-
-
-// Wraps the content block provided with a media query
-// with min-width and max-width equal to the edges of a slice
-//
-// at($slice, $no-query: false)
-// - $slice : <slice number> A number of a slice. Should be a positive integer.
-// - $no-query    : [<.class>]     A class to provide the no-query fallback (see Breakpoint docs).
-=at($slice, $no-query: false)
-
-  +between($slice, $slice, $no-query)
-    @content
-
-
-// Wraps the content block provided with a media query
-// with min-width equal to the right edge of a slice
-//
-// from($slice, $no-query: false)
-// - $slice : <slice number> A number of a slice. Should be a positive integer.
-// - $no-query    : [<.class>]     A class to provide the no-query fallback (see Breakpoint docs).
-=from($slice, $no-query: false)
-
-  +between($slice, total-slices(), $no-query)
-    @content
-
-
-// Wraps the content block provided with a media query
-// with max-width equal to the right edge of a slice
-//
-// to($slice, $no-query: false)
-// - $slice : <slice number> A number of a slice. Should be a positive integer.
-// - $no-query    : [<.class>]     A class to provide the no-query fallback (see Breakpoint docs).
-=to($slice, $no-query: false)
-
-  +between(1, $slice, $no-query)
-    @content
-
-
+////////////////////////////////////////////////
+// If you don't understand what's going on here,
+// please read the README first.
+////////////////////////////////////////////////
+
+// Wraps the content block provided with a media query
+// with min-width equal to the left edge of the left slice
+// and max-width equal to the right edge of the right slice
+//
+// between($slice-left, $slice-right, $no-query: false)
+// - $slice-left  : <slice number> A number of the left slice. Should be a positive integer.
+// - $slice-right : <slice number> A number of the left slice. Should be a positive integer.
+// - $no-query    : [<.class>]     A class to provide the no-query fallback (see Breakpoint docs).
+@mixin between($slice-left, $slice-right, $no-query: false) {
+  // Parsing slice names.
+  $slice-left: get-slice-id($slice-left);
+  $slice-right: get-slice-id($slice-right);
+
+  // If the slices provided are the first and the last one,
+  // the breakpoint becomes meaningless
+  @if $slice-left == 1 and $slice-right == total-slices() {
+    //Thus, don't wrap the code block with a media query
+    @content;
+  }
+  @else {
+    // Retrieving the left edge of the left slice
+    $context: left-bp-of-slice($slice-left);
+
+    // Retrieving the right edge of the slice
+    // unless the slice is the last one
+    @if $slice-right < total-slices() {
+      $right: right-bp-of-slice($slice-right);
+      $context: append($context, $right);
+    }
+
+    // Setting the breakpoint
+    @include breakpoint($context, $no-query) {
+      @content;
+    }
+  }
+}
+
+// Wraps the content block provided with a media query
+// with min-width and max-width equal to the edges of a slice
+//
+// at($slice, $no-query: false)
+// - $slice : <slice number> A number of a slice. Should be a positive integer.
+// - $no-query    : [<.class>]     A class to provide the no-query fallback (see Breakpoint docs).
+@mixin at($slice, $no-query: false) {
+  @include between($slice, $slice, $no-query) {
+    @content;
+  }
+}
+
+// Wraps the content block provided with a media query
+// with min-width equal to the right edge of a slice
+//
+// from($slice, $no-query: false)
+// - $slice : <slice number> A number of a slice. Should be a positive integer.
+// - $no-query    : [<.class>]     A class to provide the no-query fallback (see Breakpoint docs).
+@mixin from($slice, $no-query: false) {
+  @include between($slice, total-slices(), $no-query) {
+    @content;
+  }
+}
+
+// Wraps the content block provided with a media query
+// with max-width equal to the right edge of a slice
+//
+// to($slice, $no-query: false)
+// - $slice : <slice number> A number of a slice. Should be a positive integer.
+// - $no-query    : [<.class>]     A class to provide the no-query fallback (see Breakpoint docs).
+@mixin to($slice, $no-query: false) {
+  @include between(1, $slice, $no-query) {
+    @content;
+  }
+}
diff --git a/stylesheets/breakpoint-slicer/_variables.sass b/stylesheets/breakpoint-slicer/_variables.sass
deleted file mode 100644
index bf0410a..0000000
--- a/stylesheets/breakpoint-slicer/_variables.sass
+++ /dev/null
@@ -1,4 +0,0 @@
-// The defaults
-$slicer-breakpoints: 0 400px 600px 800px 1010px !default
-$slicer-breakpoint-names: () !default
-$slicer-anti-overlap-corrections: 1px !default
\ No newline at end of file
diff --git a/stylesheets/breakpoint-slicer/_variables.scss b/stylesheets/breakpoint-slicer/_variables.scss
new file mode 100644
index 0000000..3ae93b6
--- /dev/null
+++ b/stylesheets/breakpoint-slicer/_variables.scss
@@ -0,0 +1,4 @@
+// The defaults
+$slicer-breakpoints: 0 400px 600px 800px 1010px !default;
+$slicer-breakpoint-names: () !default;
+$slicer-anti-overlap-corrections: 1px !default;