.button-panel {
  display: none;
}
.plot-container p {
  display: none;
}

.plot-container p {
  margin-bottom: 0em;
  font-size: 0.8em;
}

.plot-control-panel {
  width: 900px;
  margin: auto;
  padding-top: 1em;
  padding-left: 35px;
}

.button-panel {
  margin-top: 20px;
}
.button-panel input {
  font-family: 'Josefin Sans', sans-serif;
  font-size: 12px;
  border: 2px solid black;
  background-color: rgba(0, 0, 0, 0);
  color: black;
  padding: 4px 8px;
  cursor: pointer;
  border-color: rgb(200, 200, 200);
  color: rgb(255, 255, 255);
  margin-bottom: 5px;
}
.button-panel input:focus {
  outline: none;
}
.button-panel input:hover {
  background-color: rgba(200, 200, 200, 0.2);
}

.highlight-button {
  background-color: rgba(200, 200, 200, 0.5) !important;
}

.is-female-dominated {
  fill: #eaba5f !important;
}
.above70rif {
  fill-opacity: 0.8 !important;
}
.below70rif {
  fill-opacity: 0.05 !important;
}


.median-wage-line {
  stroke: #AA77FF;
  stroke-opacity: 0.9;
  stroke-width: 2;
  fill: none;
  stroke-linecap: round;
  pointer-events: none;
}
.poverty-wage-line {
  stroke: #FF5555;
  stroke-opacity: 0.9;
  stroke-width: 2;
  fill: none;
  stroke-linecap: round;
  pointer-events: none;
}

.median-wage-line-label {
  fill: #AA77FF;
  stroke-opacity: 1;
  font-size: 1.2em;
}
.poverty-wage-line-label {
  fill: #FF5555;
  stroke-opacity: 1;
  font-size: 1.2em;
}


.legend {
  font-size: 0.8em;
}

.reg-line {
  stroke: #FF0000;
  stroke-opacity: 0.7;
  stroke-width: 2;
  fill: none;
  stroke-linecap: round;
  pointer-events: none;
}

.reg-err {
  fill: #FF0000;
  fill-opacity: 0.12;
  pointer-events: none;
}

.scatter {
  text-align: center;
  font-family: 'Josefin Sans', sans-serif;
  color: white;
  fill: white;
  padding-right: 100px;
}

.search-highlighted {
  fill-opacity: 0.7 !important;

}
.search-not-highlighted {
  fill-opacity: 0.1 !important;
}
.label-search-highlighted {
  fill-opacity: 1 !important;
}
.label-search-not-highlighted {
  fill-opacity: 0.1 !important;
}

rect {
  fill: transparent;
  shape-rendering: crispEdges;
}

.axis {
  font-size: 1em;
}

.axis path,
.axis line {
  fill: none;
  stroke: rgba(255, 255, 255, 0.1);
  shape-rendering: crispEdges;
}

.axisLine {
  fill: none;
  shape-rendering: crispEdges;
  stroke: rgba(255, 255, 255, 0.5);
  stroke-width: 2px;
}

.dot {
  fill-opacity: 0.3;
}
.dot:hover {
  fill-opacity: 1;
  stroke: white;
}
.display {
  fill-opacity: 0.7;
}

.dot-text-display {
  text-anchor: middle;
  /* alignment-baseline: central; */
  font-size: 0.8em;
}
.dot-text-no-display {
  display: none;
}

.d3-tip {
  line-height: 1;
  font-weight: bold;
  padding: 12px;
  background: rgba(230, 230, 230, 1);
  color: #fff;
  border-radius: 2px;
  font-family: 'Josefin Sans', sans-serif;
  font-weight: normal;
  line-height: 1.3em;
  font-weight: 300;
  color: black;
  pointer-events: none;
  z-index: 9999;
}
.d3-tip h4 {
  margin-top: 0.2em;
  margin-bottom: 0.6em;
  font-size: 1em;
}
.d3-tip b {
  font-weight: 500;
}
.d3-tip table {
  font-size: 0.8em;
  color: black;
}
.d3-tip td {
  margin: 0.2em;
  padding-left: 0.5em;
}

/* 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(255, 255, 255, 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;
}