FPZ.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Flipkart Plus Zone</title>
    <link rel="stylesheet" href="./index.css" />
    <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
    <style>
      body {
        font-family: Arial, sans-serif;
        margin: 0;
        padding: 0;
        background-color: #f1f3f6;
      }
      .header {
        background-color: #2874f0;
        color: white;
        padding: 10px 20px;
        display: flex;
        justify-content: space-between;
        align-items: center;
      }
      .header .logo {
        font-size: 24px;
        font-weight: bold;
      }
      .header .search-bar {
        flex: 1;
        margin: 0 20px;
      }
      .header .search-bar input {
        width: 100%;
        padding: 10px;
        border: none;
        border-radius: 4px;
      }
      .header .options {
        display: flex;
        gap: 20px;
      }
      .banner {
        background-image:url('https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRtZ5ediPrmW2u1hdiQi8hvbeEjVKXu1e0PXCFd-N1m9g&s');
        background-size: cover;
        background-position: center;
        height: 400px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: white;
        font-size: 36px;
        font-weight: bold;
      }
      .container {
        padding: 20px;
      }
      .product-list {
        display: flex;
        flex-wrap: wrap;
        gap: 20px;
      }
      .product {
        background-color: white;
        padding: 20px;
        border-radius: 4px;
        width: calc(25% - 20px);
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
      }
      .product img {
        width: 100%;
        border-bottom: 1px solid #eee;
        padding-bottom: 15px;
      }
      .product .name {
        font-size: 18px;
        font-weight: bold;
        margin: 10px 0;
      }
      .product .price {
        color: #2874f0;
        font-size: 16px;
        font-weight: bold;
      }
      
    </style>
  </head>
  <body>
    <div class="header">
      <div class="logo">Flipkart Plus</div>
      <div class="search-bar">
        <input type="text" placeholder="Search for products, brands and more" />
      </div>
      <div class="options">
        <div>Login</div>
        <div>More</div>
        <div>Cart</div>
      </div>
    </div>
    <div class="banner">
      Welcome to Flipkart Plus Zone
    </div>
    <div class="container">
      <div class="product-list">
        <div class="product">
          <img src="phone-6.webp" alt="Product Image" />
          <div class="name">Moto G</div>
          <div class="price">₹9999</div>
        </div>
        <div class="product">
          <img src="phone-2.webp" alt="Product Image" />
          <div class="name">Poco M6 </div>
          <div class="price">₹11,999</div>
        </div>
        <div class="product">
          <img src="phone-3.webp" alt="Product Image" />
          <div class="name">Poco C65</div>
          <div class="price">₹21,999</div>
        </div>
        <div class="product">
          <img src="phone-5.webp" alt="Product Image" />
          <div class="name">Moto A14</div>
          <div class="price">₹19,999</div>
        </div>
      </div>
    </div>

    <footer>
      <div class="foot-top">
        <div class="foot-left">
          <div class="about">
            <h5>ABOUT</h5>
            <ul>
              <li><a href="">Contact Us</a></li>
              <li><a href="">About Us</a></li>
              <li><a href="">Careers</a></li>
              <li><a href="">Flipkart Stories</a></li>
              <li><a href="">Press</a></li>
              <li><a href="">Corporate Information</a></li>
             <li><i><a href="">Explore Plus</a></i></li>
            </ul>
          </div>
          <div class="about">
            <h5>GROUP COMPANIES</h5>
            <ul>
              <li><a href="https://www.myntra.com/">Myntra</a></li>
              <li><a href="https://www.flipkartwholesale.com/">Flipkart Wholesale</a></li>
              <li><a href="https://www.cleartrip.com/">Cleartrip</a></li>
              <li><a href="https://www.shopsy.in/">Shopsy</a></li>
            </ul>
          </div>
          <div class="about">
            <h5>HELP</h5>
            <ul>
              <li><a href="">Payments</a></li>
              <li><a href="">Shipping</a></li>
              <li><a href="">Cancellation & Returns</a></li>
              <li><a href="">FAQ</a></li>
              <li><a href="">Report Infringement</a></li>
            </ul>
          </div>
          <div class="about">
            <div id="policy">
              <h5>CONSUMER POLICY</h5>
              <ul>
                <li><a href="">Cancellation & Returns</a></li>
                <li><a href="">Terms Of Use</a></li>
                <li><a href="">Security</a></li>
                <li><a href="">Privacy</a></li>
                <li><a href="">Sitemap</a></li>
                <li><a href="">Grievance Redressal</a></li>
                <li><a href="">EPR Compilance</a></li>
              </ul>
            </div>
          </div>
        </div>
  
        <div class="foot-right">
          <div class="part">
            <div class="mail">
              <h5>Mail Us:</h5>
              <p>
                Flipkart Internet Private Limited,
                Buildings Alyssa, Begonia & Clove Embassy Tech Village,
                Outer Ring Road, Devarabeesanahalli Village, Bengaluru, 560103, Karnataka, India
              </p>
            </div>
            <div class="social">
              <h5>Social</h5>
              <ul>
                <li><a href="https://www.facebook.com/flipkart/"><i class="bi bi-facebook"></i></a></li>
                <li><a href="https://twitter.com/Flipkart"><i class="bi bi-twitter"></i></a></li>
                <li><a href="https://www.youtube.com/flipkart"><i class="bi bi-youtube"></i></a></li>
              </ul>
            </div>
          </div>
          <div class="office">
            <h5>Registered Office Address:</h5>
            <p>Flipkart Internet Private Limited,
              Buildings Alyssa, Begonia & Clove Embassy Tech Village,
              Outer Ring Road, Devarabeesanahalli Village, Bengaluru, 560103, Karnataka, India</p>
            <p>CIN : U51109KA2012PTC066107</p>
            <P>Telephone: <a href="">044-45614700</a></P>
          </div>
        </div>
      </div>
      <div class="foot-down">
  
        <div>
  
          <ul>
            <li><a href=""><i class="bi bi-briefcase-fill"></i> Become a seller</a></li>
            <li><a href=""><i class="bi bi-gift-fill"></i> Gift Cards</a></li>
            <li><a href=""><i class="bi bi-question-circle-fill"></i> Help Center</a></li>
            <div>
              <li>&copy;<span class="update_Cyear"></span> Flipkart.com</li>
            </div>
           </ul>
        </div>
  
        
        <div class="payment-icons">
          <img src="visa.jpeg" alt="Visa">
          <img src="mastercard.jpeg" alt="Mastercard">
          <img src="images/rupay.png" alt="rupay">
          <img src="images/discover.png" alt="discover">
          <img src="images/emi.png" alt="emi">
          <img src="images/net_banking.png" alt="net banking">
          <img src="images/cod.png" alt="cash on delivery">
        </div>
      </div>
    </footer>
  </body>
</html>