/*
 * Do you love modern web development?
 * Do you feel your manager isn't proud of you enough?
 * Do you think that NPM and Bun are the best things in the universe?
 * Are you unable to draw anymore without using stylesheet files?
 * Good! Then we know how to help you!
 * GoTouchGrass.com - an amazingly grounding experience, designed to help people like you!
 * [Voiceover:] (oh yeah, this grass is so nice)
 * - Are your eyes shining blood red from the screen?
 * - GoTouchGrass.com!
 * - Are you being irritated by the bare mention of the white theme?
 * - GoTouchGrass.com!
 * - Are you wearing maid costume and changed your gender to have more time programming in Rust?
 * [music stops for this line, confusing voice]... Uhhh... i guess it's too late to he [interrupted]
 * GoTouchGrass.com! Ultimate soultions to modern problems!
 * [Kid's voice:] And the best part: it's free!
 * [family laugh voice]
 * GoTouchGrass.com
 * [fast:] gotouchgrass.com is not a medical procedure, times of exposure and side-effects should be discussed with a medical professional. 
 * [adbreak]
 */

body { 
	margin:0;
	min-height: 100vh;
	min-width : 100vw; 
	display: flex; 
	justify-content: center; 
	align-items: center; 
	background-color: #101010ff; /* fuck u smaznug */
	color: white; 
}



.main { 
	margin: 0;
	text-align:center; 
	max-width: 95vw; /* mobile */
}

/* desktops */
@media screen and (min-width: 420px) and (orientation: landscape) {
  .main {
    max-width: 80vw;
  }
}


 
.normal { 
	text-align: left; 
}
.center { 
	text-align: center; 
} 
.blue { 
	color: blue; 
} 
.hidden { 
	color: rgba(0,0,0,0); 
}



blockquote {
	margin: 0.5em 10px;
	padding: 1em 20px;
	border-left: 0.3em solid #ba7423;
	background-color: #203139;
	color: #c3c3c3;
}

/* this shit won't wrk on old browsers but i don't care... */
blockquote.warning,
blockquote.notice,
blockquote.tip {
	display: flex;
	gap: 12px;
}

blockquote.warning::before,
blockquote.notice::before,
blockquote.tip::before {
	flex-shrink: 0;
	font-size: 1.5em;
	line-height: 1;
}

blockquote.warning {
	border-left-color: #e67e22;
	background-color: #3e2c1c; 
}
blockquote.warning::before {
	content: "⚠️";
	color: #e67e22;
}

blockquote.notice {
	border-left-color: #3498db;
	background-color: #1c2c3e; 
}
blockquote.notice::before {
	content: "ℹ️";
	color: #3498db;
}

blockquote.tip {
	border-left-color: #2ecc71;
	background-color: #1c3327; 
}
blockquote.tip::before {
	content: "💡";
	color: #2ecc71;
}