des changements pour la version mobile avec un seul markdown

assets/main.css

@@ -1,72 +1,68 @@
-.background{
-  background-color:#F5F5F5;}
-.content-wrapper {
-  display: flex;
-  gap: 20px;
-  align-items: flex-start;  
+.right, 
+ .left
+ {
+  width: 50%;
 }
-.content-wrapper h1 {
+.left 
+  {
+  float: left;
+  box-sizing: border-box;
+  padding-right: 1rem;
+  clear: both;
+}
+.right 
+{
+  float: right;
+  clear: right;
+  margin-bottom: 1rem;
+}
+.center
+ {   clear: both; /* Clears the floating of the above columns */
+  width: 100%; /* Ensures it spans the full width */
+  text-align: center; /* Centers the content inside the div */
+  margin-top: 1rem; /* Optional: Adds some space above the center div */
+}
+@media print, screen and (max-width: 580px) {
+.left,.right {
+  width: 100%;
+  float: none;
+  clear: none;
+  }
+}
+
+h2 a {
+  font-size: 0.8em; 
+  color: #474405;
+  text-decoration: none; /* Retire le lien visuel */
+  pointer-events: none;  /* Désactive l'interaction du lien */
+}
+
+
+h4 a {
+  color: #8B5E3C;
+  text-decoration: none; /* Retire le lien visuel */
+  pointer-events: none;  /* Désactive l'interaction du lien */
+}
+
+h1 {
   text-align: center;
   color: #6A994E;
   font-size: 2.5em;
   margin: 20px 0;
   text-transform: uppercase;}
-.content-wrapper h2 {
-  font-size: 1em;  
-      }
-.content-wrapper h2 a {
-  text-decoration: none; /* Supprime le soulignement */
-  cursor: default; 
-                } 
-.content-wrapper h2 span {
-  color: #474405;
-            }   
-.content-wrapper h4 {
-  text-align: center; /* Centre horizontalement le texte dans <h4> */
-    }
-.content-wrapper h4 a {
-  text-decoration: none; /* Supprime le soulignement */
-  color: #8B5E3C; 
-  cursor: default;
-     
-  }
-
-.content-wrapper h5 {
-  color: #8B5E3C; /* Vert pour souligner les sous-sections */
-  font-size: 1em;
-  margin-top: 20px;
-  margin: 10px 10px;
-}
-.content-wrapper p{
+p{
   font-weight: normal;
   margin: 10px 10px ;
   text-align: justify;
   font-size: 0.98em;
   color:#8B5E3C;
 }
-/* assets/main.css */
-
 video {
-border: 2px solid #474405;
-border-radius: 8px;
-max-width: 100%;  /* Responsive width */
-display: block;   /* Center the video */
-margin: 20px auto;
-}
-/* assets/main.css */
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+  border: 2px solid #474405;
+  border-radius: 8px;
+  max-width: 100%;  /* Responsive width */
+  display: block;   /* Center the video */
+  margin: 20px auto;
+  }
+.background{
+  background-color:#F5F5F5;}