main.css

.ui {
  /*width: 100%;
  height: 100%;*/
  position: absolute;
  top: 0;
  left: 0;
  font-family: 'IM Fell French Canon', serif;
}

.health-ui {
  background-image: url('./resources/images/health-bar.png');
  background-size: 200px 120px;
  width: 200px;
  height: 120px;
  z-index: 1;
}

/*.health-bar {
  background: greenyellow;
  width: 200px;
  max-width: 200px;
  height: 40px;
  position: relative;
  top: 215px;
  left: 260px;
  border-style: solid;
  border-width: 2px;
  border-color: black;
  border-radius: 5px;
}

.marker-ui {
  /*width: 100%;
  height: 100%;
  position: absolute;
  top: 200;
  left: 200;
  font-family: 'IM Fell French Canon', serif;
}

.green-marker {
  background-image: url('./resources/images/greenmarker.png');
  background-size: 200px 120px;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 200px;
  height: 120px;
  z-index: 1;
}*/