.spendbandcalc {
    position: relative;
}
.statuscolordiv {
    height: 12px;
    width: 22%;
    background: #000;
    border-top-right-radius: 6px;
    -webkit-border-top-right-radius: 6px;
    -moz-border-radius-topright: 6px;
    border-bottom-right-radius: 6px;
    -webkit-border-bottom-right-radius: 6px;
    -moz-border-radius-bottomright: 6px;
    margin-right: 1px;
    position: absolute;
    border-right: 1px solid #fff;
    cursor: pointer;
}
.agactivecircle {
    width:25px;
    height:25px;
    z-index: 8;
    position: absolute;
    bottom: -5.5%;
}
.agactivecircle img{
    width:25px;
    height:25px;
}
.agactivecircle.blue {
    position: absolute;
    left: 7%;
}
.agactivecircle.bronze {
    position: absolute;
    left: 27%;
}
.agactivecircle.silver {
    position: absolute;
    left: 47%;
}
.agactivecircle.gold {
    position: absolute;
    left: 67%;
}
.agactivecircle.diamond {
    position: absolute;
    left: 86%;
}
.statuscolordiv.statuscolordiv-blue {
    left: 0;
    background: rgb(46,109,172);
    background: -moz-linear-gradient(90deg, rgba(46,109,172,1) 0%, rgba(148,202,250,1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(46,109,172,1) 0%, rgba(148,202,250,1) 100%);
    background: linear-gradient(90deg, rgba(46,109,172,1) 0%, rgba(148,202,250,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#2e6dac",endColorstr="#94cafa",GradientType=1);
    z-index: 6;
}
.statuscolordiv.statuscolordiv-bronze {
    left: 20%;
    background: rgb(185,106,71);
    background: -moz-linear-gradient(90deg, rgba(185,106,71,1) 0%, rgba(248,152,89,1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(185,106,71,1) 0%, rgba(248,152,89,1) 100%);
    background: linear-gradient(90deg, rgba(185,106,71,1) 0%, rgba(248,152,89,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#b96a47",endColorstr="#f89859",GradientType=1);
    z-index: 5;
}
.statuscolordiv.statuscolordiv-silver {
    left: 40%;
    background: rgb(142,142,142);
    background: -moz-linear-gradient(90deg, rgba(142,142,142,1) 0%, rgba(220,220,220,1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(142,142,142,1) 0%, rgba(220,220,220,1) 100%);
    background: linear-gradient(90deg, rgba(142,142,142,1) 0%, rgba(220,220,220,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#8e8e8e",endColorstr="#dcdcdc",GradientType=1);
    z-index: 4;
}
.statuscolordiv.statuscolordiv-gold {
    left: 59%;
    background: rgb(202,153,67);
    background: -moz-linear-gradient(90deg, rgba(202,153,67,1) 0%, rgba(246,215,96,1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(202,153,67,1) 0%, rgba(246,215,96,1) 100%);
    background: linear-gradient(90deg, rgba(202,153,67,1) 0%, rgba(246,215,96,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ca9943",endColorstr="#f6d760",GradientType=1);
    z-index: 3;
}
.statuscolordiv.statuscolordiv-diamond {
    left: 78%;
    background: rgb(192,198,214);
    background: -moz-linear-gradient(90deg, rgba(192,198,214,1) 0%, rgba(222,208,224,1) 50%, rgba(199,180,202,1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(192,198,214,1) 0%, rgba(222,208,224,1) 50%, rgba(199,180,202,1) 100%);
    background: linear-gradient(90deg, rgba(192,198,214,1) 0%, rgba(222,208,224,1) 50%, rgba(199,180,202,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#c0c6d6",endColorstr="#c7b4ca",GradientType=1);
    z-index: 2;
}
.verticaltext
{
    -ms-writing-mode: tb-rl;
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    white-space: nowrap;
    padding-bottom:30px;
}