--- a/css/style.css	Sun Oct 01 04:06:23 2023 -0400
+++ b/css/style.css	Fri Dec 15 18:56:52 2023 -0500
@@ -1,37 +1,49 @@
-.navbar {
-	text-align: left; /* Override body text align */
-	box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.5);
-}
-.container {
-	width: 98%;
-	margin-top: 1%;
-}
+/* body-wide font choice and stuff */
 body {
 	color: white;
 	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+}
+
+.header {
 	text-align: center;
-	text-shadow: 5px 5px 5px rgba(0, 0, 0, 0.6);
+	justify-content: center;
 }
-div.box {
-	background-color: rgba(0, 0, 0, 0.5);
-	box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.5) inset;
-	color: white;
+
+.title {
 	text-align: center;
-	margin: 1% auto;
-	padding: 15px;
-	max-width: 500px;
+	display: inline-block;
+	/* dumb little hack to get this to render properly on mobile */
+	padding: 0 0.75em;
+}
+
+.avatar {
+	display: inline-block;
+
+	border: 4px solid black;
+	width: 200px;
+	height: auto;
 }
-.center {
-	position: absolute;
-	top: 50%;
-	left: 50%;
-	transform: translate(-50%, -50%);
+
+.content {
+	background-color: rgba(0, 0, 0, 0.5);
+
+	/* essentially equivalent to `margin: auto;`
+	 * except it has a minimum value of 1em to make it
+	 * look nice on mobile
+	*/
+	margin-inline: max(1em, 50% - 46.88em/2);
+
+	margin-top: 1em;
+	padding: 1em 1.5em;
 }
-a:link, a:visited, a:hover, a:active {
-	color: #ff6600;
+
+/* generic drop shadows I heavily use these in... everything,
+ * so having them as their own classes is pretty nice :)
+*/
+.drop-shadow-text {
+	text-shadow: 0.125em 0.125em 0.125em rgba(0, 0, 0, 0.5);
 }
-/* Only in index.html */
-div.logos {
-	filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, 0.5));
-	image-rendering: pixelated;
+
+.drop-shadow-box {
+	box-shadow: 0.125em 0.125em 0.625em rgba(0, 0, 0, 0.5);
 }