title: Jekyll and Scss having undefined variables on imported files
body: <p>Upon running <code>bundle exec jekyll serve</code> I get the error </p>
  
  <pre><code>Conversion error: Jekyll::Converters::Scss encountered an error while converting 'assets/css/main.scss':
                  Undefined variable: "$grey-color". on line 17
  </code></pre>
  
  <p>In my main.scss file, $grey-color is defined</p>
  
  <pre><code>--- snip ---
  
  $grey-color:       #37474F;
  $grey-color-light: #fefefe;
  $grey-color-dark:  #5e5e5e;
  
  --- snip ---
  
  / Import partials from `sass_dir` (defaults to `_sass`)
  @import
      "base",
      "cards",
  
  --- snip ---
  </code></pre>
  
  <p>and at the bottom of the file, imports _base.scss from the _sass folder, where it errors out at line 17 which is <code>background-color: $grey-color;</code> I know it's erroring out because if I change it to a hex color (ex #FFFFFF) it errors out on the next variable usage.</p>
  
  <p>Why aren't my imports getting access to the variables defined in main.scss?</p>