add "book" button

1 files changed, 31 insertions, 1 deletions

diff --git a/static/style.css b/static/style.css
index 72f35c3..c55407f 100644
--- a/static/style.css
+++ b/static/style.css
@@ -10,6 +10,26 @@ body {
   gap: 3rem;
 }
 
+.button {
+  display: inline-block;
+  font-size: 1rem;
+  text-decoration: none;
+  text-transform: uppercase;
+  font-weight: bold;
+  color: #000000;
+  border: 0.1875rem solid;
+  padding: 0.75rem 2.5rem;
+  box-shadow: 1px 1px 0 0, 2px 2px 0 0, 3px 3px 0 0, 4px 4px 0 0;
+  position: relative;
+  transition: box-shadow 0.2s, top 0.2s, left: 0.2s;
+}
+
+.button:active {
+  box-shadow: 0px 0px 0px 0px;
+  top: 5px;
+  left: 5px;
+}
+
 .logo {
   width: 294px;
   height: 259px;
@@ -19,6 +39,7 @@ h1 {
   font-weight: 900;
   font-style: italic;
   font-size: 1.75rem;
+  margin-bottom: 0.75rem;
 }
 
 .article {
@@ -80,7 +101,7 @@ h1 {
   object-fit: cover;
 }
 
-@media screen and (max-width: 56rem) {
+@media screen and (max-width: 50rem) {
   body {
     margin: 2rem 1rem 1rem;
   }
@@ -89,6 +110,11 @@ h1 {
     gap: 2rem;
   }
 
+  .logo {
+    width: 180px;
+    height: 159px;
+  }
+
   .gallery {
     display: flex;
     flex-direction: column;
@@ -119,4 +145,8 @@ h1 {
   .gallery > div {
     background-color: #ffffff22;
   }
+
+  .button {
+    color: #ffffff;
+  }
 }