.wordsearch {
  margin: auto;
  display: table;
}

.letters {
  display: flex;
  justify-content: center;
  position: relative;
}

.letters .prompt {
  position: absolute;
  display: none;
  margin: 20%;
  font-weight: bold;
  background-color: mintcream;
  border: 2px solid lightseagreen;
  border-radius: 8px;
  color: grey;
}

.letters .prompt div {
  margin: auto;
  padding: 10px;
}

.wordsearch table {
  margin: 0;
  padding: 0;
  border-collapse: separate;
  border-spacing: 5px;
}

.wordsearch tr {
  padding: 0;
  margin: 0;
}

.wordsearch td {
  vertical-align: middle;
  height: 2em;
  width: 2em;
  text-align: center;
  font-weight: bold;
  background-color: mintcream;
  border-radius: 8px;
  box-shadow: 1px 1px 1px 1px lightseagreen;
  color: grey;
  padding: 0;
  margin: 0;

  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Opera and Firefox */
}

.wordsearch td.selected {
  color: black;
}

.wordsearch td.solved {
  background-color: rgb(102, 250, 188);
}

.hints {
  width: 15%;
  padding: 0.3em;
}

.hints div {
  margin: 0.15em;
  background-color: white;
  padding: 0.2em;
  border-radius: 10px;
  -webkit-box-shadow: 2px 2px 10px 1px rgba(0,0,0,0.77);
  -moz-box-shadow: 2px 2px 10px 1px rgba(0,0,0,0.77);
  box-shadow: 2px 2px 10px 1px rgba(0,0,0,0.77);
  text-align: center;
}

.hints img {
  width: 30%;
  margin: 0.05em;
}

.hints .solved {
  font-weight: bold;
  border: 3px solid rgb(102, 250, 188);
}

.resetButton {
  text-align: center;
}
/*
.resetButton button {
  height: 2em;
  border: 0;
  border-radius: 8px;
  box-shadow: 1px 1px 1px 1px lightseagreen;
  background-color: inherit;
  font-weight: bold;
  color: grey;
}

.resetButton button:hover {
  color: black;
}
*/
@media (max-width: 450px) {
	
	.wordsearch td {
		height: 1.5em;
		width: 1.5em;
	}
	
	.wordsearch table {
		border-spacing: 3px;
	}
}