.body {
  text-align: justify;
  font-family: sans-serif;
}

.background {
  height: 100%;
  width: 100%;
  margin: 0 auto;
  background-image: url("../img/antique-map.jpg");
  background-size: cover;
}


.container {
  margin: 0 auto;
  background-size: contain;
  background-position: right;
  width: 600px;
  height: 400px;

}

h1 {
 margin: 0 auto;
 text-align: center;
 font-family: monospace, sans-serif;
 color: #8c5d00;
 text-shadow: 1px 2px black;
 font-size: 70px;
 font-weight: bold;
 text-decoration: underline;
 padding-top: 30px;
 text-decoration-color: #8c5d00;
}

h2 {
  padding-left: 40px;
  font-weight: 900;
  color: #5e3e00;
  text-shadow: 1px 0 black;
}

h3 {
  padding-left: 40px;
  color: #5e3e00;
  text-shadow: 1px 0 black;
}

h4 {
  padding-left: 40px;
}

Button {
  -moz-box-shadow: 3px 4px 0px 0px #d6d6d6;
	-webkit-box-shadow: 3px 4px 0px 0px #d6d6d6;
	box-shadow: 3px 4px 0px 0px #d6d6d6;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #94612e), color-stop(1, #a17a52));
	background:-moz-linear-gradient(top, #94612e 5%, #a17a52 100%);
	background:-webkit-linear-gradient(top, #94612e 5%, #a17a52 100%);
	background:-o-linear-gradient(top, #94612e 5%, #a17a52 100%);
	background:-ms-linear-gradient(top, #94612e 5%, #a17a52 100%);
	background:linear-gradient(to bottom, #94612e 5%, #a17a52 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#94612e', endColorstr='#a17a52',GradientType=0);
	background-color:#94612e;
	-moz-border-radius:15px;
	-webkit-border-radius:15px;
	border-radius:15px;
	border:4px solid #ad8a6b;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:17px;
	padding:7px 25px;
	text-decoration:none;
	text-shadow:0px 1px 0px #a68988;
}

Button:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #a17a52), color-stop(1, #94612e));
	background:-moz-linear-gradient(top, #a17a52 5%, #94612e 100%);
	background:-webkit-linear-gradient(top, #a17a52 5%, #94612e 100%);
	background:-o-linear-gradient(top, #a17a52 5%, #94612e 100%);
	background:-ms-linear-gradient(top, #a17a52 5%, #94612e 100%);
	background:linear-gradient(to bottom, #a17a52 5%, #94612e 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#a17a52', endColorstr='#94612e',GradientType=0);
	background-color:#a17a52;
}

Button:active {
	position:relative;
	top:1px;
}


.start {
  margin-left: 50px;
  padding: 10px;
}

.skip {
  margin-left: 65%;
  margin-bottom: 5px;
  padding: 10px;
}

.scoreCounter {
  font-size: 32px;
  padding-left: 50px;
  font-family: monospace, sans-serif;
  color: #5e3e00;
  text-shadow: 1px 0 black;
}

.grid {
  border: 6px solid white;
  border-style: ridge;
  width: 596px;
  height: 392px;
  display: grid;
  grid-template-columns: repeat(5,1fr);
  grid-auto-rows: minmax(78px,auto);
}

.box {
  border: 1px solid white;
  background-color: white;
  width: 118px;
  height: 80px;
}

.letters {
  text-align: center;
  margin: 0 auto;
}

.input {
  padding: 8px;
}

.submit {
  display: inline-block;
  padding: 10px;
  margin: 40px auto;
}

.timer {
  font-family: monospace, sans-serif;
  font-size: 46px;
}