* {-webkit-text-size-adjust:none; box-sizing: border-box;}
body {margin: 0px; padding: 10px; font-family: Arial; color: #333; font-size: 1em; line-height: 1.6em; text-align: center; background: #fff;}
h1,h2,h3,h4 {margin: 0px; padding: 0; line-height: 1.3em;}
h1 {font-size: 2em;}
h2 {font-size: 1.2em; padding: 0 0 1em 0; text-transform: uppercase;}
a {}
a:hover {}
img {border: 0px;}
.clear {height: 0px; font-size: 0px; clear: both;}

hr {display: block; border: 0px; background: #eee; height: 1px; margin: 3em 0;}

#wrapper {max-width: 900px; margin: 0 auto; padding: 30px; text-align: left;}

#header {padding: 0 0 20px 0; margin-bottom: 20px; border-bottom: 1px solid #ddd; color: #000;}
#header .logo {float: left; margin-right: 20px;}
#header h1 {padding-top: 0px; text-transform: uppercase;}

#content {}
#footer {}

form {padding: 0px; margin: 0px;}
fieldset {padding: 10px 20px 20px 20px; margin: 0 0 20px 0; border: 1px solid #ddd; background: #f6f6f6;}
legend {padding: 0px 0.5em; margin-left: -0.5em; font-size: 16px; font-weight: bold; color: #000; text-transform: uppercase; background: transparent;}
label {display: block; clear: both; font-size: 0.7em; letter-spacing: 1px; line-height: 1.6em; padding-bottom: 1em; text-transform: uppercase;}
label strong {display: block; color: #999; padding-bottom: 0.5em;}
label input, label select, label textarea {font-size: 1.4em;}
input, textarea, select {-webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; border: 1px solid #ccc;}
label input.full, label select.full, label textarea.full {width: 100%;}
input:not([type=checkbox]):not([type=radio]), textarea, select {padding: 0.5em; line-height: 1.5em; height: 2.25em;}
input[type=image] {height: auto !important;}
div.col2:after, div.col3:after {content: ''; display: block; clear: both;}
div.col2 label, div.col3 label {float: left; padding-right: 20px; width: 50%; clear: none;}
div.col3 label {width: 33.33%;}
div.col2 label:last-child, div.col3 label:last-child {padding-right: 0px;}
desc {display: block; padding-top: 0.5em; text-transform: none; font-style: italic; color: #999; letter-spacing: 0.5px;}

#ui-datepicker-div {font-size: 12px;}

.note {height: auto; overflow: auto; padding: 10px; border: 1px solid #ccc; background: #faf9e7;}

.btns {height: 3em;}
a.btn {display: block; float: left; line-height: 3em; padding: 0; margin-right: 20px; font-size: inherit; background: #ccc; color: #fff; text-decoration: none; -webkit-border-radius: 4px; -moz-border-radius: 4px;}
a.btn strong {display: block; padding: 0 20px; -webkit-border-radius: 3px; -moz-border-radius: 3px;}
a.btn.submit {border-color: #216a00; background-color: #009900; color: #fff;}
a.btn.submit strong {border-color: #3aba01;}
a.btn:hover {background-color: #bbb;}
a.btn.submit:hover {background-color: #3aba01;}

.error {display: block; border: 1px solid red; padding: 10px; color: red; font-weight: bold; background-color: #fbe6e6;}

table {width: 100%; border: 0px; margin: 0px; padding: 0px; border-spacing: 0px;}
table tr th {background-color: #eee; font-weight: bold; padding: 4px;}
table tr td {padding: 4px; border-top: 1px solid #eee;}

.player-list {column-count: 4; column-gap: 20px; list-style: none; margin: 0; padding: 0 0 3em 0;}
.player-list li {display: block;}

@media screen and (max-width: 1024px) {
	#header {text-align: center;}
	#header .logo {float: none; margin: 0 auto;}
}

@media screen and (max-width: 768px) {
	body {padding: 0px;}
	#wrapper {border: 0px; padding: 20px;}
	#header h1 {font-size: 1.3em;}
	#header h2 {font-size: 0.8em;}

	.player-list {column-count: 3;}
	
	#paymentMethodOptions, #paymentMethodOptions tbody, #paymentMethodOptions tr, #paymentMethodOptions tr td {display: block; width: 100%;}
}

@media screen and (max-width: 640px) {
	div.col2 label, div.col3 label {display: block; width: 100%; padding-right: 0px; float: none;}
	.player-list {column-count: 2;}
	table {font-size: 0.75em;}
}

@media screen and (max-width: 380px) {
	.player-list {column-count: 1;}
}