// Contextual backgrounds
.bg-default {
  color: #fff;
  background-color: @state-default-inverse-bg;
  a&:hover {
    background-color: darken(@state-default-inverse-bg, 10%);
  }
}
.bg-primary {
  color: #fff;
  background-color: @state-primary-inverse-bg;
  a&:hover {
    background-color: darken(@state-primary-inverse-bg, 10%);
  }
}
.bg-success {
  color: #fff;
  background-color: @state-success-inverse-bg;
  a&:hover {
    background-color: darken(@state-success-inverse-bg, 10%);
  }
}
.bg-info {
  color: #fff;
  background-color: @state-info-inverse-bg;
  a&:hover {
    background-color: darken(@state-info-inverse-bg, 10%);
  }
}
.bg-warning {
  color: #fff;
  background-color: @state-warning-inverse-bg;
  a&:hover {
    background-color: darken(@state-warning-inverse-bg, 10%);
  }
}
.bg-danger {
  color: #fff;
  background-color: @state-danger-inverse-bg;
  a&:hover {
    background-color: darken(@state-danger-inverse-bg, 10%);
  }
}
.bg-important {
  color: #fff;
  background-color: @state-important-inverse-bg;
  a&:hover {
    background-color: darken(@state-important-inverse-bg, 10%);
  }
}
.bg-special {
  color: #fff;
  background-color: @state-special-inverse-bg;
  a&:hover {
    background-color: darken(@state-special-inverse-bg, 10%);
  }
}



