.progressContainer  {
    margin-top:     15px;
    display:        block;
    overflow:       visible;
    min-height:     1px;
    border:         1px solid white;
    zoom:           1;    
}
.progressCentred    {
    display:        inline-block;
    width:          auto;
    margin:         0px auto;
    padding:        0 30px 0 0;
}
.progressLeftHeader {
    float:          left;
    width:          68%;
    height:         150px;
}
.progressHeading    {
    font-size:      20pt;
    font-weight:    bold;
    color:          black;
    margin-bottom:  15px;
}
.progressHeading1   {
    font-size:      16pt;
    font-weight:    bold;
    color:          #008da9;
    margin-bottom:  5px;
}
.progressHeading2   {
    font-size:      12pt;
    font-weight:    bold;
    color:          #006f98;
    margin-bottom:  5px;
}
.progressText1      {
    font-size:      9pt;
    font-weight:    bold;
    color:          #999999;
}
.progressRightHeader {
    float:          left;
    width:          32%;
    border:         2px solid #bbbbbb;
    border-radius:  5px;
    z-index:        0;
}
.progressLegend     {
    float:          right;
    padding:        10px;
    margin:         0;
    margin-right:   20px;    
}
.progressLegend p   {
    margin:         0 0 10px 0;
    font-size:      11pt;
    font-weight:    bold;
    color:          #aaaaaa;
}

.progressArea       {
    position:       relative;
    display:        block;
    width:          100%; 
    height:         100px;
    padding-top:    10px;
    text-align:     center;
}
.progressStep       {
    position:       relative;
    display:        inline-block;
    float:          left;
    height:         100%;
    margin-right:   -25px;
}
.progressStepSpacer {
    margin-left:    50px;
}
.progressLine       {
    display:        inline-block; 
    height:         70px;  /* This height must be adjusted if progressArea height, or progressCircle height changed */
    width:          100px; 
    margin:         0; 
    padding:        0; 
    border-top:     5px solid #bbbbbb;
    z-index:        0;
}
.progressCircleAndText {
    position:       relative;
    display:        inline-block;
    width:          80px;
    height:         100%;
    margin-left:    -30px;
    text-align:     center;
    z-index:        1;
}
.progressCircle     {
    display:        block; 
    height:         35px; 
    width:          35px; 
    margin-left:    auto; 
    margin-right:   auto;
    padding:        0; 
    border-radius:  18px; 
    border:         5px solid #bbbbbb;
    z-index:        2;
}
.progressText       {
    display:        inline-block;
    float:          left;
    width:          100%;
    font-size:      8pt;
    color:          #646464;
    text-align:     center;
    margin-top:     10px;
    height:         40px;
    z-index:        2;
}
.progressNotStarted .progressCircle {
    background-color: #999999;
    border-color:   #888888;
}
.progressNotStarted .progressLine {
    border-color:   #888888;
}
.progressComplete .progressCircle {
    background-color: #4EAE51;
    border-color:   #2B9E2C;
}
.progressComplete .progressLine {
    border-color:   #2B9E2C;
}
.progressInProgress .progressCircle {
    background-color: #FF9549;
    border-color:   #FF7423
}
.progressInProgress .progressLine {
    border-color:   #FF7423;
}
.progressNotApplicable .progressCircle {
    background-color: black;
    border-color:   black;
}
.progressNotApplicable .progressLine {
    border-color:   black;
}

.progressOverallCell {
    display:        block; 
    margin-left:    auto; 
    margin-right:   auto;
    padding:        0; 
    height:         40px;
    width:          40px;
    background-size: 40px 40px!important;
    background-repeat: no-repeat!important;
}
.progressOverallCellText   {
    display:        inline-block; 
    font-size:      7pt;
    font-weight:    bold;
    line-height:    40px;
    text-align:     center;
    color:          #292929;
}
.progressOverallRow {
    display:        block; 
    margin-left:    auto; 
    margin-right:   auto;
    padding:        0; 
    height:         150px;
    width:          150px;
    background-size: 150px 150px;
    background-repeat: no-repeat;
}
.progressOverallRowText {
    display:        inline-block; 
    font-size:      14pt;
    font-weight:    bold;
    line-height:    150px;
    width:          150px;
    text-align:     center;
}
.progress10         {
    background:     url(/portal/images/progress10.png);
    background-color: #FF9549;    
}
.progress20         {
    background:     url(/portal/images/progress20.png);
    background-color: #FF9549;    
}
.progress25         {
    background:     url(/portal/images/progress25.png);
    background-color: #FF9549;
}
.progress30         {
    background:     url(/portal/images/progress30.png);
    background-color: #FF9549;    
}
.progress33         {
    background:     url(/portal/images/progress33.png);
    background-color: #FF9549;    
}
.progress40         {
    background:     url(/portal/images/progress40.png);
    background-color: #FF9549;    
}
.progress50         {
    background:     url(/portal/images/progress50.png);
    background-color: #FF9549;
}
.progress60         {
    background:     url(/portal/images/progress60.png);
    background-color: #FF9549;    
}
.progress66         {
    background:     url(/portal/images/progress66.png);
    background-color: #FF9549;    
}
.progress70         {
    background:     url(/portal/images/progress70.png);
    background-color: #FF9549;    
}
.progress75         {
    background:     url(/portal/images/progress75.png);
    background-color: #FF9549;
}
.progress80         {
    background:     url(/portal/images/progress80.png);
    background-color: #FF9549;    
}
.progress90         {
    background:     url(/portal/images/progress90.png);
    background-color: #FF9549;    
}
.progress100        {
    background:     url(/portal/images/progress100.png);
    background-color: #2B9E2C;
}