* {
  touch-action: manipulation;
}

#pagesquasher {
  width: 100%;
}

#topbanner {
  height: 150px;
}

#topbanner #logo {
  width: 400px;
  height: 100px;
}

#topbanner p {
  font-size: 30px;
}

#topbanner h2 {
  font-size: 40px;
}

#bannerspacing {
  height: 150px;
}

#completiongrid {
  position: absolute;

  top: 50px;
}

#completiongrid table td {
  width: calc(100vw / 7);
  height: calc(100vw / 7);

  font-size: 50px;
}

#miscicons {
  left: 0;

  width: 100vw;
  height: 150px;

  align-items: center;

  display: block;
}

#info {
  position: fixed;
  width: 100px;
  height: 100px;

  left: 0;
  top: 25px;
}

#help {
  position: fixed;
  width: 100px;
  height: 100px;

  right: 0;
  top: 25px;
}

#pagesquasher {
  height: calc(100% - 150px);
  top: calc(50% + 70px);
}

#dayguesses {
  width: 100%;
}

#dayguesses > table {
  width: 100%;
}

#dayguesses > table td {
  height: 75px;

  font-size: 45px;
}

#guessbar > div {
  display: block;
  width: 100%;
}

#guessbar > div > input {
  width: 90%;
  height: 100px;

  display: flex;

  justify-self: center;

  font-size: 50px;
}

#guessbar > div > div {
  margin-top: 50px;
  width: 100%;

  flex-direction: row;
  justify-content: center;
}

#guessbar button {
  width: 400px;
  height: 100px;

  padding: 1px;

  margin: 10px;

  font-size: 40px;
}

#guessbar #seeresponsehistory {
  font-size: 35px;

  margin-top: 10px;
}

#objectcluemenu {
  width: 100%;
  height: 70%;

  padding-top: 120px;
  padding-bottom: 120px;

  top: 50%;
  left: 50%;
}

#objectcluemenu.visible {
  transform: translate(-50%, -50%);
}

#objectcluemenu table {
  width: 95%;
}

#objectcluemenu table td {
  height: 25px;

  font-size: 50px;
}

#objectcluemenu .arrow {
  width: 100px;
  height: 100px;
}

#objectcluemenu h2 {
  font-size: 50px;
  bottom: 1%;
}

#objectcluemenu #category {
  font-size: 50px;
}

#objectcluemenu #objectcluemenuclose {
  width: 100px;
  height: 100px;
}
