<style>
        .progress-container {
            border: 1px solid #000;
            height: 19px;
            margin: 5px;
            background: white;
            -moz-border-radius: 4px;
            -webkit-border-radius: 4px;
            text-align: center;
            position: relative;
        }
        .progress {
            position: absolute;
            top: 0;
            left: 0;
            height: 100%;
            width: 100%;
            -moz-border-radius: 2px;
            -webkit-border-radius: 2px;
            background: #1E5799;
            background: -moz-linear-gradient(top, #1E5799 0%, #2989D8 50%, #207cca 51%, #7db9e8 100%); /* firefox */
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1E5799), color-stop(50%,#2989D8), color-stop(51%,#207cca), color-stop(100%,#7db9e8)); /* webkit */
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1E5799', endColorstr='#7db9e8',GradientType=0 );
            z-index: 2;
        }
        .progress-number {
            color: #000;
            font-weight: bold;
            position: absolute;
            left: 37%;
            z-index: 3;
        }
</style>