-
Notifications
You must be signed in to change notification settings - Fork 0
/
asia.html
205 lines (194 loc) · 12.7 KB
/
asia.html
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Asia - TripTale.com</title>
<!--Bootstrap-->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>
<link rel="stylesheet" type="text/css" href="asia.css">
<!--JQuery-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.13.2/jquery-ui.js"></script>
<script src="asia.js"></script>
<!--Google Fonts-->
<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=Enriqueta:wght@600&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Lobster+Two&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Young+Serif&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=DM+Serif+Display&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Raleway:wght@400;700&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@500&family=Noto+Sans+SC:wght@900&display=swap" rel="stylesheet">
</head>
<body>
<!--Navbar-->
<div class="navbarContainer container" style="z-index: 100; position:relative">
<ul class="nav nav-pills row">
<li class="nav-item col">
<a class="nav-link nav1" aria-current="page" href="index.html">Home</a>
</li>
<li class="nav-item dropdown col">
<a class="nav-link nav2 dropdown-toggle" data-bs-toggle="dropdown" role="button" aria-expanded="false">Destinations</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="asia.html">Asia</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="africa.html">Africa</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="australia.html">Australia</a></li>
</ul>
</li>
<li class="nav-item col navMilieu">
<a class="nav-link nav3" href="index.html">Trip<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" fill="currentColor" class="bi bi-globe-asia-australia" viewBox="0 0 16 16">
<path d="m10.495 6.92 1.278-.619a.483.483 0 0 0 .126-.782c-.252-.244-.682-.139-.932.107-.23.226-.513.373-.816.53l-.102.054c-.338.178-.264.626.1.736a.48.48 0 0 0 .346-.027ZM7.741 9.808V9.78a.413.413 0 1 1 .783.183l-.22.443a.6.6 0 0 1-.12.167l-.193.185a.36.36 0 1 1-.5-.516l.112-.108a.45.45 0 0 0 .138-.326M5.672 12.5l.482.233A.386.386 0 1 0 6.32 12h-.416a.7.7 0 0 1-.419-.139l-.277-.206a.302.302 0 1 0-.298.52z"/>
<path d="M8 0a8 8 0 1 0 0 16A8 8 0 0 0 8 0M1.612 10.867l.756-1.288a1 1 0 0 1 1.545-.225l1.074 1.005a.986.986 0 0 0 1.36-.011l.038-.037a.88.88 0 0 0 .26-.755c-.075-.548.37-1.033.92-1.099.728-.086 1.587-.324 1.728-.957.086-.386-.114-.83-.361-1.2-.207-.312 0-.8.374-.8.123 0 .24-.055.318-.15l.393-.474c.196-.237.491-.368.797-.403.554-.064 1.407-.277 1.583-.973.098-.391-.192-.634-.484-.88-.254-.212-.51-.426-.515-.741a7 7 0 0 1 3.425 7.692 1 1 0 0 0-.087-.063l-.316-.204a1 1 0 0 0-.977-.06l-.169.082a1 1 0 0 1-.741.051l-1.021-.329A1 1 0 0 0 11.205 9h-.165a1 1 0 0 0-.945.674l-.172.499a1 1 0 0 1-.404.514l-.802.518a1 1 0 0 0-.458.84v.455a1 1 0 0 0 1 1h.257a1 1 0 0 1 .542.16l.762.49a1 1 0 0 0 .283.126 7 7 0 0 1-9.49-3.409Z"/>
</svg>Tale
</a>
</li>
<li class="nav-item col">
<a class="nav-link nav4" href="plan.html">About Us</a>
</li>
<li class="nav-item col">
<a class="nav-link nav5" href="formulaire.html">Contact us</a>
</li>
</ul>
</div>
<div class="myContainer">
<!--Image-->
<div class="imageContainer">
<image src="https://images.unsplash.com/photo-1492571350019-22de08371fd3?q=80&w=2106&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" class="image"></image>
</div>
<p class="copyright">© Tianshu Liu / Unsplash Images</p>
<!--Asia Title-->
<div class="titleBlockContainer">
<div class="titleContainer">
<h2 class="asiaTitle">Asia</h2>
</div>
<div class="introduction">
<h5>Rich cultures, ancient wisdom, and vibrant festivities await in every corner.</h5>
<p>- Discover the heart of diversity -</p>
</div>
<div class="buttonContainer">
<div class="d-grid gap-2 d-md-flex justify-content-md-end">
<div class="btn-group" role="group" aria-label="Basic outlined example">
<a href="https://www.booking.com/index.fr.html?label=gog235jc-1DCAEoggI46AdIM1gDaE2IAQGYAQ24AQfIAQzYAQPoAQGIAgGoAgO4Aoyoxa0GwAIB0gIkMTQyMDc0ZTQtYTE2Zi00MmE2LTkwODMtMzFlNDczYjFlZDBh2AIE4AIB&sid=306c41821a322984ea596f6d3bf93d7a&aid=397594">
<button type="button" class="btn btn-outline-primary">Accomodation</button>
</a>
<a href="https://www.skyscanner.fr/">
<button type="button" class="btn btn-outline-primary" style="--bs-btn-padding-x: 2.1rem">Flight</button>
</a>
<a href="formulaire.html">
<button type="button" class="btn btn-outline-primary"style="--bs-btn-padding-x: 1.2rem">Contact Us</button>
</a>
</div>
</div>
</div>
</div>
<!--Cards 1-->
<div class="colorContainer">
<div class="cityContainer">
<h1 class="titleCity">Where to next?</h1>
<h6 class="subtitleCity">Top cities in Asia to visit</h6>
</div>
<div class="saveContainer">
<button class="btn btn-outline-danger btnSave" href="https://www.skyscanner.fr/" value="yes"><svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" fill="currentColor" class="bi bi-star" viewBox="0 0 16 16">
<path d="M2.866 14.85c-.078.444.36.791.746.593l4.39-2.256 4.389 2.256c.386.198.824-.149.746-.592l-.83-4.73 3.522-3.356c.33-.314.16-.888-.282-.95l-4.898-.696L8.465.792a.513.513 0 0 0-.927 0L5.354 5.12l-4.898.696c-.441.062-.612.636-.283.95l3.523 3.356-.83 4.73zm4.905-2.767-3.686 1.894.694-3.957a.56.56 0 0 0-.163-.505L1.71 6.745l4.052-.576a.53.53 0 0 0 .393-.288L8 2.223l1.847 3.658a.53.53 0 0 0 .393.288l4.052.575-2.906 2.77a.56.56 0 0 0-.163.506l.694 3.957-3.686-1.894a.5.5 0 0 0-.461 0z"/>
</svg>
Save
</button>
</div>
<div class="cardContainer">
<div class="row row-cols-1 row-cols-md-2 g-4">
<div class="col">
<div class="card card1 h-80">
<img src="https://images.unsplash.com/photo-1532572204213-a43b97556045?q=80&w=2188&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" class="card-img-top" height="350px" width="30px" alt="...">
<div class="card-body">
<h5 class="card-title">Shanghai</h5>
<p class="card-text">A bustling metropolis in China, is known for its modern skylineand a vibrant blend of Eastern and Western cultures. It's a major financial center with bustling shopping districts, diverse cuisine.</p>
</div>
</div>
</div>
<div class="col">
<div class="card card2 h-80">
<img src="https://images.unsplash.com/photo-1580054964025-b212c87078c8?q=80&w=2235&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" class="card-img-top" height="350px" width="30px" alt="...">
<div class="card-body">
<h5 class="card-title">Singapore</h5>
<p class="card-text">Singapore, a city-state in Southeast Asia, is renowned for its multicultural atmosphere, stunning skyline, global financial hub and lush green spaces ith a blend of modernity and tradition.</p>
</div>
</div>
</div>
<div class="col">
<div class="card card3 h-80">
<img src="https://images.unsplash.com/photo-1588732807335-2132a3f9489e?q=80&w=2187&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" class="card-img-top" height="350px" width="20px" alt="...">
<div class="card-body">
<h5 class="card-title">Bangkok</h5>
<p class="card-text">Thailand's capital city, is known for its modern development, vibrant street life, ornate shrines, and bustling markets. Key attractions include the Grand Palace, Wat Pho temple, and the lively Khao San Road.</p>
</div>
</div>
</div>
<div class="col">
<div class="card card 4">
<img src="https://plus.unsplash.com/premium_photo-1678303397238-76250a5ebf73?q=80&w=2187&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" class="card-img-top" height="350px" width="20px" alt="...">
<div class="card-body">
<h5 class="card-title">Kuala Lumpur</h5>
<p class="card-text">he capital of Malaysia, known for its modern skyline dominated by the iconic Petronas Twin Towers. The city blends multicultural influences in its architecture, cuisine like Chinatown and Little India.</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!--Cards 2-->
<div class="colorContainer2">
<div class="placeContainer">
<div class="placeTitleContainer">
<h1 class="titlePlace">3 must-see places</h1>
<h6 class="subtitlePlace">Explore our latest suggestions</h6>
</div>
<div class="cardContainer2">
<div class="row row-cols-1 row-cols-md-3 g-4">
<div class="col">
<div class="card h-100">
<img src="https://images.unsplash.com/photo-1461073116689-3fba0b98a223?q=80&w=2187&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">The Pearl Tower</h5>
<p class="card-text">Famous for its unique architectural design, it stands in the Pudong district and offers panoramic views of the city. This tower, a symbol of China's modern development, features observation decks, a revolving restaurant, and various entertainment options.</p>
</div>
<div class="card-footer">
<small class="text-muted">Last updated 3 hours ago</small>
</div>
</div>
</div>
<div class="col">
<div class="card h-100">
<img src="https://images.unsplash.com/photo-1555841666-851050de3839?q=80&w=2187&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">Singaporean Merlion Park</h5>
<p class="card-text">Known its iconic Merlion statue, a mythical creature with a lion's head and the body of a fish. It's a major symbol of Singapore and a popular spot for tourists, offering spectacular views of Marina Bay and the city's skyline. The park is a must-visit.</p>
</div>
<div class="card-footer">
<small class="text-muted">Last updated 19 hours ago</small>
</div>
</div>
</div>
<div class="col">
<div class="card h-100">
<img src="https://images.unsplash.com/photo-1559217371-a654c1c0f1c5?q=80&w=2187&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">The grand Palace</h5>
<p class="card-text">is a historic complex of buildings at the heart of the city. It has been the official residence of the Kings of Siam since 1782. The palace is renowned for its stunning architecture and intricate details, representing the finest in Thai art. </p>
</div>
<div class="card-footer">
<small class="text-muted">Last updated 1 day ago</small>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>