| <!DOCTYPE html> |
| <html lang="en"> |
|
|
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <title>Center for Biblical Studies - About Us</title> |
| <script src="https://cdn.tailwindcss.com"></script> |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> |
| <link rel="stylesheet" href="styles.css"> |
| </head> |
|
|
| <body class="font-sans bg-gray-50"> |
| |
| <nav class="bg-white shadow-lg sticky top-0 z-50"> |
| <div class="max-w-7xl mx-auto px-4"> |
| <div class="flex justify-between items-center h-20"> |
| <div class="flex items-center"> |
| <i class="fas fa-bible text-3xl text-amber-500 mr-2"></i> |
| <span class="text-xl font-bold text-gray-800">Centre d'Études Bibliques</span> |
| </div> |
| <div class="hidden md:flex space-x-8 items-center"> |
| <a href="index.html" |
| class="nav-link text-gray-800 hover:text-amber-500 px-3 py-2 rounded-md text-sm font-medium transition duration-300">Accueil</a> |
| <a href="blogs.html" |
| class="nav-link text-gray-800 hover:text-amber-500 px-3 py-2 rounded-md text-sm font-medium transition duration-300">Blogs</a> |
| <a href="values.html" |
| class="nav-link text-gray-800 hover:text-amber-500 px-3 py-2 rounded-md text-sm font-medium transition duration-300">Nos |
| Valeurs</a> |
|
|
| <div class="language-selector ml-4"> |
| <button class="flex items-center text-gray-800 hover:text-amber-500"> |
| <i class="fas fa-globe mr-1"></i> |
| <span>English</span> |
| <i class="fas fa-chevron-down ml-1 text-xs"></i> |
| </button> |
| <div class="language-dropdown"> |
| <a href="#" class="flex items-center"> |
| <span class="mr-2">🇬🇧</span> English |
| </a> |
| <a href="#" class="flex items-center"> |
| <span class="mr-2">🇫🇷</span> Français |
| </a> |
| </div> |
| </div> |
| </div> |
| <div class="md:hidden"> |
| <button class="mobile-menu-button p-2 focus:outline-none"> |
| <i class="fas fa-bars text-gray-800 text-xl"></i> |
| </button> |
| </div> |
| </div> |
| </div> |
| |
| <div class="mobile-menu hidden md:hidden bg-white"> |
| <div class="px-2 pt-2 pb-3 space-y-1 sm:px-3"> |
| <a href="index.html" |
| class="block px-3 py-2 rounded-md text-base font-medium text-gray-800 hover:text-amber-500">Home</a> |
| <a href="blogs.html" |
| class="block px-3 py-2 rounded-md text-base font-medium text-gray-800 hover:text-amber-500">Blogs</a> |
| <a href="values.html" |
| class="block px-3 py-2 rounded-md text-base font-medium text-gray-800 hover:text-amber-500">Our |
| Values</a> |
| <div class="pt-2 border-t border-gray-200"> |
| <div class="flex items-center px-3 py-2"> |
| <i class="fas fa-globe mr-2 text-gray-800"></i> |
| <span class="text-gray-800 mr-2">Language:</span> |
| <select class="border border-gray-300 rounded px-2 py-1 text-sm"> |
| <option>English</option> |
| <option>Français</option> |
| </select> |
| </div> |
| </div> |
| </div> |
| </div> |
| </nav> |
|
|
| |
| <section id="about-hero" class="about-hero flex items-center justify-center text-center text-white relative"> |
| <div class="px-4 max-w-4xl mx-auto"> |
| <h1 class="text-4xl md:text-6xl font-bold mb-6 animate-fade-in">À Propos de Notre Ministère</h1> |
| <p class="text-xl md:text-2xl mb-8">Découvrez notre mission, nos valeurs et l'équipe dédiée à l'étude biblique et à l'éducation chrétienne.</p> |
| <div class="flex flex-col sm:flex-row justify-center gap-4"> |
| <a href="#mission" |
| class="btn-primary bg-amber-500 hover:bg-amber-600 text-white font-bold py-3 px-6 rounded-full text-lg transition duration-300"> |
| <i class="fas fa-cross mr-2"></i> Notre Mission |
| </a> |
| <a href="#team" |
| class="btn-primary bg-transparent hover:bg-white hover:text-gray-900 border-2 border-white text-white font-bold py-3 px-6 rounded-full text-lg transition duration-300"> |
| <i class="fas fa-users mr-2"></i> Rencontrer l'Équipe |
| </a> |
| </div> |
| </div> |
| <div class="absolute bottom-10 left-0 right-0 text-center"> |
| <a href="#about-content" class="text-white animate-bounce"> |
| <i class="fas fa-chevron-down text-3xl"></i> |
| </a> |
| </div> |
| </section> |
|
|
| |
| <section id="about-content" class="py-20 bg-white"> |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> |
| <div class="text-center mb-16"> |
| <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">Notre Histoire</h2> |
| <div class="w-20 h-1 bg-amber-500 mx-auto"></div> |
| <p class="text-gray-600 max-w-4xl mx-auto mt-6 text-lg"> |
| Fondé en 2005, le Centre d'Études Bibliques a été créé pour offrir une étude biblique rigoureuse |
| accessible à tous les croyants. Ce qui a commencé comme un petit groupe d'étude est devenu un ministère |
| international touchant des milliers de personnes à travers nos publications, ressources en ligne et programmes éducatifs. |
| </p> |
| </div> |
|
|
| |
| <div class="relative max-w-4xl mx-auto"> |
| <div class="relative grid grid-cols-1 gap-8"> |
| |
| <div class="timeline-item relative pl-16 pb-16"> |
| <div |
| class="absolute left-0 top-0 flex items-center justify-center w-10 h-10 rounded-full bg-amber-500 text-white"> |
| <i class="fas fa-seedling"></i> |
| </div> |
| <h3 class="text-xl font-bold text-gray-800 mb-2">2005 - Débuts Modestes</h3> |
| <p class="text-gray-600"> |
| Commencé comme un groupe d'étude biblique hebdomadaire dans le sous-sol d'une église locale avec seulement 12 membres. |
| Notre fondateur, le Dr Michael Johnson, a vu le besoin d'une compréhension biblique plus profonde parmi les croyants laïcs. |
| </p> |
| </div> |
|
|
| |
| <div class="timeline-item relative pl-16 pb-16"> |
| <div |
| class="absolute left-0 top-0 flex items-center justify-center w-10 h-10 rounded-full bg-amber-500 text-white"> |
| <i class="fas fa-book"></i> |
| </div> |
| <h3 class="text-xl font-bold text-gray-800 mb-2">2010 - Première Publication</h3> |
| <p class="text-gray-600"> |
| Publication de notre premier guide d'étude sur l'Évangile de Jean, devenu rapidement une ressource |
| utilisée par les églises à travers le pays. Cela marqua notre transition vers un ministère d'édition. |
| </p> |
| </div> |
|
|
| |
| <div class="timeline-item relative pl-16 pb-16"> |
| <div |
| class="absolute left-0 top-0 flex items-center justify-center w-10 h-10 rounded-full bg-amber-500 text-white"> |
| <i class="fas fa-globe"></i> |
| </div> |
| <h3 class="text-xl font-bold text-gray-800 mb-2">2015 - Expansion Numérique</h3> |
| <p class="text-gray-600"> |
| Lancement de notre plateforme en ligne, rendant nos ressources disponibles mondialement. |
| Notre premier voyage d'étude international en Israël a connecté l'Écriture avec son contexte géographique. |
| </p> |
| </div> |
|
|
| |
| <div class="timeline-item relative pl-16"> |
| <div |
| class="absolute left-0 top-0 flex items-center justify-center w-10 h-10 rounded-full bg-amber-500 text-white"> |
| <i class="fas fa-church"></i> |
| </div> |
| <h3 class="text-xl font-bold text-gray-800 mb-2">2020 - Aujourd'hui</h3> |
| <p class="text-gray-600"> |
| Nous servons maintenant plus de 50 000 abonnés dans 120 pays avec une équipe de 12 érudits et |
| éducateurs. |
| Nos ressources sont utilisées dans les séminaires, églises et études personnelles à travers le monde. |
| </p> |
| </div> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section id="mission" class="py-20 bg-gray-50"> |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> |
| <div class="text-center mb-16"> |
| <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">Notre Mission & Valeurs</h2> |
| <div class="w-20 h-1 bg-amber-500 mx-auto"></div> |
| <p class="text-gray-600 max-w-2xl mx-auto mt-4">Principes directeurs qui façonnent tout ce que nous faisons</p> |
| </div> |
|
|
| <div class="grid md:grid-cols-3 gap-8"> |
| |
| <div |
| class="mission-card bg-white p-8 rounded-lg shadow-md text-center transition duration-300 hover:shadow-lg"> |
| <div class="mission-icon mb-4 text-4xl text-gray-700"> |
| <i class="fas fa-bible"></i> |
| </div> |
| <h3 class="text-xl font-bold text-gray-800 mb-3">Fidélité Biblique</h3> |
| <p class="text-gray-600"> |
| Nous nous engageons envers l'autorité et la suffisance des Écritures, les interprétant de manière responsable |
| dans leurs contextes historiques et littéraires. |
| </p> |
| </div> |
|
|
| |
| <div |
| class="mission-card bg-white p-8 rounded-lg shadow-md text-center transition duration-300 hover:shadow-lg"> |
| <div class="mission-icon mb-4 text-4xl text-gray-700"> |
| <i class="fas fa-graduation-cap"></i> |
| </div> |
| <h3 class="text-xl font-bold text-gray-800 mb-3">Excellence Académique</h3> |
| <p class="text-gray-600"> |
| Notre équipe maintient les plus hauts standards d'érudition tout en rendant les concepts |
| théologiques complexes accessibles à tous les croyants. |
| </p> |
| </div> |
|
|
| |
| <div |
| class="mission-card bg-white p-8 rounded-lg shadow-md text-center transition duration-300 hover:shadow-lg"> |
| <div class="mission-icon mb-4 text-4xl text-gray-700"> |
| <i class="fas fa-hands-helping"></i> |
| </div> |
| <h3 class="text-xl font-bold text-gray-800 mb-3">Application Pratique</h3> |
| <p class="text-gray-600"> |
| Nous comblons le fossé entre la connaissance biblique et la vie chrétienne, aidant les croyants |
| à appliquer les Écritures à la vie quotidienne. |
| </p> |
| </div> |
| </div> |
|
|
| <div class="mt-16 bg-amber-50 border-l-4 border-amber-500 p-6 rounded"> |
| <div class="flex"> |
| <div class="flex-shrink-0"> |
| <i class="fas fa-quote-left text-3xl text-amber-500"></i> |
| </div> |
| <div class="ml-4"> |
| <p class="text-lg italic text-gray-700"> |
| "Notre vision est de voir chaque croyant équipé d'une compréhension profonde des Écritures qui |
| transforme leur relation avec Dieu et influence leurs communautés pour Christ." |
| </p> |
| <p class="mt-4 font-medium text-gray-800"> |
| — Dr Michael Johnson, Fondateur & Directeur |
| </p> |
| </div> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section id="team" class="py-20 bg-white"> |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> |
| <div class="text-center mb-16"> |
| <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">Rencontrez Notre Équipe</h2> |
| <div class="w-20 h-1 bg-amber-500 mx-auto"></div> |
| <p class="text-gray-600 max-w-2xl mx-auto mt-4">Érudits et éducateurs dévoués engagés envers la vérité biblique</p> |
| </div> |
|
|
| <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-8"> |
| |
| <div class="team-card bg-white rounded-lg shadow-md overflow-hidden transition duration-300"> |
| <img src="https://images.unsplash.com/photo-1560250097-0b93528c311a?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=687&q=80" |
| alt="Dr. Michael Johnson" class="w-full h-64 object-cover"> |
| <div class="p-6"> |
| <h3 class="text-xl font-bold text-gray-800 mb-1">Dr Michael Johnson</h3> |
| <p class="text-amber-500 font-medium mb-3">Fondateur & Directeur</p> |
| <p class="text-gray-600 mb-4"> |
| PhD in Biblical Studies from Oxford University. Specializes in Pauline epistles and early |
| church history. |
| Author of 12 books on biblical interpretation. |
| </p> |
| <div class="flex space-x-4"> |
| <a href="#" class="text-gray-500 hover:text-amber-500 transition duration-300"> |
| <i class="fab fa-twitter"></i> |
| </a> |
| <a href="#" class="text-gray-500 hover:text-amber-500 transition duration-300"> |
| <i class="fab fa-linkedin"></i> |
| </a> |
| <a href="#" class="text-gray-500 hover:text-amber-500 transition duration-300"> |
| <i class="fas fa-envelope"></i> |
| </a> |
| </div> |
| </div> |
| </div> |
|
|
| |
| <div class="team-card bg-white rounded-lg shadow-md overflow-hidden transition duration-300"> |
| <img src="https://images.unsplash.com/photo-1573496359142-b8d87734a5cd?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=688&q=80" |
| alt="Dr. Elizabeth Thompson" class="w-full h-64 object-cover"> |
| <div class="p-6"> |
| <h3 class="text-xl font-bold text-gray-800 mb-1">Dr. Elizabeth Thompson</h3> |
| <p class="text-amber-500 font-medium mb-3">Senior Researcher</p> |
| <p class="text-gray-600 mb-4"> |
| PhD in Old Testament Studies from Yale Divinity School. Expert in Hebrew poetry and wisdom |
| literature. |
| Leads our Holy Land study tours. |
| </p> |
| <div class="flex space-x-4"> |
| <a href="#" class="text-gray-500 hover:text-amber-500 transition duration-300"> |
| <i class="fab fa-twitter"></i> |
| </a> |
| <a href="#" class="text-gray-500 hover:text-amber-500 transition duration-300"> |
| <i class="fab fa-linkedin"></i> |
| </a> |
| <a href="#" class="text-gray-500 hover:text-amber-500 transition duration-300"> |
| <i class="fas fa-envelope"></i> |
| </a> |
| </div> |
| </div> |
| </div> |
|
|
| |
| <div class="team-card bg-white rounded-lg shadow-md overflow-hidden transition duration-300"> |
| <img src="https://images.unsplash.com/photo-1568602471122-7832951cc4c5?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" |
| alt="Dr. Robert Chen" class="w-full h-64 object-cover"> |
| <div class="p-6"> |
| <h3 class="text-xl font-bold text-gray-800 mb-1">Dr. Robert Chen</h3> |
| <p class="text-amber-500 font-medium mb-3">Theology Department Head</p> |
| <p class="text-gray-600 mb-4"> |
| PhD in Systematic Theology from Princeton Theological Seminary. Focuses on Christology and |
| theological method. |
| Editor of our quarterly theological journal. |
| </p> |
| <div class="flex space-x-4"> |
| <a href="#" class="text-gray-500 hover:text-amber-500 transition duration-300"> |
| <i class="fab fa-twitter"></i> |
| </a> |
| <a href="#" class="text-gray-500 hover:text-amber-500 transition duration-300"> |
| <i class="fab fa-linkedin"></i> |
| </a> |
| <a href="#" class="text-gray-500 hover:text-amber-500 transition duration-300"> |
| <i class="fas fa-envelope"></i> |
| </a> |
| </div> |
| </div> |
| </div> |
| </div> |
|
|
| <div class="text-center mt-12"> |
| <a href="#contact" |
| class="btn-primary inline-block bg-amber-500 hover:bg-amber-600 text-white font-bold py-3 px-6 rounded-full text-lg transition duration-300"> |
| <i class="fas fa-paper-plane mr-2"></i> Contact Our Team |
| </a> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16 bg-amber-500 text-white"> |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> |
| <div class="grid md:grid-cols-4 gap-8 text-center"> |
| <div class="p-4"> |
| <div class="text-4xl font-bold mb-2">18</div> |
| <div class="text-lg">Years Serving</div> |
| </div> |
| <div class="p-4"> |
| <div class="text-4xl font-bold mb-2">50K+</div> |
| <div class="text-lg">Subscribers</div> |
| </div> |
| <div class="p-4"> |
| <div class="text-4xl font-bold mb-2">120</div> |
| <div class="text-lg">Countries Reached</div> |
| </div> |
| <div class="p-4"> |
| <div class="text-4xl font-bold mb-2">12</div> |
| <div class="text-lg">Scholars</div> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section id="contact" class="py-20 bg-gray-50"> |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> |
| <div class="text-center mb-16"> |
| <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">Get In Touch</h2> |
| <div class="w-20 h-1 bg-amber-500 mx-auto"></div> |
| <p class="text-gray-600 max-w-2xl mx-auto mt-4">We'd love to hear from you. Reach out with questions, |
| comments, or speaking inquiries.</p> |
| </div> |
|
|
| <div class="grid md:grid-cols-2 gap-12"> |
| <div> |
| <form class="space-y-6"> |
| <div> |
| <label for="name" class="block text-sm font-medium text-gray-700 mb-1">Full Name</label> |
| <input type="text" id="name" |
| class="w-full px-4 py-2 border border-gray-300 rounded-md focus:ring-amber-500 focus:border-amber-500" |
| placeholder="Your name"> |
| </div> |
| <div> |
| <label for="email" class="block text-sm font-medium text-gray-700 mb-1">Email |
| Address</label> |
| <input type="email" id="email" |
| class="w-full px-4 py-2 border border-gray-300 rounded-md focus:ring-amber-500 focus:border-amber-500" |
| placeholder="Your email"> |
| </div> |
| <div> |
| <label for="subject" class="block text-sm font-medium text-gray-700 mb-1">Subject</label> |
| <select id="subject" |
| class="w-full px-4 py-2 border border-gray-300 rounded-md focus:ring-amber-500 focus:border-amber-500"> |
| <option>General Inquiry</option> |
| <option>Speaking Request</option> |
| <option>Study Tour Information</option> |
| <option>Publication Questions</option> |
| </select> |
| </div> |
| <div> |
| <label for="message" class="block text-sm font-medium text-gray-700 mb-1">Message</label> |
| <textarea id="message" rows="5" |
| class="w-full px-4 py-2 border border-gray-300 rounded-md focus:ring-amber-500 focus:border-amber-500" |
| placeholder="Your message"></textarea> |
| </div> |
| <div> |
| <button type="submit" |
| class="w-full bg-amber-500 hover:bg-amber-600 text-white font-bold py-3 px-6 rounded-md transition duration-300"> |
| Send Message |
| </button> |
| </div> |
| </form> |
| </div> |
| <div> |
| <div class="bg-white p-8 rounded-lg shadow-md h-full"> |
| <h3 class="text-xl font-bold text-gray-800 mb-6">Contact Information</h3> |
|
|
| <div class="space-y-6"> |
| <div class="flex items-start"> |
| <div class="flex-shrink-0 mt-1"> |
| <i class="fas fa-map-marker-alt text-amber-500 text-xl"></i> |
| </div> |
| <div class="ml-4"> |
| <h4 class="text-lg font-medium text-gray-800">Our Location</h4> |
| <p class="text-gray-600">123 Biblical Way<br>Jerusalem, Israel 12345</p> |
| </div> |
| </div> |
|
|
| <div class="flex items-start"> |
| <div class="flex-shrink-0 mt-1"> |
| <i class="fas fa-envelope text-amber-500 text-xl"></i> |
| </div> |
| <div class="ml-4"> |
| <h4 class="text-lg font-medium text-gray-800">Email Us</h4> |
| <p class="text-gray-600">info@biblicalstudies.org<br>support@biblicalstudies.org</p> |
| </div> |
| </div> |
|
|
| <div class="flex items-start"> |
| <div class="flex-shrink-0 mt-1"> |
| <i class="fas fa-phone-alt text-amber-500 text-xl"></i> |
| </div> |
| <div class="ml-4"> |
| <h4 class="text-lg font-medium text-gray-800">Call Us</h4> |
| <p class="text-gray-600">+1 (555) 123-4567<br>Mon-Fri, 9am-5pm EST</p> |
| </div> |
| </div> |
| </div> |
|
|
| <div class="mt-8"> |
| <h4 class="text-lg font-medium text-gray-800 mb-4">Follow Us</h4> |
| <div class="flex space-x-4"> |
| <a href="#" |
| class="w-10 h-10 rounded-full bg-gray-100 flex items-center justify-center text-gray-700 hover:bg-amber-500 hover:text-white transition duration-300"> |
| <i class="fab fa-facebook-f"></i> |
| </a> |
| <a href="#" |
| class="w-10 h-10 rounded-full bg-gray-100 flex items-center justify-center text-gray-700 hover:bg-amber-500 hover:text-white transition duration-300"> |
| <i class="fab fa-twitter"></i> |
| </a> |
| <a href="#" |
| class="w-10 h-10 rounded-full bg-gray-100 flex items-center justify-center text-gray-700 hover:bg-amber-500 hover:text-white transition duration-300"> |
| <i class="fab fa-instagram"></i> |
| </a> |
| <a href="#" |
| class="w-10 h-10 rounded-full bg-gray-100 flex items-center justify-center text-gray-700 hover:bg-amber-500 hover:text-white transition duration-300"> |
| <i class="fab fa-youtube"></i> |
| </a> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <footer class="bg-gray-800 text-white py-12"> |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> |
| <div class="grid grid-cols-1 md:grid-cols-4 gap-8"> |
| <div> |
| <div class="flex items-center mb-4"> |
| <i class="fas fa-bible text-3xl text-amber-500 mr-2"></i> |
| <span class="text-xl font-bold">Center for Biblical Studies</span> |
| </div> |
| <p class="text-gray-400">Equipping believers with biblical knowledge for faithful living and |
| effective ministry.</p> |
| </div> |
|
|
| <div> |
| <h3 class="text-lg font-semibold mb-4">Quick Links</h3> |
| <ul class="space-y-2"> |
| <li><a href="index.html" |
| class="text-gray-400 hover:text-amber-500 transition duration-300">Home</a></li> |
| <li><a href="blog.html" |
| class="text-gray-400 hover:text-amber-500 transition duration-300">Blogs</a></li> |
| <li><a href="#contact" |
| class="text-gray-400 hover:text-amber-500 transition duration-300">Contact</a></li> |
| </ul> |
| </div> |
|
|
| <div> |
| <h3 class="text-lg font-semibold mb-4">Resources</h3> |
| <ul class="space-y-2"> |
| <li><a href="#" class="text-gray-400 hover:text-amber-500 transition duration-300">Study |
| Guides</a></li> |
| <li><a href="#" class="text-gray-400 hover:text-amber-500 transition duration-300">Online |
| Courses</a></li> |
| <li><a href="#" class="text-gray-400 hover:text-amber-500 transition duration-300">Research |
| Papers</a></li> |
| </ul> |
| </div> |
|
|
| <div> |
| <h3 class="text-lg font-semibold mb-4">Newsletter</h3> |
| <p class="text-gray-400 mb-4">Subscribe to receive new blog posts and updates directly to your |
| inbox.</p> |
| <form class="flex"> |
| <input type="email" placeholder="Your email" |
| class="px-4 py-2 w-full rounded-l-md focus:outline-none text-gray-800"> |
| <button type="submit" |
| class="bg-amber-500 hover:bg-amber-600 text-white px-4 py-2 rounded-r-md transition duration-300"> |
| <i class="fas fa-paper-plane"></i> |
| </button> |
| </form> |
| </div> |
| </div> |
|
|
| <div class="border-t border-gray-700 mt-12 pt-8 flex flex-col md:flex-row justify-between items-center"> |
| <p class="text-gray-400 text-sm">© 2023 Center for Biblical Studies. All rights reserved.</p> |
| <div class="flex space-x-6 mt-4 md:mt-0"> |
| <a href="#" class="text-gray-400 hover:text-amber-500 transition duration-300">Privacy Policy</a> |
| <a href="#" class="text-gray-400 hover:text-amber-500 transition duration-300">Terms of Service</a> |
| </div> |
| </div> |
| </div> |
| </footer> |
|
|
| <script> |
| |
| const mobileMenuButton = document.querySelector('.mobile-menu-button'); |
| const mobileMenu = document.querySelector('.mobile-menu'); |
| |
| mobileMenuButton.addEventListener('click', () => { |
| mobileMenu.classList.toggle('hidden'); |
| }); |
| |
| |
| document.querySelectorAll('a[href^="#"]').forEach(anchor => { |
| anchor.addEventListener('click', function (e) { |
| e.preventDefault(); |
| |
| document.querySelector(this.getAttribute('href')).scrollIntoView({ |
| behavior: 'smooth' |
| }); |
| |
| |
| if (!mobileMenu.classList.contains('hidden')) { |
| mobileMenu.classList.add('hidden'); |
| } |
| }); |
| }); |
| </script> |
| <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=echodram/values" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> |
|
|
| </html> |