From 8bbb48cf32ed776013d9fd90912c4625bb4e1350 Mon Sep 17 00:00:00 2001
From: Reto Bollinger <bolliret@MBP-von-Reto-2.localdomain>
Date: Tue, 26 Nov 2024 21:16:37 +0100
Subject: [PATCH] CSS adjusted for second lowest level of termine table

---
 .../project/assets/static/style.css           | 102 +++++++++++++++++-
 1 file changed, 100 insertions(+), 2 deletions(-)

diff --git a/lektor/lektordata/project/assets/static/style.css b/lektor/lektordata/project/assets/static/style.css
index 0b8cd5a..d28a6f3 100644
--- a/lektor/lektordata/project/assets/static/style.css
+++ b/lektor/lektordata/project/assets/static/style.css
@@ -266,13 +266,13 @@ div.left_footer, div.middle_footer, div.right_footer {
 
 
 .termine ul > li {
-  font-family: "Roboto-Light","Arial",sans-serif;;
+  font-family: "Roboto-Light","Arial",sans-serif;
   width: 1000px;
   max-width: 1140px;
 }
 
 .termine .inner_page > ul > li{
-  padding: 10px 10px 10px 10px;
+  padding: 10px;
 }
 
 .termine ul > li > div {
@@ -315,7 +315,105 @@ div.left_footer, div.middle_footer, div.right_footer {
     width: auto;
 } 
 
+@media (min-width: 1025px) and (max-width: 1100px) {
 
+    .termine ul {
+        padding: 0 0 calc(50vw * 0.091) calc(50vw * 0.091);
+        width: calc(1100vw * 0.091);
+    }
+
+    .termine ul > li {
+        width: calc(1000vw * 0.091);
+        max-width: calc(1140vw * 0.091);
+    }
+
+    .termine .inner_page > ul > li{
+        padding: calc(10vw * 0.091);
+    }
+
+    .termine ul > li > div {
+        width: calc(470vw * 0.091);
+        font-size: calc(20vw * 0.091);
+    }
+
+    .termine ul > li > ul > li {
+        width: calc(155vw * 0.091);
+    }
+
+    .termine ul > li > ul > li:nth-child(1){
+        width: calc(240vw * 0.091);
+    }
+
+    .termine ul > li > ul > li:nth-child(2){
+        width: calc(55vw * 0.091);
+    }
+
+    .termine ul > li > ul > li > div{
+        font-size: calc(20vw * 0.091);
+    } 
+
+}
+
+
+@media (min-width:769px) and (max-width:1024px) {
+
+    .termine ul {
+        display: table;
+        border-collapse: collapse;
+        padding: 0 0 calc(50vw * 0.091) calc(50vw * 0.091);
+        margin: 0 0 calc(50vw * 0.091) calc(50vw * 0.091);
+        width: calc(1000vw * 0.091);
+    }
+
+    .termine ul > li{
+        display: table-row;
+        margin: 0;
+    }
+
+
+    .termine ul > li > div{
+        width: calc(900vw * 0.091);
+        max-width: calc(900vw * 0.091);
+        text-align: left;
+        padding: calc(15vw * 0.091) calc(10vw * 0.091);
+        margin: 0;
+        display: inline-block;
+        white-space: nowrap;
+        font-family: "Roboto-Regular","Arial",sans-serif;
+    }
+
+    .termine ul > li > ul {
+        display: table-row;
+    }
+
+    .termine ul > li > ul > div{
+        font-weight: normal;
+        padding: 0;
+        margin: 0;
+        text-align: left;
+    }
+
+    .termine ul > li > ul > li {
+        display: table-cell;
+    }
+
+    .termine ul > li > ul > li > div {
+        font-family: "Roboto-Light","Arial",sans-serif;
+        padding: 0 0 calc(10vw * 0.091) calc(10vw * 0.091);
+    }
+
+    .termine ul > li > ul > li:nth-child(1) { width: calc(350vw * 0.091); }
+    .termine ul > li > ul > li:nth-child(2) { width: calc(100vw * 0.091); }
+    .termine ul > li > ul > li:nth-child(3) { width: calc(450vw * 0.091); }
+
+    .termine ul > li > ul > li:nth-child(1) > div{ width: calc(340vw * 0.091); }
+    .termine ul > li > ul > li:nth-child(2) > div{ width: calc(90vw * 0.091); }
+    .termine ul > li > ul > li:nth-child(3) > div{ width: calc(440vw * 0.091); }
+
+    .termine ul > li > div, .termine ul > li > ul > li > div {
+        font-size: 2.5vw;
+    }
+}
 
 
 @media (min-width: 769px) and (max-width: 1100px) {