html, body {
  height: 100%;
  background-image: url(graphics/virus-5.png);
  background-size: cover;
  font-family: 'Press Start 2P';
  font-size: 1.1vw;
}

#container {
  width: 80%;
  margin: auto;
}

#canvas {
  background-size: cover;
  background-color: #a3c294;
  width: 100%;
  height: auto;
}

#spiller {
  color: rgb(219,255,255);
  width: 25%;
  float: left;
  text-align: center;
  font-size: larger;
}

#score {
  color: rgb(219,255,255);
  width: 25%;
  float: left;
  text-align: center;
  font-size: larger;
}

#level {
  color: rgb(219,255,255);
  width: 25%;
  float: right;
  text-align: center;
  font-size: larger;
}

#lives {
  color: rgb(219,255,255);
  width: 25%;
  float: right;
  text-align: center;
  font-size: larger;
}

#overlay {
  width: 70%;
  height: auto;
  margin: 2% 5% 2%;
  padding: 4%;
  position: absolute;
  background-color: rgb(33,37,41);
  color: rgb(219,255,255);
  font-size: 1.3vw;
  display: none;
}

#overlay_small {
  width: 40%;
  height: auto;
  margin: 4% 20% 4%;
  padding: 4%;
  position: absolute;
  background-color: rgb(33,37,41);
  color: rgb(219,255,255);
  font-size: 1.3vw;
  display: none;
}

#overlay_small button {
  padding: 3px 15px;
  margin-right: 5px;
}

th, td {
  padding: 4px 10px;
}

#HS {
  display: flex;
}

#HS_tabell {
  float: left;
  width: 50%;
}

#HS_bilde {
  float: right;
  width: 50%;
  display: flex;
  justify-content: center;
}

#trophy {
  width: 70%;
  height: auto;
}

#omoss_head {
  text-align: center;
}

.rad {
  display: flex;
}

.omoss_tekst {
  flex: 30%;
  text-align: center;
  column-count: 1;
  column-width: 33%;
  font-size: 1vw;

}

#volum {
  margin-top: 0px;
  width: 60%;
}

#avatars {
  display: flex;
  justify-content: space-around;
}

.avatar {
  width: 22%;
  height: auto;
  border-radius: 30px;
  margin: 5px;
}

#navn {
  display: flex;
  justify-content: space-around;
}

.button {
  margin-top: 5px;
}

li {
  padding-top: 5px;
}