:root {
	--poker-green: #35654d;
}


body {
	font-size: 1rem;
	background-color: lightblue;
}

.container {
  display: block;
  justify-content: space-between;

  /* #ChartSession {
  	padding-bottom: 50vw;
  } */
}
#chartCumulative { min-width: 50vw; }
#chartSession { min-width: 50vw; }

main {
	background-color: white;
	text-align: center;
	margin: 0 auto;
	width: max-content;
	padding: 2vw 3vw;
	border-radius: 20px;


	/* h2 {
		font-size: min(5vw, 50px);
	} */
	form {
		margin: auto;
		width:max-content;
		/* transform: scale(1.5); */
		font-size: 1.2em;
		input, select, button {
			font-size: inherit;
			padding: 0.5em;
		}

/*		display: flex;*/
		button {
			/* font-size: min(3vw, 40px); */
			/* font-weight: bold; */
			/* padding: 5px 10px; */
/*			white-space: nowrap;*/
			/* margin-top: 15px; */
		}
		/* input, label, select {
			font-size: min(3vw, 40px);
		} */
	}
	/* form:disabled {
		button{
  			color: green;
	}
} */

	table {
		margin: 0 auto;
		width: 100%;
		border: 2px solid black;
	}
	table#pool {
		margin-top: 25px;
	}

	td, th {
		border: 2px solid black;
		max-width: 400px;
		word-wrap: break-word;
		overflow-wrap: break-word;
		padding: 5px 10px;
		font-size: 34px;
	}
}
/* #ledger {
    width: 100vw;
    max-width: 100vw;
    min-width: 0;
    table-layout: fixed;
    box-sizing: border-box;
    border-collapse: collapse;
    border: 1px solid black;
    font-size: 0.8em;
}

#ledger td,
#ledger th {
    width: auto;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    font-size: 0.5em;
    padding: 0;
    border: 1px solid black;
    overflow-wrap: anywhere;
    word-break: break-word;
} */
#ledger {
    width: 100%;
	max-width: 100%;
    min-width: 0;
    table-layout: auto;
    border-collapse: collapse;
    box-sizing: border-box;
	margin-left: auto;
	margin-right: auto;

	th, td {
		font-size: 0.5em;
		padding: 2px;
		margin: 0;
		white-space: nowrap;
	}

	.note {
		width: 100%;
		white-space: normal;
	}
}

header {
	margin: 0 auto;
	background-color: white;
	width: max-content;
	text-align: center;
	padding: 0 40px;
	/* h1 {
		font-size: min(5vw, 50px);
		margin-bottom: 1vw;
	} */
	/* p {
		font-size: min(2vw, 20px);
		margin-top: 1vw;
	} */
	
	border-radius: 15px;
}


nav {
   	list-style-type: none;
	background-color: var(--poker-green);
	margin: 35px auto;
	padding: .5% 1%;
	border-radius: 25px;
  	display: flex;
  	max-width: min(80%, 1200px);
/*  	justify-content: center; */
	a {
		flex: 1;
		padding: .5%;
		margin: 1% 1%;
		display: inline-block;
		color: black;
		text-decoration: none;
		background-color: #dddddd;
		/* font-size: min(3vw, 30px); */
		font-size: 2em;
		text-align: center;
		border-radius: 10px;
		a {
			text-decoration: none;
			display: block;
			color: black;
		}
	}
	a:hover{
		background-color: green;
	}
}

@media (max-width: 600px) {

	main {
		width: 90%;
	}
	.ledger-form {
		width: 100%;
	}
	nav {
		border-radius: 0;
		padding: 10px 0;
		width: 100vw;
		max-width: 100vw;
		box-sizing: border-box;
		margin-left: calc(50% - 50vw);
		font-size: .75em;

		a {
			aspect-ratio: 10 / 4;
			display: flex;
			justify-content: center;
			align-items: center;
		}
	}
	/* main form * {
		font-size: 16px;
		min-height: 44px;
		padding: 8px 12px;
		margin: 6px 3px;
	}
	nav a {
		font-size: 16px;
		margin: 1% 0.5%;
		padding: 10px 4px;
	} */


}
