diff --git a/about.html b/about.html
index 6e452f7..148dd16 100644
--- a/about.html
+++ b/about.html
@@ -4,13 +4,14 @@
 		<meta charset="utf-8" />
 		<meta name="viewport" content="width=device-width,initial-scale=1" />
 		<link rel="stylesheet" href="/styles/default.css" />
+		<link rel="stylesheet" href="/styles/about.css" />
 		<link rel="icon" href="/images/favicon.ico" />
 		<title>About</title>
 	</head>
 
 	<body>
 		<header>
-			<p id="headermain"><a id="homelink" href="/">dairydemon.net</a></p>
+			<p><a id="homelink" href="/">dairydemon.net</a></p>
 		</header>
 		<main>
 			<article>
diff --git a/attributions.html b/attributions.html
index f34c826..bb068f7 100644
--- a/attributions.html
+++ b/attributions.html
@@ -10,7 +10,7 @@
 
 	<body>
 		<header>
-			<p id="headermain"><a id="homelink" href="/">dairydemon.net</a></p>
+			<p><a id="homelink" href="/">dairydemon.net</a></p>
 		</header>
 		<main>
 			<article>
diff --git a/index.html b/index.html
index a18a797..ea3389d 100644
--- a/index.html
+++ b/index.html
@@ -4,6 +4,7 @@
 		<meta charset="utf-8" />
 		<meta name="viewport" content="width=device-width,initial-scale=1" />
 		<link rel="stylesheet" href="/styles/default.css" />
+		<link rel="stylesheet" href="/styles/index.css" />
 		<link rel="icon" href="/images/favicon.ico" />
 		<title>Dairy Demon</title>
 	</head>
diff --git a/mgs/mgs.html b/mgs/mgs.html
index 7623f20..c49a85a 100644
--- a/mgs/mgs.html
+++ b/mgs/mgs.html
@@ -10,7 +10,7 @@
 
 	<body>
 		<header>
-			<p id="headermain"><a id="homelink" href="/">dairydemon.net</a></p>
+			<p><a id="homelink" href="/">dairydemon.net</a></p>
 		</header>
 		<main>
 			<nav>
diff --git a/styles/about.css b/styles/about.css
new file mode 100644
index 0000000..e02cb30
--- /dev/null
+++ b/styles/about.css
@@ -0,0 +1,8 @@
+#usbimg {
+	width: 256px;
+	height: auto;
+	max-width: 100%;
+	margin-right: 10px;
+	margin-bottom: 10px;
+	float: left;
+}
diff --git a/styles/default.css b/styles/default.css
index 1f35b9c..9b0177f 100644
--- a/styles/default.css
+++ b/styles/default.css
@@ -18,60 +18,19 @@ main nav {
 
 /* header and footer */
 header {
-	display: flex;
-	align-items: center;
-	min-width: min-content;
-}
-
-footer {
 	text-align: center;
 }
 
-#headerimg {
-	border-right: 3px solid black;
-	width: 128px;
-	background-image: url("/images/watching.jpg");
-	flex: initial;
-	align-self: stretch;
-}
-
-#headermain {
-	text-align: center;
-	flex: auto;
-}
-
-#headermain a {
-	color: blue;
-	text-decoration: none;
-	text-transform: uppercase;
-}
-
-#headermain a:hover {
-	text-decoration: underline;
-}
-
 #homelink {
+	color: blue;
+	text-decoration: none;
+	text-transform: uppercase;
 	font-size: xx-large;
 	font-weight: bold;
 }
 
-#headermain nav {
-	font-size: x-large;
-}
-
-nav ul,
-footer ul {
-	padding: 0;
-}
-
-nav ul li,
-footer ul li {
-	display: inline;
-}
-
-nav ul li + li::before,
-footer ul li + li::before {
-	content: " | ";
+#homelink:hover {
+	text-decoration: underline;
 }
 
 /* main content */
@@ -108,15 +67,6 @@ ol ol ol {
 	list-style: lower-roman
 }
 
-#usbimg {
-	width: 256px;
-	height: auto;
-	max-width: 100%;
-	margin-right: 10px;
-	margin-bottom: 10px;
-	float: left;
-}
-
 @media screen and (min-width: 80ch) {
 	/* to avoid zoom issues, grid layout is only used when mid-width is
 	 * large enough */
diff --git a/styles/index.css b/styles/index.css
new file mode 100644
index 0000000..39c62a6
--- /dev/null
+++ b/styles/index.css
@@ -0,0 +1,52 @@
+/* header and footer */
+header {
+	display: flex;
+	align-items: center;
+	min-width: min-content;
+}
+
+footer {
+	text-align: center;
+}
+
+#headerimg {
+	border-right: 3px solid black;
+	width: 128px;
+	background-image: url("/images/watching.jpg");
+	flex: initial;
+	align-self: stretch;
+}
+
+#headermain {
+	text-align: center;
+	flex: auto;
+}
+
+#headermain a {
+	color: blue;
+	text-decoration: none;
+	text-transform: uppercase;
+}
+
+#headermain a:hover {
+	text-decoration: underline;
+}
+
+#headermain nav {
+	font-size: x-large;
+}
+
+nav ul,
+footer ul {
+	padding: 0;
+}
+
+nav ul li,
+footer ul li {
+	display: inline;
+}
+
+nav ul li + li::before,
+footer ul li + li::before {
+	content: " | ";
+}
