Bootstrap3-styled progress tags (makes HTML5 progress tags look like Bootstrap3's div.progress

gistfile1.scss

$progress-border-radius: $border-radius-base !default;

progress {
  color: $progress-bar-bg;
  background-size: auto;
  width: 100%;
  height: 20px;
  box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.15);
  border-radius: $progress-border-radius;
  margin-bottom: 20px;
  &::-moz-progress-bar {
    border-top-left-radius: $progress-border-radius;
    border-bottom-left-radius: $progress-border-radius;
  }
  &::-webkit-progress-value {
    border-top-left-radius: $progress-border-radius;
    border-bottom-left-radius: $progress-border-radius;
  }
  &::-webkit-progress-bar {
    background: $progress-bg;
    border-radius: $progress-border-radius;
    box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.15);
  }
  &:not([value]) {
    &::-moz-progress-bar {
      background-image: url(indeterminate.gif);
    }
    &::-webkit-progress-bar {
      background-image: url(indeterminate.gif);
    }
  }

  &.progress-bar-striped {
    &::-moz-progress-bar {
      background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
      background-size: 40px 40px;
    }
    &::-webkit-progress-value {
      background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
      background-size: 40px 40px;
    }
  }
  &.active {
    &::-moz-progress-bar {
      -webkit-animation: progress-bar-stripes 2s linear infinite;
      animation: progress-bar-stripes 2s linear infinite;
    }
    &::-webkit-progress-value {
      -webkit-animation: progress-bar-stripes 2s linear infinite;
      animation: progress-bar-stripes 2s linear infinite;
    }
  }

  &::-moz-progress-bar { background-color: $progress-bar-bg; }
  &::-webkit-progress-value { background-color: $progress-bar-bg; }
  &.progress-bar-success {
    &::-moz-progress-bar { background-color: $progress-bar-success-bg; }
    &::-webkit-progress-value { background-color: $progress-bar-success-bg; }
  }
  &.progress-bar-info {
    &::-moz-progress-bar { background-color: $progress-bar-info-bg; }
    &::-webkit-progress-value { background-color: $progress-bar-info-bg; }
  }
  &.progress-bar-warning {
    &::-moz-progress-bar { background-color: $progress-bar-warning-bg; }
    &::-webkit-progress-value { background-color: $progress-bar-warning-bg; }
  }
  &.progress-bar-danger {
    &::-moz-progress-bar { background-color: $progress-bar-danger-bg; }
    &::-webkit-progress-value { background-color: $progress-bar-danger-bg; }
  }
}