#supplies {
    position: relative;
    padding: 30px 0 30px 20px;
    font-family: Arial, Helvetica, sans-serif;
}

#supplies .high {
    position: relative;
    float: left;
    margin: 0 20px 20px 0;
    width: 100px;
    height: 2px;
    background: #ffc000;
}

#supplies .high span {
    font-size: 11px;
    position: absolute;
    top: -20px;
}

#supplies .low {
    position: relative;
    float: left;
    width: 100px;
    height: 2px;
    background: #6dcff6;
}

#supplies .low span {
    font-size: 11px;
    position: absolute;
    top: -20px;
}

#supplies .measure {
    float: left;
    position: relative;
    margin: 30px 18px 0 0;
}

#supplies .measure .top {
    position: absolute;
    left: -5px;
    width: 20px;
    height: 2px;
    background: #ffc000;
    z-index: 3;
}

#supplies .measure .bottom {
    position: absolute;
    left: -5px;
    width: 20px;
    height: 2px;
    background: #6dcff6;
    z-index: 3;
}

#supplies .measure.one .top {
    bottom: 65px;
}

#supplies .measure.one .bottom {
    bottom: 18px;
}

#supplies .measure.two .top {
    bottom: 75px;
}

#supplies .measure.two .bottom {
    bottom: 15px;
}

#supplies .measure.three .top {
    bottom: 70px;
}

#supplies .measure.three .bottom {
    bottom: 21px;
}

#supplies .measure.four .top {
    bottom: 72px;
}

#supplies .measure.four .bottom {
    bottom: 14px;
}

#supplies .measure.five .top {
    bottom: 67px;
}

#supplies .measure.five .bottom {
    bottom: 15px;
}

#supplies .measure.six .top {
    bottom: 64px;
}

#supplies .measure.six .bottom {
    bottom: 14px;
}

#supplies .measure.seven .top {
    bottom: 67px;
}

#supplies .measure.seven .bottom {
    bottom: 13px;
}

#supplies .measure.eight .top {
    bottom: 67px;
}

#supplies .measure.eight .bottom {
    bottom: 17px;
}

#supplies .measure .name {
    position: absolute;
    top: -20px;
    left: 14px;
    width: 32px;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
    color: #000;
}

#supplies .measure .name.big {
    font-size: 15px;
    color: #cc1617;
}

#supplies .measure .warning {
    position: absolute;
    top: 20px;
    left: 24px;
    width: 14px;
    height: 28px;
    background: url(../images/warning.png);
    z-index: 3;
}

#supplies .measure .bag {
    position: absolute;
    top: 0;
    left: 0;
    width: 58px;
    height: 100px;
    background: url(../images/bag.png);
    z-index: 2;
}

#supplies .measure .bag:after {
    content: "";
    position: absolute;
    bottom: -18px;
    left: 0;
    width: 58px;
    height: 18px;
    background: url(../images/bag-bottom.png);
    z-index: 2;
}

#supplies .measure .outer {
    position: relative;
    bottom: 0;
    width: 58px;
    height: 100px;
    overflow: hidden;
}

#supplies .measure .inner {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 0%;
    background: url(../images/fill.png) no-repeat;
    overflow: hidden;
}