:root {
	--main-color: #6f5dce;
	--odd-column: #1D1D1D;
	--even-column: #252525;
}

@font-face {
	font-family: "BebasNeue";
	src: url('fonts/BebasNeue.ttf');
}

@font-face {
	font-family: "Gatha";
	src: url('fonts/Gatha.ttf');
}

html {
	background-color: var(--odd-column);
	font-family: "Gatha";
	font-size: 20px;
}

body {
	width: 1000px;
	margin: auto;
	color: #FFFFFF;
	text-align: center;
}

h1 {
	font-size: 35px;
	font-family: "BebasNeue";
	padding: 20px;
	color: var(--main-color);
}

h2 {
	font-size: 25px;
	font-family: "BebasNeue";
}

a {
	color: white;
	text-decoration: none;
}

.tablelinks {
	width: 100%;
	color: white;
}

.tablelinks tr {
	border-bottom: solid 2px black;
	background-color: var(--odd-column);
}

.tablelinks th:hover {
	border-bottom: solid 2px var(--main-color);
}

.tablelinks a {
	color: white;
	text-decoration: none;
}

.selectedth {
	background-color: var(--main-color);
	border: solid 2px var(--main-color);
}

.tdbold, .tdmaincolor {
	font-weight: bold;
}

.tdmaincolor {
	color: var(--main-color);
}

table, .fixedtable, .gamerecap {
	/*margin: auto;*/
	border-collapse: collapse;
	/*table-layout: fixed;*/
	width: 100%;
	/*border: solid 3px black;*/
}

.fixedtable, .gamerecap {
	table-layout: fixed;
}

.gamerecap {
	width: 80%;
	margin: auto;
	margin-top: 30px;
	border: 2px solid black;
}

.gamerecap th {
	background-color: black;
	color: white;
	padding: 15px;
	font-size: 15px;
}

.gamerecap td {
	padding: 10px;
}

th {
	background-color: black;
	color: var(--main-color);
	text-transform: uppercase;
	border: solid 1px black;
}

th, td {
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 5px;
	padding-bottom: 5px;
	text-align: center;
}

tr {
	border-bottom: solid 1px var(--main-color);
}

tr td:nth-child(1), tr td:nth-child(3), tr td:nth-child(5) {
    background-color: var(--odd-column);
}

tr td:nth-child(2), tr td:nth-child(4), tr td:nth-child(6) {
    background-color: var(--even-column);
}

form {
	padding: 20px;
}

.banner, .bottom {
	padding: 30px;
	background-color: black;
}

.banner {
	font-family: "BebasNeue";
	font-weight: bold;
	font-size: 50px;
	text-align: center;
}

.bottom a {
	color: white;
	text-decoration: none;
}

.bottom a:hover {
	color: var(--main-color);
}

.container {
	display: flex;
}

.item {
	flex-grow: 1;
	margin: 5px;
}

.statdiv {
	flex-grow: 1;
	border: solid 1px black;
	background-color: var(--even-column);
	text-align: center;
	padding: 15px;
	margin: 5px
}

.greytext {
	color: grey;
}

.stattext {
	color: var(--main-color);
}

.tabcontent {
    display: none;
}

.tabs {
	display: flex;
    overflow: hidden;
	width: 100%;
}

.tablinks {
	flex: 1;
    background-color: black;
    /*float: left;*/
    border: 3px solid #000;
    cursor: pointer;
    padding: 10px;
	color: white;
	font-family: "BebasNeue";
	font-size: 30px;
}

.tablinks:hover {
    /*background-color: #ddd;*/
	border-bottom: 3px solid var(--main-color);
}

.tablinks.active {
    background-color: var(--main-color);
	border: 3px solid var(--main-color);
}

.logos {
	width: 50px;
	padding: 10px;
}

.player-stats {
	display: none;
}

.maindiv {
	padding-bottom: 30px;
}