File Manager

Editing File: /htdocs/ong-genie-bio.com/rejoins-nous.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <title>ONG Génie Bio</title>
    <meta content="width=device-width, initial-scale=1.0" name="viewport">
    <meta content="" name="keywords">
    <meta content="" name="description">

<link href="img/logo1.png" rel="icon">

<link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600&family=Playfair+Display:wght@700;900&display=swap" rel="stylesheet">

<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.10.0/css/all.min.css" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.4.1/font/bootstrap-icons.css" rel="stylesheet">

<link href="lib/animate/animate.min.css" rel="stylesheet">
    <link href="lib/owlcarousel/assets/owl.carousel.min.css" rel="stylesheet">

<link href="css/bootstrap.min.css" rel="stylesheet">

<link href="css/style.css" rel="stylesheet">
</head>

<div class="container-fluid sticky-top" style="background-color: #D7E0E4;">
        <div class="container">
            <nav class="navbar navbar-expand-lg navbar-light py-2 py-lg-0" style="background-color: #D7E0E4;">
                <a href="index.html" class="navbar-brand">
                    <img class="img-fluid" src="img/logo1.png" alt="Logo" style="height: 200%; width: 180%; margin-top: -55%;">
                </a>
                <button type="button" class="navbar-toggler ms-auto me-0" data-bs-toggle="collapse" data-bs-target="#navbarCollapse">
                    <span class="navbar-toggler-icon"></span>
                </button>
                <div class="collapse navbar-collapse" id="navbarCollapse">
                    <div class="navbar-nav ms-auto">
                        <a href="index.html" class="nav-item nav-link">Accueil</a>
                        <a href="about.html" class="nav-item nav-link">A Propos</a>
                        <a href="projets.html" class="nav-item nav-link">Projets</a>
                        <a href="contact.html" class="nav-item nav-link">Contact</a>
                        <a href="donation.html" class="nav-item nav-link">Donation</a>
                        <a href="rejoins-nous.html" class="nav-item nav-link active">Rejoindre la communauté</a>
                    </div>
                </div>
            </nav>
        </div>
    </div>

<div class="container-fluid page-header py-5 wow fadeIn" data-wow-delay="0.1s">
        <div class="container text-center py-5">
            <h1 class="display-2 text-dark mb-4 animated slideInDown">Rejoignez-nous et soyez le changement!</h1>
        </div>
    </div>

<div class="container-fluid py-5">
        <div class="container">
            <div class="row g-5">
                <div class="col-lg-5 wow fadeIn" data-wow-delay="0.1s">
                    <h5>Vous êtes passionné(e) par l'avenir de notre planète,
                        de nos forêts, de notre biodiversité, et vous croyez en
                        la puissance de la communauté pour créer un impact
                        positif ? Alors Génie Bio est l'endroit où vous devriez
                        être ! En tant que membre, vous ferez partie
                    </h5>
                </div>

<div class="col-lg-6">
                    <h5>d'une communauté dévouée qui travaille sans relâche
                        pour promouvoir des pratiques agricoles durables,
                        restaurer nos écosystèmes forestiers, protéger la
                        biodiversité menacée et soutenir le développement des
                        communautés locales.
                    </h5>
                </div>

<div class="section-title text-center">
                    <h1 class="title text-center">Pourquoi nous rejoindre ?</h1>
                </div>

<div class="col-lg-6">
                    <br><h2>Agir pour un avenir meilleur</h2>
                    <p class="h6">En rejoignant notre ONG, vous contribuerez
                        directement à des initiatives qui ont un impact positif
                        sur notre planète et ses habitants.
                    </p>
                    <br>

<br><h2>Élargir vos compétences</h2>
                    <p class="h6">Vous aurez l'opportunité d'apprendre, de développer de
                        nouvelles compétences et de collaborer.
                    </p>
                    <br>

<br><h2>Communauté engagée</h2>
                    <p class="h6">Vous ferez partie d'une communauté d'individus
                        partageant les mêmes idées, de personnes qui sont
                        déterminées à apporter des changements positifs.
                    </p>
                    <br>

<br><h2>Politiques et actions</h2>
                    <p class="h6"><strong>Génie Bio</strong> joue un rôle actif dans la formulation de politiques environnementales 
                        et de développement. En nous rejoignant, vous aurez la possibilité de contribuer à 
                        façonner un avenir plus durable.
                    </p>
                    <br>
                    <div class="col-lg-6 wow fadeInUp">
                        <div class="float-top">
                            <img src="img/communauté.jpg" alt="" style="height: 400px; margin-left: 250%; margin-top: -200%;">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

<div class="container d-flex justify-content-center" style="background-color: #f0f0f0;">
        <div class="col-lg-6 wow fadeInUp" style="border-radius: 10%;">
            <h2>Rejoignez_nous</h2>
            <form>
                <div class="form-group">
                    <label for="nom">Nom :</label>
                    <input type="text" class="form-control" id="nom" name="nom" required>
                </div>
                <div class="form-group">
                    <label for="prenom">Prénom :</label>
                    <input type="text" class="form-control" id="prenom" name="prenom" required>
                </div>
                <div class="form-group">
                    <label for="email">Email :</label>
                    <input type="email" class="form-control" id="email" name="email" required>
                </div>
                <div class="form-group">
                    <label for="telephone">Numéro de téléphone :</label>
                    <input type="tel" class="form-control" id="telephone" name="telephone">
                </div>
                <div class="form-group">
                    <label for="ville">Ville :</label>
                    <input type="text" class="form-control" id="ville" name="ville">
                </div>
                <div class="form-group">
                    <label for="domaine">Domaine d'intérêt :</label>
                    <select class="form-control" id="domaine" name="domaine">
                        <option value="">Choisir...</option>
                        <option value="informatique">Agriculture Durable</option>
                        <option value="design">Environnement et Biodiversité</option>
                        <option value="marketing">Formation et Certifications</option>
                        <option value="developpement">Developpement Communautaire</option>
                        <option value="developpement">Agriculture Biologique</option>
                        <option value="developpement">Securité Alimentaire</option>

</select>
                </div>
                <div class="form-group">
                    <label for="motivation">Motivation :</label>
                    <textarea class="form-control" id="motivation" name="motivation" rows="3" required></textarea>
                </div>
                <div class="form-group">
                    <label for="disponibilite">Disponibilité :</label>
                    <select class="form-control" id="Disponibilité" name="d">
                        <option value="">Choisir...</option>
                        <option value="semaine">En Semaine</option>
                        <option value="Week-End">Les Week-End</option>

</select>               
                 </div>
                <button type="submit" class="btn btn-primary">Envoyer</button>
            </form>
        </div>
    </div>

<div class="container-fluid bg-dark footer mt-5 py-5 wow fadeIn" data-wow-delay="0.1s">
        <div class="container py-5">
            <div class="row g-5">
                <div class="col-lg-3 col-md-6">
                    <h4 class="text-primary mb-4">Contact</h4>
                    <p class="mb-2"><i class="fa fa-map-marker-alt text-primary me-3"></i>Côte d'Ivoire, Abidjan</p>
                    <p class="mb-2"><i class="fa fa-phone-alt text-primary me-3"></i>+225 0709095378</p>
                    <p class="mb-2"><i class="fa fa-envelope text-primary me-3"></i>operations.geniebio@gmail.com</p>
                    <div class="d-flex pt-3">
                        <a class="btn btn-square btn-primary rounded-circle me-2" href="https://www.facebook.com/ongeniebio"><i class="fab fa-facebook-f"></i></a>
                        <a class="btn btn-square btn-primary rounded-circle me-2" href="https://www.linkedin.com/company/ong-genie-bio/"><i class="fab fa-linkedin-in"></i></a>
                    </div>
                </div>
                <div class="col-lg-3 col-md-6">
                    <h4 class="text-primary mb-4">Rubriques</h4>
                    <a class="btn btn-link" href="">Accueil</a>
                    <a class="btn btn-link" href="">A Propos de nous</a>
                    <a class="btn btn-link" href="">Projets</a>
                    <a class="btn btn-link" href="">Donation</a>
                    <a class="btn btn-link" href="">Contact</a>
                </div>

<div class="col-lg-3 col-md-6">
                    <h4 class="text-primary mb-4">Accés rapide</h4>
                    <a class="btn btn-link" href="projets.html">Projets</a>
                    <a class="btn btn-link" href="donation.html">Donation</a>
                    <a class="btn btn-link" href="rejoins-nous.html">Communauté</a>
                </div>
                <div class="col-lg-3 col-md-6">
                    <h4 class="text-primary mb-4">Newsletter</h4>
                    <div class="position-relative w-100">
                        <input class="form-control bg-transparent w-100 py-3 ps-4 pe-5" type="text" placeholder="Votre email" style="color: #D7E0E4;">
                        <button type="button" class="btn btn-primary py-2 position-absolute top-0 end-0 mt-2 me-2">Envoyer</button>
                    </div>
                </div>
            </div>
        </div>
    </div>

<div class="container-fluid copyright py-4">
        <div class="container">
            <div class="row">
                <div class="col-md-6 text-center text-md-start mb-3 mb-md-0">
                    &copy; <a class="fw-medium" href="#">GénieBio</a>
                </div>
                <div class="col-md-6 text-center text-md-end">
                    Fait par <a class="fw-medium" href="https://www.digifemmes.com">DigiFemmes</a>
                </div>
            </div>
        </div>
    </div>

<a href="#" class="btn btn-lg btn-primary btn-lg-square rounded-circle back-to-top"><i class="bi bi-arrow-up"></i></a>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0/dist/js/bootstrap.bundle.min.js"></script>
    <script src="lib/wow/wow.min.js"></script>
    <script src="lib/easing/easing.min.js"></script>
    <script src="lib/waypoints/waypoints.min.js"></script>
    <script src="lib/owlcarousel/owl.carousel.min.js"></script>

<script src="js/main.js"></script>
</body>

</html>

Back to Directory File Manager