/*html {
  height: 100%;
}*/

/*body {
  height: 100%;
  width: 100%;
}*/

body {
  font-family:open_sanslight, Arial, Helvetica, sans-serif;
  color:#666;
  margin:0px auto;


}

/*a {
  color: #008cba;
  text-decoration: none;
}
a:hover,
a:focus {
  color: #00526e;
  text-decoration: underline;
}*/

#text {
  height: 20px;
}

#chart {
  max-width: 700px;
}

#lineselect {
  width: 100%;

}

#chosen-select {
  max-width: 700px;
  margin-bottom: 20px;
  margin-left: 10px;
  margin-right: 10px;

  /*margin-left: 30px;*/
}

svg {
  font: 10px sans-serif;
}

.background path {
  fill: none;
  /* stroke-width: 20px; */
  pointer-events: stroke;
}

/* .foreground path {
  fill: none;
  stroke-width: 1.5px;
} */


.axis line,
.axis path {
  fill: none;
  stroke: #D9D9D9;
  shape-rendering: crispEdges;
}

.axis text {
  text-shadow: 0 1px 0 #fff, 1px 0 0 #fff, 0 -1px 0 #fff, -1px 0 0 #fff;
  fill: #959393;
  font-size: 16px;
}

.average_text,
.ticks_label,
.uk_text {
  fill: #959393;
  font-size: 16px;
}

#source_link  {
  font-size: 14px;
  margin-left: 10px;
  margin-right: 10px;
}




.foreground path.active {
  /* stroke-width: 3px !important; */
}

.foreground path.inactive {
  /* stroke: #ccc !important;
  stroke-opacity: .5;
  stroke-width: 1px !important; */
}


@media all and (max-width: 500px) {
  .axis text {
    text-shadow: 0 1px 0 #fff, 1px 0 0 #fff, 0 -1px 0 #fff, -1px 0 0 #fff;
    fill: #959393;
    font-size: 14px;
  }

  .average_text,
  .ticks_label,
  .uk_text {
    fill: #959393;
    font-size: 14px;

  }

  #source_link  {
    font-size: 12px;
    margin-left: 0px;
    margin-right: 0px;
  }

  #chosen-select {
    margin-bottom: 5px;
    margin-left: 0px;
    margin-right: 0px;

    /*margin-left: 30px;*/
  }



}