/**
 * @copyright   2010-2013, The Titon Project
 * @license     http://opensource.org/licenses/bsd-license.php
 * @link        http://titon.io
 */

@import "../common";

/**
 *    <div class="progress">
 *        <div class="progress-bar" style="width: 50%">50%</div>
 *    </div>
 */

.progress {
    height: 20px;
    overflow: hidden;
    position: relative;
    background: $gray;

    @include clear-fix;
}

.progress-bar {
    height: 20px;
    line-height: 18px;
    overflow: hidden;
    position: relative;
    text-align: center;
    font-size: .7rem;
    background: $gray-darkest;
    float: left;
    @include transition(width .6s, background .3s);
}