body
{
	background-color: #B8C6D1;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #1F2E3C;
	max-width: 1200px;
	margin: 20px auto;
	padding: 0 15px;
}

table
{
	border-color: #CCCCCC;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #1F2E3C;
}

tr
{
	border-color: #CCCCCC;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #1F2E3C;
}

td
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #1F2E3C;
	border-color: #CCCCCC;
	text-align: left;
	padding: 3px;
}

td.leaders
{
	font-weight: bold;
	text-align: center;
}

td.header
{
	background-color: #8092A8;
	font-weight: bold;
	color: #FFFFFF;
	border-color: #8092A8;
	font-size: 14px;
	text-align: center;
	padding: 6px;
}

td.subheader
{
	background-color: #B7C2AA;
	font-weight: bold;
	color: #1F2E3C;
	border-color: #B7C2AA;
	font-size: 12px;
	text-align: center;
	padding: 5px;
}

.twib-banner
{
	text-align: center;
	margin-bottom: 8px;
}

.twib-banner img
{
	width: 100%;
	max-height: 250px;
	object-fit: cover;
	display: block;
	margin: 0 auto;
	border-radius: 6px;
}

h1
{
	color: #003366;
	margin-top: 0px;
	margin-bottom: 4px;
}

h2
{
	color: #004A7C;
	border-bottom: 1px solid #8092A8;
	padding-bottom: 4px;
	margin-top: 25px;
	margin-bottom: 4px;
}

p
{
	line-height: 1.3;
	margin-top: 6px;
	margin-bottom: 8px;
}

.helper
{
	font-size: 12px;
	color: #4A5568;
}

label
{
	display: block;
	font-weight: bold;
	margin-bottom: 4px;
}

.form-row
{
	display: flex;
	gap: 15px;
	margin-bottom: 10px;
}

.form-row > div
{
	flex: 1;
}

/* Empty fields */

input,
select,
textarea
{
	background-color: #D7E0E8;
	border: 1px solid #8092A8;
	border-radius: 4px;
	padding: 8px;
	color: #1F2E3C;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	box-sizing: border-box;
	width: 100%;
	margin-bottom: 12px;

	transition:
		background-color .25s ease,
		border-color .25s ease;
}

/* Active field */

input:focus,
select:focus,
textarea:focus
{
	background-color: #DDB8C3 !important;
	border-color: #003366;
	outline: none;
}

/* Completed field */

.field-complete
{
	background-color: #C1CBD2 !important;
}

/* Active field color */

.field-active
{
	background-color: #DDB8C3 !important;
}

/* Placeholder text */

::placeholder
{
	color: #4A5568;
	font-style: italic;
}

textarea
{
	resize: vertical;
	min-height: 55px;
}

.traveler-age-row
{
	display: flex;
	flex-wrap: nowrap;
	gap: 15px;
	align-items: flex-start;
	margin-top: 10px;
	margin-bottom: 15px;
}

.traveler-age-row label
{
	display: block;
	margin-bottom: 4px;
	white-space: nowrap;
}

.traveler-age-row > div
{
    flex: 0 0 175px;
    min-width: 175px;
    display: flex;
    flex-direction: column;
}

.traveler-age-row select
{
	width: 175px;
}

#travelers
{
	width: 90px;
}
#traveler1Row,
#traveler2Row,
#traveler3Row,
#traveler4Row,
#averageAgeRow
{
	display: flex;
	flex-direction: column;
}


.checkbox-grid
{
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 10px;
	margin-bottom: 15px;
}

.checkbox-grid label
{
	display: flex;
	align-items: center;
	font-weight: normal;
	margin-bottom: 0;
}

.checkbox-grid input[type="checkbox"]
{
	width: auto;
	margin-right: 8px;
	margin-bottom: 0;
}

button:hover
{
	background-color: #DDB8C3;
}




.submit-button
{
	background: url('wagon.png');

	background-size: cover;
	background-position: center;

	border: 4px solid #1F3A1F;
border-radius: 12px;

	width: 140px;
	height: 100px;

	display: flex;
	align-items: center;
	justify-content: center;

	text-align: center;

	cursor: pointer;

	position: relative;

	overflow: hidden;
}

.submit-button::before
{
	content: "";

	position: absolute;

	inset: 0;

	background: rgba(255,255,255,.25);
}

.submit-button:hover
{
	transform: scale(1.03);

	box-shadow:
		0 4px 8px rgba(0,0,0,.35);
}

.submit-title
{
	position: relative;
	z-index: 2;

	font-size: 18px;
	font-weight: bold;

	color: #000;

	text-shadow:
		2px 2px 4px rgba(255,255,255,.95),
		-2px -2px 4px rgba(255,255,255,.95);
}


.submit-area
{
	display: grid;
	grid-template-columns: 220px 170px 170px 220px;
	column-gap: 50px;

	justify-content: center;
	align-items: center;

	width: fit-content;
	margin: 25px auto 0 auto;
}

.submit-area > div
{
	text-align: center;
}

.reset-button
{
	background: #FFFFFF;
	color: #1F2E3C;
	border: none;
	border-radius: 50%;

	width: 100px;
	height: 100px;
    transform: rotate(-45deg);

	display: inline-flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;

	text-align: center;
	cursor: pointer;

	position: relative;
	overflow: hidden;
}

.reset-button::before
{
	content: "";

	position: absolute;

	left: -55px;
	top: -15px;

	width: 70px;
	height: 130px;

	border: 3px solid #CC3333;
	border-right: none;
	border-radius: 50%;
}

.reset-button::after
{
	content: "";

	position: absolute;

	right: -55px;
	top: -15px;

	width: 70px;
	height: 130px;

	border: 3px solid #CC3333;
	border-left: none;
	border-radius: 50%;
}

.baseball-top,
.baseball-bottom
{
	font-size: 20px;
	line-height: 1;
}

.baseball-main,
.baseball-sub
{
	transform: rotate(45deg);
}

.baseball-main
{
	font-size: 24px;
	font-weight: bold;
	line-height: 1;
	margin: 5px 0;
}

.baseball-sub
{
	font-size: 10px;
	line-height: 1;
}

.state-select
{
	width: 180px;
}

.submit-map
{
	font-size: 24px;
	line-height: 1;
}

.submit-car
{
	font-size: 24px;
	line-height: 1;
	margin-top: 4px;
}

.submit-mountain
{
	font-size: 24px;
	line-height: 1;
}

@media (max-width: 768px)
{
	.form-row
	{
		display: block;
	}

	.checkbox-grid
	{
		grid-template-columns: 1fr;
	}
}