:root {
	/* Lobby menu boxes */
	--menubordercolour: #5524d4;
	--menushadowcolour: #2a24aa;
	}

.lobby_grid {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: stretch;
	align-content: space-around;
	gap: 1em;
	margin: 1em 0;
}

.lobby_grid div {
	padding: 0.6em 0.4em;
	background-color: var(--pagecolour);
	border: 2px solid var(--menubordercolour);
	box-shadow: 4px 4px var(--menushadowcolour);
	}

#introduction_glow {
	padding: 2.5em 0;
	background-image: 
		radial-gradient(ellipse at center, #2a24aa 25%, transparent 65%, var(--pagecolour) 80%),
	/* colour order goes from inside to out*/
	repeating-linear-gradient(
   		-45deg,
    		#1c1f19,
    		#1c1f19 0.5em,
    		transparent 0.5em,
    		transparent 1em
		);
	}

#introduction_text {
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: center;
	padding: 0.5em;
	background-color: var(--pagecolour);
	border-width: 4px 0;
	border-color: #5524d4;
	border-style: solid;
	text-align: center;
}

#introduction {
	margin: 1em;
	padding: 1em;
	border: 2px solid var(--menubordercolour);
	box-shadow: 4px 4px var(--menushadowcolour);
	}
	
#frontdoor {
	width: 1000px;
	max-width: 100%;
	height: 16em;
	margin: 1em auto;
	background-image: url(../assets/internetbee1.png);
	background-attachment: fixed;
	border-radius: 1em;
}
#sludgetown {
	height: 57px;
	width: 120px;
	vertical-align: middle;
	}
#sludgetown:hover {
	scale: 2;
	image-rendering: pixelated;
	transition-duration: 0.5s;
	transition-property: scale;
	}