small navigation improvements

4 files changed, 26 insertions, 3 deletions

diff --git a/static/logo-bg.png b/static/logo-bg.png
index 4762622..62f26e6 100644
--- a/static/logo-bg.png
+++ b/static/logo-bg.png
diff --git a/static/logo-bg2.png b/static/logo-bg2.png
new file mode 100644
index 0000000..81255be
--- /dev/null
+++ b/static/logo-bg2.png
diff --git a/static/og:image.png b/static/og:image.png
new file mode 100644
index 0000000..0f39cec
--- /dev/null
+++ b/static/og:image.png
diff --git a/static/style.css b/static/style.css
index 00d4bf2..869b0bc 100644
--- a/static/style.css
+++ b/static/style.css
@@ -142,7 +142,6 @@ nav a.active {
 
 .container {
   display: flex;
-  flex-wrap: wrap;
   gap: 2rem;
 }
 
@@ -174,7 +173,7 @@ nav a.active {
   margin-bottom: -0.25rem;
 }
 
-.logo::before {
+.logo-bg::before {
   animation: infinite linear logo-rotation 120s;
   background-image: url("/static/logo-bg.png");
   background-repeat: no-repeat;
@@ -188,6 +187,21 @@ nav a.active {
   height: 215px;
 }
 
+.logo-bg2::before {
+  /* animation: linear both logo-rotation 20s; */
+  background-image: url("/static/logo-bg2.png");
+  background-repeat: no-repeat;
+  background-position: center;
+  background-size: cover;
+  position: absolute;
+  content: "";
+  left: calc(50% - 108px);
+  top: -30px;
+  z-index: -1;
+  width: 215px;
+  height: 155px;
+}
+
 .logo-glasses {
   position: absolute;
   top: 10px;
@@ -374,6 +388,11 @@ h2[id=content] {
   margin-top: -1.5rem;
 }
 
+.product-page-layout #content {
+  position: absolute;
+  top: -1.5rem;
+}
+
 .product-page-layout {
   display: flex;
   gap: 0 2rem;
@@ -638,7 +657,7 @@ select {
   margin-right: 0.5rem !important;
 }
 
-@media screen and (max-width: 50rem) {
+@media screen and (max-width: 70rem) {
   body {
     margin: 2rem;
   }
@@ -647,6 +666,10 @@ select {
     max-width: 100%;
   }
 
+  .container {
+    flex-wrap: wrap;
+  }
+
   .content h2 {
     font-size: 2.5rem;
   }