#club-form {
	text-align: center;
}

#club-form > div {
	display: inline-block;
	text-align: left;
	width: auto;
}

#club-form td {
	padding: 10px;
}

#club-form td > input {
	width: 100%;
}

#club-form td input[type='submit'] {
	width: 100%;
}

.club-panel {
	padding: 20px;
	margin: 20px;
	background: var(--color-background-secondary);
}

.two-column {
	display: inline-block;
	width: 45%;
	vertical-align: top;
}

#account-links {
	background: var(--color-background-secondary);
	margin-bottom: 20px;
	margin-top: -5px;
}

#account-links > div {
	display: inline-block;
	width: 24%;
	text-align: center;
}

#account-links > div > a {
	text-decoration: none;
	padding: 10px;
	display: inline-block;
}

#cards > div {
	display: inline-block;
	padding: 10px;
	margin: 10px;
	text-align: left;
	background: var(--color-background);
	border: 2px solid var(--color-secondary);
	vertical-align: top;
}

#add-card-container {
	position: relative;
	height: 0;
	overflow: hidden;
	background: var(--color-background);
}

#add-card-container > section {
	padding: 10px;
}

#card-container {
	width: 100%;
}

.club-table {
	width: 100%;
}

.club-table tbody tr:nth-child(odd) {
	background: var(--color-background-secondary);
}

@media (max-width: 9in) {

	#account-links > div {
		display: block;
		width: auto;
	}

	.two-column {
		display: block;
		width: auto;
		margin-bottom: 10px;
		padding: 10px;
	}

	.club-panel {
		padding: 10px;
		margin: 10px;
	}

	#add-card-container button[name="verify-card"], #add-card-container button[name="close"] {
		width: 45% !important;
		display: inline-block;
	}
}