#mapid {
  height: 60%;
  width: 100%;
}

#inside {
  position: absolute;
  top: 20%;
  background-image: url(/img/floor_wood.jpg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-color: brown;
  color: ghostwhite;
  width: 320px;
  left: calc(50% - 160px);
  min-height: 400px;
  max-height: 60%;
}

#house_stairs_up {
  position: absolute;
  top: 0;
  left: 0;
  height: 40%;
}

.leaflet-control-zoom, #message {
  display: none;
}

#healthbar,
#expbar {
  position: absolute;
  width: 100%;
  height: 5%;
  margin-top: 3%;
  color: black;
  background: #303030;
}

#healthbar {
  bottom: 5%;
}

#expbar {
  bottom: 0;
}

#healthpercentage,
#exppercentage {
  background: forestgreen;
  height: 100%;
}

#exppercentage {
  background: cornflowerblue;
}

#healthpercentage img,
#exppercentage img {
  margin: 0 .25%;
  height: 100%;
}

#healthpercentagevalue,
#exppercentagevalue {
  position: relative;
  top: calc(-28% - 18px);
  font-size: 18px;
  text-align: center;
  display: block;
  color: #fafafa;
}

.leaflet-bottom {
  display: none;
}

.monsterhealth,
.flaghealth {
  background: #303030;
  width: 36px;
  height: 5px;
}

.monsterhealth div,
.flaghealth div {
  background: green;
  height: 100%;
  margin: -10px 1px;
}