/* all css at the top , before the @media stuff, are assumed for mobile */

.desktop {
	visibility: visible;
	height: 100%;
	width: 100%;
	vertical-align: top;
}

.pTime {
	color:#989898;
	display: inline-block;
	padding-top: 10px;
	font-size: 9px;
	font-weight: normal;
	font-family: calibri;
}

html, body, #wrapper {
	height:100%;
	width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	margin: 0px 0px 0px 0px;
	background-color: black;
	color: white;
}

#wrapper td {
   vertical-align: middle;
   text-align: center;
   padding: 0px;
}

a:active, a:focus {
	outline: 0;
	border: none;
	-moz-outline-style: none;
}

img[usemap], map area{
    outline: none;
}

.title {
	font-family: calibri;
	font-size: 29px;
	color:#989898;
	padding: 4px;
	display: inline-block;
}

.instructions {	
	color:#989898;
	display: block;
	padding-top: 8px;
	padding-bottom: 0px;
	font-size: 12px;
	font-weight: normal;
	font-family: calibri;

}

.buttonOptions {	
	color:#989898;
	display: inline-block;
	padding-top: 8px;
	padding-bottom: 0px;
	font-size: 11px;
	font-weight: normal;
	font-family: calibri;
}

.mobileOnly {
	display: none;
}

/*smaller screens */
/*@media only screen and (min-width: 1px) and (max-width: 579px) {*/
@media only screen and (min-width: 1px) and (max-width: 1024px) {
	img {
		max-width: 100%;
		height: auto;
	}
	
	.instructions {
		display: none;
	}
	
	.mobileOnly {
		display: block;
	}
}