* { margin: 0; padding: 0; }
body {
	user-select: none;
	overflow: hidden;
	height: 600px;
	width: 1000px;
	position: absolute;
	left: 50%; top: 50%;
	transform: translate(-50%, -50%);
	background-color: rgb(75, 130, 151);
	color: white;
	font-family: Arial, Helvetica, sans-serif;
	border: 1px solid white;
	clip-path: fill-box;
}

#walk {
	position: absolute;
	left: 50%; top: 50%;
	transform: translate(-50%, -50%);
	padding: 2rem 3rem;
	/* background-color: #258125; */
}
#walk h3 {
	pointer-events: none;
}
#cash {
	position: absolute;
	bottom: 100%;
	left: 0;
	padding: 0.2rem;
	font-size: 1rem;
	width: max-content;
}
#cash-per-sec {
	position: absolute;
	top: 100%;
	left: 0;
	padding: 0.2rem;
	font-size: 1rem;
	width: max-content;
}
#toggle-shop, #toggle-support {
	position: absolute;
	/* background-color: #222; */
	padding: 1rem 1.2rem;
	font-weight: bold;
}
#toggle-shop {
	left: 0.5rem; top: 0.5rem;
}
#toggle-support {
	right: 0.5rem; top: 0.5rem;
}

#shop-wrapper, #support-wrapper {
	position: absolute;
	top: 4.2rem;
	display: grid;
	justify-items: center;
	grid-template-columns: 1fr;
	grid-auto-rows: max-content;
	gap: 0.5rem;
	font-size: 1rem;
	width: 28%;
	transition-duration: 0.3s;
}
#shop-wrapper { left: 0; }
#support-wrapper { right: 1rem; }
#shop-wrapper .btn, #support-wrapper .btn {
	/* background-color: #444; */
	padding: 1rem 0;
	width: 100%;
	margin-left: 1rem;
}
#shop-wrapper .btn h3, #support-wrapper .btn h3 {
	font-weight: normal;
	text-align: center;

}


#progress-bar {
	position: absolute;
	transform: translateX(-50%);
	left: 50%;
	top: 15%;
	width: 30%;
	height: 1rem;
	background-color: lightcyan;
}
#progress-bar div {
	background-color: #47c8c2;
	position: absolute;
	left: 0; top: 0;
	height: 100%;
	width: 0%;
}
#progress-bar #perc-dist {
	position: absolute;
	transform: translateX(-50%);
	left: 50%;
	bottom: 100%;
	padding: 0.5rem;
	width: max-content;
}

.afford {
	box-shadow: 0 0 5px lime;
}

#times-around {
	position: absolute;
	left: 0;
	bottom: 0;
	padding: 0.5rem 0.7rem;
}

.g-btn {
	background-color: #309230;
}
.g-btn:hover { background-color: #308a30; }
.g-btn:active { background-color: #2d862d; }
.dg-btn {
	background-color: #137c13;
}
.dg-btn:hover { background-color: #177517; }
.dg-btn:active { background-color: #147014; }

#restart {
	position: absolute;
	padding: 1rem 1.2rem;
	right: 0.5rem;
	bottom: 0.5rem;
}