index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" type="text/css" href="vendors/css/grid.css" />
    <link rel="stylesheet" type="text/css" href="vendors/css/normalize.css" />
    <link
      rel="stylesheet"
      type="text/css"
      href="vendors/css/ionicons.min.css"
    />
    <link rel="stylesheet" type="text/css" href="resources/css/style.css" />
    <link rel="stylesheet" type="text/css" href="resources/css/queries.css" />
    <link rel="preconnect" href="https://fonts.gstatic.com" />
    <!-- Google Font -->
    <link
      href="https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;1,300&display=swap"
      rel="stylesheet"
    />
    <!-- Font Awesome -->
    <link
      rel="stylesheet"
      type="text/css"
      href="assets/css/font-awesome.min.css"
    />
    <script
      src="https://kit.fontawesome.com/28942a5a95.js"
      crossorigin="anonymous"
    ></script>
    <title>Bharat Dental Clinic</title>
  </head>
  <body id="page-top">
    <header>
      <a href="#page-top" class="logo-1"
        ><img src="resources/img/Bharat Logo.png" alt="logo" class="logo"
      /></a>
      <nav>
        <!-- <a href="#page-top" class="logo-1"
          ><img src="resources/img/starmedLogo.png" alt="logo" class="logo"
        /></a> -->
        <div class="row-top">
          <!-- <a href="#page-top" class="logo-1"
            ><img src="resources/img/starmedLogo.png" alt="logo" class="logo"
          /></a> -->
          <a href="#page-top" class="logo-2"
            ><img
              src="resources/img/Bharat Logo.png"
              alt="logo-black"
              class="logo-black"
          /></a>
          <ul class="main-nav js--main-nav">
            <li><a href="#About" class="about-nav">About Us</a></li>
            <li><a href="#doctors" class="doctors-nav">Doctors</a></li>
            <li><a href="#Services" class="services-nav">Services</a></li>
            <li><a href="#gallery" class="gallery-nav">Gallery</a></li>
            <li> <a href="#testimonials" class="testimonials-nav">Testimonials</a> </li>
            <li><a href="#contact" class="address-nav">Address</a></li>
          </ul>
          <a class="burger-menu js--nav-icon"
            ><i class="ion-navicon-round"></i
          ></a>
        </div>
      </nav>
      <div class="heroTB_and_Picture">
        <div class="hero-text-box">
          <!-- <h1 class="clinic_name">DR. FAZIL'S</h1> -->
          <h1>&nbsp;Dr. Rahul's</h1>
          <h1 class="clinic_name">Bharat Dental Care & Orthodontic Centre</h1>
          <a class="btn btn-full" href="#"><i class="fa fa-bell"></i> Book your Appointment</a>
         <!-- <img class="Picture" src="resources/css/img/whitebackgrounddental.webp"> -->
        </div>
        <img class="Picture" src="resources/css/img/13192.jpg">
      </div> 
    </header>
    <!--------------------- ABOUT US ------------------------------------------>
    <section id="About" class="sticky-nav-js">
      <div class="row">
        <h2>
          About Us
        </h2>
        <p class="description">
          The goal of our dental clinic is to provide dental treatments 
           which you can trust, especially when it comes to quality, ethics, hygiene and a proper
           follow up till your needs are completed.
          We work on machineries which are completely up to date. 
          We offer you the TRUST and ETHICS which can be matched by none.
        </p>
      </div>
    </section>

    <!--------------------- DOCTORS -------------------------------------------->
    <section id="doctors">

      <div class="row">
        <h2>Our Dental Team</h2>
      </div>

      <div class="row">
        <div class="col span-1-of-3 box1">
          <img src="resources/img/D1.jpg" style="margin-bottom: 20px" />
          <h4>Dr. Fazil</h4>
          <div class="doc-detail">
            <i class="fas fa-user-md icon-small"></i> Chief Dental Surgeon
            <br />
          </div>
          <div class="doc-detail">
            <i class="far fa-envelope icon-small"></i> dentalclinic@gmail.com

            <br />
          </div>
          <div class="doc-detail">
            <i class="fas fa-phone-alt icon-small"></i> +91 96632 23956 <br />
          </div>
        </div>

        <div class="col span-1-of-3 box1">
          <img src="resources/img/D2.jpg" style="margin-bottom: 20px" />
          <h4>Dr. Ayisha Fida</h4>
          <div class="doc-detail">
            <i class="fas fa-user-md icon-small"></i> Chief Dental Surgeon
            <br />
          </div>
          <div class="doc-detail">
            <i class="far fa-envelope icon-small"></i> dentalclinic@gmail.com

            <br />
          </div>
          <div class="doc-detail">
            <i class="fas fa-phone-alt icon-small"></i> +91 96632 23956 <br />
          </div>
        </div>

        <div class="col span-1-of-3 box1">
          <img src="resources/img/D3.jpg" style="margin-bottom: 20px" />
          <h4>Dr. Aparna</h4>
          <div class="doc-detail">
            <i class="fas fa-user-md icon-small"></i> Chief Dental Surgeon
            <br />
          </div>
          <div class="doc-detail">
            <i class="far fa-envelope icon-small"></i> dentalclinic@gmail.com

            <br />
          </div>
          <div class="doc-detail">
            <i class="fas fa-phone-alt icon-small"></i> +91 96632 23956 <br />
          </div>
        </div>
      </div>
    </section>

    <!--------------------- SERVICES -------------------------------------------->
    <section id="Services">
      <div class="row">
        <h2>Key Treatments</h2>
      </div>
      <div class="row">
        <div class="col span-1-of-4">
          <div class="box">
            <img
              class="services-icon"
              src="resources/css/icon-svg/root-canal.svg"
              alt="Composite"
            />
            <h3>Root Canal</h3>
          </div>
        </div>
        <div class="col span-1-of-4 box">
          <img
            class="services-icon"
            src="resources/css/icon-svg/tooth-filling.svg"
            alt="Denture"
          />
          <h3>Tooth Filling</h3>
        </div>
        <div class="col span-1-of-4 box">
          <img
            class="services-icon"
            src="resources/css/icon-svg/pedon.png"
            alt="Crown"
          />
          <h3>Paedodontics</h3>
        </div>
        <div class="col span-1-of-4 box">
          <img
            class="services-icon"
            src="resources/css/icon-svg/tooth-impacted-2654295-2200616.webp"
            alt="Disimpaction"
          />
          <h3>Disimpaction</h3>
        </div>
      </div>
      <div class="row">
        <div class="col span-1-of-4">
          <div class="box">
            <img
              class="services-icon"
              src="resources/css/icon-svg/tooth-extraction.svg"
              alt="Extraction"
            />
            <h3>Extraction</h3>
          </div>
        </div>
        <div class="col span-1-of-4 box">
          <img
            class="services-icon"
            src="resources/css/icon-svg/prosthetic"
            alt="Mucogingival Surgery"
          />
          <h3>Prosthesis</h3>
        </div>
        <div class="col span-1-of-4 box">
          <img
            class="services-icon"
            src="resources/css/icon-svg/tooth-whitening.svg"
            alt="Polishing"
          />
          <h3>Polishing</h3>
        </div>
        <div class="col span-1-of-4 box">
          <img
            class="services-icon"
            src="resources/css/icon-svg/crown.svg"
            alt="Restoration"
          />
          <h3>Implant</h3>
        </div>
      </div>
    </section>

    <!--------------------- GALLERY -------------------------------------------->
    <!-- <section id="gallery">
      <div class="row">
        <h2>Gallery</h2>
      </div>
      <ul class="gallery-showcase">
        <li>
          <figure class="gallery-photo">
            <img src="resources/img/ga1.jpg" alt="" />
          </figure>
        </li>
        <li>
          <figure class="gallery-photo">
            <img src="resources/img/ga2.jpg" alt="" />
          </figure>
        </li>
        <li>
          <figure class="gallery-photo">
            <img src="resources/img/ga3.jpg" alt="" />
          </figure>
        </li>
        <li>
          <figure class="gallery-photo">
            <img src="resources/img/ga4.jpg" alt="" />
          </figure>
        </li>
        <li>
          <figure class="gallery-photo">
            <img src="resources/img/ga5.jpg" alt="" />
          </figure>
        </li>
        <li>
          <figure class="gallery-photo">
            <img src="resources/img/ga6.jpg" alt="" />
          </figure>
        </li>
        <li>
          <figure class="gallery-photo">
            <img src="resources/img/ga7.jpg" alt="" />
          </figure>
        </li>
        <li>
          <figure class="gallery-photo">
            <img src="resources/img/ga8.jpg" alt="" />
          </figure>
        </li>
        <li>
          <figure class="gallery-photo">
            <img src="resources/img/ga9.jpg" alt="" />
          </figure>
        </li>
      </ul>
    </section> -->

    <div id="gallery">
      <div class="row">
        <h2>Gallery</h2>
      </div>
      <div class="galleryImages">
        <img class="GalleryItem" src="resources/img/G1.jpg"/>
        <img class="GalleryItem" src="resources/img/G2.jpg"/>
        <img class="GalleryItem" src="resources/img/G3.jpg"/>
        <img class="GalleryItem" src="resources/img/G4.jpg"/>
        <img class="GalleryItem" src="resources/img/G5.jpg"/>
        <img class="GalleryItem" src="resources/img/G01.jpg"/>
        <img class="GalleryItem" src="resources/img/G7.jpg"/>
        <img class="GalleryItem" src="resources/img/G8.jpg"/>
        <img class="GalleryItem" src="resources/img/G9.jpg"/>
      </div>
    </div>

    <!--------------------- TESTIMONIALS -------------------------------------------->
    <section id="testimonials">
      <div class="row">
        <!-- <h2>What Our Customers Say</h2>
      </div>
      <div class="row">
        <div class="col span-1-of-3">
          <blockquote>
            Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
            nisi ut aliquip ex ea commodo consequat.Duis aute irure dolor in
            reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
            pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
            culpa qui officia deserunt mollit anim id est laborum.
            <cite><img src="resources/img/R1.jpg" /> Tracy Gilbert</cite>
          </blockquote>
        </div>
        <div class="col span-1-of-3">
          <blockquote>
            Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
            nisi ut aliquip ex ea commodo consequat.
            <cite><img src="resources/img/R2.jpg" /> Adam Nicholas</cite>
          </blockquote>
        </div>
        <div class="col span-1-of-3">
          <blockquote>
            Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
            nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in
            reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
            pariatur.
            <cite><img src="resources/img/R3.jpg" /> Dwayne Johnson</cite>
          </blockquote>
        </div>
        <div class="col span-1-of-3">
          <blockquote>
            Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
            nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in
            reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
            pariatur.
            <cite><img src="resources/img/R3.jpg" /> Dwayne Johnson</cite>
          </blockquote>
        </div>
        <div class="col span-1-of-3">
          <blockquote>
            Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
            nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in
            reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
            pariatur.
            <cite><img src="resources/img/R3.jpg" /> Dwayne Johnson</cite>
          </blockquote>
        </div>
        <div class="col span-1-of-3">
          <blockquote>
            Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
            nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in
            reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
            pariatur.
            <cite><img src="resources/img/R3.jpg" /> Dwayne Johnson</cite>
          </blockquote>
        </div> -->

        <script src="https://apps.elfsight.com/p/platform.js" defer></script>
<div class="elfsight-app-04330198-8582-489d-a5fe-2c1ea61ae72b"></div>
      </div>
    </section>

    <!--------------------- CONTACT US -------------------------------------------->

    <section id="contact">
      <div class="row">
        <h2>Contact Us</h2>
      </div>
      <div class="row">
        <h3 id="address">Radhas Building, Chalil Bazar, Puthiyangadi, Kozhikode, Kerala 673021</h3>
      </div>
      <div class="row">
        <iframe
          src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3912.42903074761!2d75.7608002!3d11.303319399999998!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x3ba65efd649f8a1d%3A0x2225632eb07c47f5!2sDr%20Rahul&#39;s%20Bharat%20Dental%20Care%20%26%20Orthodontic%20Centre!5e0!3m2!1sen!2sin!4v1658482315872!5m2!1sen!2sin" 
          width="100%"
          height="550"
          aria-hidden="false"
          tabindex="0"
        ></iframe>
      </div>
      <div class="row">
        <h4 id="timing">Business Hours : 10:00 AM - 6:30 PM <br>(Closed On Sundays)</h4>
      </div>
      <div class="row">
        <h4 id="contact-no">For Booking : +91 89210 21395</h4>
      </div>
    </section>

    <footer>
      <div class="row">
        <p>Copyright &copy; 2022 by Hypha.</p>
      </div>
    </footer>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="vendors/js/jquery.waypoints.min.js"></script>
    <script src="resources/js/script.js"></script>
  </body>
</html>