@charset "utf-8";

.content-statsleague-width {
	max-width: 64rem;
}

.content-container-grid {
	display: grid;
	column-gap: 1rem;
  grid-template-areas:
	 "content-header"
	 "top-holes"
	 "top-net"
	 "leaderboard";
	grid-row-gap: .5rem;
}

.content-header {
	display: grid;
	grid-area: content-header;
	grid-template-columns: 1fr 1fr;
	grid-template-areas:
		"data1 data2";
	height: auto !important;
	line-height: normal !important;
	padding: .5rem !important;
	margin-bottom: 0 !important;
}

		#content-header-league__data1 {
			grid-area: data1;
			font-size: 1.4rem;
			font-weight: 400;
			white-space: nowrap;
			text-align: left;
		}

		#content-header-league__data2 {
			grid-area: data2;
			font-size: .8rem;
			font-weight: 400;
			white-space: nowrap;
			text-align: right;
		}

.content-header-select {
	display: none;
}

.stat-box {
	padding: 1.5rem .3rem;
	background-color: #f7e4b6;
	border: 1px solid #cfbe92;
}

.stat-box__header{
	font-size: .8rem;
	font-style: italic;
	font-weight: 700;
	text-decoration: underline;
}
.stat-box__content{
	font-size: .75rem;
	font-style: normal;
	font-weight: 400;
	text-decoration: none;
}

.top-holes {
	grid-area: top-holes;
}

.top-net {
	grid-area: top-net;
}

.front9 {
	grid-area: front9;
	display: none;
}

.back9 {
	grid-area: back9;
	display: none;
}

.leaderboard {
	grid-area: leaderboard;
	/* background-color: orange; */
}



/* 544px */
@media (min-width: 34em) {
	.content-container-grid {
		grid-template-areas:
		 "content-header content-header"
		 "top-holes top-net"
		 "leaderboard leaderboard";
	}
}



/* 570px */
@media (min-width: 35.625em) {
	.front9 {
		display: grid;
		align-content: start;
	}

	.back9 {
		display: grid;
		align-content: end;
	}

	.content-container-grid {
		grid-template-areas:
		 "content-header content-header"
		 "top-holes top-net"
		 "front9 front9"
		 "back9 back9"
		 "leaderboard leaderboard";
	}
}

/* 800px */
@media (min-width: 50em) {
	.content-container-grid {
		grid-template-columns: 1fr 1fr 17.5rem;
		grid-template-areas:
		 "content-header content-header content-header"
		 "top-holes top-net leaderboard"
		 "front9 front9 leaderboard"
		 "back9 back9 leaderboard";
		}

		.content-header {
			grid-template-columns: 1fr 1fr;
			grid-template-areas:
				"data1 data2"
				"select select";
		}

		.content-header-select {
			display: grid;
			grid-area: select;
			grid-template-areas:
				"select1 select2"
		}

		#select1 {
			display: grid;
			grid-area: select1;
			justify-content: start;
		}

		#select2 {
			display: grid;
			grid-area: select2;
			justify-content: end;
		}

	.stat-table--frontback {
		font-family: 'Open Sans Condensed', sans-serif;
		/* font-size: .75rem !important; */
	}

	.stat-table--leaderboard {
		font-size: .75rem !important;
	}
}

/* 960px */
@media (min-width: 60em) {
	.content-container-grid {
		grid-template-columns: 1fr 1fr 22rem;
		}

		.stat-table--frontback {
			font-family: 'Open Sans', sans-serif;
		}

		.stat-table--leaderboard {
			font-size: .8rem !important;
		}
}


/*===============
* Responsive media queries for leaderboard table
=================*/

/* 440px */
@media (min-width: 27.5em) {
	#stats-league_leaderboard-table th:first-child,
	#stats-league_leaderboard-table td:first-child {
	padding-left: 3.5rem;
	}
	#stats-league_leaderboard-table th:last-child,
	#stats-league_leaderboard-table td:last-child {
	padding-right: 3.5rem;
	}
}

/* 800px */
@media (min-width: 50em) {
	#stats-league_leaderboard-table th:first-child,
	#stats-league_leaderboard-table td:first-child {
	padding-left: .3rem;
	}
	#stats-league_leaderboard-table th:last-child,
	#stats-league_leaderboard-table td:last-child {
	padding-right: .3rem;
	}
}
