* { /* reset */
	padding:0;
	margin:0;
	box-sizing:border-box;
	-webkit-user-select: none; /* Safari */
	user-select: none; /* Standard syntax */
	user-drag: none; /* Standard syntax */
	-webkit-user-drag: none; /* Safari and Chrome */
}
body {
  background-color: ivory;
	font-family: 'Roboto Mono','Monaco','Courier New','Lucida Console',monospace;
}
#head {
  width:95vmin;
  height:8vmin;
  display:flex;
  justify-content: space-around;
  align-items: center;
  margin:0 auto;
}
#head img {
  height:60%;
  cursor: pointer;
}
#main {
	width:95vmin;
	display:flex;
	flex-direction: column;
	align-items: center;
	margin:0 auto;
}
#keyboard {
	width:96vmin; height:27vmin;
	font-size:5.5vmin;
  background-color:burlywood;
  border:outset burlywood .8vmin;
  padding:.5vmin;
	padding-bottom: 1vmin;
}
.key {
  display:flex;
  justify-content: center;
  align-items: center;
  width:16%;
  margin:.8%;
  background-color:ivory;
  border:outset black 4px;
	cursor:pointer;
}
.row {
	width:100%; height:34.2%;
	display:flex; justify-content: space-evenly;
}
.row1 {
	display:flex; justify-content:center;
	align-items: center;
}
.n {
	font-size:3vmin; margin:1vmin 1vmin 0 1vmin;
	letter-spacing: .2vmin;
}
#g10, #n10 {letter-spacing:normal;}
.green {color:#0b0;}
.x {visibility: hidden;}
#delete {
  font-size: 150%;
  padding-bottom: 3.4vmin;
}
#clear {
  width:30%;
}
#try {
  width:22%;
}
#try, #clear {
  font-size: 65%;
}
#delete, #clear {
  background-color:#faa;
}
#try {
  background-color: #dfd;
}
.box {
	height:7vmin;
	font-size:4.5vmin;
	border:solid black .5vmin;
	letter-spacing: .4vmin;
  display:flex;
  justify-content:center;
  align-items:center;
  margin: 1vmin 0 0 0;
	background-color: #eff;
}
#cursor {
  animation: blink 1s step-start infinite;
  margin-left: -.4vmin;
  height:100%;
}
@keyframes blink {
  50% {
    opacity: 0;
  }
}
#w5 {width:20vmin;}
#w6 {width:23vmin;}
#w7 {width:26vmin;}
#w8 {width:29vmin;}
#w9 {width:32vmin;}
#w10 {width:35vmin;}
#message {
	width:100%;
	font-size:2.7vmin;
	letter-spacing: normal;
	border-color: brown;
	text-align: center;
	visibility:hidden;
}
#info1, #info2 {
	font-family: sans-serif;
	font-size: 50%;
	background-color:lemonchiffon;
	padding:2.5vmin 3vmin;
	height:102%;
	cursor:pointer;
}
#info2 {
	padding-top: 1vmin;
}
#info1 p, #info2 p {
	margin-bottom:.8vmin;
}

@media (orientation:portrait) {
}