From 0934a039dd105d19e2553a566db577a5caa21c25 Mon Sep 17 00:00:00 2001
From: edpibu <git@edgarpierre.fr>
Date: Sun, 20 Dec 2020 14:39:02 +0100
Subject: [PATCH] Updated css structure for multiple pages

---
 css/index.css | 92 +++++++++++++++++++++++++++++++++++++++++++++++++++
 css/main.css  | 90 -------------------------------------------------
 index.html    |  2 +-
 3 files changed, 93 insertions(+), 91 deletions(-)
 create mode 100644 css/index.css

diff --git a/css/index.css b/css/index.css
new file mode 100644
index 0000000..1a197c5
--- /dev/null
+++ b/css/index.css
@@ -0,0 +1,92 @@
+@import url('main.css');
+
+@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Serif:wght@400;700&display=swap');
+
+
+.left, .right {
+	position: absolute;
+	left: 0;
+	right: 0;
+}
+
+.left {
+	text-align: center;
+	top: 0;
+	bottom: 40%;
+}
+.right {
+	top: 60%;
+	bottom: 0;
+	background: url("../images/pic1.jpg");
+	background-size: cover;
+	background-position: center;
+}
+
+.left h1 {
+  position: absolute;
+	font-size: 3rem;
+  height: 1em;
+  line-height: 1em;
+  margin: 0;
+  width: 100%;
+
+  font-family: IBM Plex Serif, serif;
+}
+
+.left h1:first-of-type {
+  top: calc( 50% - 1em );
+  font-weight: 700;
+}
+.left h1:last-of-type {
+  bottom: calc( 50% - 1em );
+  font-weight: 400;
+}
+
+footer {
+  position: absolute;
+  bottom: 0;
+  width: 100%;
+  background: black;
+  color: #ffffffde;
+  text-align: center;
+}
+footer ul {
+  list-style: none;
+  padding: 1em;
+}
+footer li span {
+  font-weight: 800;
+  margin-right: 1em;
+}
+footer a {
+  color: #dededede;
+  text-decoration: none;
+  transition: color 50ms;
+}
+footer a:hover {
+  color: #ffffffde;
+}
+footer a:active {
+  color: #ffffffde;
+}
+
+@media screen and (min-width: 1024px) {
+	.left, .right {
+		top: 0;
+		bottom: 0;
+	}
+
+	.right {
+		right: 0;
+		left: 40%
+	}
+	.left {
+		right: 60%;
+	}
+	
+	.left h1 {
+		font-size: 4rem;
+		text-align: right;
+		padding-right: 1em;
+	}
+}
\ No newline at end of file
diff --git a/css/main.css b/css/main.css
index ace62b5..c914e1e 100644
--- a/css/main.css
+++ b/css/main.css
@@ -1,5 +1,3 @@
-@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Serif:wght@400;700&display=swap');
-
 html {
   box-sizing: border-box;
   font-family: sans-serif;
@@ -16,92 +14,4 @@ body {
   width: 100%;
   margin: 0;
 	color: #000000de;
-}
-
-.left, .right {
-	position: absolute;
-	left: 0;
-	right: 0;
-}
-
-.left {
-	text-align: center;
-	top: 0;
-	bottom: 40%;
-}
-.right {
-	top: 60%;
-	bottom: 0;
-	background: url("../images/pic1.jpg");
-	background-size: cover;
-	background-position: center;
-}
-
-.left h1 {
-  position: absolute;
-	font-size: 3rem;
-  height: 1em;
-  line-height: 1em;
-  margin: 0;
-  width: 100%;
-
-  font-family: IBM Plex Serif, serif;
-}
-
-.left h1:first-of-type {
-  top: calc( 50% - 1em );
-  font-weight: 700;
-}
-.left h1:last-of-type {
-  bottom: calc( 50% - 1em );
-  font-weight: 400;
-}
-
-footer {
-  position: absolute;
-  bottom: 0;
-  width: 100%;
-  background: black;
-  color: #ffffffde;
-  text-align: center;
-}
-footer ul {
-  list-style: none;
-  padding: 1em;
-}
-footer li span {
-  font-weight: 800;
-  margin-right: 1em;
-}
-footer a {
-  color: #dededede;
-  text-decoration: none;
-  transition: color 50ms;
-}
-footer a:hover {
-  color: #ffffffde;
-}
-footer a:active {
-  color: #ffffffde;
-}
-
-@media screen and (min-width: 1024px) {
-	.left, .right {
-		top: 0;
-		bottom: 0;
-	}
-
-	.right {
-		right: 0;
-		left: 40%
-	}
-	.left {
-		right: 60%;
-	}
-	
-	.left h1 {
-		font-size: 4rem;
-		text-align: right;
-		padding-right: 1em;
-	}
 }
\ No newline at end of file
diff --git a/index.html b/index.html
index cbafd22..a80b4dc 100644
--- a/index.html
+++ b/index.html
@@ -6,7 +6,7 @@
 
     <title>Edgar P. Burkhart</title>
 
-    <link rel="stylesheet" type="text/css" href="css/main.css" />
+    <link rel="stylesheet" type="text/css" href="css/index.css" />
     
     <link rel="apple-touch-icon" sizes="57x57" href="icons/apple-icon-57x57.png">
     <link rel="apple-touch-icon" sizes="60x60" href="icons/apple-icon-60x60.png">