body {background: url(numbers.jpg);margin:0;padding:0;}
.ie8 body {background: none;}

.mask {
	position: absolute;
	margin-top:-10px;
	width: 100%;
	height: 100%;
	background-color: #fff;
	opacity: 0;
	z-index:1;
}

#testBox {
	display: block;
	position: relative;
	margin: 10px auto 20px;
	padding: 0 10px;
	width: 600px;
	height: 300px;
	overflow: hidden;
	background-color: #fff;
	border: 1px solid red;
	border-radius: 10px;
	box-shadow: 0 0 11px #666;
	z-index: 2;
}

.email img {
	position: absolute;
	top: 10px;
	right: 19px;
}

.email p {
	position: absolute;
	top: 24px;
	right: 2px;
	font-family: sans-serif;
	font-size: .9em;
	text-decoration: underline;
}

h3 {margin-top: 5px; text-align: center;}

#test {
	display: block;
	position: relative;
	margin: auto;
	padding: 15px;
	width: 150px;
	overflow: visible;
	border: 1px solid;
	box-shadow: 1px 1px 3px #666;
}

#equation {float:left;margin: 0 5px 0 18px;font-size: 1.25em;letter-spacing: .1em;}

#guess {float: left; height: 1.25em; width: 45px; font-size: 1em;}

input[type=button] {
	display: block;
	width: 100px;
	margin: 25px auto 0;
}

input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}

/* displayed when answer is submitted */
#symbol {
    position: absolute;
    right: -110px;
    top: -30px;
    font-size: 5em;
    opacity: 0;
    color: lightgreen;
}

.feedback {
	margin: 20px 40px;
	font-size: 2.2em;
	color: lightgreen;
	text-align: center;
}

table {
	position: relative;
	margin: auto;
	color: #000;
	background-color: #fff;
	box-shadow: 3px 0px 11px #666;
	z-index:2;
}

table caption h2 {
font-weight: normal; color: #000; box-shadow: 3px 2px 8px #666;
background-color: #fff;
}

td {
  border: 1px solid #666;
  text-align: center;
  padding: 3px 9px;
  font-size: 20px;
}
tr:first-child, td:nth-child(1) {background-color: rgb(245, 227, 170);font-weight: bold;color: #000;}
.lighten {color: #aaa; background-color: #eee;}
.correctnum {padding:0;font-size: 30px;font-weight: bold; color:rgb(2,196,2);}

/***************************************/
			/* Media queries */
/***************************************/

@media screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation: landscape) {
	#testBox, table {display:block;float:left;margin:50px 20px;}
	#testBox {width: 550px;}
	table {top: 12px;}
	td {font-size: 12px;}
}
