@charset "utf-8";
/* CSS Document */
td
{
   display: table-cell;
   padding:0px;
}
#instruction
{
    position: absolute;
    top: 12px;
    left: 32px;
    width: 380px;
    text-align: left;
    font-size: 12px;
    color: #282820;
    line-height: 16px;
}
#instruction h2{ font-size: 12pt; font-weight: bold; line-height: 1.5em; margin: 0px; }

#content
{
    position: absolute;
    top: 140px;
    left: 15px;
    width: 811px;
    height: 400px;
}

#timeline
{
    position: absolute;
    top: 70px;
    left: 80px;
    width: 739px;
    height: 139px;
    background-image: url(../assets/timeline-back.png);
}

.timeline-title{position: absolute;font-size: 10pt;color: #31363a;text-align: left;width: 100px;}
.timeline-label
{
    position: absolute;
    font-size: 9pt;
    color: #68685f;
    text-align: center;
    width: 40px;
    background-color: #ffffff;
    line-height: 1.3em;
}
#timeline-labels {position: absolute; top: 89px;/*220px;*/}
#timeline-title0 {left: 19px;margin-top: -15px;}
#timeline-label0 {left: 60px;}
#timeline-label1 {left:198px;}
#timeline-label2 {left:340px;}
#timeline-label3 {left:480px;}
#timeline-label4 {left:620px;}
#timeline-label5 {left:760px;}

.slider {position: absolute;  left: 78px;  height: 2px;  border: 1px solid green;  }
#customerSlider{ top:276px; width: 703px; }
#inventorySlider{top:336px;width: 703px;}
#supplierSlider{ top:396px; width: 703px; }

#delivered-label {position: absolute;left: 220px;top: 50px;width: 150px;border: 1px solid #333333;color: #fff;background-color: #242424;padding: 0px 5px;margin-left: -80px;text-align: center;font-size: 9pt;line-height:1.5em;}

#canvas-holder
{
    position: absolute;
    left: 80px;
    width: 700px;
    top: 0px;
    height: 400px;
}

.bar-text
{
    position: absolute;
    width: 160px;
    height: 20px;
    text-align: center;
    color: #FFFFFF;
    font-size: 8.5pt;
    font-weight: normal;
    margin-top: 11px;
    line-height: 1.2em;
}
.bar-value{font-size: 16px;font-weight: 700;line-height: 16px;}
.bar-text.right{text-align: left;color: #ea5429;}
.bar-text.left{text-align: right;color: #5091cd;}

#formula
{
    position: absolute;
    top: 69px;
    left: 50px;
    color: #242424;
    vertical-align: middle;
}
#formula table{}
#formula .bracket-col
{
    text-align: center;
    font-size: 45px;
    padding-left: 2px;
    padding-right: 2px;
}

#formula .oper-col
{
    text-align: center;
    font-size: 30px;
    padding-left: 10px;
    padding-right: 10px;
}

#formula .text-col
{
    font-size: 9pt;
    font-weight: bold;
    line-height: 1.2em;
    text-align: center;
}

#formula .formula-value
{
    font-size: 12pt;
    font-weight: bold;
    line-height: 1.2em;
    text-align: center;
}
#formula #formula-cash-conversion{color: #5091cd;}
#formula #formula-inventory{color: #396400;}
#formula #formula-sales-outstanding{color: #ea5429;}
#formula #formula-purchase-outstanding{color: #781e65;}


.i-btn
{
    position: absolute;
    top: -22px;
    left: 190px;
    cursor:pointer;
    width: 16px;
    height: 16px;
    background-image: url(../assets/i-btn.png);
    background-position: 0px 0px;
    background-position-y: 0px;
}

.i-btn.selected
{
    background-position: 0px -16px;
    background-position-y: -16px;
}
.i-cover { position:absolute; top:0px; left:0px; width:100%; height:100%; background-color:rgba(50, 50, 50, 0.5); z-index:52;/*display: table-cell; vertical-align: middle;*/ /*background-image: url(../assets/i-cover.png); background-repeat: repeat;*/  }

.i-popup
{
    position: absolute;
    display: inline-block;
    width: 500px;
    height: 188px;
    background-color: #FFFFFF;
    z-index:51;
    -webkit-box-shadow: 0px 0px 15px 0px rgba(50, 50, 50, 0.75);
    -moz-box-shadow:    0px 0px 15px 0px rgba(50, 50, 50, 0.75);
    box-shadow:         0px 0px 15px 0px rgba(50, 50, 50, 0.75);
    padding: 20px;
    margin: auto;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

.i-popup .i-title
{
    color: #292920;
    width: 100%;
    height: 25px;
    font-size: 13pt;
    font-weight: normal;
    line-height: 1.5em;
    border-bottom: 1px solid #292920;
    font-family: Helvetica, Arial, sans-serif;
}
.i-popup .i-content
{
    color: #292920;
    font-size: 10pt;
    margin-top: 10px;
    line-height: 1.5em;
    font-family: Helvetica, Arial, sans-serif;
}

.i-popup .i-close-btn
{
    cursor:pointer;
    position: absolute;
    width: 8px;
    height: 8px;
    background: url("../assets/i-close-button.png");
    top: 5px;
    right: 5px;
}



.axis-title {
  font-size: 16px;
  font-weight: 700;
  line-height: 16px;
}

.axis-sub-title {
  font-size: 13px;
}

.bar-label {}

p {
  margin: 0px;
}

.days-purchase-bar.right {
  color: #781e65;
}

.i-cover p:last-child
 {
  padding-top: 12px;
}