Generated by SassMeister.com.

SassMeister-input.scss

// ----
// Sass (v3.4.9)
// Compass (v1.0.1)
// ----

$blue: #2980b9;
$blue-dark: #20638f;
$blue-light: #3498db;
$red: #e74c3c;
$red-dark: #d62c1a;
$red-light: #ed7669;
$green: #27ae60;
$green-dark: #1e8449;
$green-light: #36d278;
$orange: #e67e22;
$orange-dark: #bf6516;
$orange-light: #eb9950;

button {
  background: #e74c3c;
  border: 2px solid #d62c1a;
  border-radius: .25em;
  color: white;
  &:hover {
    background: #ed7669;
  }
  &.red {
    background: #e74c3c;
    border-color: #d62c1a;
    &:hover {
      background: #ed7669;
    }
  }
  &.green {
    background: #27ae60;
    border-color: #1e8449;
    &:hover {
      background: #36d278;
    }
  }
  &.orange {
    background: #e67e22;
    border-color: #bf6516;
    &:hover {
      background: #eb9950;
    }
  }
}

SassMeister-output.css

button {
  background: #e74c3c;
  border: 2px solid #d62c1a;
  border-radius: .25em;
  color: white;
}
button:hover {
  background: #ed7669;
}
button.red {
  background: #e74c3c;
  border-color: #d62c1a;
}
button.red:hover {
  background: #ed7669;
}
button.green {
  background: #27ae60;
  border-color: #1e8449;
}
button.green:hover {
  background: #36d278;
}
button.orange {
  background: #e67e22;
  border-color: #bf6516;
}
button.orange:hover {
  background: #eb9950;
}