:root {
	--orange: #FF5900;
	--blue: #000011;
	--dark-gray: #111111;
	--light-gray: gray;
	--text-light: white;
	--text-dark: darkgray;
}

body {
	background-color: var( --dark-gray );
	color: var( --text-dark );
	font-family:Arial, Helvetica, sans-serif;
	font-size:larger;
}

h1 {
	text-align:center;
}

h4 {
	margin-bottom:-10px;
}

h1, h2, h3 {
	margin-bottom:0;
}

img {
	max-width:100%;
}

a {
	color: var( --text-light );
}

li {
	margin-bottom:10px;
}

table {
	max-width:100%;
	border-collapse:collapse;
	background-color: var( --dark-gray );
}

table, th, td {
	border:1px solid white;
	border-color: var( --light-gray );
}

th, td {
	padding:5px;
}

hr {
	color: var( --text-dark );
}

button {
	padding-top:5px;
	padding-bottom:5px;
	padding-left:20px;
	padding-right:20px;
	background-color: var( --dark-gray );
	border-color: var( --light-gray );
	border-radius:5px;
	color:white;
	margin-bottom:20px;
	cursor:pointer;
}

.main {
	margin-left:24%;
	margin-right:24%;
	padding-left:50px;
	padding-right:50px;
}

.toc li {
	margin-bottom:1px;
}

.hidden {
	display:none;
}

@media screen and (max-width: 800px) {
	.main {
		margin-left:0;
		margin-right:0;
		padding-left:0;
		padding-right:0;
	}

	th, td {
		padding:0;
		font-size:small;
	}
}
