diff --git a/.DS_Store b/.DS_Store
new file mode 100644
index 0000000000000000000000000000000000000000..c5390d74ced7a32426713ddc923567bdedae38d6
Binary files /dev/null and b/.DS_Store differ
diff --git a/Bobo.html b/Bobo.html
new file mode 100644
index 0000000000000000000000000000000000000000..44bf1f07084d90d7d84e6e4ae6d6aad9b72d2975
--- /dev/null
+++ b/Bobo.html
@@ -0,0 +1,96 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Le centre de Bobo - Africa Unite</title>
+ <link rel="stylesheet" href="styles.css">
+</head>
+<body>
+ <div class="core">
+ <!--Logo Africa Unite-->
+ <a href="index.html"><img src="images/logo_africaunite_transparent.png" alt="Logo Africa Unite" width="5%"></a>
+ <!--Barre de navigation-->
+ <nav id="navbar">
+ <ul>
+ <li class="deroulant"><a href="#">Qui sommes nous?</a>
+ <ul class="sous">
+ <li><a href="equipes.html">Nos différentes équipes</a></li>
+ <li><a href="histoire.html">L'histoire de l'association</a></li>
+ </ul>
+ </li>
+ <li class="deroulant"><a href="#">Nos projets</a>
+ <ul class="sous">
+ <li><a href="Bobo.html">Le centre de Bobo</a></li>
+ <li><a href="nvprojet.html">Le nouveau projet</a></li>
+ </ul>
+ <li><a href="actions.html">Nos actions</a></li>
+ <li><a href="contact.html">Nous contacter</a></li>
+ </ul>
+ </nav>
+ <!--Bouton d'apparition/disparition barre de navigation-->
+ <img src="icons/menu_icon.png" id="menu_icon" alt="Menu Icon" width="25px" style="position: absolute; right:1%; top:20px">
+
+ <!--Coeur de la page: Historique du centre à Bobo-->
+ <div class="row">
+ <h2>Le centre de Bobo</h2>
+ <div class="column2">
+ <p>A l’été 2014, nous avons acheté notre propre
+ terrain, dans un quartier en construction, en
+ périphérie de Bobo-Dioulasso. En 2015, nous
+ avons signé notre premier devis pour construire
+ les murs de l’enceinte, une maison de gardien,
+ ainsi qu’une buvette, pour permettre au centre
+ de devenir indépendant financièrement.</p>
+ <p>En 2016, nous avons mis en place un forage
+ puisant de l’eau potable.</p>
+ <p>En 2017, nous avons débuté pour le centre la construction d’un château d’eau dans le centre.
+ Nous avons aidé à installer un polytank équipé d’une pompe électrique fonctionnant à énergie
+ solaire pour remplacer l’ancienne pompe manuelle.</p>
+ </div>
+ <div class="column2">
+ <img src="images/logo_africaunite_transparent.png" alt="Logo Africa Unite" width="250px">
+ </div>
+ </div>
+ <div class="row">
+ <div class="column2">
+ </div>
+ <div class="column2">
+
+ </div>
+ </div>
+ <div class="row">
+ <div class="column2">
+ <p>
+ </p>
+ </div>
+ <div class="column2">
+
+ </div>
+ </div>
+ </div>
+
+ <!--Footer-->
+ <div class="footer">
+ <div class="row">
+ <div class="column3">
+ <img src="images/logo_africaunite_transparent.png" alt="logo" width="100px">
+ </div>
+ <div class="column3">
+ <h3>Nous retrouver sur les réseaux</h3>
+ <p>Instagram</p>
+ <p>Facebook</p>
+ </div>
+ <div class="column3">
+ <h3>Nous contacter</h3>
+ <p>3 rue Joliot Curie <br>
+ 91190 GIF-SUR-YVETTE
+ </p>
+ <p>africa-unite@larez.fr</p>
+ </div>
+ </div>
+ </div>
+</body>
+<script src="main.js"></script>
+</html>
\ No newline at end of file
diff --git a/actions.html b/actions.html
new file mode 100644
index 0000000000000000000000000000000000000000..3e4f80319c113f834d27083e737eab0a8d2e9b37
--- /dev/null
+++ b/actions.html
@@ -0,0 +1,227 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+ <meta charset="UTF-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Nos actions - Africa Unite</title>
+ <link rel="stylesheet" href="styles.css">
+</head>
+
+<body>
+ <div class="core">
+ <!--Logo Africa Unite-->
+ <a href="index.html"><img src="images/logo_africaunite_transparent.png" alt="Logo Africa Unite" width="5%"></a>
+ <!--Barre de navigation-->
+ <nav id="navbar">
+ <ul>
+ <li class="deroulant"><a href="#">Qui sommes nous?</a>
+ <ul class="sous">
+ <li><a href="equipes.html">Nos différentes équipes</a></li>
+ <li><a href="histoire.html">L'histoire de l'association</a></li>
+ </ul>
+ </li>
+ <li class="deroulant"><a href="#">Nos projets</a>
+ <ul class="sous">
+ <li><a href="Bobo.html">Le centre de Bobo</a></li>
+ <li><a href="nvprojet.html">Le nouveau projet</a></li>
+ </ul>
+ <li><a href="actions.html">Nos actions</a></li>
+ <li><a href="contact.html">Nous contacter</a></li>
+ </ul>
+ </nav>
+ <!--Bouton d'apparition/disparition barre de navigation-->
+ <img src="icons/menu_icon.png" id="menu_icon" alt="Menu Icon" width="25px"
+ style="position: absolute; right:1%; top:20px">
+
+ <!--Corps de la page-->
+ <h2>Nos actions</h2>
+ <h4>Nos actions sur le campus</h4>
+ <!--Caroussel des actions-->
+ <div class="actions">
+ <div class="scroller">
+ <div class="item">
+ <div class="card">
+ <div class="imag">
+ <img src="images/africaday1.jpg" alt="Africa Day">
+ </div>
+ <h3>Journée de l'Afrique</h3>
+ <p>
+ Autour du mercredi 25 mai (jour officiel de la Journée de l’Afrique),
+ nous organisons une journée entièrement dédiée à célébrer la culture
+ africaine : déjeuner de plats traditionnels, ventes d’objets africains,
+ de nombreuses activités et une conférence nous permettent d’échanger
+ avec tout le campus et de les sensibiliser à notre projet…
+ Tout cela grâce à l’aide précieuse de l’association CS Afrique de notre école !
+ </p>
+ <button type="button">En savoir plus!</button>
+ </div>
+ </div>
+ <div class="item">
+ <div class="card">
+ <div class="imag">
+ <img src="images/logo_africaunite_fondvert.png" alt="Africa ">
+ </div>
+ <h3>Ventes de pâtisseries orientales</h3>
+ <p>
+ A l’occasion de certains événements, nous vendons de délicieuses pâtisseries orientales de
+ toutes sortes sur le campus de l'école, en partenariat avec la Rose de Tunis. Que ce soit au
+ moment des fêtes ou pour la journée de l’Afrique, nous avons à cœur de régaler les étudiants
+ avec ces pâtisseries dont tout le monde raffole !
+ </p>
+ <button type="button">En savoir plus!</button>
+ </div>
+ </div>
+ <div class="item">
+ <div class="card">
+ <div class="imag">
+ <img src="images/logo_africaunite_fondvert.png" alt="Africa ">
+ </div>
+ <h3>Galettes des rois</h3>
+ <p>
+ En partenariat avec l’association de cuisine, le Paps, nous avons préparé des galettes des
+ rois
+ pour les vendre sur le campus. La seule et unique galette frangipane, à partager, pour se
+ régaler le jour de l’Épiphanie !
+ </p>
+ <button type="button">En savoir plus!</button>
+ </div>
+ </div>
+ <div class="item">
+ <div class="card">
+ <div class="imag">
+ <img src="images/logo_africaunite_fondvert.png" alt="Africa">
+ </div>
+ <h3>Semaine Huma</h3>
+ <p>
+ Organisée en mars par l’ensemble des sections de HumaCS, la Semaine Huma est l’occasion de
+ faire connaître l’association sur le campus et de proposer des activités pour régaler en
+ retour les élèves de l’école.
+ Avec l’aide de la majorité des associations
+ étudiantes de l’école, la Semaine Huma propose des repas « barspé » , des ateliers de
+ cuisine, une conférence orientée Solidarité (la conférence de 2022 a par exemple accueilli
+ Jon Cerezo, le Responsable Campagne humanitaire et migrations à Oxfam), une Tombola, des
+ escape games, un tournoi de beach-volley, une soirée « Jeux télévisés », des initiations et
+ activités proposées par les différentes associations et bien sûr l’évènement phare de la
+ semaine, l’Humaviron. Pendant 24 heures, les associations de l’école s’affrontent sur des
+ rameurs à celle qui couvrira la plus grande distance. Une subvention est gagnée pour Huma CS
+ si la barre des 7 000 km
+ est franchie (et c’est toujours le cas grâce à la motivation de tous !). La Semaine Huma,
+ c’est surtout un moment privilégié qui rapproche les étudiants des causes portées par les
+ projets de solidarité des sections dans une atmosphère joyeuse et très dynamique. Un
+ incontournable de l’année !!
+ </p>
+ <button type="button">En savoir plus!</button>
+ </div>
+ </div>
+ </div>
+ </div>
+ <h4>Nos actions hors du campus</h4>
+ <div class="actions">
+ <div class="scroller">
+ <div class="item">
+ <div class="card">
+ <div class="imag">
+ <img src="images/africaday1.jpg" alt="Africa Day">
+ </div>
+ <h3>Courses de solidarité et bol de riz</h3>
+ <p>
+ Nous intervenons également dans des écoles (primaire et collège) où nous présentons notre
+ projet aux élèves. Ainsi, les écoles nous aident à récolter des fonds que ce soit par des
+ courses de solidarité ou par l'opération bol de riz, sur volontariat des élèves. Les courses
+ de solidarité consiste à un système de parrainage des élèves où les sponsors de chaque élève
+ promettent de donner une certaine somme pour chaque kilomètre parcouru durant la course que
+ nous organisons. L'opération bol de riz remplace pendant un repas le menu d'origine de
+ l'école et la marge récupérée est reversée à notre association.
+ </p>
+ <button type="button">En savoir plus!</button>
+ </div>
+ </div>
+ <div class="item">
+ <div class="card">
+ <div class="imag">
+ <img src="images/africaday1.jpg" alt="Africa Day">
+ </div>
+ <h3>Courses de solidarité et bol de riz</h3>
+ <p>
+ Nous intervenons également dans des écoles (primaire et collège) où nous présentons notre
+ projet aux élèves. Ainsi, les écoles nous aident à récolter des fonds que ce soit par des
+ courses de solidarité ou par l'opération bol de riz, sur volontariat des élèves. Les courses
+ de solidarité consiste à un système de parrainage des élèves où les sponsors de chaque élève
+ promettent de donner une certaine somme pour chaque kilomètre parcouru durant la course que
+ nous organisons. L'opération bol de riz remplace pendant un repas le menu d'origine de
+ l'école et la marge récupérée est reversée à notre association.
+ </p>
+ <button type="button">En savoir plus!</button>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <h4>Nos missions sur place</h4>
+ <div class="actions">
+ <div class="scroller">
+ <div class="item">
+ <div class="card">
+ <div class="imag">
+ <img src="images/africaday1.jpg" alt="Africa Day">
+ </div>
+ <h3>Courses de solidarité et bol de riz</h3>
+ <p>
+ Nous intervenons également dans des écoles (primaire et collège) où nous présentons notre
+ projet aux élèves. Ainsi, les écoles nous aident à récolter des fonds que ce soit par des
+ courses de solidarité ou par l'opération bol de riz, sur volontariat des élèves. Les courses
+ de solidarité consiste à un système de parrainage des élèves où les sponsors de chaque élève
+ promettent de donner une certaine somme pour chaque kilomètre parcouru durant la course que
+ nous organisons. L'opération bol de riz remplace pendant un repas le menu d'origine de
+ l'école et la marge récupérée est reversée à notre association.
+ </p>
+ <button type="button">En savoir plus!</button>
+ </div>
+ </div>
+ <div class="item">
+ <div class="card">
+ <div class="imag">
+ <img src="images/africaday1.jpg" alt="Africa Day">
+ </div>
+ <h3>Courses de solidarité et bol de riz</h3>
+ <p>
+ Nous intervenons également dans des écoles (primaire et collège) où nous présentons notre
+ projet aux élèves. Ainsi, les écoles nous aident à récolter des fonds que ce soit par des
+ courses de solidarité ou par l'opération bol de riz, sur volontariat des élèves. Les courses
+ de solidarité consiste à un système de parrainage des élèves où les sponsors de chaque élève
+ promettent de donner une certaine somme pour chaque kilomètre parcouru durant la course que
+ nous organisons. L'opération bol de riz remplace pendant un repas le menu d'origine de
+ l'école et la marge récupérée est reversée à notre association.
+ </p>
+ <button type="button">En savoir plus!</button>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <!--Footer-->
+ <div class="footer">
+ <div class="row">
+ <div class="column3">
+ <img src="images/logo_africaunite_transparent.png" alt="logo" width="100px">
+ </div>
+ <div class="column3">
+ <h3>Nous retrouver sur les réseaux</h3>
+ <p>Instagram</p>
+ <p>Facebook</p>
+ </div>
+ <div class="column3">
+ <h3>Nous contacter</h3>
+ <p>3 rue Joliot Curie <br>
+ 91190 GIF-SUR-YVETTE
+ </p>
+ <p>africa-unite@larez.fr</p>
+ </div>
+ </div>
+ </div>
+</body>
+<script src="main.js"></script>
+
+</html>
\ No newline at end of file
diff --git a/contact.html b/contact.html
new file mode 100644
index 0000000000000000000000000000000000000000..ba66708561c0002c885a05c9982bdde501ca7dca
--- /dev/null
+++ b/contact.html
@@ -0,0 +1,57 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Contact - Africa Unite</title>
+ <link rel="stylesheet" href="styles.css">
+</head>
+<body>
+ <div class="core">
+ <!--Logo Africa Unite-->
+ <a href="index.html"><img src="images/logo_africaunite_transparent.png" alt="Logo Africa Unite" width="5%"></a>
+ <!--Barre de navigation-->
+ <nav id="navbar">
+ <ul>
+ <li class="deroulant"><a href="#">Qui sommes nous?</a>
+ <ul class="sous">
+ <li><a href="equipes.html">Nos différentes équipes</a></li>
+ <li><a href="histoire.html">L'histoire de l'association</a></li>
+ </ul>
+ </li>
+ <li class="deroulant"><a href="#">Nos projets</a>
+ <ul class="sous">
+ <li><a href="Bobo.html">Le centre de Bobo</a></li>
+ <li><a href="nvprojet.html">Le nouveau projet</a></li>
+ </ul>
+ <li><a href="actions.html">Nos actions</a></li>
+ <li><a href="contact.html">Nous contacter</a></li>
+ </ul>
+ </nav>
+ <!--Bouton d'apparition/disparition barre de navigation-->
+ <img src="icons/menu_icon.png" id="menu_icon" alt="Menu Icon" width="25px" style="position: absolute; right:1%; top:20px">
+ </div>
+<!--Footer-->
+<div class="footer">
+ <div class="row">
+ <div class="column3">
+ <img src="images/logo_africaunite_transparent.png" alt="logo" width="100px">
+ </div>
+ <div class="column3">
+ <h3>Nous retrouver sur les réseaux</h3>
+ <p>Instagram</p>
+ <p>Facebook</p>
+ </div>
+ <div class="column3">
+ <h3>Nous contacter</h3>
+ <p>3 rue Joliot Curie <br>
+ 91190 GIF-SUR-YVETTE
+ </p>
+ <p>africa-unite@larez.fr</p>
+ </div>
+ </div>
+</div>
+</body>
+<script src="main.js"></script>
+</html>
\ No newline at end of file
diff --git a/equipes.html b/equipes.html
new file mode 100644
index 0000000000000000000000000000000000000000..ee0b182e5ccb9a8be081f6769561adfbb0ff7d06
--- /dev/null
+++ b/equipes.html
@@ -0,0 +1,80 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Nos équipes - Africa Unite</title>
+ <link rel="stylesheet" href="styles.css">
+</head>
+<body>
+ <div class="core">
+ <!--Logo Africa Unite-->
+ <a href="index.html"><img src="images/logo_africaunite_transparent.png" alt="Logo Africa Unite" width="5%"></a>
+ <!--Barre de navigation-->
+ <nav id="navbar">
+ <ul>
+ <li class="deroulant"><a href="#">Qui sommes nous?</a>
+ <ul class="sous">
+ <li><a href="equipes.html">Nos différentes équipes</a></li>
+ <li><a href="histoire.html">L'histoire de l'association</a></li>
+ </ul>
+ </li>
+ <li class="deroulant"><a href="#">Nos projets</a>
+ <ul class="sous">
+ <li><a href="Bobo.html">Le centre de Bobo</a></li>
+ <li><a href="nvprojet.html">Le nouveau projet</a></li>
+ </ul>
+ <li><a href="actions.html">Nos actions</a></li>
+ <li><a href="contact.html">Nous contacter</a></li>
+ </ul>
+ </nav>
+ <!--Bouton d'apparition/disparition barre de navigation-->
+ <img src="icons/menu_icon.png" id="menu_icon" alt="Menu Icon" width="25px" style="position: absolute; right:1%; top:20px">
+ <h2>Qui sommes nous?</h2>
+ <div class="row">
+ <div class="column2">
+ <p>Africa Unite est une association de solidarité internationale
+ fondée par des étudiants de Supélec en 2010 et reconnue
+ officiellement en avril 2014. Elle réunit chaque année douze
+ étudiants de l’école d’ingénieur CentraleSupélec, qui travaillent
+ pour financer la construction d’un centre socio-éducatif à Bobo-
+ Dioulasso, au Burkina Faso. Ses objectifs sont de promouvoir
+ l’éducation et la formation professionnelle des jeunes, de créer un
+ cadre d’expression artistique et culturelle et d’épanouissement des jeunes et des enfants, et de
+ favoriser des échanges d’expériences et de solidarité entre les jeunes de Bobo-Dioulasso et les
+ jeunes du reste du monde.
+ </p>
+ <p>Nous sommes en phase de construction d'un nouveau projet de centre socio-éducatif
+ à Mbam, une ville de 4000 habitants du Sénégal, dont plus de la moitié sont des jeunes.
+ </p>
+ <a href="equipes/P24.html"><button> Découvrir nos différentes équipes</button></a>
+ </div>
+ <div class="column2">
+ <img src="images/photoP23.JPG" alt="equipe photoP23" width="100%">
+ </div>
+ </div>
+ </div>
+ <!--Footer-->
+ <div class="footer">
+ <div class="row">
+ <div class="column3">
+ <img src="images/logo_africaunite_transparent.png" alt="logo" width="100px">
+ </div>
+ <div class="column3">
+ <h3>Nous retrouver sur les réseaux</h3>
+ <p>Instagram</p>
+ <p>Facebook</p>
+ </div>
+ <div class="column3">
+ <h3>Nous contacter</h3>
+ <p>3 rue Joliot Curie <br>
+ 91190 GIF-SUR-YVETTE
+ </p>
+ <p>africa-unite@larez.fr</p>
+ </div>
+ </div>
+ </div>
+</body>
+<script src="main.js"></script>
+</html>
\ No newline at end of file
diff --git a/equipes/P23.html b/equipes/P23.html
new file mode 100644
index 0000000000000000000000000000000000000000..c197fb943aab9170175ebffab72d0b3aa968149f
--- /dev/null
+++ b/equipes/P23.html
@@ -0,0 +1,368 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Equipe 2022 - Africa Unite</title>
+ <link rel="stylesheet" href="../styles.css">
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css"/>
+</head>
+<body>
+ <div class="core">
+ <!--Logo Africa Unite-->
+ <a href="../actions.html"><img src="../images/logo_africaunite_transparent.png" alt="Logo Africa Unite" width="5%"></a>
+ <!--Barre de navigation-->
+ <nav id="navbar">
+ <ul>
+ <li class="deroulant"><a href="#">Qui sommes nous?</a>
+ <ul class="sous">
+ <li><a href="../equipes.html">Nos différentes équipes</a></li>
+ <li><a href="../histoire.html">L'histoire de l'association</a></li>
+ </ul>
+ </li>
+ <li class="deroulant"><a href="#">Nos projets</a>
+ <ul class="sous">
+ <li><a href="../Bobo.html">Le centre de Bobo</a></li>
+ <li><a href="../nvprojet.html">Le nouveau projet</a></li>
+ </ul>
+ <li><a href="../actions.html">Nos actions</a></li>
+ <li><a href="../contact.html">Nous contacter</a></li>
+ </ul>
+ </nav>
+ <!--Bouton d'apparition/disparition barre de navigation-->
+ <img src="../icons/menu_icon.png" id="menu_icon" alt="Menu icon" width="25px"
+ style="position: absolute; right:1%; top:20px">
+
+
+
+ <h2>L'équipe 2022</h2>
+ <h4>Le Buro</h4>
+ <div class="row">
+ <div class="column4">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Alexis.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Alexis Lallouche
+ </h2>
+ <span>Président</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column4">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Aymane.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Aymane Fardadi
+ </h2>
+ <span>Vice-Président</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column4">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Fraysse.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Alexandre Fraysse
+ </h2>
+ <span>Trésorier</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column4">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Aude.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Aude Champavère
+ </h2>
+ <span>Secrétaire Générale</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <h4>Les Activités internes</h4>
+ <div class="row">
+ <div class="column3">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Albane.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Albane Vigier
+ </h2>
+ <span>VP Acti Int</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column3">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Muriel.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Muriel Kenmogne
+ </h2>
+ <span>Acti Int</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column3">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Aude.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Aude Champavère
+ </h2>
+ <span>Acti Int</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <a href="../actions.html"><button> Découvrir les actions internes</button></a>
+ <h4>Les Activités externes</h4>
+ <div class="row">
+ <div class="column3">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Sani.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Alexandre Sani
+ </h2>
+ <span>VP Acti Ext</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column3">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Aymane.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Aymane Fardadi
+ </h2>
+ <span>Acti Ext</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column3">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Ouma.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Ouma El Khattabi
+ </h2>
+ <span>VP Écoles</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <a href="../actions.html"><button> Découvrir les actions externes</button></a>
+ <h4>Le pôle entreprise</h4>
+ <div class="row">
+ <div class="column4">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Antoine.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Antoine Greil
+ </h2>
+ <span>VP Ent</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column4">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Titouan.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Titouan Loustanau
+ </h2>
+ <span>Ent</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column4">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Sabrina.jpeg">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Sabrina Mockbel
+ </h2>
+ <span>Ent</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column4">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Fraysse.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Alexandre Fraysse
+ </h2>
+ <span>Ent</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <h4>Le pôle projet</h4>
+ <div class="row">
+ <div class="column2">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Salomé.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Salomé Aubri
+ </h2>
+ <span>VP Projet</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column2">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Alexis.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Alexis Lallouche
+ </h2>
+ <span>Président</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <a href="../actions.html"><button> Découvrir le nouveau projet</button></a>
+ <h4>Le pôle média</h4>
+ <div class="row">
+ <div class="column3">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Muriel.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Muriel Kenmogne
+ </h2>
+ <span>VP Com Int</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column3">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Titouan.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Titouan Loustanau
+ </h2>
+ <span>VP Com Ent</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column3">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Ouma.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Ouma El Khattabi
+ </h2>
+ <span>VP Geek</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <!--Footer-->
+ <div class="footer">
+ <div class="row">
+ <div class="column3">
+ <img src="../images/logo_africaunite_transparent.png" alt="logo" width="100px">
+ </div>
+ <div class="column3">
+ <h3>Nous retrouver sur les réseaux</h3>
+ <p>Instagram</p>
+ <p>Facebook</p>
+ </div>
+ <div class="column3">
+ <h3>Nous contacter</h3>
+ <p>3 rue Joliot Curie <br>
+ 91190 GIF-SUR-YVETTE
+ </p>
+ <p>africa-unite@larez.fr</p>
+ </div>
+ </div>
+ </div>
+</body>
+</html>
\ No newline at end of file
diff --git a/equipes/P24.html b/equipes/P24.html
new file mode 100644
index 0000000000000000000000000000000000000000..9780712c96e041d1a99afef65a8ce951400e0d13
--- /dev/null
+++ b/equipes/P24.html
@@ -0,0 +1,368 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Equipe 2022 - Africa Unite</title>
+ <link rel="stylesheet" href="../styles.css">
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css"/>
+</head>
+<body>
+ <div class="core">
+ <!--Logo Africa Unite-->
+ <a href="../actions.html"><img src="../images/logo_africaunite_transparent.png" alt="Logo Africa Unite" width="5%"></a>
+ <!--Barre de navigation-->
+ <nav id="navbar">
+ <ul>
+ <li class="deroulant"><a href="#">Qui sommes nous?</a>
+ <ul class="sous">
+ <li><a href="../equipes.html">Nos différentes équipes</a></li>
+ <li><a href="../histoire.html">L'histoire de l'association</a></li>
+ </ul>
+ </li>
+ <li class="deroulant"><a href="#">Nos projets</a>
+ <ul class="sous">
+ <li><a href="../Bobo.html">Le centre de Bobo</a></li>
+ <li><a href="../nvprojet.html">Le nouveau projet</a></li>
+ </ul>
+ <li><a href="../actions.html">Nos actions</a></li>
+ <li><a href="../contact.html">Nous contacter</a></li>
+ </ul>
+ </nav>
+ <!--Bouton d'apparition/disparition barre de navigation-->
+ <img src="../icons/menu_icon.png" id="menu_icon" alt="Menu icon" width="25px"
+ style="position: absolute; right:1%; top:20px">
+
+
+
+ <h2>L'équipe 2022</h2>
+ <h4>Le Buro</h4>
+ <div class="row">
+ <div class="column4">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Alexis.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Alexis Lallouche
+ </h2>
+ <span>Président</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column4">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Aymane.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Aymane Fardadi
+ </h2>
+ <span>Vice-Président</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column4">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Fraysse.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Alexandre Fraysse
+ </h2>
+ <span>Trésorier</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column4">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Aude.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Aude Champavère
+ </h2>
+ <span>Secrétaire Générale</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <h4>Les Activités internes</h4>
+ <div class="row">
+ <div class="column3">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Albane.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Albane Vigier
+ </h2>
+ <span>VP Acti Int</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column3">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Muriel.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Muriel Kenmogne
+ </h2>
+ <span>Acti Int</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column3">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Aude.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Aude Champavère
+ </h2>
+ <span>Acti Int</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <a href="../actions.html"><button> Découvrir les actions internes</button></a>
+ <h4>Les Activités externes</h4>
+ <div class="row">
+ <div class="column3">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Sani.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Alexandre Sani
+ </h2>
+ <span>VP Acti Ext</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column3">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Aymane.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Aymane Fardadi
+ </h2>
+ <span>Acti Ext</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column3">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Ouma.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Ouma El Khattabi
+ </h2>
+ <span>VP Écoles</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <a href="../actions.html"><button> Découvrir les actions externes</button></a>
+ <h4>Le pôle entreprise</h4>
+ <div class="row">
+ <div class="column4">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Antoine.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Antoine Greil
+ </h2>
+ <span>VP Ent</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column4">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Titouan.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Titouan Loustanau
+ </h2>
+ <span>Ent</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column4">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Sabrina.jpeg">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Sabrina Mockbel
+ </h2>
+ <span>Ent</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column4">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Fraysse.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Alexandre Fraysse
+ </h2>
+ <span>Ent</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <h4>Le pôle projet</h4>
+ <div class="row">
+ <div class="column2">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Salomé.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Salomé Aubri
+ </h2>
+ <span>VP Projet</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column2">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Alexis.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Alexis Lallouche
+ </h2>
+ <span>Projet</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <a href="../actions.html"><button> Découvrir le nouveau projet</button></a>
+ <h4>Le pôle média</h4>
+ <div class="row">
+ <div class="column3">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Muriel.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Muriel Kenmogne
+ </h2>
+ <span>VP Com Int</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column3">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Titouan.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Titouan Loustanau
+ </h2>
+ <span>VP Com Ent</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="column3">
+ <div class="container">
+ <div class="image">
+ <img src="P24/P24Ouma.JPG">
+ </div>
+ <div class="content">
+ <div class="info">
+ <h2>
+ Ouma El Khattabi
+ </h2>
+ <span>VP Geek</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <!--Footer-->
+ <div class="footer">
+ <div class="row">
+ <div class="column3">
+ <img src="../images/logo_africaunite_transparent.png" alt="logo" width="100px">
+ </div>
+ <div class="column3">
+ <h3>Nous retrouver sur les réseaux</h3>
+ <p>Instagram</p>
+ <p>Facebook</p>
+ </div>
+ <div class="column3">
+ <h3>Nous contacter</h3>
+ <p>3 rue Joliot Curie <br>
+ 91190 GIF-SUR-YVETTE
+ </p>
+ <p>africa-unite@larez.fr</p>
+ </div>
+ </div>
+ </div>
+</body>
+</html>
\ No newline at end of file
diff --git a/equipes/P24/P24Albane.JPG b/equipes/P24/P24Albane.JPG
new file mode 100644
index 0000000000000000000000000000000000000000..01641d106dc19e303f9c9e9b226b02983b07f4ea
Binary files /dev/null and b/equipes/P24/P24Albane.JPG differ
diff --git a/equipes/P24/P24Alexis.JPG b/equipes/P24/P24Alexis.JPG
new file mode 100644
index 0000000000000000000000000000000000000000..078185d915dd70d3189c8273060f2f32346ca464
Binary files /dev/null and b/equipes/P24/P24Alexis.JPG differ
diff --git a/equipes/P24/P24Antoine.JPG b/equipes/P24/P24Antoine.JPG
new file mode 100644
index 0000000000000000000000000000000000000000..2b1a9949f459900097757a811cd6eb599dce2b3e
Binary files /dev/null and b/equipes/P24/P24Antoine.JPG differ
diff --git a/equipes/P24/P24Aude.JPG b/equipes/P24/P24Aude.JPG
new file mode 100644
index 0000000000000000000000000000000000000000..d537ed73517a8fe73619c6af93d1d9c5b1da8cf0
Binary files /dev/null and b/equipes/P24/P24Aude.JPG differ
diff --git a/equipes/P24/P24Aymane.JPG b/equipes/P24/P24Aymane.JPG
new file mode 100644
index 0000000000000000000000000000000000000000..eda1cc53de3e92b0df91660642773de20d01edcb
Binary files /dev/null and b/equipes/P24/P24Aymane.JPG differ
diff --git a/equipes/P24/P24Fraysse.JPG b/equipes/P24/P24Fraysse.JPG
new file mode 100644
index 0000000000000000000000000000000000000000..b351b1947da24ae34b0563f6f60cd49140ff301b
Binary files /dev/null and b/equipes/P24/P24Fraysse.JPG differ
diff --git a/equipes/P24/P24Muriel.JPG b/equipes/P24/P24Muriel.JPG
new file mode 100644
index 0000000000000000000000000000000000000000..88d3016a18b8070c4c38ecbad28027183c53c7fc
Binary files /dev/null and b/equipes/P24/P24Muriel.JPG differ
diff --git a/equipes/P24/P24Ouma.JPG b/equipes/P24/P24Ouma.JPG
new file mode 100644
index 0000000000000000000000000000000000000000..d8f585d582f33349eba0a148e62cec75be8222fe
Binary files /dev/null and b/equipes/P24/P24Ouma.JPG differ
diff --git a/equipes/P24/P24Sabrina.jpeg b/equipes/P24/P24Sabrina.jpeg
new file mode 100644
index 0000000000000000000000000000000000000000..ad752f04e456f220ccf26a1de20e42a7b5692b96
Binary files /dev/null and b/equipes/P24/P24Sabrina.jpeg differ
diff --git "a/equipes/P24/P24Salom\303\251.JPG" "b/equipes/P24/P24Salom\303\251.JPG"
new file mode 100644
index 0000000000000000000000000000000000000000..a7cf1c9b5d702267cd640d2cc186267ba1500414
Binary files /dev/null and "b/equipes/P24/P24Salom\303\251.JPG" differ
diff --git a/equipes/P24/P24Sani.JPG b/equipes/P24/P24Sani.JPG
new file mode 100644
index 0000000000000000000000000000000000000000..e04e51e1f5a3a103c222bac28cb49c57425962d4
Binary files /dev/null and b/equipes/P24/P24Sani.JPG differ
diff --git a/equipes/P24/P24Titouan.JPG b/equipes/P24/P24Titouan.JPG
new file mode 100644
index 0000000000000000000000000000000000000000..46ed85a7f3f678bcac51683e3cab2b68dd14e9fe
Binary files /dev/null and b/equipes/P24/P24Titouan.JPG differ
diff --git a/histoire.html b/histoire.html
new file mode 100644
index 0000000000000000000000000000000000000000..0e9fa8576e61c6393cb04b192661b9198afca948
--- /dev/null
+++ b/histoire.html
@@ -0,0 +1,113 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Notre histoire - Africa Unite</title>
+ <link rel="stylesheet" href="styles.css">
+</head>
+<body>
+ <div class="core">
+ <!--Logo Africa Unite-->
+ <a href="index.html"><img src="images/logo_africaunite_transparent.png" alt="Logo Africa Unite" width="5%"></a>
+ <!--Barre de navigation-->
+ <nav id="navbar">
+ <ul>
+ <li class="deroulant"><a href="#">Qui sommes nous?</a>
+ <ul class="sous">
+ <li><a href="equipes.html">Nos différentes équipes</a></li>
+ <li><a href="histoire.html">L'histoire de l'association</a></li>
+ </ul>
+ </li>
+ <li class="deroulant"><a href="#">Nos projets</a>
+ <ul class="sous">
+ <li><a href="Bobo.html">Le centre de Bobo</a></li>
+ <li><a href="nvprojet.html">Le nouveau projet</a></li>
+ </ul>
+ <li><a href="actions.html">Nos actions</a></li>
+ <li><a href="contact.html">Nous contacter</a></li>
+ </ul>
+ </nav>
+ <!--Bouton d'apparition/disparition barre de navigation-->
+ <img src="icons/menu_icon.png" id="menu_icon" alt="Menu Icon" width="25px" style="position: absolute; right:1%; top:20px">
+ <div class="content">
+ <h2>L'histoire de l'association Africa Unite</h2>
+ <div class="row">
+ <div class="column2">
+ <p>Africa Unite, qui n’était alors qu’un club, est né en 2008 par
+ Caroline Togna, après une mission à l’Espace
+ Rencontre Jeunesse (ERJ) de Dafra, à Bobo-Dioulasso. Cette
+ maison des jeunes est vouée à proposer à la jeunesse
+ burkinabée des activités culturelles, ludiques et sportives, et met
+ à disposition des 3000 enfants qui s’y rendent
+ quotidiennement des facilités logistiques auxquelles ils n’ont
+ pas forcément accès chez eux : bibliothèque, salle informatique,
+ etc. Elle organise tous les deux ans, lors de la Semaine Nationale e la Culture qui a lieu à Bobo
+ Dioulasso, les activités dédiées aux enfants. Avec l’aide de Moussa Kafando, ancien directeur de
+ la maison des jeunes, et de Pako Togo Soumaïla, attaché culturel à la mairie de Bobo-Dioulasso
+ et nouveau directeur de la maison des jeunes, le projet d’Africa Unite est né.
+ </p>
+ </div>
+ <div class="column2">
+ <img src="images/logo_africaunite_transparent.png" alt="Logo Africa Unite" width="200px">
+ </div>
+ </div>
+ <div class="row">
+ <div class="column2">
+ </div>
+ <div class="column2">
+ <p>En 2010, Maxime Guymard a fondé l’association Africa Unite, dont la mission était d’apporter
+ un soutien logistique et éducatif par de la rénovation, des cours de soutien ou des activités
+ ludiques
+ </p>
+ <p>Le quartier jouxtant l’ERJ était sujet à de nombreuses
+ coupures d’eau (plus d’une fois par semaine en
+ moyenne), contraignant les habitants du quartier à
+ aller pomper manuellement de l’eau dans un puits
+ creusé dans le centre. Constatant cette difficulté
+ d’approvisionnement en eau, nous avons décidé de
+ construire un château d’eau, équipé d’un système de
+ purification, pour satisfaire les besoins en eau les plus
+ urgents des jeunes du centre et de leurs familles.
+ </p>
+ </div>
+ </div>
+ <div class="row">
+ <div class="column2">
+ <p>Après la construction du château d’eau lors de l’été 2013, les membres d’Africa Unite, en
+ concertation avec Moussa et Pako, ont estimé que l’ERJ avait atteint un stade de maturité. Son
+ succès auprès de la jeunesse nous a fait conclure qu’il ne fallait pas s’arrêter là. L’association a
+ donc décidé de construire, de A à Z, un nouveau centre dont le modèle se baserait sur celui de
+ l’ERJ de Dafra. L’ERJ d’Africa Unite est né.
+ </p>
+ </div>
+ <div class="column2">
+
+ </div>
+ </div>
+ </div>
+ </div>
+ <!--Footer-->
+ <div class="footer">
+ <div class="row">
+ <div class="column3">
+ <img src="images/logo_africaunite_transparent.png" alt="logo" width="100px">
+ </div>
+ <div class="column3">
+ <h3>Nous retrouver sur les réseaux</h3>
+ <p>Instagram</p>
+ <p>Facebook</p>
+ </div>
+ <div class="column3">
+ <h3>Nous contacter</h3>
+ <p>3 rue Joliot Curie <br>
+ 91190 GIF-SUR-YVETTE
+ </p>
+ <p>africa-unite@larez.fr</p>
+ </div>
+ </div>
+ </div>
+</body>
+<script src="main.js"></script>
+</html>
\ No newline at end of file
diff --git a/icons/.DS_Store b/icons/.DS_Store
new file mode 100644
index 0000000000000000000000000000000000000000..5008ddfcf53c02e82d7eee2e57c38e5672ef89f6
Binary files /dev/null and b/icons/.DS_Store differ
diff --git a/icons/menu_icon.png b/icons/menu_icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..15effa75c9e92d0973c56d65699fe621f2acf049
Binary files /dev/null and b/icons/menu_icon.png differ
diff --git a/images/.DS_Store b/images/.DS_Store
new file mode 100644
index 0000000000000000000000000000000000000000..925727d9da17b5ac30f5f62e48e07d5440c77753
Binary files /dev/null and b/images/.DS_Store differ
diff --git a/images/africaday1.jpg b/images/africaday1.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..f24115e02ae559de7aec6f7831a3527bd97fe16f
Binary files /dev/null and b/images/africaday1.jpg differ
diff --git a/images/centre-front-2.jpg b/images/centre-front-2.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..91f7dec6240cc3a37577f7197b8f97e79cc34e91
Binary files /dev/null and b/images/centre-front-2.jpg differ
diff --git a/images/centre-front.jpg b/images/centre-front.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..7b5b07a09f8fea0519b32525dc2a8afe8ae53dd2
Binary files /dev/null and b/images/centre-front.jpg differ
diff --git a/images/centrebobo.jpg b/images/centrebobo.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..71757d7eaa003fc68df6930100b24b610ed913f1
Binary files /dev/null and b/images/centrebobo.jpg differ
diff --git a/images/chambre-hotes-1.jpeg b/images/chambre-hotes-1.jpeg
new file mode 100644
index 0000000000000000000000000000000000000000..b6819e0e577da63fae0095000732aba20013bf9b
Binary files /dev/null and b/images/chambre-hotes-1.jpeg differ
diff --git a/images/chateau-d'eau.jpeg b/images/chateau-d'eau.jpeg
new file mode 100644
index 0000000000000000000000000000000000000000..7f602b1a04c8bb4e2477893cdac51826e723f2d6
Binary files /dev/null and b/images/chateau-d'eau.jpeg differ
diff --git a/images/cirque-bobo-2.jpeg b/images/cirque-bobo-2.jpeg
new file mode 100644
index 0000000000000000000000000000000000000000..aa8166c1c3e6b0086042d25b10abb93e012b9771
Binary files /dev/null and b/images/cirque-bobo-2.jpeg differ
diff --git a/images/cirque-bobo-3.jpeg b/images/cirque-bobo-3.jpeg
new file mode 100644
index 0000000000000000000000000000000000000000..e968c475dac37a3618e41f6af01c86733cdbab3a
Binary files /dev/null and b/images/cirque-bobo-3.jpeg differ
diff --git a/images/cirque-bobo-4.jpeg b/images/cirque-bobo-4.jpeg
new file mode 100644
index 0000000000000000000000000000000000000000..09804151059c1b92a7abec7399883274545ce576
Binary files /dev/null and b/images/cirque-bobo-4.jpeg differ
diff --git a/images/cirque-bobo.jpeg b/images/cirque-bobo.jpeg
new file mode 100644
index 0000000000000000000000000000000000000000..9a30eb729b1894b8e6fc6c0102501f83890015cb
Binary files /dev/null and b/images/cirque-bobo.jpeg differ
diff --git a/images/classe4-1.jpg b/images/classe4-1.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..274d0314a39011fad568857192f4388d0ff7216d
Binary files /dev/null and b/images/classe4-1.jpg differ
diff --git a/images/ekip.JPG b/images/ekip.JPG
new file mode 100644
index 0000000000000000000000000000000000000000..ea2e8151c43ed7780c1fa7b4d41579f241662f8b
Binary files /dev/null and b/images/ekip.JPG differ
diff --git a/images/enfants_centre.JPG b/images/enfants_centre.JPG
new file mode 100644
index 0000000000000000000000000000000000000000..099e309470a32fc05853df663fbc8393e7b95629
Binary files /dev/null and b/images/enfants_centre.JPG differ
diff --git a/images/favicon.ico b/images/favicon.ico
new file mode 100644
index 0000000000000000000000000000000000000000..80aabc5bd77ffc5a91159cd616ed92e191b9bd48
Binary files /dev/null and b/images/favicon.ico differ
diff --git a/images/frise-droite.jpeg b/images/frise-droite.jpeg
new file mode 100644
index 0000000000000000000000000000000000000000..2e9eb0d45257e1000b9f6b98634e077f46e8a164
Binary files /dev/null and b/images/frise-droite.jpeg differ
diff --git a/images/frise-gauche.jpeg b/images/frise-gauche.jpeg
new file mode 100644
index 0000000000000000000000000000000000000000..c266041de1faa0284ce410d227d22b28a5b577f4
Binary files /dev/null and b/images/frise-gauche.jpeg differ
diff --git a/images/logo_africaunite_fondvert.png b/images/logo_africaunite_fondvert.png
new file mode 100644
index 0000000000000000000000000000000000000000..b65d473e72ae670264e3fc78496a168d3dd9fba3
Binary files /dev/null and b/images/logo_africaunite_fondvert.png differ
diff --git a/images/logo_africaunite_transparent.png b/images/logo_africaunite_transparent.png
new file mode 100644
index 0000000000000000000000000000000000000000..046e7c09442e494ba8e42bd69d73b65190339aa8
Binary files /dev/null and b/images/logo_africaunite_transparent.png differ
diff --git a/images/patisseries-1.jpg b/images/patisseries-1.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..ee9b954be14f9e8736a06dc924009bb203e0c674
Binary files /dev/null and b/images/patisseries-1.jpg differ
diff --git a/images/patisseries-2.jpg b/images/patisseries-2.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..cc61734bce292abad4806028157eec7cb17a46e6
Binary files /dev/null and b/images/patisseries-2.jpg differ
diff --git a/images/photoP22.jpg b/images/photoP22.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..e8beac39c2072932539c8a01bf46f75a3b3c9f6e
Binary files /dev/null and b/images/photoP22.jpg differ
diff --git a/images/photoP23.jpg b/images/photoP23.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..9e4c93578311ec0cf729560799df8655bc554f6b
Binary files /dev/null and b/images/photoP23.jpg differ
diff --git a/images/photoP2324.JPG b/images/photoP2324.JPG
new file mode 100644
index 0000000000000000000000000000000000000000..35c5b4448737baf59383b57373e4e262fe588222
Binary files /dev/null and b/images/photoP2324.JPG differ
diff --git a/images/tounoi-foot-1.jpeg b/images/tounoi-foot-1.jpeg
new file mode 100644
index 0000000000000000000000000000000000000000..e3fe3ca61ec7a009e4773c4f64a4e7764f5a6470
Binary files /dev/null and b/images/tounoi-foot-1.jpeg differ
diff --git a/images/tounoi-foot-2.jpeg b/images/tounoi-foot-2.jpeg
new file mode 100644
index 0000000000000000000000000000000000000000..2e731e8be00fe175754c38586dfb1718db715d12
Binary files /dev/null and b/images/tounoi-foot-2.jpeg differ
diff --git a/index.html b/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..d99ebbde41c3317ae2357acc3d97008fccb3fc9c
--- /dev/null
+++ b/index.html
@@ -0,0 +1,86 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+ <meta charset="UTF-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Africa Unite</title>
+ <link rel="icon" type="image/x-icon" href="/images/favicon.ico">
+ <link rel="stylesheet" href="styles.css">
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+</head>
+
+<body>
+ <div class="core">
+ <!--Logo Africa Unite-->
+ <a href="index.html"><img src="images/logo_africaunite_transparent.png" alt="Logo Africa Unite" width="5%"></a>
+ <!--Barre de navigation-->
+ <nav id="navbar">
+ <ul>
+ <li class="deroulant"><a href="#">Qui sommes nous?</a>
+ <ul class="sous">
+ <li><a href="equipes.html">Nos différentes équipes</a></li>
+ <li><a href="histoire.html">L'histoire de l'association</a></li>
+ </ul>
+ </li>
+ <li class="deroulant"><a href="#">Nos projets</a>
+ <ul class="sous">
+ <li><a href="Bobo.html">Le centre de Bobo</a></li>
+ <li><a href="nvprojet.html">Le nouveau projet</a></li>
+ </ul>
+ <li><a href="actions.html">Nos actions</a></li>
+ <li><a href="contact.html">Nous contacter</a></li>
+ </ul>
+ </nav>
+ <!--Bouton d'apparition/disparition barre de navigation-->
+ <img src="icons/menu_icon.png" id="menu_icon" alt="Menu Icon" width="25px"
+ style="position: absolute; right:1%; top:20px">
+ <div class="row">
+ <div class="column2">
+ </div>
+ <div class="column2">
+
+ </div>
+ </div>
+ <div class="row">
+ <div class="column2">
+ <h1>AFRICA <br>
+ UNITE</h1>
+ <h5>Une association étudiante composée de 12 élèves de première année de Centrale Supélec.</h5>
+ <h4>Nous suivre sur les réseaux</h4>
+ </div>
+ <div class="column2">
+ <img src="images/centre-front.jpg" alt="Front Centre" width="110%">
+ <div class="button">
+ <span>
+ <a href= "https://www.helloasso.com/associations/africa-unite" target="_blank"> FAIRE UN DON</a>
+ </span>
+ </div>
+ </div>
+ </div>
+ </div>
+ <!--Footer-->
+ <div class="footer">
+ <div class="row">
+ <div class="column3">
+ <img src="images/logo_africaunite_transparent.png" alt="logo" width="100px">
+ </div>
+ <div class="column3">
+ <h3>Nous retrouver sur les réseaux</h3>
+ <p>Instagram</p>
+ <p>Facebook</p>
+ </div>
+ <div class="column3">
+ <h3>Nous contacter</h3>
+ <p>3 rue Joliot Curie <br>
+ 91190 GIF-SUR-YVETTE
+ </p>
+ <p>africa-unite@larez.fr</p>
+ </div>
+ </div>
+ </div>
+</body>
+<script src="main.js"></script>
+
+</html>
\ No newline at end of file
diff --git a/main.js b/main.js
new file mode 100644
index 0000000000000000000000000000000000000000..45b4b7c411b6730655a21365e90ef182f2aaf688
--- /dev/null
+++ b/main.js
@@ -0,0 +1,7 @@
+document.getElementById("menu_icon").onclick = function() {
+ if (document.getElementById("navbar").style.display == "block"){
+ document.getElementById("navbar").style.display = "none";}
+ else{
+ document.getElementById("navbar").style.display = "block"
+ }
+}
\ No newline at end of file
diff --git a/nvprojet.html b/nvprojet.html
new file mode 100644
index 0000000000000000000000000000000000000000..c6fbe14463023a3b1575c73e126b4945999c94de
--- /dev/null
+++ b/nvprojet.html
@@ -0,0 +1,78 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+ <meta charset="UTF-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Le nouveau projet - Africa Unite</title>
+ <link rel="stylesheet" href="styles.css">
+</head>
+
+<body>
+ <div class="core">
+ <!--Logo Africa Unite-->
+ <a href="index.html"><img src="images/logo_africaunite_transparent.png" alt="Logo Africa Unite" width="5%"></a>
+ <!--Barre de navigation-->
+ <nav id="navbar">
+ <ul>
+ <li class="deroulant"><a href="#">Qui sommes nous?</a>
+ <ul class="sous">
+ <li><a href="equipes.html">Nos différentes équipes</a></li>
+ <li><a href="histoire.html">L'histoire de l'association</a></li>
+ </ul>
+ </li>
+ <li class="deroulant"><a href="#">Nos projets</a>
+ <ul class="sous">
+ <li><a href="Bobo.html">Le centre de Bobo</a></li>
+ <li><a href="nvprojet.html">Le nouveau projet</a></li>
+ </ul>
+ <li><a href="actions.html">Nos actions</a></li>
+ <li><a href="contact.html">Nous contacter</a></li>
+ </ul>
+ </nav>
+ <!--Bouton d'apparition/disparition barre de navigation-->
+ <img src="icons/menu_icon.png" id="menu_icon" alt="Menu Icon" width="25px"
+ style="position: absolute; right:1%; top:20px">
+ <h2>Le nouveau projet</h2>
+ <p>
+ Notre centre à Bobo-Dioulasso sera autonome financièrement et énergétiquement d’ici 2023-2024. Nous sommes à la
+ recherche d’un nouveau projet. Les situations sécuritaire et politique au Burkina Faso complexifient le
+ développement d’un nouveau projet. C’est pourquoi, depuis deux ans, nous contactons ONG et organisations locales
+ dans les pays africains pour appréhender les besoins locaux et dessiner des esquisses d’un projet. À la suite de
+ ces recherches, deux pistes solides sont ressorties : l’aide d’un village au Sénégal et la création d’un centre
+ de formation professionnelle en Guinée. Deux missions de repérage ont alors été organisées en février 2022 pour
+ évaluer les besoins locaux et établir la faisabilité de ces pistes. À la suite de nos observations, nous avons
+ décidé de commencer le nouveau projet au Sénégal dans le village de Mbam situé dans la région de Foundiougne (à
+ 180 km au sud-est de Dakar). Le projet consistera en la réalisation d’un centre socio-éducatif basé sur le
+ modèle du centre à Bobo-Dioulasso. Mbam est un village d’environ 5000 habitants dont la moitié sont des enfants.
+ La plupart des villageois vivent de l’agriculture ou de la pêche. L’activité avant tout vivrière permet de
+ dégager un petit revenu afin de couvrir les dépenses annexes. Par ailleurs, Mbam connaît de graves problèmes
+ d’eau (eau salée qui contamine les puits) ce qui contraint les habitants à marcher plusieurs kilomètres pour
+ accéder à de l’eau potable. Nous essaierons de soulager les habitants du village en essayant d’apporter des
+ solutions d'appoint comme un récupérateur d’eau dans le centre.
+ </p>
+ </div>
+ <div class="footer">
+ <div class="row">
+ <div class="column3">
+ <img src="images/logo_africaunite_transparent.png" alt="logo" width="100px">
+ </div>
+ <div class="column3">
+ <h3>Nous retrouver sur les réseaux</h3>
+ <p>Instagram</p>
+ <p>Facebook</p>
+ </div>
+ <div class="column3">
+ <h3>Nous contacter</h3>
+ <p>3 rue Joliot Curie <br>
+ 91190 GIF-SUR-YVETTE
+ </p>
+ <p>africa-unite@larez.fr</p>
+ </div>
+ </div>
+ </div>
+</body>
+<script src="main.js"></script>
+
+</html>
\ No newline at end of file
diff --git a/styles.css b/styles.css
new file mode 100644
index 0000000000000000000000000000000000000000..ccca94986e2e746745aefdec8332a152c1d40f2b
--- /dev/null
+++ b/styles.css
@@ -0,0 +1,351 @@
+@import url('https://fonts.googleapis.com/css?family=Oswald');
+*{
+ margin:0;
+ padding:0;
+ border:0;
+}
+body{
+ background: linear-gradient(116.02deg, #25351E -2.64%, rgba(23, 51, 13, 0.661967) 101.01%, rgba(25, 92, 2, 0.635417) 101.02%, #21351E 101.03%);
+ font-family: Oswald;
+ place-items: center;
+}
+.core{
+ margin: 50px;
+}
+h1{/*Titre page principale*/
+ color: #FFFEFE;
+ font-size: 100px;
+ font-weight: 700;
+ line-height: 98%;
+ text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+}
+h2{/*Titres autres pages*/
+ color: #FFFEFE;
+ font-family: Oswald;
+ font-size: 50px;
+ margin: 10px;
+}
+h3{/*Titre*/
+ color:#FFFEFE;
+ font-size: 30px;
+}
+.card h3{
+ color:black;
+}
+h4{/*Sous titres de pages*/
+ color: white;
+ margin: 10px;
+ font-size: 25px;
+}
+h5{/*Subtext Front page*/
+ color: #FFFEFE;
+ font-size:30px;
+ text-align: justify;
+ padding: 20px;
+}
+p{
+ text-align: justify;
+ color: #FFFEFE;
+ font-style: normal;
+}
+nav{
+ width: 80%;
+ margin: 10px;
+ position: sticky;
+ top: 0px;
+ position: absolute;
+ left:15%;
+ display:block;
+}
+nav ul{
+ list-style-type: none ;
+}
+nav li {
+ float: left;
+ width: 25%;
+ text-align: center;
+}
+nav ul::after{
+ content:"";
+ display: table;
+ clear: both;
+}
+nav a {
+ display: block;
+ text-decoration: none;
+ color: #FFFEFE;
+ font-weight: bold;
+ border-bottom: 2px solid transparent;
+ padding: 10px 0px;
+}
+nav a:hover{
+ color: red;
+ border-bottom: 2px solid gold;
+
+}
+.sous{
+ display: none;
+ color: black;
+ position: absolute;
+ width: 100%;
+ z-index: 1000;
+}
+.sous li{
+ float: none;
+ width: 100%;
+ text-align:left;
+}
+.sous a{
+ padding: 10px;
+ border-bottom: none;
+}
+.sous a:hover{
+ border-bottom: none;
+ background-color: rgba(200, 200, 200, 0,1);
+}
+nav > ul li:hover .sous{
+ display: block;
+}
+.deroulant > a::after{
+ content:"▼";
+ font-size: 12px;
+}
+
+.actions{
+ margin: 3% 0;
+}
+.scroller {
+ overflow-x: scroll;
+ display: flex;
+ scroll-snap-type: x mandatory;
+ }
+ .item {
+ min-width: 85%;
+ background-color: none;
+ scroll-snap-align: center;
+ margin-bottom: 10px;
+ padding: 0 50px 0 10px;
+ }
+ .card {
+ height: 85%;
+ background-color: #C4C4C4;
+ border-radius: 20px;
+ padding: 20px;
+ box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
+ z-index: 1;
+ position: relative;
+ }
+ .card p {
+ line-height: 1.6;
+ font-size: 14px;
+ color: black;
+ }
+ .imag{
+ width: 30%;
+ float: left;
+ padding: 20px;
+ }
+ .imag img{
+ position: relative;
+ border-radius: 20px;
+ height: auto;
+ width: 100%;
+ }
+.card button{
+ font-family: Oswald;
+ font-size: 15px;
+ background-color: #E6E6E6;
+ border-radius: 10px;
+ padding: 10px;
+ position: absolute;
+ right:20px;
+ bottom:20px;
+}
+
+.row {
+ margin: 0 -5px;
+}
+
+.row:after {
+ content: "";
+ display: table;
+ clear: both;
+}
+.column2 {
+ float: left;
+ width: 48%;
+ padding: 1%;
+}
+.column2 img{
+ border-radius: 20px;
+}
+.column3 {
+ float: left;
+ width: 31%;
+ padding: 1%;
+ }
+
+.column4{
+ float: left;
+ width: 23%;
+ padding: 1%;
+}
+.footer{
+ background-color: grey;
+ padding-bottom: 30px;
+ padding-left: 30px;
+ padding-right: 30px;
+ padding-top: 10px;
+}
+button{
+ font-size: 15px;
+ background-color: #E6E6E6;
+ border-radius: 10px;
+ padding: 10px;
+ margin: 10px;
+}
+.button {
+ font-family: Oswald;
+ margin-top: 10px;
+ margin-left: auto;
+ border-radius: 10px;
+ background-color: red;
+ border: none;
+ color: white;
+ text-align: center;
+ font-size: 20px;
+ padding: 10px;
+ width: 50%;
+ transition: all 0.5s;
+ cursor: pointer;
+ }
+
+ .button span {
+ cursor: pointer;
+ display: inline-block;
+ position: relative;
+ transition: 0.5s;
+ }
+
+ .button span:after {
+ content: '\00bb';
+ position: absolute;
+ opacity: 0;
+ top: 0;
+ right: -20px;
+ transition: 0.5s;
+ }
+
+ .button:hover span {
+ padding-right: 25px;
+ }
+
+ .button:hover span:after {
+ opacity: 1;
+ right: 0;
+ }
+
+ .button a {
+ text-decoration: none;
+ font-weight: bold;
+ }
+ .button a:visited{
+ color: white;
+ }
+
+ .button a:hover{
+ color: lightgray;
+ border-bottom: 2px solid gold;
+}
+button{
+ font-family: Oswald;
+}
+.container{
+ position: relative;
+ height: 400px;
+ width: 7cm;
+ overflow: hidden;
+ background: grey;
+ box-shadow: 0px 1px 5px 0px rgba(0,0,0,0.3);
+ transition: 0.3s ease-out;
+ border-radius: 20px;
+ }
+ .container:hover{
+ box-shadow: 0px 1px 35px 0px rgba(0,0,0,0.3);
+ }
+ .container .image{
+ background: #000;
+ position: absolute;
+ top: 0;
+ left: 0;
+ height: 100%;
+ width: 100%;
+ z-index: 2;
+ transition: transform 0.3s ease-out;
+ }
+ .container:hover .image{
+ transform: translateY(-100px);
+ }
+ .image img{
+ height: 100%;
+ width: 100%;
+ object-fit: cover;
+ transition: opacity 0.3s ease-out;
+ }
+ .container:hover .image img{
+ opacity: 0.7;
+ }
+ .container:hover .image{
+ transform: translateY(-100px);
+ }
+
+ .container .content{
+ position: relative;
+ width: 100%;
+ height: 100%;
+ background: grey;
+ }
+ .info{
+ position: absolute;
+ bottom: 20px;
+ text-align: center;
+ width: 100%;
+ color: white;
+ line-height: 26px;
+ }
+ .info h2{
+ font-size: 27px;
+ margin: 3px 0;
+ }
+ .info span{
+ color: #1a1a1a;
+ }
+
+ .fa {
+ height:80px;
+ width: 80px;
+ padding: 20px;
+ text-align: center;
+ text-decoration: none;
+ border-radius: 50%;
+ }
+
+ /* Add a hover effect if you want */
+ .fa:hover {
+ opacity: 0.7;
+ }
+
+ /* Set a specific color for each brand */
+
+ /* Facebook */
+ .fa-facebook {
+ background: #3B5998;
+ color: white;
+ position: relative;
+ }
+
+ /* Instagram */
+ .fa-instagram {
+ background: purple;
+ color: white;
+ }
\ No newline at end of file