File "products.html"

Full Path: /home/chawlag2/public_html/bikes/assets/img/portfolio/products.html
File size: 4 KB
MIME-type: text/html
Charset: utf-8

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

<head>
  <meta charset="utf-8">
  <meta content="width=device-width, initial-scale=1.0" name="viewport">

  <title>E-Bikes Variants</title>
  <meta content="" name="description">
  <meta content="" name="keywords">

  <!-- Favicons -->
  <link href="assets/img/logo.png" rel="icon">

  <!-- Google Fonts -->
  <link
    href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Raleway:300,300i,400,400i,500,500i,600,600i,700,700i|Poppins:300,300i,400,400i,500,500i,600,600i,700,700i"
    rel="stylesheet">
  <link href="https://fonts.cdnfonts.com/css/airstrike" rel="stylesheet">

  <!-- Vendor CSS Files -->
  <link href="assets/vendor/animate.css/animate.min.css" rel="stylesheet">
  <link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
  <link href="assets/vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
  <link href="assets/vendor/boxicons/css/boxicons.min.css" rel="stylesheet">
  <link href="assets/vendor/glightbox/css/glightbox.min.css" rel="stylesheet">
  <link href="assets/vendor/remixicon/remixicon.css" rel="stylesheet">
  <link href="assets/vendor/swiper/swiper-bundle.min.css" rel="stylesheet">

  <!-- Template Main CSS File -->
  <link href="assets/css/style.css" rel="stylesheet">

  <style>
    /* Overlay */
    .zoom-product .overlay {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: rgba(0, 0, 0, 0.4);
      /* Semi-transparent black */
      color: white;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      opacity: 0;
      transition: opacity 0.3s ease;
      border-radius: 10px;
    }

    /* Show overlay on hover */
    .zoom-product:hover .overlay {
      opacity: 1;
    }

    .zoom-product .overlay h4 {
      margin: 0;
      font-size: 60px;
      font-family: 'Airstrike', sans-serif;
    }

    .airstrike {
      font-family: 'Airstrike', sans-serif;
    }
  </style>

  <!-- =======================================================
  * Template Name: Sailor
  * Template URL: https://bootstrapmade.com/sailor-free-bootstrap-theme/
  * Updated: Mar 17 2024 with Bootstrap v5.3.3
  * Author: BootstrapMade.com
  * License: https://bootstrapmade.com/license/
  ======================================================== -->
</head>

<body>
  <a href="https://api.whatsapp.com/send?phone=+923114995162&text=Hello" class="float" target="_blank">
    <i class="bi bi-whatsapp"></i>
  </a>

  <!-- ======= Header ======= -->
  <header id="header" class="sticky-top d-flex align-items-center"
    style="background: linear-gradient(90deg, #a7a8a4 0%, #a58b78 100%) !important;">
    <div class="container d-flex align-items-center">

      <h1 class="logo me-auto"><a href="../index.html"><img src="assets/img/logo2.png" class="img-fluid"
            style="width: 130px;" alt=""></a></h1>
      <!-- Uncomment below if you prefer to use an image logo -->
      <!-- <a href="index.html" class="logo me-auto"><img src="assets/img/logo.png" alt="" class="img-fluid"></a>-->

      <nav id="navbar" class="navbar">
        <ul>
          <li><a href="index.html">Home</a></li>
          <li><a href="about.html">About Us</a></li>
          <li><a href="products.html" class="active">Products</a></li>
          <!-- <li><a href="social.html">Social Responsibility</a></li> -->
          <!-- <li><a href="#">Gallery</a></li> -->
          <li><a href="#">Sitemap</a></li>
          <li><a href="contact.html">Contact Us</a></li>
          <li><a href="distributor.html">Apply As Distributor</a></li>
          <li><a href="https://global.qjmotor.com/"><img src="assets/img/logo_white.png" class="img-fluid"
                style="height: 60px;" alt=""></a></li>
          <li><a href="index.html"><img src="assets/img/nexusNew.png" class="img-fluid" style="width: 120px;"
                alt=""></a>
          </li>