title: Sass::SyntaxError: Undefined variable: "$alert-padding"
body: <p>I get this error when I compile to production. </p>
  
  <blockquote>
    <p>Sass::SyntaxError: Undefined variable: "$alert-padding".</p>
  </blockquote>
  
  <p>The compiler worked fine until now, only today when I backed up a styles.css.scss file this error occurred. </p>
  
  <p>In production env I have</p>
  
  <pre><code>  config.assets.precompile =  ['*.js', '*.css', '*.css.erb', '*.scss'] 
  </code></pre>
  
  <p>content of styles.css.scss</p>
  
  <pre><code>$btn-default-bg: green;
  $btn-default-color: white;
  $navbar-default-bg: white;
  $navbar-default-border: white;
  @import 'bootstrap';
  
  html{
  
  height:100%;  
  
  }
  
  body {
    height:100%;
    padding-top: 60px;
    background: rgba(0,123,91,1);
  }
  
  // @import 'bootstrap-responsive';
  .navbar-header,
  #bs-example-navbar-collapse-1{
    background: #004835 !important;
  }
  
  .navbar-default .navbar-brand,
  .navbar-default .navbar-nav&gt;li&gt;a{
    color:#ffffff;
  }
  
  nav{
    border:none !important;
  }
  </code></pre>
  
  <p>application.css</p>
  
  <pre><code>/*
   * This is a manifest file that'll be compiled into application.css, which will include all the files
   * listed below.
   *
   * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
   * or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
   *
   * You're free to add application-wide styles to this file and they'll appear at the top of the
   * compiled file, but it's generally better to create a new file per style scope.
   *
   *= require_self
   *= require phrasing
   *= require_tree .
   */
  </code></pre>