/* This document is for styling the stars */
#galaxy-container {
  position: absolute;
  top: 0;
  left: 0;
  background: none;
  height: 100%;
  width: 100%;
  z-index: 1;
}
div.star {
  display: block;
  background: rgba(255, 255, 255, 0);
  position: absolute;
  cursor: pointer;
  border-radius: 100%;
  width: 36px;
  height: 36px;
}

div.star::after {
  content: '';
  cursor: pointer;
  background: white;
  position: absolute;
  display: block;
  width: 4px;
  height: 4px;
  border-radius: 100%;
  top: calc(50% - 2px);
  left: calc(50% - 2px);
}

div.star-label {
  position: absolute;
  color: white;
  display: none;
}

div.starContainer:hover > .star,
div.starContainer:focus > .star {
  border: 2px solid rgb(255, 241, 41);
}

div.starContainer:hover > div.star-label,
div.starContainer:focus > div.star-label {
  display: block;
}
