.grid line {
  stroke: #ccc;
  stroke-opacity: 0.7;
}

.grid .tick {
  stroke: lightgrey;
  stroke-opacity: 0.7;
  shape-rendering: crispEdges;
}

.grid path {
  stroke-width: 0;
}
.averageLine {
  stroke-width: 1.5;
  /* stroke-dasharray:4 4; */
}

.categoryTitle{
  font-family: 'Open Sans', sans-serif;
  fill: #666;
  font-size:14px;
  font-weight: 600;
}


.annotationText{
  font-family: 'Open Sans', sans-serif;
  fill: #666;
  font-size:14px;
  /* font-weight: 600; */
}



body {
	max-width: 700px;
	margin:0px auto;
	font-family: 'Open Sans', sans-serif;
}

.dropdown {
  height: 44px;
  border-style: solid;
  color: #206095;
  background-color: #FFF;
  font-size: 1.1em;
  border: none;
  box-shadow: none;
  border-radius: 0;
  background: transparent;
  cursor: pointer;
  outline: none;
  padding-left: 6px;
  margin-bottom: 20px;
  border: 2px solid #206095;
  -moz-appearance: none;
  -webkit-appearance: none;
}

.dropdown:focus-visible{
  box-shadow: 0 0 0px 3pt orange;
}

::before,
::after {
  box-sizing: border-box;
}

#selectnav::before {

  height: 43px;
  width: 46px;
  position: absolute;
  top: 1px;
  right: 1px;
  bottom: 1px;
  background: #206095;
  content: '';
  pointer-events: none;

}

#selectnav::after {
  content: '';
  position: absolute;
  top: 0;
  width: 0;
  height: 0;
  right: 17px;
  bottom: 0;
  margin: 18px 0 0 0;
  border-style: solid;
  border-width: 10px 9px 0 9px;
  border-color: #ffffff transparent transparent transparent;
  pointer-events: none;
}

#info {
	height:25px;
	width:100%;
	font-size:16px;
  padding-top: 10px;
}

#label {
	font-weight:bold;
}

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

.domain {
	display:none;
}

.axis text, #xaxislabel {
  font-family: 'Open Sans', sans-serif;
  font-size:11px;
}

.cells path {
  fill: none;
  pointer-events: all;
}


.cellsselected {
  opacity:0.75;
  stroke-width: 2px;
  stroke: #000;
  fill:orange;
}

#source{
	font-size: 14px;
	font-weight: 700;
	color: #414042;
}

.key /* required */
{
	display: inline-block;
	margin: 0 0 1em 0;
	padding: 0;
	line-height: 15px;
}

.label {
	white-space: nowrap;
	font-size: 12px;
	color: #333;
	font-weight: normal;
	font-family: "Open Sans", Helvetica, sans-serif;
}

.key li/* required */
{
	display: inline-block;
	margin: 0 18px 0 0;
	padding: 0;
	line-height: 15px;
}

.key b /* required */
{
	display: inline-block;
	width: 35px;
	height: 15px;
	margin-right: 6px;
	float: left;
	background-color: transparent;
	margin-top:8px;
	border-radius:15px;
}

.legendBlocks{ /* new for Cluster chart */
	width: 15px !important;
	margin-top:0px !important;
}

.key label/* required */
{
	white-space: nowrap;
	font-size: 12px;
	color: #333;
	font-weight: normal;
}

.visuallyhidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}
