website2/index.html at main · website-google/website2 · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Kalash Marriage Lawn</title>
  <link rel="stylesheet" href="style.css">
  <link href="https://fonts.googleapis.com/css2?family=Italiana&family=Playfair+Display:wght@400;600;700&display=swap" rel="stylesheet">
</head>
<body>

  <!-- Header -->
  <header>
    <button class="menu-icon" id="menuToggle">☰</button>
    <a href="index.html" class="logo-link">
      <img src="images/logo3.png" alt="Kalash Marriage Lawn Logo" class="logo">
    </a>
  </header>

  <!-- Side Menu -->
  <nav id="sideMenu" class="side-menu">
    <button class="closebtn" id="menuClose">×</button>
    <a href="index.html">Home</a>
    <a href="photos.html">Photos</a>
    <a href="aboutus.html">About Us</a>
    <a href="owners.html">Owners</a>
    <a href="contactus.html">Contact Us</a>
  </nav>
  <div id="overlay" class="overlay"></div>

  <!-- Recognition Banner (stacked vertically) -->
<section class="recognition-container">
  <div class="recognition-banner">
    <div class="recog-text">
      <h1>Upto 70% off</h1>
      <h2>on Prime Decor Items</h2>
      <p>Kalash Marriage Lawn has been celebrated for its Ethnic Elegance and Luxurious Experience — 2025</p>
      <p class="awards">2005 • 2010 • 2015 • 2020 • 2025</p>
    </div>
  </div>

  <div class="recognition-image">
    <div class="recog-text">
      <div class="recog-image">
        <img src="images/Logo.png" alt="Recognition Image">
      </div>
    </div>
  </div>
</section>


  <!-- Enquiry Section -->
  <section class="enquiry-section">
    <div class="enquiry-overlay">
      <h2>Enquiry</h2>
      <form id="whatsappForm">
        <input type="text" id="name" placeholder="Your Name" required>
        <input type="email" id="email" placeholder="Your Email" required>
        <textarea id="message" placeholder="Your Message" rows="5" required></textarea>
        <button type="submit">Submit Enquiry</button>
      </form>
    </div>
  </section>

  <!-- Offers Section -->
  <section class="offers-section">
  <div class="offers-container">
    <h2 class="offers-heading">🎉 Upto 70% Off on Select Prime Items!</h2>
    <p class="offers-subtext">Celebrate your special day with unmatched elegance and savings at Kalash Marriage Lawn.</p>
    <div class="offers-buttons">
      <a href="aboutus.html" class="offers-btn">About Us</a>
      <a href="https://wa.me/916388028416" class="offers-btn whatsapp-btn" target="_blank">Contact Us</a>
    </div>
  </div>
</section>


  <!-- Slideshow -->
  <a href="photos.html" class="slideshow-link">
  <section class="slideshow-wrapper">
    <div class="slideshow-overlay">
      <h2>KALASH MARRIAGE LAWN</h2>
      <p>Ethnic, Luxurious, Authentic</p>
    </div>
    <div class="slideshow">
      <img src="images/img-1.jpg" alt="Stage">
      <img src="images/img-2.webp" alt="Bar">
      <img src="images/img-3.webp" alt="Buffet">
      <img src="images/img-4.webp" alt="Open Air Buffet">
      <img src="images/img-5.webp" alt="Outdoor Space">
      <img src="images/img-6.webp" alt="Stage">
      <img src="images/img-7.webp" alt="Open Air Lawn">
      <img src="images/img-8.webp" alt="Outdoor Seating Space">
      <img src="images/img-9.webp" alt="Outdoor VIP Area">
      <img src="images/img-10.webp" alt="Open Air Lawn">
      <img src="images/img-1.jpg" alt="Stage">
      <img src="images/img-2.webp" alt="Bar">
      <img src="images/img-3.webp" alt="Buffet">
      <img src="images/img-4.webp" alt="Open Air Buffet">
      <img src="images/img-5.webp" alt="Outdoor Space">
      <img src="images/img-6.webp" alt="Stage">
      <img src="images/img-7.webp" alt="Open Air Lawn">
      <img src="images/img-8.webp" alt="Outdoor Seating Space">
      <img src="images/img-9.webp" alt="Outdoor VIP Area">
      <img src="images/img-10.webp" alt="Open Air Lawn">
    </div>
    <button class="prev" onclick="changeSlide(-1)">❮</button>
    <button class="next" onclick="changeSlide(1)">❯</button>
  </section>
  </a>

  <!-- Map Button-->
   <section class="map-section">
  <div class="map-container">
    <!-- Embedded Google Map (shows by default) -->
    <iframe src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d13907.479645599504!2d81.03402638118607!3d26.86798141473913!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x399be2675fe81431%3A0x23a1e850bbf7a951!2skalash%20Marriage%20Lawn!5e1!3m2!1sen!2sin!4v1763826612518!5m2!1sen!2sin"
    width="100%" height="400" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>

    <!-- Button that opens Google Maps -->
    <div class="map-button-container">
      <a href="https://maps.app.goo.gl/ADbus59ijtA4rEXC9"
         target="_blank"
         class="map-btn">
        Open Maps
      </a>
    </div>
  </div>
</section>

  <!-- Review Generator -->
  <section class="generator">
    <h2>DROP A QUICK REVIEW</h2>
    <div class="review-card">
      <p id="reviewText"></p>
      <div class="review-actions">
        <button id="copyBtn">📋 Copy</button>
        <button id="newReviewBtn">🔄 New Review</button>
        <a id="mapsBtn" class="review-btn" target="_blank">⭐ Post Review</a>
      </div>
    </div>
    <p id="copyMsg" class="copy-msg"></p>
  </section>

  <!-- Footer -->
  <footer class="luxury-footer">
    <p>&copy; 2025 Kalash Marriage Lawn | Designed by Ishu</p>
  </footer>

  <script src="script.js"></script>
</body>
</html>