1 files changed, 70 insertions, 0 deletions
diff --git a/src/static/main.css b/src/static/main.css
new file mode 100644
index 0000000..d684a7c
--- /dev/null
+++ b/src/static/main.css
@@ -0,0 +1,70 @@
+/*
+* This palette is from the Catppuccin project. Check it out!
+* https://catppuccin.com/
+*/
+
+:root {
+	--background-color: #1e1e2e; /* mocha base */
+	--primary-font: "Noto Sans";
+	--regular-text: #cdd6f4; /* mocha text */
+	--blue-text: 	#89b4fa; /* mocha blue */
+	--subtext: 	#bac2de; /* mocha subtext1 */
+	--medium-screen: 768px;
+}
+
+body {
+	background-color: var(--background-color);
+	font-family: var(--primary-font), system-ui;
+	line-height: 1.5rem;
+	margin-left: auto;
+	margin-right: auto;
+	margin-top: 1.25rem;
+	margin-bottom: 1.25rem;
+	max-width: var(--medium-screen);
+	padding: 0.75rem;
+}
+
+h1, h2, h3, h4, h5, h6, strong, b, p {
+	color: var(--regular-text);
+}
+
+a {
+	text-decoration: underline;
+	color: var(--blue-text);
+}
+
+video {
+	width: 100%;
+	height: auto;
+	max-width: var(--medium-screen);
+}
+
+footer {
+	color: var(--subtext);
+	font-size: 0.75rem;
+
+	text-align: right;
+}
+
+#nav_links {
+	display: flex;
+	gap: 0.25rem;
+}
+
+#gifs {
+	display: none;
+	flex-direction: row;
+	flex-wrap: wrap;
+	gap: 0.5rem;
+	justify-content: space-evenly;
+}
+
+.blogpost {
+	font-size: 0.85rem;
+}
+
+@media screen and (min-width: 768px) {
+	#gifs {
+		display: flex;
+	}
+}