From ae484f59d757c0317bc7a61a68f4d3b5f599a9b1 Mon Sep 17 00:00:00 2001
From: "Glitch (hello-webpage)" <none>
Date: Thu, 15 Oct 2020 16:59:57 +0000
Subject: [PATCH] =?UTF-8?q?=F0=9F=9B=A9=F0=9F=91=A2=20Checkpoint=20./style?=
 =?UTF-8?q?.css:617503/2419=20./index.html:617503/291?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 index.html |  5 ++++-
 style.css  | 25 ++++++++++---------------
 2 files changed, 14 insertions(+), 16 deletions(-)

diff --git a/index.html b/index.html
index 9eaeddd..87a4acf 100644
--- a/index.html
+++ b/index.html
@@ -17,8 +17,11 @@
     <div class="wrapper">
       <div class="content">
         <h1>Hello world!</h1>
-        <img src="/illustration.svg" class="illustration" />
       </div>
+      <img src="/illustration.svg" class="illustration" />
+      <button>
+        Remix on Glitch
+      </button>
     </div>
 
     <!-- include the Glitch button to show what the webpage is about and
diff --git a/style.css b/style.css
index 4f9f7d1..72746a2 100644
--- a/style.css
+++ b/style.css
@@ -4,8 +4,6 @@
   --main-text-color: #373fff;
 }
 
-
-
 body {
   font-family: helvetica, arial, sans-serif;
   background-color: var(--main-bg-color);
@@ -17,22 +15,19 @@ h1 {
 }
 
 .wrapper {
-  min-height: 100vh; // height of the browser viewport
-  display: flex;
-    justify-content: center;
-  align-items: center;
+  min-height: 100vh;
+  display: grid;
+  place-items: left;
 }
 
 .content {
-  height: 100px;
-  width: 200px;
-  background: #fff;
-  padding: 50px;
-  border-radius: 10px;
-  position: relative;
-  text-align: center;
+  width: clamp(23ch, 50%, 46ch);
+  display: flex;
+  flex-direction: column;
+  padding: 1rem;
 }
 
 .illustration {
-  
-}
\ No newline at end of file
+  position: relative;
+  bottom: 10em;
+}