body {
  font: 10px sans-serif;
   font-family: "ff-meta-serif-web-pro";
}

/* Table */
table {
  border-collapse: collapse;
}
thead {
  font-weight: bold;
}
table td, table th, caption {
  padding: 3px;
  border: 1px solid gray;;
}
table th {
  cursor: n-resize;
}
table th.sorted {
  cursor: s-resize;
}
table td:first-child, table td:nth-child(2) {
  text-align: center;
}
table tr.odd {
  background-color: #EEE;
}
td {
  text-align: right;
}

/* Treemap */

rect {
  fill: none;
  stroke: #fff;
}

text {
  font: 10px sans-serif;
}

.cell > .focus {
  stroke: black;
  stroke-width: 2.5px;
  fill: yellow;
}

/* Scatterplot */

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

.dot {
  stroke: #000;
}

.year.label {
  font: 500 196px "Helvetica Neue";
  fill: #ddd;
}

/* nodelink */

circle.node {
  stroke: black;
  stroke-width: 1.5px;
  fill: white;
}

.connect__line {
  stroke: #999;
  stroke-opacity: .6;
}

.connect__line.highlighted {
  stroke-width: 2.5px;
  stroke-opacity: .6;
}

/* linechart */


body {
  font: 10px sans-serif;
}

.grid .tick {
    stroke: lightgrey;
    opacity: 0.7;
}
.grid path {
      stroke-width: 0;
}

/* conflicts with scatterplot
.axis path,
.axis line {
  fill: none;
  stroke: #000;
  shape-rendering: crispEdges;
}

.x.axis path {
  display: none;
}
*/
.line {
  fill: none;
  stroke: steelblue;
  stroke-width: 1.5px;
}

body {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

text.country {
  font-weight: 200;
}

text.selected {
  font-weight: 800;
}

/* Bar chart */

.bar {
  fill: steelblue;
}

.bar:hover {
  fill: brown;
}

/* Sparkline */

.connect__path {
  fill: none;
  stroke: #000;
  stroke-width: 1.5px;
  opacity: 1;
}

.mark__line_horizontal {
  fill: none;
  stroke: #000;
  stroke-width: 1.5px;
  stroke-dasharray: 5,5;
  opacity: 1;
}
/* Dot plot */

.items__mark__diamond {
  fill: red;
}

.items__mark__diamond.selected {
  stroke: black;
}

circle.dot__circle {
  fill: gray;
  opacity: ".5";
}

circle.dot__circle.selected {
  stroke: black;
  stroke-width: "3px";
  opacity: 1

}

circle.dot__circle:not(.selected) {
  stroke: black;
  stroke-width: ".9px";
  opacity: 1;
}

.dot__circle.highlighted {
  opacity: 1;
  fill: orange;
}

.dot__circle:not(.highlighted) {
  opacity: .1;
}

rect.dot__circle {
  fill: gray;
  opacity: ".5";
}

.dot__label:not(.highlighted) {
  text-decoration: none;
}

.dot__label.highlighted {
  text-decoration: underline;
}

.points {
  opacity: 1;
}

/* Pie chart */

path {
  stroke: black;
}

/* Box plot */

.box {
  font: 10px sans-serif;
}

.box line,
.box rect,
.box circle {
  fill: #fff;
  stroke: #000;
  stroke-width: 1.5px;
}

.box .center {
  stroke-dasharray: 3,3;
}

.box .outlier {
  fill: none;
  stroke: #ccc;
}

.items__mark__text:not(.highlighted) {
  text-decoration: none;
}

.items__mark__text.highlighted {
  text-decoration: underline;
}

.items__mark__text:not(.selected) {
  font-weight: 200;
}

.items__mark__text.selected {
  font-weight: 700;
}

.items__mark__circle {
  stroke: black;
  stroke-width: "0.5px";
  stroke-opacity: .5;
}

.items__mark__circle.highlighted__adjacent {
  stroke: black;
  stroke-width: 1.5px;
  stroke-opacity: 1;
}

g:hover .items__mark__circle:not(.highlighted__adjacent) {
  -webkit-transition:0.3s;
  transition:0.3s;
  opacity: 0.5;
}

.items__mark__circle:.highlighted__adjacent {
  opacity: 1;
  stroke-opacity: 1;
}

g:hover .connect__path:not(.highlighted) {
  -webkit-transition:0.3s;
  transition:0.3s;
  opacity: 0.5;
}

g:hover .items__mark__circle.highlighted {
  stroke: black;
  stroke-width: 2.5px;
  opacity: 1;
  stroke-opacity: 1;
}

.items__mark__circle.selected {
  stroke: black;
  stroke-width: 1.5px;
  stroke-opacity: 1;
}

.connect__path:not(.highlighted) {
  stroke-width: 1px;
}

.connect__path.highlighted {
  stroke-opacity: 1;
  stroke-width: 5px;
}

.connect__path.selected {
  stroke-opacity: 1;
  stroke-width: 3px;
}

.items__mark__rect.highlighted {
  stroke-opacity: 1;
  stroke: black;
  stroke-width: 2.5px;
}

.items__mark__rect.selected {
  stroke-width: 1.5px;
  stroke: black;
}

.items__mark__diamond.highlighted {
  stroke-opacity: 1;
  stroke: black;
  stroke-width: 2.5px;
}

.items__mark__star {
  fill: yellow;
  stroke-width: .5px;
}

.items__mark__star.selected {
  stroke-width: 1px;
}

.items__mark__star.highlighted {
  fill: yellow;
  stroke-width: 1.5px;
}

.items__mark__tick {
  stroke: black;
  stroke-width: .2px;
}

.items__mark__tick.selected {
  stroke-width: 1.5px;
}

.items__mark__tick.highlighted {
  stroke-width: 2.5px;
}

.items__mark__shape {
  stroke: black;
  stroke-width: .2px;
}

.items__mark__shape.selected {
  stroke-width: 1.5px;
}

.items__mark__shape.highlighted {
  stroke-width: 2.5px;
}
