svg>*{
  font-family: 'Arial Narrow', sans-serif !important;
}

.plot-tooltip, 
#plot-tooltip, 
#bplot-tooltip, 
.plot-title,
.axis-title,
.legend-title,
.tick>text
{
  /* font-family:'Archivo Narrow', sans-serif !important; */
  fill: #444444;
  color: #444444;
}

.relative-plot-wrapper{
  position:relative;
  width:100%;
  height:100%;
}
#scatter-plot-legend{
  width:100%;
}
#plots{
  width:100%;
}
.plot{
  position:relative;
}
.plot-svg, .plot-canvas{
  position:absolute;
  top:0px;
  left:0px;
}
.plot-svg{
  z-index:1;
  pointer-events: none;
}




  .plot-tooltip, #plot-tooltip, #bplot-tooltip{
    position:absolute !important;
    white-space: nowrap;
    font-size:12px;
    line-height: 1.5em;
    background:white !important;
    z-index: 10000;
    pointer-events: none;
    padding:.5em;
    box-shadow: 0.5px 0.5px 10px 0px rgba(141, 137, 137, 0.5) !important; 
    min-width:200px;
  }
  .plot-title{
    font-size:14px !important;
    font-weight:700;
    line-height:14px;
  }

  .axis-title,
  .legend-title
  {
    font-size: 12.5px;
  }

  .bar-label{
    font-size:10.5px;
  }
  .parallelcoord-label{
    font-size:11.5px;
  }
/* TO DO: will remove styles from here and add styles directly to plot classes */
 .tick > line:not(.tick-pathType){
    stroke:#444444;
    stroke-width:.25px;
  }
  .tick > text{
    /* font-size:11px; */
    color:#444444 !important;
  }
  .legend.tick>text{
    font-size:12.5px !important;
    color:#444444 !important;
  }

  
  .dashed {
    stroke-width: 1.25px !important;
    stroke-dasharray: 4px 1.5px !important;
    stroke: #555555;
  }
  .tick:hover {
    cursor: pointer;
  }
  
  .tick.inactive {
    opacity: .2;
  }
  .tick.active, .tick>text.active {
    font-weight: bolder !important;
  }
  .tick.active>circle{
    stroke: black;
    stroke-width:2px;
  }




  

  .scatter-pt:hover{
    cursor: pointer;
    }
   .mouseover >circle{
      fill-opacity:1;
      stroke:black;
    }
  .mouseover.lineplot-series > path{
    stroke-width:6px;
    stroke-opacity:1;
    }
    
  .scatter-pt-label{
      pointer-events: none;
      font-size:0.8em;
      font-weight:800;
      filter: drop-shadow(.4px .4px .4px rgba(255, 255, 255, 1));
      text-shadow: 0px 0px 3px white,0px 0px 3px white;
    }
  .selected > circle{
      stroke:black;
      stroke-width:1.75px;
    }
    


/* old */
.no-data-message{
  font-size:1.5rem;
  font-weight:400;
  fill:#9e9e9e;
}

.plot-borderbox {
  stroke: black;
  stroke-width: 1px;
  fill: none;
}

/* .lattice-plot {
  pointer-events: all;
}

.lattice-plot:hover {
  cursor: pointer;
}

.lattice-plot.click>*>.plot-borderbox {
  stroke-width: 3px;
} */

.handle {
  fill: #fff;
  stroke: #000;
  stroke-opacity: .5;
  stroke-width: 1.25px;
  cursor: move;
}

/* 
.heatmap>*>.tick {
  font-family: 'Arial Narrow', sans-serif;
  fill: rgb(69, 69, 69);
} */

.heatmap>*>.tick.click,
.heatmap>*>.tick.mouseover, 
.heatmap>*>.tickhighlight {
  fill: black;
  font-weight: 900;
}


.heatmap-rect.mouseover {
  stroke-width: 1px;
  stroke: black;
}

.heatmap-rect.click{
  stroke-width: 2px;
  stroke: black;
}
.scatter-pt:not(.click){
  opacity: .75 !important;
}
.scatter-pt.inactive {
  fill: #c9c9c9;
  stroke: #c9c9c9;
  fill-opacity: 1;
  opacity: .25;
  pointer-events: none;
}

.scatter-pt.click,
.scatter-pt:not(.inactive):hover,
.scatter-pt:not(.inactive).mouseover {
  stroke: black;
  stroke-width: 3.5px;
  opacity: 1;
  fill-opacity: 1;
}


.violin>path {
  fill-opacity: .25;
}

.violin-pt {
  stroke: black;
  stroke-width: .15px;
  opacity: .75;
}

.parallelcoord-series>.label {
  font-family: 'Arial Narrow', sans-serif;
}


/** for Dose Response plot */
.parallelcoord-series>.path {
  opacity: .3;
  stroke-width: 1.5px;
}

.parallelcoord-series.context {
  pointer-events: none;
}

.parallelcoord-series:hover {
  cursor: pointer;
}

.parallelcoord-series.context>.path {
  stroke: #ebebeb;
  opacity: 1;
}

/* .parallelcoord-series.notclick>.path {
  opacity: .25;
} */

.parallelcoord-series.click>.path,
.parallelcoord-series:hover>.path {
  stroke: rgb(250, 43, 43);
  stroke-width: 3px;
  opacity: .95;
}

.parallelcoord-series.click.mouseover>.label {
  font-weight: bolder;
}

.parallelcoord-series.click.mouseover>.path {
  stroke-width: 4.5px;
  opacity: 1
}

.parallelcoord-pt {
  fill: none;
  stroke: rgb(250, 43, 43);
  stroke-width: 1px;
}

.parallelcoord-pt.click,
.parallelcoord-pt.mouseover {
  stroke: rgb(250, 43, 43);
  fill: yellow;
  /* stroke-width: 4px; */
}


.brush-track {
  fill-opacity: 0.5;
}