.svg-container {
    display: inline-block;
    position: relative;
	width: 100%;
    padding-bottom: 66.7%; /* aspect ratio */
    
	vertical-align: top;
    overflow: hidden;
}

.svg-content-responsive {
    display: inline-block;
    position: absolute;
    top: 0px;
    left: 0;
}


#graphdiv{
	font-size:0.85em;
}

.ruley line {
  stroke: #ccc;
  stroke-width:1;
  stroke-dasharray:5,5;

}

.rulex line {
  stroke: #ccc;
  stroke-width:2;  
  stroke-dasharray:5,5;
}


.rule line.axis {
  stroke-width:1;
  stroke: #aaa;

}



.line, circle.area {
  fill: none;
  stroke-width: 2;
}

circle.area {
  fill: #fff;
}

.label, .legend{
	font-size:1.2em;
	font-weight:normal;
}

.ticks{
	font-size:1.3em;
	font-weight:normal;
}


/* Taken from Bostock's example http://bl.ocks.org/Caged/6476579 */
.d3-tip {
  font-size:0.7em;
  line-height:1.5em;
  font-weight: normal;
  padding: 10px;
  background: rgba(0, 0, 0, 0.7);
  color: #fff;
  border-radius: 2px;
  text-align:center;
  z-index: 10000;
}

.d3-tip p{
  margin:0px;
}
/* Creates a small triangle extender for the tooltip */
.d3-tip:after {
  box-sizing: border-box;
  display: inline;
  font-size: 10px;
  width: 100%;
  line-height: 1;
  color: rgba(0, 0, 0, 0.8);
  content: "\25BC";
  position: absolute;
  text-align: center;
}

/* Style northward tooltips differently */
.d3-tip.n:after {
  margin: -1px 0 0 0;
  top: 100%;
  left: 0;
}