* {
  margin: 0;
  padding: 0%;
}

#background {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: -2;
}
.timeBallon {
  position: absolute;
  top: -50px;
  z-index: 1;
  left: 50%;
  bottom: 0;
  transform: translate(-60%, 0%);
}
.scoreBallon {
  position: relative;
  top: 0%;
  padding: 0;
  list-style: none;
  z-index: -1;
  width: 20%; /* you can use % */
  height: 54%;
}
#startName {
  position: absolute;
  top: 50%;
  left: 40%;
  transform: translate(-50%, -50%);
  display: none;
  z-index: 1;
}
#choosing {
  position: absolute;
  top: 10%;
  left: 5%;
  transform: translate(-5%, -5%);
  z-index: 1;
}
#win,
#retry {
  position: absolute;
  width: 100%;
  text-align: center;
  color: #e16363;
  font-weight: bold;
  font-size: 3rem;
  font-family: "Arial black";
  top: 20%;
  left: 40%;
  transform: translate(-50%, -50%);
  display: none;
  z-index: 1;
  cursor: pointer;
}

#retrybutton {
  position: absolute;
  top: 70%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: none;
  z-index: 1;
}

#startSound {
  position: absolute;
  top: 50%;
  left: 20%;
  transform: translate(-50%, -50%);
  display: none;
  z-index: 1;
}
#answersContainer {
  margin: 0px auto;
  width: 70%;
}

#errors {
  position: absolute;
  top: 0%;
  left: 30%;
  padding: 0;
  list-style: none;
}

#answers {
  position: relative;
}
#container {
  position: relative;
  margin: 0px auto;
  width: 450px;
}
#pyramid {
  position: absolute;
  top: 490px;
  left: 30%;
  z-index: 2;
  transform: translate(-50%, -50%);
}
#chosing {
  padding: 0;
  list-style: none;
  position: relative;
  top: 25%;
  left: 45%;
  transform: translate(-50%, -50%);
}
#keyboard {
  padding: 0;
  list-style: none;
}
#keyboard li,
.scoreBallon li,
#errors li,
#chosing li {
  margin: 1px;
  width: 37px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  background: #fff;
  border: 1px solid #f9f9f9;
  border-radius: 5px;
}
#chosing li:hover,
#keyboard li:hover {
  position: relative;
  top: 1px;
  left: 1px;
  border-color: #e5e5e5;
  cursor: pointer;
}
.upperButs {
  position: absolute;
  width: 5%;
  height: 7%;
}
#homebtn {
  top: 1%;
  left: 4%;
}
#helpbtn {
  top: 1%;
  left: 10%;
}
#soundOn {
  top: 1%;
  left: 72%;
}
#exit {
  top: 1%;
  left: 78%;
}