@font-face {
  font-family: Halyard; /* set name */
  font-weight: bold;
  src: url(https://statewatch.github.io/embeds/fonts/halyard-text-bold.woff2); /* url of the font */
}
@font-face {
  font-family: Halyard; /* set name */
  font-weight: 500;
  src: url(https://statewatch.github.io/embeds/fonts/halyard-text-medium.woff2); /* url of the font */
}
/* @font-face {
  font-family: Halyard; 
  font-weight: bold;
  font-style: italic;
  src: url(https://statewatch.github.io/embeds/fonts/halyard-display-medium-italic.woff2); 
} */
@font-face {
  font-family: Halyard; /* set name */
  src: url(https://statewatch.github.io/embeds/fonts/halyard-text.woff2); /* url of the font */
}

body {
  /* margin: auto;
	width: 650px; */
  font-family: "Halyard", sans-serif;
  margin: 0px; /*important so that margin calculations on iframes work*/
  font-size: 15px; /*standart size on statewatch website*/
}

.plot {
  fill: #fff;
}
.line {
  fill: none;
  stroke-linejoin: round;
  stroke-linecap: round;
}
.axis path {
  fill: none;
}

.mono-ticks {
  /* font-family: monospace; */
}

.tooltip {
  /* font-family: sans-serif; */
  /* font-family: monospace; */
  /* max-width: 250px; */
  font-size: 0.9rem;
  position: absolute;
  display: none;
  background-color: white;
  opacity: 0.9;
  border: none;
  text-align: left;
  border-radius: 2px;
  padding: 3px 5px;
  pointer-events: none;
}

.tooltip > div {
  padding: 10px;
}

.tooltip-title {
  background-color: #eee;
  padding-bottom: 7px !important;
  color: #444;
}

.tooltip-content {
  padding-top: 7px !important;
}

.tick > text,
text.sankey_label {
  font-size: 0.85rem;
}

svg > text,
.grey_labels > g > text {
  font-size: 0.8rem;
  fill: #666;
}

.tick > line {
  display: none;
}

.y-axis > path,
.x-axis > path {
  display: none;
}
/* .line{
  opacity: 0.2
}

.line:hover {
  opacity: 1;
} */

.caption > p {
  color: #666;
  font-size: 0.85rem;
}

a {
  color: #7e7292;
}

a:hover {
  color: #715678;
}

circle.base,
circle.contract {
  stroke: black;
  stroke-width: 1px;
}

circle.base:hover,
circle.contract:hover {
  stroke-width: 2px;
}

.group,
.country {
  stroke: grey;
  stroke-width: 1px;
}

.group:hover,
.country:hover {
  stroke: black;
}
