Generated by SassMeister.com.

SassMeister-input.scss

// ----
// libsass (v3.2.5)
// ----

.btn,
[class*="btn-"],
[class*=" btn-"]  {
  display: inline-block;
  font-weight: 800;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;

  &:hover,
  &:focus {
    color: #444;
    text-decoration: none;
  }

  &[disabled],
  fieldset[disabled] & {
    cursor: disabled;
    opacity: .65;
  }
}

// Button brands
.btn-sneap {
  background-color: #189;
  color: #fff;
}

.btn-fire {
  background-color: #a44;
  color: #333;
}

// Button variant
.btn-rounded {
  border-radius: 24px;
}

//
// Additional code for variant 1
.btn-login {
  @extend .btn, .btn-fire, .btn-rounded;
}
.btn-login-square {
  @extend .btn, .btn-fire;
}

SassMeister-output.css

.btn,
.btn-login,
.btn-login-square,
[class*="btn-"],
[class*=" btn-"] {
  display: inline-block;
  font-weight: 800;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
}

.btn:hover,
.btn-login:hover,
.btn-login-square:hover,
.btn:focus,
.btn-login:focus,
.btn-login-square:focus,
[class*="btn-"]:hover,
[class*="btn-"]:focus,
[class*=" btn-"]:hover,
[class*=" btn-"]:focus {
  color: #444;
  text-decoration: none;
}

.btn[disabled],
[disabled].btn-login,
[disabled].btn-login-square,
fieldset[disabled] .btn,
fieldset[disabled] .btn-login,
fieldset[disabled] .btn-login-square,
[class*="btn-"][disabled],
fieldset[disabled] [class*="btn-"],
[class*=" btn-"][disabled],
fieldset[disabled] [class*=" btn-"] {
  cursor: disabled;
  opacity: .65;
}

.btn-sneap {
  background-color: #189;
  color: #fff;
}

.btn-fire, .btn-login, .btn-login-square {
  background-color: #a44;
  color: #333;
}

.btn-rounded, .btn-login {
  border-radius: 24px;
}