html { background-color: #99cccc }
body { width: 851px; margin: 0px auto; background-color: #ffffff; color: #000000; padding: 0px; font-family: verdana,arial,sans-serif }
.unconfirmed { color: #333399 }
#map { width: 100%; min-height: 500px }
table tr:nth-child(odd) { background-color: #f0f0f0 }
header { text-align: center }
img.headerImg { width: 100% } /* 851px wide; 273px tall to match facebook */
h1 img { vertical-align: middle }
#footer { text-align: center; border-top: 1px #000 solid; font-size: smaller; padding-top: 3px; margin-top: 1ex }
div.hr { clear: both; height: 1px; font-size: 1pt }
#content { padding: 1ex; min-height: 400px; padding: 22px; padding-top: 1ex }

#mainmenu { padding: 0px; display: inline-block; margin: 0px auto }
#mainmenu li { float: left; list-style-type: none; display: block; width: 113px }
#mainmenu li a { display: block; background-color: #118811; color: #ffffff; text-align: center; border: 1px #ffffff solid; padding: 3px; text-decoration: none }
#mainmenu li a:hover { background-color: #ffffff; color: #118811; border-color: #118811 }
#mainmenu li.active a { background-color: #ffffff; color: #118811; border-color: #118811 }

.button { display: inline-block; background-color: #118811; color: #ffffff; text-align: center; border: 1px #ffffff solid; padding: 3px; text-decoration: none; min-width: 113px; }
.button:hover { background-color: #ffffff; color: #118811; border-color: #118811 }

.lineup { padding-left: 9rem }
.lineup label { margin-left: -9em; width: 8em; float: left; clear: left; display: block; text-align: right; }
form.lineup2 { width: 20rem; }
form.lineup3 { width: 40rem; }
.lineup2 label, .lineup3 label { display: block; text-align: right; clear: right; margin-bottom: 1ex; }
.lineup2 label:afterm .lineup3 label:after { clear: both; content: ""; display: block; }
.lineup2 input, .lineup2 textarea, .lineup2 select { float: right; width: 9rem; margin-left: 0.5em; }
.lineup3 input, .lineup3 textarea, .lineup3 select { float: right; width: 12rem; margin-left: 0.5em; margin-right: 10rem }
.clearfix { clear: both; }

.done { color: #999999 }

@media only screen and (max-width: 800px) {
  body { width: 100% }
  header { text-align: left; overflow-x: hidden }
  header nav { width: 100%; text-align: center }
  #mainmenu li { margin: 3px; }
  table { width: 100% }
  form.lineup3 { width: 98%; }
  .lineup3 input, .lineup3 textarea, .lineup3 select { margin-right: 0px }
}
@media only screen and (max-width: 400px) {
  header { font-size: smaller }
}