:root {
	--ignite-orange: #f27d18;
	--ignite-yellow: #f2bb18;
	--echo-stats-header-orange: #240407;
	--echo-stats-header-blue: #0b0b13;
	--echo-stats-row-dark: rgba(0, 0, 0, 0.4);
	--echo-stats-row-dark-hover: rgba(0, 0, 0, 0.5);
	--echo-stats-table-orange: rgba(255, 150, 50, 0.7);
	--echo-stats-table-blue: rgba(50, 150, 255, 0.7)
}

html, body {
	background-color: #222;
	color: #eee;
}

a:hover {
	color: #4abbff;
}

.navbar-item, .navbar-link {
	color: #d7d7d7;
}

.navbar-link.is-active, .navbar-link:focus, .navbar-link:focus-within, .navbar-link:hover, a.navbar-item.is-active, a.navbar-item:focus, a.navbar-item:focus-within, a.navbar-item:hover {
	background-color: #2a2a2a;
	color: #f99135;
	/* border-radius: 10rem; */
}

.navbar-link.is-active, a.navbar-item.is-active {
	color: #ff7800;
}

.mobile_nav_menu_button {
	float: right;
	margin: 0.6em;
	/* padding: 1em; */
	opacity: .3;
	max-height: 2.3em;
	display: none;
}

.mobile_nav_menu_button > img {
	max-height: 2.3em;
}

@media screen and (max-width: 1023px) {
	.navbar-menu {
		background-color: inherit;
	}

	.navbar-menu.expanded {
		display: flex;
	}

	.mobile_nav_menu_button {
		display: block;
	}
}

.hero {
	background-color: #0001;
}

.subtitle {
	color: #ccc;
	margin-top: 1em;
	margin-bottom: .5em;
}

.subtitle strong {
	color: #eee;
}

.title {
	color: #ff7800;
}

.table {
	background-color: #fff1;
	color: #ddd;
	border-radius: .5em;
}

.table thead td, .table thead th {
	color: #eee;
}

.table td, .table th {
	border-color: #555;
}

.watermark {
	position: absolute;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.watermark img {
	position: absolute;
	top: -50%;
	left: -25%;
	width: 150%;
	max-width: none;
	opacity: .01;
}

code {
	background-color: #0001;
	color: var(--ignite-orange);
}

.footer {
	background-color: #282828;
	margin-top: 3em;
	padding: 3rem 1.5rem 5rem;
}

strong {
	color: var(--ignite-orange);
}

a {
	color: var(--ignite-yellow);
}

a:hover {
	color: #ffda55;
}

a:active {
	color: #a98d1e;
}

.footer ul {
	list-style: none;
	width: fit-content;
	margin: auto;
}

.footer ul li {
	float: left;
	margin: 0 1em;
}

#no_player {
	display: none;
}

.playercard_container {
	font-size: .8em;
}

@media screen and (max-height: 50em) {
	.playercard_container {
		font-size: .6em;
	}
}