diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss
index bc9eb7b8363d0b83b5ba42a23a5e0ecb46511159..f992a048ad10ed2b91340ecfb77c6fba3aa11b49 100644
--- a/app/assets/stylesheets/application.scss
+++ b/app/assets/stylesheets/application.scss
@@ -97,4 +97,25 @@ a, a:hover, a:focus, a:active {
   background-color: #1877F2;
   font-weight: bold;
 }
+
+.custom-image-container {
+  position: relative;
+  text-align: center;
+  color: white;
+}
+
+.Insp_Quote {
+  position: absolute;
+  text-shadow: 0 0 2px black, 0 0 2px black, 0 0 2px black, 0 0 2px black;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+
+#expand-hidden {
+  position: absolute;
+  top: 8px;
+  right: 16px;
+}
+
 @import 'cookies_eu';
diff --git a/app/views/home/home.html.erb b/app/views/home/home.html.erb
index 5e349a9038901717313984bb2b6da17687e2e381..4d8273c59802335c923600c8c0dcdaf51dbf225f 100644
--- a/app/views/home/home.html.erb
+++ b/app/views/home/home.html.erb
@@ -1,34 +1,64 @@
 <%=button_to t('.action_create'), new_habit_path, method: :get, class:"btn btn-info btn-lg" %>
 <!--Inspirational Quotes: https://type.fit/api/quotes
     Inspirational Dogs: https://dog.ceo/dog-api/-->
-<div class="d-flex justify-content-center">
+
+<div class="d-flex justify-content-center custom-image-container" id="cute-dogs-container">
+
   <%=image_tag source="", :class => "Insp_Pic", :align => "middle", :style => "width:300px;height:300px;"%>
+  <div id="expand-hidden"><i class='fa fa-window-close fa-lg'></i> </div>
+  <div class="Insp_Quote"></div><br>
 </div>
 <div class="d-flex justify-content-center">
-  <h3 class="Insp_Quote"></h3><br>
+
   <script>
+    Cookies.set('name', 'value');
     var Text = ""
     var Auth = ""
     var ImgURL = ""
-      fetch("https://dog.ceo/api/breeds/image/random")
-          .then(function(response) {
-              return response.json();
-          })
-          .then(function(data) {
-              console.log(data.message);
-              ImgURL = data.message;
-              $(".Insp_Pic").attr("src",ImgURL);
-          });
-      fetch("https://type.fit/api/quotes")
-          .then(function(response) {
-              return response.json();
-          })
-          .then(function(data) {
-              let quote = data[Math.floor(Math.random() * data.length)];
-              Text = quote.text;
-              Auth = quote.author;
-              $(".Insp_Quote").text(Text + " - " + Auth + "\n")
-          });
+
+    if (Cookies.get('visible') == "false") {
+      $(".Insp_Pic").hide();
+      $(".Insp_Quote").hide();
+      Cookies.set("visible", "false");
+    }
+
+    $("#expand-hidden").click(function () {
+      if (Cookies.get('visible') != "false") {
+        $(".Insp_Pic").hide();
+        $(".Insp_Quote").hide();
+        Cookies.set("visible", "false");
+        $("#expand-hidden").html("Show cute dogs");
+      } else {
+        $(".Insp_Pic").show();
+        $(".Insp_Quote").show();
+        Cookies.set("visible", "true");
+        $("#expand-hidden").html("<i class='fa fa-window-close fa-lg'></i>");
+      }
+
+    });
+
+    fetch("https://dog.ceo/api/breeds/image/random")
+        .then(function(response) {
+            return response.json();
+        })
+        .then(function(data) {
+            console.log(data.message);
+            ImgURL = data.message;
+            $(".Insp_Pic").attr("src",ImgURL);
+        });
+    fetch("https://type.fit/api/quotes")
+        .then(function(response) {
+            return response.json();
+        })
+        .then(function(data) {
+            let quote = data[Math.floor(Math.random() * data.length)];
+            Text = quote.text;
+            Auth = quote.author;
+            $(".Insp_Quote").text(Text + " - " + Auth + "\n");
+            $(".Insp_Quote").css({
+              'width': ($(".Insp_Pic").width() + 'px')
+            });
+        });
   </script>
 </div>
 <div class="container-md">
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
index 506b2064ec7603f83632a324865a3ef220299a48..31a73d4e0814f74726948617133ab7ba2dd7eafa 100644
--- a/app/views/layouts/application.html.erb
+++ b/app/views/layouts/application.html.erb
@@ -3,7 +3,6 @@
   <head>
     <script>
       window.vapidPublicKey = new Uint8Array(<%= @decodedVapidPublicKey %>);
-      console.log(window.vapidPublicKey)
     </script>
     <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1" />
     <title><%=t('app_title') %></title>