/*
Generic Styling, for Desktops/Laptops
*/
body {
	font-size: 1.2em;
}
h1 {
	color:#0099df;
}
table {
	width: 750px;
	border-collapse: collapse;
	margin-top: 30px;
}
/* Zebra striping */
tr:nth-of-type(odd) {
	background: #eee;
}
th {
	background: #333;
	color: white;
	font-weight: bold;
}
td, th {
	padding: 6px;
	border: 1px solid #ccc;
	text-align: left;
}

form  { display: table; width: 750px;}
p     { display: table-row; margin: 4px; }
label { display: table-cell; width: 30%;margin: 8px; font-size: 1.2em; vertical-align: middle;}
input { display: table-cell; margin: 8px; padding: 8px; font-size: 1.2em;}
select { display: table-cell; margin: 8px; padding: 8px; font-size: 1.2em;}


img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 30%;
  height: auto;
}

/*
Max width before this PARTICULAR table gets nasty
This query will take effect for any screen smaller than 760px
and also iPads specifically.
*/
@media screen and (max-width: 750px)  {
	table {
		width: 100%;
		border-collapse: collapse;
	}
	
	form { width: 100%;}
}