From c8f07912183183be528824dcba7f66d9ec8f956f Mon Sep 17 00:00:00 2001
From: hugo LAMY <hugo.lamy@oskey.io>
Date: Sun, 8 Mar 2026 17:42:32 +0100
Subject: [PATCH] denested manifestations css

---
 www/contact.html                |   2 +-
 www/css/page_manifestations.css | 227 +++++++++++++++++---------------
 2 files changed, 122 insertions(+), 107 deletions(-)

diff --git a/www/contact.html b/www/contact.html
index 8ed1274..710307c 100644
--- a/www/contact.html
+++ b/www/contact.html
@@ -256,7 +256,7 @@
                         <td>Maintenance du site :</td>
                         <td class="link">
                           &nbsp;<a
-                            href="https://hugulumu.fr"
+                            href="https://hugulumu.com"
                             title="Accéder au site de Hugo Lamy"
                             target="_blank"
                             >Hugo Lamy</a
diff --git a/www/css/page_manifestations.css b/www/css/page_manifestations.css
index 87adf3e..7422068 100644
--- a/www/css/page_manifestations.css
+++ b/www/css/page_manifestations.css
@@ -1,130 +1,145 @@
 /* page manifestations */
-
 #middle {
   float: left;
   width: 600px;
   height: auto;
+}
 
-  #top.name_list {
-    float: left;
-    height: 25px;
-    width: 480px;
-    margin-left: 98px;
-    font-family: Arial, sans-serif;
-    font-size: 11px;
-    font-weight: normal;
-    margin-top: 50px;
-    margin-bottom: 25px;
+#middle #top.name_list {
+  float: left;
+  height: 25px;
+  width: 480px;
+  margin-left: 98px;
+  font-family: Arial, sans-serif;
+  font-size: 11px;
+  font-weight: normal;
+  margin-top: 50px;
+  margin-bottom: 25px;
 
-    display: flex;
-    flex-wrap: wrap;
-    height: auto;
-    column-gap: 30px;
+  display: flex;
+  flex-wrap: wrap;
+  height: auto;
+  column-gap: 30px;
+}
 
-    p {
-      position: relative;
-      padding-left: 13px;
+#middle #top.name_list p {
+  position: relative;
+  padding-left: 13px;
+}
 
-      &::before {
-        content: "";
-        position: absolute;
-        left: 0;
-        top: 50%;
-        translate: 0% -50%;
-        width: 7px;
-        height: 7px;
-        border-radius: 10%;
-        border: 1px solid #cc3300;
-      }
-    }
-  }
+#middle #top.name_list p::before {
+  content: "";
+  position: absolute;
+  left: 0;
+  top: 50%;
+  translate: 0% -50%;
+  width: 7px;
+  height: 7px;
+  border-radius: 10%;
+  border: 1px solid #cc3300;
+}
 
-  #manifestations {
-    position: relative;
-    left: 100px;
-    top: 0px;
-    float: left;
-    width: 580px;
-    height: 600px;
+#middle #manifestations {
+  position: relative;
+  left: 100px;
+  top: 0px;
+  float: left;
+  width: 580px;
+  height: 600px;
+}
 
-    #Container {
-      position: absolute;
-      top: 0px;
-      left: 0px;
-      width: 510px;
-      height: 530px;
-      background-color: #ffffff;
-      overflow-y: scroll;
-      overflow-x: hidden;
-      padding-right: 20px;
+#middle #manifestations #Container {
+  position: absolute;
+  top: 0px;
+  left: 0px;
+  width: 510px;
+  height: 530px;
+  background-color: #ffffff;
+  overflow-y: scroll;
+  overflow-x: hidden;
+  padding-right: 20px;
+}
 
-      #News {
-        position: absolute;
-        top: 0px;
-        /* overflow: hidden; */
-        width: 480px;
-        height: 530px;
-        display: block;
+#middle #manifestations #Container #News {
+  position: absolute;
+  top: 0px;
+  /* overflow: hidden; */
+  width: 480px;
+  height: 530px;
+  display: block;
+}
 
-        .Scroller-Container {
-          position: absolute;
-          top: 0px;
-          left: 0px;
+#middle #manifestations #Container #News .Scroller-Container {
+  position: absolute;
+  top: 0px;
+  left: 0px;
+}
 
-          .video {
-            width: 480px;
-            height: 400px;
-            margin-top: 3px;
+#middle #manifestations #Container #News .Scroller-Container .video {
+  width: 480px;
+  height: 400px;
+  margin-top: 3px;
+}
 
-            &.manifestation_poster {
-              position: relative;
-              background: black;
-              height: auto;
+#middle
+  #manifestations
+  #Container
+  #News
+  .Scroller-Container
+  .video.manifestation_poster {
+  position: relative;
+  background: black;
+  height: auto;
+}
 
-              video {
-                max-height: 100%;
-                max-width: 100%;
-                object-fit: contain;
-                object-position: top;
-              }
-            }
-          }
+#middle
+  #manifestations
+  #Container
+  #News
+  .Scroller-Container
+  .video.manifestation_poster
+  video {
+  max-height: 100%;
+  max-width: 100%;
+  object-fit: contain;
+  object-position: top;
+}
 
-          .images {
-            width: 480px;
-            height: 80px;
-            margin-top: 10px;
+#middle #manifestations #Container #News .Scroller-Container .images {
+  width: 480px;
+  height: 80px;
+  margin-top: 10px;
+}
 
-            &.manifestation_flex {
-              display: flex;
-              justify-content: space-between;
-            }
-          }
+#middle
+  #manifestations
+  #Container
+  #News
+  .Scroller-Container
+  .images.manifestation_flex {
+  display: flex;
+  justify-content: space-between;
+}
 
-          .title {
-            width: 480px;
-            height: 20px;
-            font-family: Arial, sans-serif;
-            font-size: 19px;
-            color: #cc3300;
-            font-weight: bold;
-          }
+#middle #manifestations #Container #News .Scroller-Container .title {
+  width: 480px;
+  height: 20px;
+  font-family: Arial, sans-serif;
+  font-size: 19px;
+  color: #cc3300;
+  font-weight: bold;
+}
 
-          .texte_manif {
-            width: 480px;
-            height: auto;
-            margin-bottom: 35px;
+#middle #manifestations #Container #News .Scroller-Container .texte_manif {
+  width: 480px;
+  height: auto;
+  margin-bottom: 35px;
+}
 
-            p {
-              text-align: justify;
-              font-size: 11px;
-              font-weight: normal;
-            }
-          }
-        }
-      }
-    }
-  }
+#middle #manifestations #Container #News .Scroller-Container .texte_manif p {
+  text-align: justify;
+  font-size: 11px;
+  font-weight: normal;
 }
 
 .images_grand {