impress/app/assets/stylesheets/partials/_campaign-progress.sass

$campaign-border-color: #006
$campaign-background-color: #eef

=campaign-progress
  .campaign-progress-wrapper
    +border-radius(8px)
    background: desaturate(lighten($campaign-border-color, 30%), 85%)
    background-image: linear-gradient(color-stops(desaturate(lighten($campaign-border-color, 50%), 85%), desaturate(lighten($campaign-border-color, 30%), 85%)))

    border: 4px solid $campaign-border-color
    clear: both
    margin-bottom: 1em
    margin-top: .5em
    position: relative

    .button
      +awesome-button
      +loud-awesome-button-color
      font-size: 75%
      margin-left: 1em
      padding: .25em .75em

  .campaign-progress
    background: $campaign-border-color
    background-image: linear-gradient(color-stops($campaign-border-color + #222, $campaign-border-color))
    border-right: 1px solid $campaign-border-color

  .campaign-progress-wrapper, .campaign-progress
    height: 2.5em

  .campaign-progress-label
    +text-shadow(#777, -1px, -1px, 0)
    color: white
    font-size: 150%
    left: 0
    position: absolute
    top: 0
    text-align: center
    width: 100%

    a
      color: inherit
      display: block
      text-decoration: none

    .button
      position: relative
      top: -2px /* lame hack to align well with text; sigh */

  &.campaign-loaded
    .campaign-progress-wrapper
      visibility: visible