Assignment2/index.html at main · Emtiaz01/Assignment2 · 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
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link
        href="https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;900&family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400&family=Mulish:ital,wght@0,200..1000;1,200..1000&family=Open+Sans:ital,wght@1,700&family=Work+Sans:wght@500&display=swap"
        rel="stylesheet">
    <title>Assignment2</title>
    <link rel="stylesheet" href="styles/styles.css">
    <link rel="stylesheet" href="styles/responsive.css">
    <script src="https://kit.fontawesome.com/a076d05399.js" crossorigin="anonymous"></script>
</head>

<body>
    <header>
        <nav class="header-section">
            <div class="nav-container">
                <img src="Images/Group 40071 (2).png">
                <p>Happy <span style="color: #FF5400;">Travel</span></p>
            </div>
            <div class="items-container">
                <a href=""><span style="color: #FF5400;font-weight: 700;">Home</span></a>
                <a href="">Package</a>
                <a href="">Testimonial</a>
                <a href="">Blog</a>
                <a href="">Contact</a>
            </div>
            <div class="three-lines">
                <img src="Images/Frame.jpg">
            </div>
        </nav>
        <section class="banner-section">
            <div class="banner-img">
                <img src="Images/Group 13 (1) (1).png">
            </div>
            <div class="banner-heading">
                <h1>Explore Your Travel</h1>
            </div>
            <div class="banneer-paragraph">
                <p>It's an invitation to a world of unforgettable experiences and boundless joy. As you set out on your
                    journey, may each step be sprinkled with laughter, every mile filled with discovery, and every
                    destination greeted with the warmth of new beginnings. </p>
            </div>
            <div class="banner-inputs">
                <div>
                    <input class="input1" type="text" name="" id="" placeholder=" Where go">
                </div>
                <div>
                    <select class="input2">
                        <option value="0">When</option>
                        <option value="1">Saturday</option>
                        <option value="2">Sunday</option>
                        <option value="3">Monday</option>
                        <option value="4">Tuesday</option>
                        <option value="5">Wednesday</option>
                        <option value="6">Thursday</option>
                        <option value="7">Friday</option>
                    </select>
                </div>
                <div>
                    <select class="input3">
                        <option value="0">Select Type</option>
                        <option value="1">Family Travel</option>
                        <option value="2">Solo Travel</option>
                        <option value="3">Luxury Travel</option>
                        <option value="4">Budget Travel</option>
                    </select>
                </div>
                <div>
                    <button class="input4">Find Now</button>
                </div>
            </div>
        </section>
    </header>

    <main>
        <div class="main-part">
            <div class="main-text">
                <h2>Our Popular Tours</h2>
                <p>Embark on extraordinary adventures with Our Popular Tours, curated to provide unforgettable
                    experiences. Immerse yourself in the allure of diverse cultures, witness breathtaking landscapes,
                    and create lasting memories with our carefully crafted itineraries.</p>
                <ul type="disc">
                    <li>Our Popular Tours cover a spectrum of destinations, from vibrant cities to serene natural
                        landscapes, ensuring a well-rounded and diverse travel experience.</li>
                    <li>Enjoy a restful stay at carefully selected accommodations that balance comfort and authenticity,
                        ensuring a relaxing retreat after each day of exploration.</li>
                    <li>Each tour is meticulously planned and designed by travel experts, offering a seamless blend of
                        must-see attractions and hidden gems for a comprehensive and enriching journey.</li>
                </ul>
                <div class="main-paragraph2">
                    <p>Whether you crave the thrill of adventure, the serenity of nature, or the richness of cultural
                        exploration, Our Popular Tours promise to be a journey beyond the ordinary. Join us on these
                        sought-after expeditions, where every step is a story and every destination a masterpiece
                        waiting to be discovered.</p>
                </div>
                <div class="main-button">
                    <button>Read More</button>
                </div>
            </div>
            <div class="main-image">
                <img src="Images/Rectangle 4.png">
            </div>
        </div>

        <div class="destination">
            <h2>Choose Your Destination</h2>
            <p>Choose your destination, and let the world become your canvas, waiting to be painted with the
                brushstrokes of your unique travel story. </p>
        </div>
        <div class="destination-images">
            <div class="destination-group1">
                <img class="maldives" src="Images/Rectangle 5.png">
                <img class="indonasia" src="Images/Rectangle 8.png" alt="">
            </div>
            <div class="image-name">
                <p class="name1">Maldives</p>
                <p class="name2">Indonasia</p>
            </div>
            <div class="destination-group2">
                <img class="srilanka" src="Images/Rectangle 6.png">
                <img class="north-america" src="Images/Rectangle 7.png">
                <img class="kashmir" src="Images/Rectangle 9.png">
            </div>
            <div class="image-name2">
                <p class="name3">Srilanka</p>
                <p class="name4">North-America</p>
                <p class="name5">Kashmir</p>
            </div>
            <div class="destination-group3">
                <img class="bangladesh" src="Images/Rectangle 11.png">
                <img class="bandarban" src="Images/Rectangle 10.png">
            </div>
            <div class="image-name2">
                <p class="name6">Bangladesh</p>
                <p class="name7">Bandarban</p>
            </div>
        </div>

        <div class="choose-us">
            <h2>Why Choose Us</h2>
            <p>We allows you to focus on the enjoyment of your journey while leaving the intricate details in the hands
                of professionals dedicated to making your trip memorable.</p>
        </div>

        <div class="small-bannerr">
            <div class="small-bannerr1">
                <img src="Images/hotel 1.png">
                <h3>Handpicked Hotels</h3>
                <p>Discover a world of sophistication and comfort as we present our carefully curated selection of
                    handpicked hotels. Each establishment embodies the epitome of hospitality, promising a unique and
                    unforgettable stay.</p>
            </div>
            <div class="small-banner2">
                <img src="Images/map 1.png">
                <h3>World Class Service</h3>
                <p>we take pride in offering a level of service that transcends expectations, providing you with an
                    unparalleled journey of comfort and satisfaction. Our commitment to world-class service is not just
                    a promise; it's a standard woven into every aspect of your experience.</p>
            </div>
            <div class="small-banner3">
                <img src="Images/price-tag 1.png">
                <h3>Best Price Guarantee</h3>
                <p>we understand that getting the best value for your travel investment is essential. That's why we
                    proudly offer our Best Price Guarantee, ensuring you receive unbeatable prices and unparalleled
                    savings when you book with us.</p>
            </div>
        </div>

        <div class="own-part">
            <h1 class="own-heading">Our Recent Articles</h1>
            <div class="own-images">
                <img class="image1" src="Images/maldives.jpg">
                <img class="image2" src="Images/bandarban.jpg">
                <img class="image3" src="Images/north-america.jpg">
            </div>
            <div class="own-text1">
                <h3>Maldives - Couple Tour</h3>
                <h2>Fly To Maldives to Explore the real Blueness of the Sea</h2>
            </div>
            <div class="own-text2">
                <h3>Bandarban - Family Tour</h3>
                <h2>Bangladesh is a Green Land and to see this come to Bandarban</h2>
            </div>
            <div class="own-text3">
                <h3>North-America - Solo Tour</h3>
                <h2>The rugged beauty of the Rockies, diverse cultural tapestry of this continent await your
                    exploration.</h2>
            </div>
        </div>

        <div class="newsletter">
            <div class="form">
                <h3>Newsletter</h3>
                <p>To get latest news & tour plans sign up today!</p>
                <hr>
                <div class="inputs">
                    <div>
                        <input class="newsinput" type="text" placeholder="Enter your name">
                    </div>
                    <div>
                        <input class="newsinput1" type="email" placeholder="Enter your email">
                    </div>
                    <div>
                        <button class="newsbutton">Subscribe</button>
                    </div>
                </div>
            </div>
            <div class="news-image">
                <img class="news-img" src="Images/Rectangle 8 (1).png">
                <button class="image-button">Happy Travel.com<br><h2>Save up to 70%</h2></button>
            </div>
        </div>
    </main>

    <footer>
        <div class="footer-section">
            <div class="footer-heading">
                <div class="footer-image">
                    <img src="Images/Group 40071 (2).png">
                </div>
                <div class="footer-tittle">
                    <h3>Happy<span style="color: #FF5400;">Travel</span></h3>
                </div>
            </div>
            <div class="footer-paragraph">
                <p>Happy Travel is not just a destination; it's a state of mind where every moment becomes a cherished memory. Bon voyage to a world where smiles are the only currency, and the destination is happiness itself.</p>
            </div>
            <div class="footer-social">
                <img src="Images/Social.png">
                <hr>
                <p>2017, All Rights Reserved.</p>
            </div>

        </div>
    </footer>
</body>

</html>