.peak {
    position: absolute; 
    width: 20;
    pointer-events: none;
  }
  
  .peak:hover{
    transform: scale(1.3);
    transition: .1s ease;
  }
  
  .container {
    position: relative;
  }
  
  .red{
    stroke:black;
    stroke-width: 20;
    pointer-events: fill;
    fill: red;
  }

  .redhp{
    stroke:blue;
    stroke-width: 30;
    pointer-events: fill;
    fill: red;
  }

  .yellow{
    stroke:black;
    stroke-width: 20;
    pointer-events: fill;
    fill: yellow;
  }

  .yellowhp{
    stroke:blue;
    stroke-width: 30;
    pointer-events: fill;
    fill: yellow;
  }
  
  .green{
    stroke:black;
    stroke-width: 20;
    pointer-events: fill;
    fill: green;
  }

  .greenhp{
    stroke:blue;
    stroke-width: 30;
    pointer-events: fill;
    fill: green;
  }
  
  .image {
    display: block;
    user-select: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    -ms-user-select: none;
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    -ms-user-drag: none;
  }
  
  .overlay {
    position: absolute; 
    width: 40;
  }
  
  .overlay:hover {
    /*transform: scale(1.3);*/
    transform: scale(1.3);
  }
  
  #tooltip {
    background: cornsilk;
    /* background: white; */
    border: 1px solid #555;
    color: #555;
    border-radius: 0px;
    padding: 5px;
    position: absolute;
    /* width: 500px; */
    font-family: Arial, Helvetica, sans-serif;
    max-width: 380;
  }