From 74741e07a7c5ba6e43f70742476371c4b9f307a6 Mon Sep 17 00:00:00 2001
From: DavidDGTNT <david@dgtntstudios.tk>
Date: Fri, 11 Feb 2022 01:33:41 +0000
Subject: [PATCH] Finished! (except for one picture)

---
 src/assets/css/main.css | 47 +++++++++++++++++++++++------------------
 src/book1/index.html    | 18 ++++++++++------
 src/book2/index.html    | 18 ++++++++++------
 3 files changed, 49 insertions(+), 34 deletions(-)

diff --git a/src/assets/css/main.css b/src/assets/css/main.css
index d676e54..eb59ecd 100644
--- a/src/assets/css/main.css
+++ b/src/assets/css/main.css
@@ -147,7 +147,31 @@ main a:hover {
     border-radius: 25px;
 }
 
+.flex-w-nc {
+    display: flex;
+    flex-direction: row;
+}
+
+.flex-w-nc div {
+    padding: 10px;
+    margin: 10px;
+}
+
+.cover {
+    width: 95%;
+    height: auto;
+}
+
 @media (max-width: 800px) {
+    body {
+        margin: 0px;
+    }
+
+    .content {
+        width: 100%;
+        border-radius: 0px;
+    }
+
     .flex-w {
         flex-direction: column;
     }
@@ -155,25 +179,8 @@ main a:hover {
     .flex-w div {
         flex: 100%
     }
-}
 
-.sec {
-    padding: 10px;
-    margin: 10px;
-    background-color: #a52a2a;
-    border-radius: 25px;
-    width: 45%;
-}
-
-.sec p {
-    text-align: left;
-    
-}
-
-.sec-left {
-    float: left;
-}
-
-.sec-right {
-    float: right;
+    header {
+        font-size: 20px;
+    }
 }
\ No newline at end of file
diff --git a/src/book1/index.html b/src/book1/index.html
index 5b33d59..2c398b1 100644
--- a/src/book1/index.html
+++ b/src/book1/index.html
@@ -15,17 +15,21 @@
             <a href="../book2/index.html">Lyza the Sheepdog: The Flood</a>
         </header>
         <main>
-            <h2>Lyza the Sheepdog: Christmas</h2>
+            <div class="flex-w-nc">
+                <div>
+                    <img src="../assets/img/book1cover.png" class="cover">
+                </div>
+                <div>
+                    <h2>Lyza the Sheepdog: Christmas</h2>
 
-            <p><img src="../assets/img/book1cover.png" alt="Lyza the Sheepdog: Christmas cover" title="" /></p>
+                    <p>Hey look, a baby has been born! Wait, what is that star?  </p>
 
-            <p>Hey look, a baby has been born! Wait, what is that star?  </p>
+                    <p>In Lyza the Sheepdog: Christmas, Lyza talks to the animals that were at the stable at Jesus' birth. She hears what others are thinking about what's going on, and tries to figure out whats going on herself.  </p>
 
-            <p>In Lyza the Sheepdog: Christmas, Lyza talks to the animals that were at the stable at Jesus' birth. She hears what others are thinking about what's going on, and tries to figure out whats going on herself.  </p>
+                    <p>When you read this book, you enter the world of Lyza the Sheepdog, a world where the event of Jesus' birth and all things that came before are the same, and we can see the fictional responses of the animals.  </p>
 
-            <p>When you read this book, you enter the world of Lyza the Sheepdog, a world where the event of Jesus' birth and all things that came before are the same, and we can see the fictional responses of the animals.  </p>
-
-            <p>This book was released in December of 2020.</p>
+                    <p>This book was released in December of 2020.</p>
+                </div>
         </main>
     </div>
 </body>
diff --git a/src/book2/index.html b/src/book2/index.html
index 1dc6ac6..df3fa4f 100644
--- a/src/book2/index.html
+++ b/src/book2/index.html
@@ -15,17 +15,21 @@
             <a href="../book2/index.html" class="current">Lyza the Sheepdog: The Flood</a>
         </header>
         <main>
-            <h2>Lyza the Sheepdog: The Flood</h2>
+            <div class="flex-w-nc">
+                <div>
+                    <img src="../assets/img/book2cover.png" class="cover">
+                </div>
+                <div>
+                    <h2>Lyza the Sheepdog: The Flood</h2>
 
-            <p><img src="../assets/img/book2cover.png" alt="Lyza the Sheepdog: The Flood cover" title="" /></p>
+                    <p>Hey! Why's there water on my back?  </p>
 
-            <p>Hey! Why's there water on my back?  </p>
+                    <p>In Lyza the Sheepdog: The Flood, Lyza talks to the animals that were at going to the Ark before the flood. She hears what others are thinking about what's going on, and tries to figure out whats going on herself.  </p>
 
-            <p>In Lyza the Sheepdog: The Flood, Lyza talks to the animals that were at going to the Ark before the flood. She hears what others are thinking about what's going on, and tries to figure out whats going on herself.  </p>
+                    <p>When you read this book, you enter the world of Lyza the Sheepdog, a world where the event of Jesus' birth and all things that came before are the same, and we can see the fictional responses of the animals.  </p>
 
-            <p>When you read this book, you enter the world of Lyza the Sheepdog, a world where the event of Jesus' birth and all things that came before are the same, and we can see the fictional responses of the animals.  </p>
-
-            <p>This book was released in December of 2021.</p>
+                    <p>This book was released in December of 2021.</p>
+                </div>
         </main>
     </div>
 </body>