<% layout('layouts/boilerplate') %>
    <!-- Jumbotron -->
    <div class="container-fluid bg-dark text-light p-5 jumbo">
        <div class="container bg-dark p-5">
            <h1 class="display-4">Welcome to TeleMedico</h1>
            <hr>
            <p>Our team's website for HackRx annual hackathon hosted by Bajaj Finserv. </p>
            <a href="#" class="btn btn-primary">Consult your Doctor</a>
        </div>
    </div>
    <!-- Specialities section -->
    <div class="middle">
        <h2 id="letter">25+ Specialities</h2>
        <div id="overhead">
            <div>
                <p>Consult with top doctors across specialities</p>
            </div>
            <a href="./specialities" class="btn btn-info">See All Specialities</a>
            <!-- <button class="spec"><a href="#">See All Specialities</a></button> -->
        </div>
        <div class="menu" id="scrollmenu">

            <a href="#">
                <div class="img img 1">
                    <img class="specialities-images" src="/img/specialities/1.png" alt="">
                    <a href="#" class="btn btn-info consult">Otology</a>
                </div>
            </a>

            <a href="#">
                <div class="img img2">
                    <img class="specialities-images" src="/img/specialities/2.png" alt="">
                    <a href="#" class="btn btn-info consult">Gynecology</a>
                </div>
            </a>

            <a href="#">
                <div class="img3 img">
                    <img class="specialities-images" src="/img/specialities/3.png" alt="">
                    <a href="#" class="btn btn-info consult">Neurology</a>
                </div>
            </a>

            <a href="#">
                <div class="img4 img">
                    <img class="specialities-images" src="/img/specialities/4.png" alt="">
                    <a href="#" class="btn btn-info consult">Dermatology</a>
                </div>
            </a>

            <a href="#">
                <div class="img img 1">
                    <img class="specialities-images" src="/img/specialities/5.png" alt="">
                    <a href="#" class="btn btn-info consult">Pedtrician</a>
                </div>
            </a>

            <a href="#">
                <div class="img img2">
                    <img class="specialities-images" src="/img/specialities/6.png" alt="">
                    <a href="#" class="btn btn-info consult">Gastroenterology</a>
                </div>
            </a>

            <a href="#">
                <div class="img img 1">
                    <img class="specialities-images" src="/img/specialities/7.png" alt="">
                    <a href="#" class="btn btn-info consult">Nephrology</a>
                </div>
            </a>

            <a href="#">
                <div class="img img2">
                    <img class="specialities-images" src="/img/specialities/8.png" alt="">
                    <a href="#" class="btn btn-info consult">Sexology</a>
                </div>
            </a>

        </div>
        <button id="leftscroll" class="scrollBtn"><i class="bi bi-arrow-left"></i></button>
        <button id="rightscroll" class="scrollBtn"><i class="bi bi-arrow-right"></i></button>
    </div>

    <!-- Benefits Section -->
    <div class="benefits">
        <div class="benefits-wrapper">
            <h2 class="benefits-heading" id="bnf-heading">Benefits of Online Consultation</h2>
            <div class="card">
                <div class="grid-row">
                    <div class="grid-col">
                        <div class="benefit-container-1">
                            <h3 class="heading"> <img src="/img/right2.png" alt="" class="right-icon">Consult Top
                                Doctors 24 x 7</h3>
                            <p>Consult the best Doctors available in various Specialities with multiple years of
                                experience and service</p>
                        </div>
                    </div>
                    <div class="grid-col">
                        <div class="benefit-container-1">
                            <h3 class="heading"> <img src="/img/right2.png" alt="" class="right-icon">Similar Clinic
                                Experience</h3>
                            <p>Experience clinic like consultation through in-built chat feature of TeleMedico</p>
                        </div>
                    </div>
                    <div class="grid-col">
                        <div class="benefit-container-1">
                            <h3 class="heading"> <img src="/img/right2.png" alt="" class="right-icon">Convenient and
                                Easy</h3>
                            <p>Start an instant consultation and check Doctors availability and Appointment within 2
                                minutes and schedule appointment</p>
                        </div>
                    </div>
                    <div class="grid-col">
                        <div class="benefit-container-2">
                            <h3 class="heading"> <img src="/img/right2.png" alt="" class="right-icon">Free Follow Up
                            </h3>
                            <p>Patients will get free consultation for 7 days and get access to chats</p>
                        </div>
                    </div>
                    <div class="grid-col">
                        <div class="benefit-container">
                            <h3 class="heading"> <img src="/img/right2.png" alt="" class="right-icon"> 100% Safe
                                Consultation</h3>
                            <p>Be assured that your online consultation will be fully private and secured</p>
                        </div>
                    </div>
                    <div class="grid-col">
                        <div class="benefit-container">
                            <h3 class="heading"> <img src="/img/right2.png" alt="" class="right-icon">Chat Facility</h3>
                            <p>Built-In chat facility for easy and secure interaction between doctor and patients and
                                pre appointment facility</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- about us -->
    <div id="all-about">
        <h1>About Us</h1>
        <p>
            Have you ever wished for a hassle free doctor's 
            consultation with no long queues and no heaps 
            of prescriptions to be maintained. With the user's 
            time being our utmost priority, TeleMedico is here 
            at your rescue. Here at TeleMedico users have all 
            the facilities of an online doctor’s chamber.With 
            safe and secure consultations and with a set of 
            India’s best doctors onboard Telemedico is all 
            set to amaze its users. With a user friendly and 
            screen responsive website this can be used both on 
            large and small screens at par.With a new feature 
            to check doctor’s availability through online and 
            offline icons users can very easily set their 
            appointments.
        </p>
    </div>
    <!-- /about us -->

    <div id="about-us">
        <h1>Our Approach to healthcare</h1>
        <p>Providing high-quality, trusted, and accessible healthcare is our reason for being</p>
        <div class="connect">
            <img src="/img/connect.svg" alt="">
            <img src="/img/trust.svg" alt="">
            <img src="/img/transparency.svg" alt="">
        </div>
        <div class="connect">
            <span id="cntr">trust</span>
            <span id="cont-cntr">We understand healthcare goes beyond 
                signs, symptoms, diagnosis, and 
                treatment. It’s about the deep connection 
                between doctors and patients that leads 
                to continuous care and sustained, better 
                outcomes.</span>
            <span id="lft">connect</span>
            <span id="cont-lft">TeleMedico works on trust. We are aware of 
                the responsibility placed on us by 30 
                crore+ patients and over a lakh doctors. 
                We always have and always will do 
                everything we possibly can to uphold this 
                trust.</span>
            <span id="rgt">transparency</span>
            <span id="cont-rgt">We believe in full disclosure. We believe in 
                communicating openly and honestly, and 
                holding ourselves to the highest ethical 
                standards.</span>
        </div>
    </div>