1 files changed, 28 insertions, 16 deletions

diff --git a/static/input.css b/static/input.css
index 2a3b96f..c308796 100644
--- a/static/input.css
+++ b/static/input.css
@@ -1,9 +1,8 @@
-@import url('https://fonts.googleapis.com/css2?family=Andika:ital,wght@0,400;0,700;1,400;1,700&display=swap');
-
 @import "tailwindcss";
 
 @theme {
-    --font-andika: "Andika", sans-serif;
+    --font-spectral: Spectral, serif;
+    --font-patua: "Patua One", cursive;
     --breakpoint-xs: 32rem;
 }
 
@@ -243,6 +242,15 @@ a:hover, .linklike:hover {
     background-size: calc(var(--squares-and-triangles-background-width-coef) * 1rem) calc(var(--squares-and-triangles-background-height-coef) * 1rem);
 }
 
+.logo-custom {
+    width: 3.5rem;
+    height: 20rem;
+    font-size: 2.5rem;
+    -webkit-text-stroke: 0.1rem var(--sidebar-stroke-color);
+    writing-mode: sideways-lr;
+    text-orientation: mixed;
+}
+
 .inset-shadow {
     box-shadow: inset 0dvh 1dvh 1dvh -1dvh rgba(75, 81, 58, 0.5),
         inset 1dvh 0dvh 1dvh -1dvh rgba(75, 81, 58, 0.5),
@@ -391,7 +399,7 @@ a:hover, .linklike:hover {
 .grid-item, .grid-sizer {
     position: relative;
     display: inline-block;
-    width: 10rem;
+    width: 50%;
 }
 
 .grid-item-index {
@@ -414,36 +422,36 @@ a:hover, .linklike:hover {
 }
 
 .grid-item-2x {
-    width: 20rem;
+    width: 100%;
 }
 
-@container main (width >= 40rem) {
+@container main (width >= 32rem) {
     .grid-item, .grid-sizer {
-        width: 12rem;
+        width: 33%;
     }
 
     .grid-item-2x {
-        width: 24rem;
+        width: 66%;
     }
 }
 
-@container main (width >= 76rem) {
+@container main (width >= 56rem) {
     .grid-item, .grid-sizer {
-        width: 18rem;
+        width: 25%;
     }
 
     .grid-item-2x {
-        width: 36rem;
+        width: 50%;
     }
 }
 
-@container main (width >= 128rem) {
+@container main (width >= 96rem) {
     .grid-item, .grid-sizer {
-        width: 24rem;
+        width: 20%;
     }
 
     .grid-item-2x {
-        width: 48rem;
+        width: 40%;
     }
 }
 
@@ -458,7 +466,7 @@ a:hover, .linklike:hover {
 }
 
 .glightbox-clean .gslide-title {
-    font-family: var(--font-andika) !important;
+    font-family: var(--font-spectral) !important;
     font-weight: 600 !important;
     color: var(--main-light-color) !important;
     padding-bottom: 1rem !important;
@@ -467,7 +475,7 @@ a:hover, .linklike:hover {
 
 .glightbox-clean .gslide-desc {
     font-size: 1rem !important;
-    font-family: var(--font-andika) !important;
+    font-family: var(--font-spectral) !important;
     font-weight: 400;
     color: var(--main-medium-color) !important;
 }
@@ -532,6 +540,10 @@ body[data-theme~="ram"] .leaflet-tile {
 }
 
 @media (max-aspect-ratio: 0.8/1) {
+    .bg-sidebar {
+        background-size: calc(var(--squares-and-triangles-background-width-coef) * 1.6dvh) calc(var(--squares-and-triangles-background-height-coef) * 1.6dvh);
+    }
+
     .ar-lt-0\.8\:bg-background-light {
         background-color: var(--background-light-color);
     }