/* Statistics */
#h-graph,#d-graph,#m-graph {position: relative; height: 150px;width: 620px;
  margin: 1.1em 0 3.5em; padding: 0;
  background: #FFF;
  border: 1px solid #8399E2; list-style: none;
  font: 9px Helvetica, Geneva, sans-serif;
}
#h-graph ul, #d-graph ul,#m-graph ul {margin: 0; padding: 0; list-style: none;}

#h-graph li.stats, #d-graph li.stats, #m-graph li.stats {height: 148px; padding-top: 2px; border-right: 1px dotted #C4C4C4; color: #AAA;}

#h-graph li.bar p, #d-graph li.bar p, #m-graph li.bar p {margin: 2px 0 0; padding: 0;}
#h-graph li.views, #d-graph li.views, #m-graph li.views {left: 0px; background: #CBDEFF;}
#h-graph li.clicks, #d-graph li.clicks {left: 9px; background: #8399E2;}
#m-graph li.clicks {left:25px; background-color:#8399E2;}
#h-graph .legend li.views,#d-graph .legend li.views,#m-graph .legend li.views { border: 1px solid;color: #000;position:absolute;left:539px; top: -182px; background-color: #CBDEFF; display:block; width:80px;  height:12px; padding-top:3px;}
#h-graph .legend li.clicks, #d-graph .legend li.clicks, #m-graph .legend li.clicks{ border: 1px solid;color: #000;position:absolute;left:539px; top: -167px;  background-color: #8399E2;  display:block; width:80px;  height:12px; padding-top:3px;}

#h-graph li {position: absolute; bottom: 0; width: 25px; z-index: 2; margin: 0; padding: 0; text-align: center; list-style: none;}
#h-graph li.bar {width: 17px;color: #000;}
#h-graph #hour0 {left: 0;}
#h-graph #hour1 {left: 25px;}
#h-graph #hour2 {left: 50px;}
#h-graph #hour3 {left: 75px;}
#h-graph #hour4 {left: 100px;}
#h-graph #hour5 {left: 125px;}
#h-graph #hour6 {left: 150px;}
#h-graph #hour7 {left: 175px;}
#h-graph #hour8 {left: 200px;}
#h-graph #hour9 {left: 225px;}
#h-graph #hour10 {left: 250px;}
#h-graph #hour11 {left: 275px;}
#h-graph #hour12 {left: 300px;}
#h-graph #hour13 {left: 325px;}
#h-graph #hour14 {left: 350px;}
#h-graph #hour15 {left: 375px;}
#h-graph #hour16 {left: 400px;}
#h-graph #hour17 {left: 425px;}
#h-graph #hour18 {left: 450px;}
#h-graph #hour19 {left: 475px;}
#h-graph #hour20 {left: 500px;}
#h-graph #hour21 {left: 525px;}
#h-graph #hour22 {left: 550px;}
#h-graph #hour23 {left: 575px; border-right: none;}

#d-graph li {position: absolute; bottom: 0; width: 20px; z-index: 2; margin: 0; padding: 0; text-align: center; list-style: none;}
#d-graph li.bar {width: 13px; color: #000;}
#d-graph #day1 {left: 0;}
#d-graph #day2 {left: 20px;}
#d-graph #day3 {left: 40px;}
#d-graph #day4 {left: 60px;}
#d-graph #day5 {left: 80px;}
#d-graph #day6 {left: 100px;}
#d-graph #day7 {left: 120px;}
#d-graph #day8 {left: 140px;}
#d-graph #day9 {left: 160px;}
#d-graph #day10 {left: 180px;}
#d-graph #day11 {left: 200px;}
#d-graph #day12 {left: 220px;}
#d-graph #day13 {left: 240px;}
#d-graph #day14 {left: 260px;}
#d-graph #day15 {left: 280px;}
#d-graph #day16 {left: 300px;}
#d-graph #day17 {left: 320px;}
#d-graph #day18 {left: 340px;}
#d-graph #day19 {left: 360px;}
#d-graph #day20 {left: 380px;}
#d-graph #day21 {left: 400px;}
#d-graph #day22 {left: 420px;}
#d-graph #day23 {left: 440px;}
#d-graph #day24 {left: 460px;}
#d-graph #day25 {left: 480px;}
#d-graph #day26 {left: 500px;}
#d-graph #day27 {left: 520px;}
#d-graph #day28 {left: 540px;}
#d-graph #day29 {left: 560px;}
#d-graph #day30 {left: 580px;}
#d-graph #day31 {left: 600px;  border-right: none;}

#m-graph li {position: absolute; bottom: 0; width: 50px; z-index: 2; margin: 0; padding: 0; text-align: center; list-style: none;}
#m-graph li.bar {width: 25px; border: 1px solid;color: #000;}
#m-graph #month1 {left: 0;}
#m-graph #month2 {left: 50px;}
#m-graph #month3 {left: 100px;}
#m-graph #month4 {left: 150px;}
#m-graph #month5 {left: 200px;}
#m-graph #month6 {left: 250px;}
#m-graph #month7 {left: 300px;}
#m-graph #month8 {left: 350px;}
#m-graph #month9 {left: 400px;}
#m-graph #month10 {left: 450px;}
#m-graph #month11 {left: 500px;}
#m-graph #month12 {left: 550px;}


/* inverse stacked graphs */
#stack-graph ul{
  margin: 0;
  padding: 0;
  list-style: none;
}
#stack-graph li {
  width: 50px;
  z-index: 2;
  margin: 0;
  padding: 0;
  text-align: center;
}
#stack-graph li.bar {
  margin-left:1px;
  width: 48px;
  color: #000;
}
#stack-graph .stats>p{
  border-bottom:1px solid #8399E2;
  font-size:1.4em;
}
#stack-graph{
  position: relative;
  height: 180px;
  top:20px;
  width: 620px;
  margin: 1.1em 0 3.5em;
  padding: 0;
  background: #FFF;
  border: 1px solid #8399E2;
  list-style: none;
  font: 9px Helvetica, Geneva, sans-serif;
}

#stack-graph li.stats {
  height: 178px;
  border-right: 1px dotted #C4C4C4;
  color: #AAA;
}
#stack-graph>li{
  float:left;
}
#stack-graph li.bar p {margin: 2px 0 0; padding: 0;}
#stack-graph li.views{left: 0px; background: #CBDEFF;}
#stack-graph li.clicks {left:25px; background-color:#8399E2;}

#stack-graph .legend li.views{ border: 1px solid;color: #000;position:absolute;left:539px; top: -34px; background-color: #CBDEFF; display:block; width:80px;  height:12px; padding-top:3px;}
#stack-graph .legend li.clicks{ border: 1px solid;color: #000;position:absolute;left:539px; top: -18px;  background-color: #8399E2;  display:block; width:80px;  height:12px; padding-top:3px;}



.clicks{
  stroke: #8399E2;
}
.views{
  stroke: #CBDEFF;
  opacity:.4;
  fill: #CBDEFF;
}

.textlabel{
  cursor:hand; cursor:pointer;
}
.stats{
  fill: #FFFFFF;
}
.stats:hover{
  cursor:hand; cursor:pointer;
  fill: #F0F0f0;
  background-color:#F0F0f0;
}