body {
  font-family: "Nunito", sans-serif;
  margin: 0;
  text-align: center;
}

.navbar {
  background-color: #323232;
  color: white;
  font-size: 3em;
  height: 2em;
}
.navbar > div {
  margin: 0;
  padding-top: 0.3em;
}
.computername {
  font-weight: 600;
  margin: 0;
  font-size: 3em;
}
.playername {
  font-weight: 600;
  margin: 0;
  font-size: 3em;
}
.playerscore,
.compscore {
  margin: 0;
  font-size: 120px;
  font-weight: 300;
}
.scoreboard > div {
  display: inline-block;
}
.scoreboard {
  height: 180px;
  margin: 30px auto;
  position: relative;
  color: #323232;
}
.dash {
  font-size: 120px;
}
.message {
  font-size: 50px;
  font-weight: 300;
  color: #323232;
}
.choice {
  margin: 50px;
  display: inline-block;

  transition: 500ms;
}
.choice > img {
  height: 250px;
  transition: 500ms;
}
.choice > p {
  margin: 0;
  font-size: 48px;
  color: #323232;
}
img:hover {
  height: 290px;
  cursor: pointer;
}
.choices {
  height: 500px;
}
.first {
  font-size: 50px;
  color: #9c9c9c;
  display: block;
}
@media (max-width: 950px) {
  .playername,
  .computername {
    font-size: 1.5em;
  }
  .playerscore,
  .compscore,
  .dash {
    font-size: 90px;
  }
  .scoreboard {
    height: 100px;
    margin: auto;
  }
  .message {
    font-size: 40px;
    height: 100px;
  }

  .choice > img {
    height: 160px;
  }
  .choice > p {
    font-size: 35px;
  }
}

@media (max-width: 500px) {
  .navbar {
    font-size: 1.5em;
    height: 2em;
  }
  .choice {
    margin: 0px;
  }

  .choice > img {
    height: 180px;
  }
  .choices {
    height: 385px;
  }
  .first {
    font-size: 20px;
    margin-top: 68px;
  }
}