diff --git a/hbbs/static/css/styles.css b/hbbs/static/css/styles.css
index e8eaa81..6706335 100644
--- a/hbbs/static/css/styles.css
+++ b/hbbs/static/css/styles.css
@@ -5,29 +5,16 @@
   font-style: normal;
 }
 
-@keyframes gradient {
-  0% {
-    background-color: pink;
-  }
-  25% {
-    background-color: lightgreen;
-  }
-  50% {
-    background-color: lightblue;
-  }
-  100% {
-    background-color: cornsilk;
-  }
+#hbbs-logo {
+  opacity: 0.75;
 }
 
 body {
   font-family: "Compagnon Roman", serif;
-  animation-name: gradient;
-  animation-duration: 120s;
 }
 
 @media (max-width: 768px) {
-  #hbbs-logo-invisible {
+  #hbbs-bubbles-top {
     display: none !important;
   }
 }
@@ -41,7 +28,8 @@ ul li {
 }
 
 #hbbs-logo,
-#hbbs-logo-invisible {
+#hbbs-bubbles-top,
+#hbbs-bubbles-bottom {
   width: 90%;
 }
 
diff --git a/hbbs/static/images/bubbles_bottom.jpg b/hbbs/static/images/bubbles-bottom.jpg
similarity index 100%
rename from hbbs/static/images/bubbles_bottom.jpg
rename to hbbs/static/images/bubbles-bottom.jpg
diff --git a/hbbs/static/images/bubbles_top.jpg b/hbbs/static/images/bubbles-top.jpg
similarity index 100%
rename from hbbs/static/images/bubbles_top.jpg
rename to hbbs/static/images/bubbles-top.jpg
diff --git a/hbbs/static/images/bubbles.jpg b/hbbs/static/images/bubbles.jpg
deleted file mode 100644
index 571693f..0000000
Binary files a/hbbs/static/images/bubbles.jpg and /dev/null differ
diff --git a/hbbs/static/images/logo-invishack.png b/hbbs/static/images/logo-invishack.png
deleted file mode 100644
index 85595df..0000000
Binary files a/hbbs/static/images/logo-invishack.png and /dev/null differ
diff --git a/hbbs/static/images/logo.png b/hbbs/static/images/logo.png
deleted file mode 100644
index de039e6..0000000
Binary files a/hbbs/static/images/logo.png and /dev/null differ
diff --git a/hbbs/static/images/hbbs_logo.svg b/hbbs/static/images/logo.svg
similarity index 100%
rename from hbbs/static/images/hbbs_logo.svg
rename to hbbs/static/images/logo.svg
diff --git a/hbbs/templates/layout.html b/hbbs/templates/layout.html
index efaa3ee..98d1ed4 100644
--- a/hbbs/templates/layout.html
+++ b/hbbs/templates/layout.html
@@ -31,7 +31,7 @@
           <img
             id="hbbs-logo"
             class="img-fluid mx-auto d-block"
-            src="/static/images/logo.png"
+            src="/static/images/logo.svg"
             alt="hbbs logo"
           />
           <ul>
@@ -42,14 +42,23 @@
           </ul>
         </div>
         <div id="content" class="col-md-4">
-          <!-- We're sorry... -->
           <img
-            id="hbbs-logo-invisible"
+            id="hbbs-bubbles-top"
             class="img-fluid mx-auto d-block"
-            src="/static/images/logo-invishack.png"
-            alt="hbbs logo invisible"
+            src="/static/images/bubbles-top.jpg"
+            alt="hbbs bubbles 1"
+          />
+
+          <div id="content-block">
+            {% block content %}{% endblock %}
+          </div>
+
+          <img
+            id="hbbs-bubbles-bottom"
+            class="img-fluid mx-auto d-block"
+            src="/static/images/bubbles-bottom.jpg"
+            alt="hbbs bubbles 2"
           />
-          {% block content %}{% endblock %}
         </div>
       </div>
     </div>