:root {
	--gradient-color-1: #1D20E2;
	--gradient-color-3: #DF1DE2;
	--gradient-color-2: #7D1DE2;
}
* {
	padding: 0;
	margin: 0;
	font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
	/* box-sizing: border-box; */
}
a:any-link {
	color: white;
}
a:any-link:hover {
	color: var(--gradient-color-2);
}
.wrapper {
	--default-background-width: 75px;
	
	/* --gradient-color-2: yellow; */
	height: 100vh;
	width: 100vw;
	display: flex;
	
	
	justify-content: center;
	align-items: center;
	/* filter: brightness(80%); */
}

@media only screen and (min-width: 600px) {

}
.wrapper.background {
	/* background: repeating-linear-gradient(
		45deg,
		var(--gradient-color-1),
		var(--gradient-color-1) calc(var(--default-background-width)/2),
		var(--gradient-color-2) calc(var(--default-background-width)/2),
		var(--gradient-color-2) var(--default-background-width)
	); */
	background: repeating-linear-gradient(
		45deg,
		var(--gradient-color-1),
		var(--gradient-color-2),
		var(--gradient-color-3)
		/* var(--gradient-color-1) 30px, */

	);
}

.content {
	background-color: black;
	
	
	/* height: 50vh; */
	/* width: 40vw; */
	width: max-content;

	font-size: clamp(2rem, 2vw, 7rem);
	color: white;
	padding: 4rem;
	border: 8px solid white;
	border-radius: 25px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	/* box-shadow: rgb(244, 71, 8) 5px 5px 5px 3px;  */
}