contact.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>BAKAME Coders</title>
    <link rel="stylesheet" href="style.css">

    <!-- css for team -->

    <!-- <link rel="stylesheet" href="files/team.css"> -->
    <!-- <link rel="stylesheet" href="/bootstrap.css"> -->
    <!-- <link rel="stylesheet" href="files/lightbox.css"> -->
    <!-- <link rel="stylesheet" href="files/font-awesome.css"> -->
    <link rel="stylesheet" href="files/style-starter.css">

    <!-- <link rel="stylesheet" href="files/about.css"> -->
    <!-- <link rel="stylesheet" href="files/project.css"> -->

    <link href="https://fonts.googleapis.com/css2?family=Raleway:ital@1&display=swap" rel="stylesheet">


    <link rel="shortcut icon" href="files/rounded2.png" type="image/x-icon">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css">
    <!-- <link rel="stylesheet" href="files/service.css"> -->
    <!-- <link rel="stylesheet" href="files/style-starter.css"> -->
    <!-- Font Awesome CDN-->
    <!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css" /> -->
    <!-- Google Font -->
    <!-- <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap" /> -->
    <!-- include offline bootstrap -->
    <link rel="stylesheet" href="files/lib/bs.css">
</head>
<body>
    <header>
        <nav class="navbar navbar-expand-sm bg-dark navbar-dark">
            <div class="container-fluid">
                <a class="navbar-brand" href="#">
                    <img src="files/bg2.png" width="100" height="100">
                    </a>
                    <div class="text-white fs-2 header-title d-lg-none">BAKAME Coders</div>
                    
                     <br>
                <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
                </button>


                <div class="text-white fs-2 header-title-pc d-none  d-lg-block d-flex-none">BAKAME-Coders</div>
                <br>
                <div class="collapse navbar-collapse" id="navbarSupportedContent">
                    
                    <ul class="navbar-nav mx-auto mb-2 mb-lg-0">

                        
                    <li class="nav-item">
                    <a class="nav-link clickable" aria-current="page" href="index.html"><i class="bi bi-house"></i> Home</a>
                    </li>

                    <li class="nav-item">
                    <a class="nav-link clickable" aria-current="page" href="index.html"><i class="bi bi-journal-text"></i> About Us</a>
                    </li>
                    <li class="nav-item">
                    <a class="nav-link" aria-current="page" href="index.html"><i class="bi bi-database-fill-check"></i> Services</a>
                    </li>
                    <li class="nav-item">
                    <a class="nav-link" aria-current="page" href="index.html"><i class="bi bi-laptop"></i> Projects</a>
                    </li>
                    <li class="nav-item">
                    <a class="nav-link" aria-current="page" href="index.html"><i class="bi bi-people-fill"></i> Team</a>
                    </li>
                    <li class="nav-item">
                    <a class="nav-link" aria-current="page" href="#"><i class="bi bi-telephone-fill"></i> Contact Us</a>
                    </li>
                    
                </ul>

                <form class="d-flex" role="search">
                    <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
                    <button class="btn btn-outline-success" type="submit"><i class="bi bi-search"></i></button>
                  </form>
                </div>
            </div>
</nav>
    </header>








    <main class="">
        <center>
            
            <div id="contents">
                <div class="row my5 bg-dark text-white">
                    <div class="col-12 text-center">BAKAME CODERS || CONTACT US</div>
                </div>
                
                
                <section class="w3l-contact-info-main" id="contact">
                    <div class="contact-sec	editContent">
                        <div class="container">
                
                            <div class="d-grid contact-view">
                                <div class="cont-details">
                                  <div class="cont-top margin-up">
                                    <div class="cont-left text-center">
                                        <span class="bi bi-geo-alt text-primary"></span>
                                    </div>
                                    <div class="cont-right">
                                        <h6>Address</h6>
                                        <p class="para"> Kigali-Rwanda</p>
                                        <p class="para"><a href="tel:+250786779666">+250786779666</a></p>
                                    </div>
                                  </div>
                                    <div class="cont-top">
                                        <div class="cont-left text-center">
                                            <span class="bi bi-github text-primary"></span>
                                        </div>
                                        <div class="cont-right">
                                            <h6>Github</h6>
                                            <p class="para"><a href="https://github.com/bakamecoders">@bakamecoders</a></p>
                                        </div>
                                    </div>
                                    <div class="cont-top margin-up">
                                      <div class="cont-left text-center">
                                          <span class="bi bi-envelope text-primary"></span>
                                      </div>
                                      <div class="cont-right">
                                          <h6>Email Us</h6>
                                          <p class="para"><a href="mailto:bakamecoders@gmail.com" class="mail">bakamecoders@gmail.com</a></p>
                                      </div>
                                  </div>
                                    <div class="cont-top">
                                        <div class="cont-left text-center">
                                            <span class="bi bi-instagram text-primary"></span>
                                        </div>
                                        <div class="cont-right">
                                            <h6>instagram</h6>
                                            <p class="para"><a href="https://instagram.com/bakamecoders">@bakamecoders</a></p>
                                        </div>
                                    </div>
                                    <div class="cont-top">
                                        <div class="cont-left text-center">
                                            <span class="bi bi-6-circle text-primary"></span>
                                        </div>
                                        <div class="cont-right">
                                            <h6>Thread</h6>
                                            <p class="para"><a href="https://www.threads.net/@bakamecoders">@bakamecoders</a></p>
                                        </div>
                                    </div>
                                    <div class="cont-top margin-up">
                                        <div class="cont-left text-center">
                                            <span class="bi bi-twitter text-primary"></span>
                                        </div>
                                        <div class="cont-right">
                                            <h6>Twitter</h6>
                                            <p class="para"><a href="https://twitter.com/bakamecoders">@bakamecoders</a></p>
                                        </div>
                                    </div>
                                    
                                    
                                </div>
                
                                <div class="map-content-9">
                                    <form action="#" method="post">
                                        <div class="twice-two">
                                            <input type="text" class="form-control" name="bcName" id="bcName" placeholder="Name" required="">
                                            <input type="email" class="form-control" name="bcSender" id="bcSender" placeholder="Email" required="">
                                        </div>
                                        <div class="twice">
                                            <input type="text" class="form-control" name="bcSubject" id="bcSubject" placeholder="Subject" required="">
                                        </div>
                                        <textarea name="bcMessage" class="form-control" id="bcMessage" placeholder="Message" required=""></textarea>
                                        <button type="submit" class="btn btn-contact">Send Message</button>
                                    </form>
                                </div>
                    </div>
                    <div class="map-iframe mt-5">
                      <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d842.4087610974046!2d30.063032121378935!3d-1.9583473445615578!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x19dca53a18f55547%3A0x39567bcb8df1d1d8!2sBakame%20Coders%20HQ!5e1!3m2!1sen!2srw!4v1690011601010!5m2!1sen!2srw" width="100%" height="200" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
                    </div>
                    </div></div>
                </section>
                

            </div>

        </center>
    </main>








    <footer class="bg-dark">
        <div class="row container-fluid text-white py-5">
            <div class="col-lg-4 col-md-6 col-sm-12 text-center"><b><div class="footer-title">BAKAME Coders</div></b><br>
                <p class="text-center ps-2">
                    <img src="files/nobg.png" alt="" width="150" height="150"> <br>
                    Welcome to Bakame Coders - Where Innovation Meets Excellence! <br><br>
                    
                </p>
            </div>
            <div class="col-lg-3 col-md-6 col-sm-12 text-center"><b><div class="footer-title">Our Location</div></b><br>
                <br>
                
                    <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d842.4087610974046!2d30.063032121378935!3d-1.9583473445615578!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x19dca53a18f55547%3A0x39567bcb8df1d1d8!2sBakame%20Coders%20HQ!5e1!3m2!1sen!2srw!4v1690011601010!5m2!1sen!2srw" width="95%" height="200" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
                
                </div>
            <div class="col-lg-2 col-md-6 col-sm-12 text-center"><b><div class="footer-title">Quick Links</div></b><br>
                <p class="">
                    <ul class="text-center list-unstyled text-decoration-none">

                        <li class="py-2">
                        <a class="bottom-nav text-decoration-none" aria-current="page" onclick="loadPage('home.php')"><i>Home</i></a>
                        </li>
    
                        <li class="py-2">
                        <a class="bottom-nav text-decoration-none" aria-current="page"  onclick="loadPage('about.php')">About Us</a>
                        </li>
                        <li class="py-2">
                        <a class="bottom-nav text-decoration-none" aria-current="page"  onclick="loadPage('services.php')">Services</a>
                        </li>
                        <li class="py-2">
                        <a class="bottom-nav text-decoration-none" aria-current="page"  onclick="loadPage('projects.php')">Projects</a>
                        </li>
                        <li class="py-2">
                        <a class="bottom-nav text-decoration-none" aria-current="page"  onclick="loadPage('team.php')">Team</a>
                        </li>
                        <li class="py-2">
                        <a class="bottom-nav text-decoration-none" aria-current="page"  onclick="loadPage('contact.php')">Contact Us</a>
                        </li>
                    </ul>
                </p>
            </div>
            <div class="col-lg-3 col-md-6 col-sm-12 text-center"><b><div class="footer-title">Contact Us!</div></b><br>
            
            <p class="pt-4 ps-2">
                <i class="bi bi-file-code-fill"></i> Bakame Coders <br>
                <i class="bi bi-geo-alt-fill"></i> Kigali - Rwanda <br>
            </p>

            <p class="pt-4 text-center">
                <a href="mailto:bakamecoder@gmail.com"><i class="bi bi-envelope"></i></a> &nbsp;
                <a href="https://wa.me/250735177666"><i class="bi bi-whatsapp"></i></a> &nbsp;
                <a href="https://github.com/bakamecoders"><i class="bi bi-github"></i></a> &nbsp;
                <a href="https://instagram.com/bakamecoders"><i class="bi bi-instagram"></i></a> &nbsp;
                <a href="https://www.threads.net/@bakamecoders"><i class="bi bi-6-circle"></i></a> &nbsp;
                <a href="https://twitter.com/bakamecoders"><i class="bi bi-twitter"></i></a> &nbsp;
                <a href="https://twitter.com/bakamecoders"><i class="bi bi-facebook"></i></a>
            </p>
            </div>
        </div>
        <div class="row text-center text-white">
            <div class="col-12">
                <p><center> Copyright 2023 All right reserved | Bakame Coders</center></p>
            </div>
        </div>
    </footer>
    
    <script src="js.js"></script>
    <script src="files/lib/bs.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
</body>
</html>