/* Tooltip container */
.tooltip {
  position: inherit;
}

/* Tooltip text */
.tooltip .tooltiptext {
  visibility: hidden;
  width: fit-content;
  background-color: #888888;
  color: #fff;
  text-align: center;
  padding: 0.5vh 0.5vw;
  border-radius: 1vw;
  line-height: initial;
  font-size: 1rem;

  /* Position the tooltip text */
  position: absolute;
  z-index: 5;
  left: 0;

  /* Fade in tooltip */
  opacity: 0;
  transition: opacity 0.3s;
}


/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
}

/* Individual Tooltips */
#nav-tooltiptext{
  left: -150%;
}

#file-export-tooltiptext{
  left: -200%;
}

#img-export-tooltiptext{
  left: -200%;
}

#upload-tooltiptext{
  left: -150%;
}

#import-tooltiptext{
  top: 100%;
}

.info-tooltiptext{
  transform: translate(0%, -100%);
  max-width: 15vw;
}

#basic-tooltiptext{
  left: 40% !important;
}

#calculator-tooltiptext{
  left: 55% !important;
}

#hardcore-tooltiptext{
  left: 70% !important;
}

#deathless-tooltiptext{
  left: 85% !important;
}