* {
	margin: 0;
	padding: 0;
}
ul {
}
html, body {
	height: 100%;
}

:root {
	--dark_green: #084d15;
	--background: #1c792e;
	--text_backing: #7ad993;
	--accent: #214f2a;
	--popup: #0a6b1d;
	--menu: #13912c;
	--footer_length: 122px;
}

body {
	background: var(--background);;
	color: white;
}
  	
.header {
	padding: 15px;
	position: fixed;
	background: var(--dark_green);
	width: 100%;
	display: flex;
	justify-content: flex-end;
	gap: 7%;
}

#end-header {
	margin-right: 30px;
}

#title {
	padding-top: 174px;
	padding-bottom: 50px;
	text-align: center;
}

.content2 {
	display: grid;
	grid-template-columns: 120px auto;
	justify-content: center;
	width: 900px;
	margin: 0 auto;
	gap: 20px;
}

.page {
	min-height: calc(100% - (1 * var(--footer_length)));
}

.page:after {
	content: "";
	display: block;
	height: 30px;
}

.height {
	min-height: 100%;
}

.footer {
	display: grid;
	grid-template-columns: 50% 50%;
	justify-content: space-evenly;
	text-align: center;
	align-items: stretch;
	background: var(--dark_green);;
	width: 100%;
	padding: 50px 0 50px 0;
}

.links {
	height: fit-content;
}

.links > ul {
	list-style-type: none;
}

.meat {
	height: fit-content;
	list-style-type: none;
}

.mobile-dropdown {
	display: none;
}

#content {
	border: solid var(--accent);;
	border-radius: 25px;
	padding: 20px;
	background: var(--text_backing);;
	color: black;
}

.game {
	height: 100px;
}
.game:after {
	content: "";
	display: block;
	height: 144px;
}

@media only screen and (max-width: 950px) {
	.content2 {
		width: 95%;
		grid-template-columns: auto;
	}
	.links {
		display: none;
	}
	.top-links {
		display: none;
	}
	.mobile-dropdown {
		display: inline-block;
	}
	.header {justify-content: flex-start; gap: 0;}
}

.top-links > button {
	background: var(--dark_green);
	color: white;
	padding: 10px 15px;
	border: none;
	cursor: pointer;
}

.mobile-dropdown > button {
	background: var(--dark_green);
	color: white;
	padding: 10px 15px;
	border: none;
	cursor: pointer;
}

details > summary {
	list-style-type: '>';
}
details[open] > summary {
	list-style-type: 'v';
}

summary {
	cursor: pointer;
}
summary > h1,h2,h3,h4 {
	display: inline-block;
}

.dropdown a{
	display: block;
	padding: 10px 15px;
}
.dropdown .content{
	display: none;
	position: absolute;
	background: var(--popup);
	min-width: 100px;
}
.dropdown:hover .content{
	display: block;
}
.dropdown a:hover {
	background: var(--menu);
}