avec des images

contact.html

@@ -18,7 +18,7 @@
             <li><a href="index.html"> Accueil </a></li>
             <li><a href="presentation.html"> Présentation </a></li>
             <li><a href="prochains_evenements.html"> Prochains évènements </a></li>
-            <li><a href="historique.html"> Historique </a></li>
+            <li><a href="troupe.html"> Troupe </a></li>
             <li><a href="contact.html"> Contact </a></li>
 
         </ul>
@@ -26,12 +26,10 @@
     </header>
     <div class="corps">
         <div class="centrer">
-            <p> Vous pouvez contacter le collectif Karäfon à l'adresse mail ___ ou bien au numéro de téléphone ___ </p>
+            <p> Vous pouvez contacter le collectif Karäfon au numéro de téléphone 07 67 27 83 14. </p>
-                <a href="https://www.facebook.com/CollectifKarafon"><img src="images/facebook.png" alt="logo facebook" width=5%/></a>
+                <a href="https://www.facebook.com/CollectifKarafon"><img src="images/facebook.png" alt="logo facebook" width=8%/></a>
-            </p>
+                <a href="https://www.facebook.com/CollectifKarafon"><img src="images/instagram.png" alt="logo instagram" width=8%/></a>
-            <p>
+
-                <a href="https://www.facebook.com/CollectifKarafon"><img src="images/instagram.png" alt="logo instagram" width=5%/></a>
-            </p>
         </div>
     </div>
 

index.html

@@ -18,7 +18,7 @@
             <li><a href="index.html"> Accueil </a></li>
             <li><a href="presentation.html"> Présentation </a></li>
             <li><a href="prochains_evenements.html"> Prochains évènements </a></li>
-            <li><a href="historique.html"> Historique </a></li>
+            <li><a href="troupe.html"> Troupe </a></li>
             <li><a href="contact.html"> Contact </a></li>
 
         </ul>
@@ -27,18 +27,13 @@
 
     <div class="corps">
         <div class="centrer">
-            <h1>   Le Collectif Karäfon pose ses valises et implante son chapiteau pour la
+            <h1> Le Collectif Karäfon pose ses valises et implante son chapiteau pour la
                 seconde fois à Beauvoir en Royans du 3 au 7 juillet !
-                Un festival convivial, familial et festif proposé par la troupe Karäfon
+                Un festival convivial, familial et festif proposé par la troupe Karäfon !</h1>
-                !</h1>
+            <img src="images/equipe.jpeg" alt="photo du festival" class="images"/>
-            <img src="images/equipe.jpeg" alt="photo du festival" height="200"/>
+            <img src="images/spectacle.jpeg" alt="photo d'un spectacle" class="images"/>
-            <img src="images/spectacle.jpeg" alt="photo du festival" height="200"/>
+            <img src="images/affiche_prochaine_edition.jpg" alt="affiche de la prochaine édition" class="images"/>
-            <div id="texte-intro">
+
-                <p>Art, cuisine, associations, action territoriale… Le Karäfon est un projet fondamentalement ouvert et curieux qui mélange les influences dans un objectif clair : démocratiser par tous les moyens l'accès à la culture.
-                    Travaillant en chapiteau, le Karäfon a aujourd'hui à son actif trois éditions très réussies de son festival itinérant : plusieurs mois de tournée à travers la France avec un spectacle pluridisciplinaire, un restaurant semi-gastronomique sous chapiteau à base de produits locaux, des ateliers, une inclusion systématique des écoles, des associations et des habitant-e-s.
-                    Quel qu'en soit le contexte, la recette de notre travail est simple : s'ouvrir aux influences, proposer des formes artistiques exigeantes (mais accessibles à tous les publics tant au niveau du prix que de la forme), agir là où notre présence est nécessaire, se questionner en permanence. 
-                    Ce cocktail explosif a créé au fil des années une troupe joyeuse, exigeante et compétente que nous sommes ravi-e-s de faire voyager pour le plus grand plaisir des cœurs et des yeux.</p>
-            </div>
 
         </div>
     </div>

karafon_style.css

@@ -38,8 +38,12 @@ li a {
 
 h1{
     color:rgb(223, 56, 27);
-    margin-left: 22%;
+    margin-left: 10%;
-    margin-right: 22%;
+    margin-right: 10%;
+}
+
+p{
+    color:rgb(29, 92, 117);
 }
 
 .centrer{
@@ -51,13 +55,10 @@ h1{
 }
 
 .corps{
-    margin-top: 8%;
+    margin-top: 6%;
-}
+    margin-left: 22%;
-
+    margin-right: 22%;
-#texte-intro{
     text-align: center;
-    margin-left: 20%;
-    margin-right: 20%;
 }
 
 #citi{
@@ -78,4 +79,42 @@ h1{
 
 #festival_itinerant{
     color:rgb(248,248,218);
-}
+}
+
+#equipe{
+    position:absolute;
+    right:7%;
+    top:30%; 
+    max-height:40%;
+}
+
+#montage{
+    max-width:30%;
+    float:right;
+}
+
+#tentes{
+    max-width:30%;
+    float:left;
+}
+
+#equipe_accueil{
+    max-width:30%;
+    float:left;
+}
+
+#spectacle{
+    max-width:30%;
+    float:left;
+}
+
+#intro-prochain{
+    margin-top: 8%;
+    margin-left: 4%;
+    margin-right: 40%;
+    margin-bottom: -10%;
+}
+
+.images{
+    max-width:28%;
+}

presentation.html

@@ -18,12 +18,35 @@
             <li><a href="index.html"> Accueil </a></li>
             <li><a href="presentation.html"> Présentation </a></li>
             <li><a href="prochains_evenements.html"> Prochains évènements </a></li>
-            <li><a href="historique.html"> Historique </a></li>
+            <li><a href="troupe.html"> Troupe </a></li>
             <li><a href="contact.html"> Contact </a></li>
 
         </ul>
         </div>
     </header>
+    <p class="corps">
+   Art, cuisine, associations et action territoriale. Le Karäfon est un
+   projet fondamentalement ouvert et curieux qui mélange les influences
+   dans un objectif clair : démocratiser par tous les moyens l'accès à la
+   culture. <br> <br> Travaillant sous chapiteau, le Karäfon a aujourd'hui à son
+   actif plusieurs éditions très réussies de son festival itinérant : plusieurs mois de
+   tournée à travers la France, une restauration éthique et gourmande à
+   base de produits locaux, des ateliers, des spectacles vivants, des
+   concerts, des projections et une inclusion systématique des écoles, des
+   associations et des habitant-e-s. <br> <br>
 
+   Quel qu'en soit le contexte, la recette de notre travail est simple :
+   s'ouvrir aux influences, proposer des formes artistiques exigeantes
+   mais accessibles à tous les publics (tant au niveau du prix que de la
+   forme), agir là où notre présence est nécessaire et se questionner en
+   permanence. <br> <br>
+   Ce cocktail explosif a créé au fil des années une troupe joyeuse,
+   exigeante et compétente que nous sommes ravi-e-s de faire voyager pour
+   le plus grand plaisir des coeurs et des yeux.
+    </p>
+    <div class="centrer">
+        <img src="images/montage_chapiteau.jpeg" alt="photo du montage du chapiteau" class="images"/>
+        <img src="images/chapiteau_tentes.jpeg" alt="photo du chapiteau et des tentes" class="images"/>
+    </div>
 </body>
 </html>

prochains_evenements.html

@@ -18,11 +18,19 @@
             <li><a href="index.html"> Accueil </a></li>
             <li><a href="presentation.html"> Présentation </a></li>
             <li><a href="prochains_evenements.html"> Prochains évènements </a></li>
-            <li><a href="historique.html"> Historique </a></li>
+            <li><a href="troupe.html"> Troupe </a></li>
             <li><a href="contact.html"> Contact </a></li>
 
         </ul>
         </div>
     </header>
+    <p id="intro-prochain">Le Collectif Karäfon pose ses valises et implante son chapiteau pour la
+        seconde fois à Beauvoir en Royans du 3 au 7 juillet !
+        Un festival convivial, familial et festif proposé par la troupe Karäfon !</p>
+    <div class="centrer">
+    <img src="images/programme1.jpeg" id="affiche" class="images"/>
+    <img src="images/programme2.jpeg" id="affiche" class="images"/>
+    <img src="images/affiche_prochaine_edition.jpg" class="images"/>
+    </div>
 </body>
 </html>

troupe.html

@@ -2,7 +2,7 @@
 <html>
 <head>
     <meta charset="utf-8" />
-    <title> Karäfon historique</title>  
+    <title> Karäfon troupe</title>  
     <link rel="stylesheet" href="karafon_style.css" /> 
 	<link rel="shortcut icon" type="image/x-icon" href="images/logo.jpeg" />
 </head>
@@ -18,13 +18,24 @@
             <li><a href="index.html"> Accueil </a></li>
             <li><a href="presentation.html"> Présentation </a></li>
             <li><a href="prochains_evenements.html"> Prochains évènements </a></li>
-            <li><a href="historique.html"> Historique </a></li>
+            <li><a href="troupe.html"> Troupe </a></li>
             <li><a href="contact.html"> Contact </a></li>
 
         </ul>
         </div>
     </header>
-<p>Voici l'historique</p>
+
+<p class="corps">   Le Karäfon est le fruit d’une rencontre ; celle de jeunes gens
+    passionnés par l'art et l'itinérance. Mais ils ne seraient rien sans
+    les nombreuses personnes rencontrées en chemin et qui ont permis
+    l'existence de cette formidable aventure ! <br> <br>
+ 
+    Aujourd'hui, le festival itinérant fait voyager une troupe aux profils
+    variés : régisseurs.euses, musicien.ne.s, artistes, cuisinier.e.s,
+    administrateurs.trices., travailleur.euses sociales... Certain.es sont
+    permanents, d'autres occasionnels, mais tous brûlent de la même
+    passion.</p>
+    <img src="images/equipe.jpeg" alt="photo du festival" id="equipe"/>
 
 </body>
 </html>