-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
402 lines (378 loc) · 47.6 KB
/
index.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
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
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
<title>weather website</title>
<link rel="shortcut icon" href="./public/Icons/clear.png" type="image/x-icon" sizes="64x64">
<link rel="stylesheet" href="./style.css" />
<!-- google font -->
<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=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap"
rel="stylesheet"
/>
<script
src="https://kit.fontawesome.com/5473ef6cd4.js"
crossorigin="anonymous"
></script>
</head>
<body>
<main>
<div id="overlay">
</div>
<section class="search-recent-section">
<div id="top-bar">
<div id="search-bar">
<input type="search" id="search" placeholder="City Name" />
<button id="search-icon">
<svg
xmlns="http://www.w3.org/2000/svg"
width="15"
height="15"
viewBox="0 0 15 15"
fill="none"
>
<path
d="M5.5 0C8.53757 0 11 2.46243 11 5.5C11 6.74832 10.5841 7.89951 9.88336 8.82257L14.0303 12.9697C14.3232 13.2626 14.3232 13.7374 14.0303 14.0303C13.7641 14.2966 13.3474 14.3208 13.0538 14.1029L12.9697 14.0303L8.82257 9.88336C7.89951 10.5841 6.74832 11 5.5 11C2.46243 11 0 8.53757 0 5.5C0 2.46243 2.46243 0 5.5 0ZM5.5 1.5C3.29086 1.5 1.5 3.29086 1.5 5.5C1.5 7.70914 3.29086 9.5 5.5 9.5C7.70914 9.5 9.5 7.70914 9.5 5.5C9.5 3.29086 7.70914 1.5 5.5 1.5Z"
fill="#919191"
></path>
</svg>
</button>
<div id="error">
<p>Invalid city name</p>
</div>
</div>
<div class="recently-searched">
<div class="cards">
</div>
<div id="shadow"></div>
<div id="shift-buttons">
<button class="shift-button left-shift-top" title="Swipe left"><</button>
<button class="shift-button right-shift-top" title="Swipe right">></button>
</div>
<select name="temp-unit" id="temp-unit">
<option value="metric" class="temp-unit">°C</option>
<option value="imperial" class="temp-unit">°F</option>
</select>
</div>
</div>
</section>
<section id="location-section">
<div class="current-location">
<p class="current-location-name">Type city name</p>
<div id="change-location">
<i class="fa-sharp fa-solid fa-angle-down" id="change-icon"></i>
</div>
</div>
<div id="mylocation">
<p id="location-head">My Location</p>
</div>
</section>
<section id="weather-hero-section">
<article id="weaher-head-time">
<div id="breif">
<p id="weather-head-name">Current weather</p>
<p id="time"></p>
</div>
<div id="temp-main">
<div class="temp-container">
<svg
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
version="1.1"
id="Layer_1"
x="0px"
y="0px"
viewBox="0 0 30 30"
style="enable-background: new 0 0 30 30"
xml:space="preserve"
class="temp-indicator"
>
<path
d="M9.91,19.56c0-0.85,0.2-1.64,0.59-2.38s0.94-1.35,1.65-1.84V5.42c0-0.8,0.27-1.48,0.82-2.03S14.2,2.55,15,2.55 c0.81,0,1.49,0.28,2.04,0.83c0.55,0.56,0.83,1.23,0.83,2.03v9.92c0.71,0.49,1.25,1.11,1.64,1.84s0.58,1.53,0.58,2.38 c0,0.92-0.23,1.78-0.68,2.56s-1.07,1.4-1.85,1.85s-1.63,0.68-2.56,0.68c-0.92,0-1.77-0.23-2.55-0.68s-1.4-1.07-1.86-1.85 S9.91,20.48,9.91,19.56z M11.67,19.56c0,0.93,0.33,1.73,0.98,2.39c0.65,0.66,1.44,0.99,2.36,0.99c0.93,0,1.73-0.33,2.4-1 s1.01-1.46,1.01-2.37c0-0.62-0.16-1.2-0.48-1.73c-0.32-0.53-0.76-0.94-1.32-1.23l-0.28-0.14c-0.1-0.04-0.15-0.14-0.15-0.29V5.42 c0-0.32-0.11-0.59-0.34-0.81C15.62,4.4,15.34,4.29,15,4.29c-0.32,0-0.6,0.11-0.83,0.32c-0.23,0.21-0.34,0.48-0.34,0.81v10.74 c0,0.15-0.05,0.25-0.14,0.29l-0.27,0.14c-0.55,0.29-0.98,0.7-1.29,1.23C11.82,18.35,11.67,18.92,11.67,19.56z M12.45,19.56 c0,0.71,0.24,1.32,0.73,1.82s1.07,0.75,1.76,0.75s1.28-0.25,1.79-0.75c0.51-0.5,0.76-1.11,0.76-1.81c0-0.63-0.22-1.19-0.65-1.67 c-0.43-0.48-0.96-0.77-1.58-0.85V9.69c0-0.06-0.03-0.13-0.1-0.19c-0.07-0.07-0.14-0.1-0.22-0.1c-0.09,0-0.16,0.03-0.21,0.08 c-0.05,0.06-0.08,0.12-0.08,0.21v7.34c-0.61,0.09-1.13,0.37-1.56,0.85C12.66,18.37,12.45,18.92,12.45,19.56z"
/>
</svg>
<p class="default-style sun-moon-max-min">
Max temp <span id="max">35°</span>
</p>
</div>
<div class="temp-container">
<svg
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
version="1.1"
id="Layer_1"
x="0px"
y="0px"
viewBox="0 0 30 30"
style="enable-background: new 0 0 30 30"
xml:space="preserve"
class="temp-indicator"
>
<path
d="M9.91,19.56c0-0.85,0.2-1.64,0.59-2.38s0.94-1.35,1.65-1.84V5.42c0-0.8,0.27-1.48,0.82-2.03S14.2,2.55,15,2.55 c0.81,0,1.49,0.28,2.04,0.83c0.55,0.56,0.83,1.23,0.83,2.03v9.92c0.71,0.49,1.25,1.11,1.64,1.84s0.58,1.53,0.58,2.38 c0,0.92-0.23,1.78-0.68,2.56s-1.07,1.4-1.85,1.85s-1.63,0.68-2.56,0.68c-0.92,0-1.77-0.23-2.55-0.68s-1.4-1.07-1.86-1.85 S9.91,20.48,9.91,19.56z M11.67,19.56c0,0.93,0.33,1.73,0.98,2.39c0.65,0.66,1.44,0.99,2.36,0.99c0.93,0,1.73-0.33,2.4-1 s1.01-1.46,1.01-2.37c0-0.62-0.16-1.2-0.48-1.73c-0.32-0.53-0.76-0.94-1.32-1.23l-0.28-0.14c-0.1-0.04-0.15-0.14-0.15-0.29V5.42 c0-0.32-0.11-0.59-0.34-0.81C15.62,4.4,15.34,4.29,15,4.29c-0.32,0-0.6,0.11-0.83,0.32c-0.23,0.21-0.34,0.48-0.34,0.81v10.74 c0,0.15-0.05,0.25-0.14,0.29l-0.27,0.14c-0.55,0.29-0.98,0.7-1.29,1.23C11.82,18.35,11.67,18.92,11.67,19.56z"
/>
</svg>
<p class="default-style sun-moon-max-min">
Min temp <span id="min">25°</span>
</p>
</div>
</div>
</article>
<article id="hero-main-sec">
<div class="hero-weather-icon-temp">
<img
src="./public/Icons/clear.png"
alt=""
id="hero-weather-icon"
/>
<p id="hero-temp">30</p>
<span id="hero-temp-unit">℃</span>
</div>
<div id="hero-weather-condition-update">
<p id="weather-type">Mostly sunny</p>
<div id="feels-like">
<p id="how-it-feels">Feels like</p>
<p id="feels">31°</p>
</div>
</div>
<div id="sun-moon-rise-set">
<div id="sunrise">
<svg
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
version="1.1"
id="Layer_1"
x="0px"
y="0px"
viewBox="0 0 30 30"
style="enable-background: new 0 0 30 30"
xml:space="preserve"
class="sunrise-set-img"
>
<path
d="M4.11,15.9c0-0.26,0.09-0.47,0.27-0.62c0.14-0.15,0.35-0.23,0.62-0.23h2.08c0.24,0,0.45,0.08,0.6,0.24 c0.16,0.16,0.24,0.36,0.24,0.6c0,0.24-0.08,0.44-0.24,0.61c-0.16,0.17-0.36,0.25-0.6,0.25H5c-0.24,0-0.45-0.08-0.63-0.25 C4.19,16.34,4.11,16.14,4.11,15.9z M5.03,20.98c0-0.23,0.09-0.43,0.26-0.61c0.16-0.16,0.37-0.23,0.61-0.23h18.21 c0.24,0,0.45,0.08,0.62,0.24c0.17,0.16,0.25,0.36,0.25,0.6c0,0.24-0.09,0.44-0.26,0.61s-0.38,0.26-0.61,0.26H5.91 c-0.24,0-0.44-0.09-0.61-0.26S5.03,21.22,5.03,20.98z M7.08,8.81c0-0.26,0.08-0.45,0.23-0.59c0.17-0.18,0.38-0.27,0.62-0.27 c0.24,0,0.44,0.09,0.61,0.27l1.44,1.46c0.18,0.16,0.26,0.36,0.26,0.6c0,0.25-0.08,0.45-0.24,0.61s-0.36,0.24-0.6,0.24 c-0.22,0-0.42-0.08-0.6-0.24L7.31,9.42C7.16,9.28,7.08,9.08,7.08,8.81z M9.68,15.9c0,0.87,0.18,1.65,0.53,2.33 c0.03,0.09,0.11,0.14,0.24,0.14h1.67c0.07,0,0.12-0.02,0.14-0.06c0.02-0.04-0.01-0.1-0.07-0.16c-0.53-0.65-0.8-1.4-0.8-2.25 c0-0.99,0.36-1.84,1.07-2.54c0.71-0.7,1.56-1.05,2.55-1.05c0.99,0,1.84,0.35,2.55,1.05s1.05,1.55,1.05,2.54 c0,0.86-0.27,1.61-0.8,2.25c-0.04,0.06-0.06,0.1-0.06,0.12c-0.01,0.03,0,0.06,0.03,0.07c0.02,0.02,0.06,0.03,0.1,0.03h1.7 c0.09,0,0.16-0.05,0.21-0.14c0.38-0.71,0.56-1.48,0.56-2.33c0-0.96-0.24-1.85-0.72-2.67c-0.48-0.82-1.13-1.47-1.95-1.95 s-1.71-0.72-2.67-0.72s-1.85,0.24-2.67,0.72c-0.82,0.48-1.47,1.13-1.95,1.95C9.91,14.05,9.68,14.94,9.68,15.9z M14.15,7.97V5.88 c0-0.24,0.08-0.44,0.25-0.62C14.57,5.08,14.77,5,15.01,5c0.24,0,0.44,0.09,0.62,0.26c0.17,0.17,0.26,0.38,0.26,0.62v2.09 c0,0.24-0.09,0.44-0.26,0.62c-0.18,0.18-0.38,0.26-0.62,0.26c-0.24,0-0.44-0.09-0.61-0.26C14.23,8.41,14.15,8.21,14.15,7.97z M19.77,10.28c0-0.24,0.08-0.44,0.24-0.6l1.44-1.46c0.17-0.18,0.38-0.27,0.62-0.27c0.25,0,0.46,0.08,0.62,0.25 c0.17,0.17,0.25,0.37,0.25,0.61c0,0.26-0.08,0.46-0.23,0.61l-1.51,1.47c-0.16,0.15-0.36,0.22-0.59,0.22 c-0.25,0.01-0.45-0.07-0.61-0.22C19.85,10.74,19.77,10.53,19.77,10.28z M22.1,15.9c0-0.27,0.08-0.47,0.24-0.62 c0.14-0.15,0.34-0.23,0.59-0.23h2.09c0.24,0,0.45,0.08,0.62,0.24c0.17,0.16,0.26,0.36,0.26,0.6c0,0.24-0.09,0.44-0.26,0.61 c-0.18,0.17-0.38,0.25-0.62,0.25h-2.09c-0.23,0-0.43-0.08-0.59-0.25C22.18,16.34,22.1,16.14,22.1,15.9z"
/>
</svg>
<p class="default-style sun-moon-max-min">
Sunrise<span id="sun-rise-time">4:20am</span>
</p>
</div>
<div id="sunset">
<svg
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
version="1.1"
id="Layer_1"
x="0px"
y="0px"
viewBox="0 0 30 30"
style="enable-background: new 0 0 30 30"
xml:space="preserve"
class="sunrise-set-img"
>
<path
d="M4.93,20.97c0-0.26,0.09-0.47,0.28-0.62c0.14-0.16,0.35-0.23,0.63-0.23h18.34c0.25,0,0.46,0.08,0.64,0.24 c0.18,0.16,0.26,0.37,0.26,0.61c0,0.24-0.09,0.45-0.27,0.62s-0.39,0.27-0.63,0.27H5.84c-0.25,0-0.46-0.09-0.64-0.27 C5.02,21.42,4.93,21.21,4.93,20.97z M6.9,12.68c0-0.26,0.08-0.47,0.23-0.63c0.17-0.18,0.38-0.26,0.65-0.26 c0.23,0,0.43,0.09,0.6,0.26l1.5,1.5c0.18,0.18,0.27,0.39,0.27,0.63c0,0.23-0.09,0.44-0.27,0.62c-0.15,0.18-0.35,0.27-0.6,0.27 s-0.47-0.09-0.64-0.27l-1.5-1.5C6.98,13.15,6.9,12.95,6.9,12.68z M9.83,18.27c-0.04,0.16,0.01,0.23,0.15,0.23h1.49 c0.07,0,0.14-0.06,0.22-0.17c0.3-0.64,0.74-1.14,1.33-1.52s1.24-0.56,1.96-0.56c0.73,0,1.39,0.19,1.99,0.56s1.05,0.88,1.35,1.52 c0.08,0.11,0.16,0.17,0.23,0.17h1.48c0.13,0,0.18-0.08,0.15-0.23c-0.34-1.13-0.99-2.05-1.95-2.76c-0.96-0.71-2.04-1.06-3.25-1.06 c-1.2,0-2.28,0.35-3.23,1.06C10.82,16.22,10.17,17.14,9.83,18.27z M14.14,11.81V9.68c0-0.25,0.08-0.46,0.24-0.64 c0.16-0.18,0.37-0.26,0.61-0.26c0.25,0,0.46,0.09,0.63,0.26c0.17,0.17,0.25,0.39,0.25,0.64v2.14c0,0.26-0.08,0.47-0.25,0.64 c-0.17,0.17-0.38,0.25-0.63,0.25c-0.24,0-0.45-0.09-0.61-0.26S14.14,12.06,14.14,11.81z M19.86,14.18c0-0.24,0.08-0.45,0.25-0.63 l1.54-1.5c0.16-0.18,0.36-0.26,0.62-0.26c0.24,0,0.44,0.08,0.6,0.25s0.23,0.38,0.23,0.64c0,0.26-0.08,0.47-0.23,0.62l-1.48,1.5 c-0.17,0.17-0.36,0.26-0.56,0.28c-0.23,0.02-0.44-0.06-0.65-0.24S19.86,14.43,19.86,14.18z"
/>
</svg>
<p class="default-style sun-moon-max-min">
Sunset <span id="sun-set-time">8:00pm</span>
</p>
</div>
</div>
</article>
<article id="hero-prediction-section">
<p id="weather-description">Expected partly sunny skies. The high will be 30°</p>
</article>
<article id="metric-section">
<div id="sea-level">
<p class="metric-name">Sea level</p>
<p id="sea-value" class="metric-value">49</p>
</div>
<div id="wind">
<p class="metric-name">Wind</p>
<p id="wind-value" class="metric-value">2 Km/h</p>
</div>
<div id="humidity">
<p class="metric-name">Humidity</p>
<p id="humidity-value" class="metric-value">54%</p>
</div>
<div id="visibility">
<p class="metric-name">Visibility</p>
<p id="visibility-value" class="metric-value">4 km</p>
</div>
<div id="pressure">
<p class="metric-name">Pressure</p>
<p id="pressure-value" class="metric-value">1000 mb</p>
</div>
<div id="wind-degre">
<p class="metric-name">Wind degree</p>
<p id="degree-value" class="metric-value">20°</p>
</div>
</article>
</section>
<section id="suggestion">
<article>
<h4>Suggestion for the day</h4>
<div class="suggest-container">
<div class="sug-sub-1">
<div class="sug-sub">
<i class="fa-solid fa-umbrella sug-icons"></i>
<div id="umberala-name">
<p class="sug-name">Umberala</p>
<div class="incate-value">
<div class="indicator"></div>
<p class="sug-value">No need</p>
</div>
</div>
</div>
<div class="sug-sub">
<i class="fa-solid fa-person-running sug-icons"></i>
<div id="outdoor-name">
<p class="sug-name">Outdoor</p>
<div class="incate-value">
<div class="indicator"></div>
<p class="sug-value">No need</p>
</div>
</div>
</div>
<div class="sug-sub">
<i class="fa-solid fa-shirt sug-icons"></i>
<div id="cloth-name">
<p class="sug-name">Clothing</p>
<div class="incate-value">
<div class="indicator"></div>
<p class="sug-value">Shorts</p>
</div>
</div>
</div>
</div>
<div class="sug-sub-1">
<div class="sug-sub">
<i class="fa-solid fa-temperature-three-quarters sug-icons"></i>
<div id="heat-name">
<p class="sug-name">Heatstroke</p>
<div class="incate-value">
<div class="indicator"></div>
<p class="sug-value">Extreme</p>
</div>
</div>
</div>
<div class="sug-sub">
<i class="fa-solid fa-sun-plant-wilt sug-icons"></i>
<div id="uvi-name">
<p class="sug-name">Uv index</p>
<div class="incate-value">
<div class="indicator"></div>
<p class="sug-value">Extreme</p>
</div>
</div>
</div>
<div class="sug-sub">
<i class="fa-solid fa-wind sug-icons"></i>
<div id="wind-deg-name">
<p class="sug-name">Wind degree</p>
<div class="incate-value">
<div class="indicator"></div>
<p class="sug-value">93°</p>
</div>
</div>
</div>
</div>
</div>
</article>
<aside >
<h4>More details...</h4>
<div class="details-container">
<div id="moon-uv-p-i" class="detail-sec">
<div id="moon-phase" class="detail-sub-sub">
<img src="./weather/wi-moon-alt-waning-crescent-1.svg" alt="" class="reuse-icon-size">
<p class="detail-name">Moon phase</p>
<p class="detail-value">Waning crescent</p>
</div>
<div id="uv-index" class="detail-sub-sub">
<img src="./weather/wi-day-sunny-overcast.svg" alt="" class="reuse-icon-size">
<p class="detail-name">UV index</p>
<p class="detail-value">13 <span class="detail-span">Extreme</span></p>
</div>
</div>
<div id="moon-sun-rise" >
<div id="moon-rise-set" class="detail-sec ">
<div id="sun-rise" class="detail-sub-sub">
<img src="./weather/wi-moonrise.svg" alt="" class="reuse-icon-size">
<p class="phase-name">Moonrise</p>
<p class="phase-value">3:00am</p>
</div>
<div class="ill-text">
<div class="illustarate">
<svg width="114" height="110" viewBox="0 0 114 110" xmlns="http://www.w3.org/2000/svg" class="inline-DS-EntryPoint1-1" style="transform: rotate(-2deg);" class="reuse-icon-size"><path fill-rule="evenodd" clip-rule="evenodd" d="M55.05 3.00834C55.366 3.00279 55.6827 3 56 3C56.3173 3 56.634 3.00279 56.95 3.00834C57.5022 3.01804 57.9577 2.57826 57.9674 2.02606C57.9771 1.47386 57.5373 1.01835 56.9851 1.00865C56.6574 1.00289 56.329 1 56 1C55.671 1 55.3426 1.00289 55.0149 1.00865C54.4627 1.01835 54.0229 1.47386 54.0326 2.02606C54.0423 2.57826 54.4978 3.01804 55.05 3.00834ZM62.8576 1.42346C62.3096 1.35528 61.81 1.7443 61.7418 2.29236C61.6736 2.84042 62.0627 3.33998 62.6107 3.40816C63.2381 3.48621 63.8621 3.57522 64.4825 3.675C65.0277 3.7627 65.5409 3.39176 65.6286 2.84648C65.7163 2.3012 65.3453 1.78807 64.8001 1.70037C64.1562 1.59682 63.5087 1.50445 62.8576 1.42346ZM49.3893 3.40816C49.9373 3.33998 50.3264 2.84042 50.2582 2.29236C50.19 1.7443 49.6904 1.35528 49.1424 1.42346C48.4913 1.50445 47.8438 1.59682 47.1999 1.70037C46.6547 1.78807 46.2837 2.3012 46.3714 2.84648C46.4591 3.39176 46.9723 3.7627 47.5175 3.675C48.1379 3.57522 48.7619 3.48621 49.3893 3.40816ZM70.556 2.94703C70.0233 2.80121 69.4733 3.11482 69.3275 3.64751C69.1816 4.18019 69.4953 4.73023 70.0279 4.87606C70.6371 5.04282 71.2419 5.22017 71.8421 5.40792C72.3692 5.57279 72.9301 5.27916 73.095 4.75206C73.2599 4.22496 72.9663 3.664 72.4392 3.49912C71.8161 3.30424 71.1883 3.12013 70.556 2.94703ZM41.9721 4.87606C42.5047 4.73024 42.8184 4.1802 42.6725 3.64751C42.5267 3.11482 41.9767 2.80121 41.444 2.94703C40.8116 3.12014 40.1839 3.30424 39.5608 3.49913C39.0337 3.664 38.7401 4.22496 38.905 4.75206C39.0699 5.27916 39.6308 5.5728 40.1579 5.40792C40.7581 5.22017 41.3629 5.04282 41.9721 4.87606ZM77.9574 5.55817C77.4511 5.33749 76.8618 5.569 76.6411 6.07528C76.4204 6.58156 76.652 7.17088 77.1582 7.39156C77.737 7.64385 78.3104 7.90618 78.8783 8.17833C79.3763 8.41703 79.9735 8.2068 80.2122 7.70877C80.4509 7.21073 80.2407 6.61349 79.7427 6.37478C79.1533 6.09232 78.5582 5.82004 77.9574 5.55817ZM34.8417 7.39157C35.348 7.17088 35.5795 6.58156 35.3589 6.07529C35.1382 5.56901 34.5488 5.33749 34.0426 5.55818C33.4418 5.82005 32.8467 6.09233 32.2573 6.37479C31.7593 6.61349 31.5491 7.21074 31.7878 7.70877C32.0265 8.20681 32.6237 8.41704 33.1217 8.17834C33.6896 7.90619 34.263 7.64386 34.8417 7.39157ZM84.9088 9.20146C84.4392 8.91077 83.8229 9.05581 83.5322 9.5254C83.2415 9.99499 83.3865 10.6113 83.8561 10.902C84.3928 11.2342 84.9232 11.5758 85.4469 11.9264C85.9059 12.2337 86.527 12.1107 86.8342 11.6518C87.1415 11.1929 87.0185 10.5717 86.5596 10.2645C86.0161 9.90065 85.4658 9.54622 84.9088 9.20146ZM28.1439 10.902C28.6135 10.6113 28.7585 9.995 28.4678 9.52541C28.1771 9.05581 27.5608 8.91078 27.0912 9.20147C26.5342 9.54623 25.9839 9.90066 25.4404 10.2645C24.9815 10.5718 24.8585 11.1929 25.1658 11.6518C25.473 12.1107 26.0941 12.2337 26.5531 11.9264C27.0768 11.5758 27.6072 11.2343 28.1439 10.902ZM91.2705 13.7965C90.8469 13.4421 90.2163 13.4983 89.8619 13.9218C89.5075 14.3454 89.5636 14.9761 89.9872 15.3305C90.4712 15.7354 90.9478 16.1488 91.4169 16.5704C91.8276 16.9396 92.4599 16.9059 92.8291 16.4951C93.1983 16.0844 93.1646 15.4521 92.7539 15.0829C92.2672 14.6455 91.7727 14.2166 91.2705 13.7965ZM22.0128 15.3305C22.4364 14.9761 22.4925 14.3455 22.1381 13.9219C21.7837 13.4983 21.1531 13.4422 20.7295 13.7965C20.2273 14.2166 19.7328 14.6455 19.2461 15.0829C18.8354 15.4521 18.8017 16.0844 19.1709 16.4951C19.5401 16.9059 20.1724 16.9396 20.5831 16.5704C21.0522 16.1488 21.5288 15.7354 22.0128 15.3305ZM96.9171 19.2461C96.5479 18.8354 95.9156 18.8017 95.5049 19.1709C95.0941 19.5401 95.0604 20.1724 95.4296 20.5831C95.8512 21.0522 96.2646 21.5288 96.6695 22.0128C97.0239 22.4364 97.6545 22.4925 98.0781 22.1381C98.5017 21.7837 98.5578 21.1531 98.2035 20.7295C97.7834 20.2273 97.3545 19.7328 96.9171 19.2461ZM16.5704 20.5831C16.9396 20.1724 16.9059 19.5401 16.4951 19.1709C16.0844 18.8017 15.4521 18.8354 15.0829 19.2462C14.6455 19.7328 14.2166 20.2273 13.7965 20.7295C13.4421 21.1531 13.4983 21.7837 13.9218 22.1381C14.3454 22.4925 14.9761 22.4364 15.3305 22.0128C15.7354 21.5288 16.1488 21.0522 16.5704 20.5831ZM101.735 25.4404C101.428 24.9815 100.807 24.8585 100.348 25.1658C99.8893 25.473 99.7663 26.0941 100.074 26.5531C100.424 27.0768 100.766 27.6072 101.098 28.1439C101.389 28.6135 102.005 28.7585 102.475 28.4678C102.944 28.1771 103.089 27.5608 102.799 27.0912C102.454 26.5342 102.099 25.9839 101.735 25.4404ZM11.9264 26.5531C12.2337 26.0941 12.1107 25.473 11.6518 25.1658C11.1929 24.8585 10.5717 24.9815 10.2645 25.4404C9.90065 25.9839 9.54622 26.5342 9.20146 27.0912C8.91077 27.5608 9.05581 28.1771 9.5254 28.4678C9.99499 28.7585 10.6113 28.6135 10.902 28.1439C11.2342 27.6072 11.5758 27.0768 11.9264 26.5531ZM105.625 32.2573C105.387 31.7593 104.789 31.5491 104.291 31.7878C103.793 32.0265 103.583 32.6237 103.822 33.1217C104.094 33.6896 104.356 34.263 104.608 34.8417C104.829 35.348 105.418 35.5795 105.925 35.3589C106.431 35.1382 106.663 34.5488 106.442 34.0426C106.18 33.4418 105.908 32.8467 105.625 32.2573ZM8.17833 33.1217C8.41703 32.6237 8.2068 32.0265 7.70877 31.7878C7.21073 31.5491 6.61349 31.7593 6.37478 32.2573C6.09232 32.8467 5.82004 33.4418 5.55817 34.0426C5.33749 34.5489 5.569 35.1382 6.07528 35.3589C6.58156 35.5796 7.17088 35.348 7.39156 34.8418C7.64385 34.263 7.90618 33.6896 8.17833 33.1217ZM108.501 39.5608C108.336 39.0337 107.775 38.7401 107.248 38.905C106.721 39.0699 106.427 39.6308 106.592 40.1579C106.78 40.7581 106.957 41.3629 107.124 41.9721C107.27 42.5047 107.82 42.8184 108.352 42.6725C108.885 42.5267 109.199 41.9767 109.053 41.444C108.88 40.8116 108.696 40.1839 108.501 39.5608ZM5.40792 40.1579C5.57279 39.6308 5.27916 39.0699 4.75206 38.905C4.22496 38.7401 3.664 39.0337 3.49912 39.5608C3.30424 40.1839 3.12013 40.8117 2.94703 41.444C2.80121 41.9767 3.11482 42.5267 3.64751 42.6725C4.18019 42.8184 4.73023 42.5047 4.87606 41.9721C5.04282 41.3629 5.22017 40.7581 5.40792 40.1579ZM110.3 47.1999C110.212 46.6547 109.699 46.2837 109.154 46.3714C108.608 46.4591 108.237 46.9723 108.325 47.5175C108.425 48.1379 108.514 48.7619 108.592 49.3893C108.66 49.9373 109.16 50.3264 109.708 50.2582C110.256 50.19 110.645 49.6904 110.577 49.1424C110.496 48.4913 110.403 47.8438 110.3 47.1999ZM3.675 47.5175C3.7627 46.9723 3.39176 46.4591 2.84648 46.3714C2.3012 46.2837 1.78807 46.6547 1.70037 47.1999C1.59682 47.8438 1.50445 48.4913 1.42346 49.1424C1.35528 49.6904 1.7443 50.19 2.29236 50.2582C2.84042 50.3264 3.33998 49.9373 3.40816 49.3893C3.48621 48.7619 3.57522 48.1379 3.675 47.5175ZM109.029 54.761C109.136 54.3241 109.53 54 110 54C110.552 54 111 54.4477 111 55C111 55.1668 110.999 55.3335 110.998 55.5C110.999 55.6665 111 55.8332 111 56C111 56.5523 110.552 57 110 57C109.53 57 109.136 56.6759 109.029 56.239C109.003 56.1472 108.99 56.0502 108.992 55.95C108.994 55.8001 108.996 55.6502 108.998 55.5C108.996 55.3498 108.994 55.1999 108.992 55.05C108.99 54.9498 109.003 54.8528 109.029 54.761ZM1.00223 55.5C1.00074 55.3335 1 55.1668 1 55C1 54.4477 1.44772 54 2 54C2.47031 54 2.86479 54.3247 2.97153 54.7621C2.99716 54.8535 3.01009 54.9502 3.00834 55.05C3.00571 55.1999 3.0037 55.3499 3.00231 55.5C3.0037 55.6501 3.00571 55.8001 3.00834 55.95C3.01009 56.0498 2.99716 56.1465 2.97153 56.2379C2.86479 56.6753 2.47031 57 2 57C1.44772 57 1 56.5523 1 56C1 55.8332 1.00074 55.6665 1.00223 55.5ZM55.05 107.992C55.366 107.997 55.6827 108 56 108C56.3173 108 56.634 107.997 56.95 107.992C57.5022 107.982 57.9577 108.422 57.9674 108.974C57.9771 109.526 57.5373 109.982 56.9851 109.991C56.6574 109.997 56.329 110 56 110C55.671 110 55.3426 109.997 55.0149 109.991C54.4627 109.982 54.0229 109.526 54.0326 108.974C54.0423 108.422 54.4978 107.982 55.05 107.992ZM62.8576 109.577C62.3096 109.645 61.81 109.256 61.7418 108.708C61.6736 108.16 62.0627 107.66 62.6107 107.592C63.2381 107.514 63.8621 107.425 64.4825 107.325C65.0277 107.237 65.5409 107.608 65.6286 108.154C65.7163 108.699 65.3453 109.212 64.8001 109.3C64.1562 109.403 63.5087 109.496 62.8576 109.577ZM49.3893 107.592C49.9373 107.66 50.3264 108.16 50.2582 108.708C50.19 109.256 49.6904 109.645 49.1424 109.577C48.4913 109.496 47.8438 109.403 47.1999 109.3C46.6547 109.212 46.2837 108.699 46.3714 108.154C46.4591 107.608 46.9723 107.237 47.5175 107.325C48.1379 107.425 48.7619 107.514 49.3893 107.592ZM70.556 108.053C70.0233 108.199 69.4733 107.885 69.3275 107.352C69.1816 106.82 69.4953 106.27 70.0279 106.124C70.6371 105.957 71.2419 105.78 71.8421 105.592C72.3692 105.427 72.9301 105.721 73.095 106.248C73.2599 106.775 72.9663 107.336 72.4392 107.501C71.8161 107.696 71.1883 107.88 70.556 108.053ZM41.9721 106.124C42.5047 106.27 42.8184 106.82 42.6725 107.352C42.5267 107.885 41.9767 108.199 41.444 108.053C40.8116 107.88 40.1839 107.696 39.5608 107.501C39.0337 107.336 38.7401 106.775 38.905 106.248C39.0699 105.721 39.6308 105.427 40.1579 105.592C40.7581 105.78 41.3629 105.957 41.9721 106.124ZM77.9574 105.442C77.4511 105.663 76.8618 105.431 76.6411 104.925C76.4204 104.418 76.652 103.829 77.1582 103.608C77.737 103.356 78.3104 103.094 78.8783 102.822C79.3763 102.583 79.9735 102.793 80.2122 103.291C80.4509 103.789 80.2407 104.387 79.7427 104.625C79.1533 104.908 78.5582 105.18 77.9574 105.442ZM34.8417 103.608C35.348 103.829 35.5795 104.418 35.3589 104.925C35.1382 105.431 34.5488 105.663 34.0426 105.442C33.4418 105.18 32.8467 104.908 32.2573 104.625C31.7593 104.387 31.5491 103.789 31.7878 103.291C32.0265 102.793 32.6237 102.583 33.1217 102.822C33.6896 103.094 34.263 103.356 34.8417 103.608ZM84.9088 101.799C84.4392 102.089 83.8229 101.944 83.5322 101.475C83.2415 101.005 83.3865 100.389 83.8561 100.098C84.3928 99.7658 84.9232 99.4242 85.4469 99.0736C85.9059 98.7663 86.527 98.8893 86.8342 99.3482C87.1415 99.8071 87.0185 100.428 86.5596 100.736C86.0161 101.099 85.4658 101.454 84.9088 101.799ZM28.1439 100.098C28.6135 100.389 28.7585 101.005 28.4678 101.475C28.1771 101.944 27.5608 102.089 27.0912 101.799C26.5342 101.454 25.9839 101.099 25.4404 100.735C24.9815 100.428 24.8585 99.8071 25.1658 99.3482C25.473 98.8893 26.0941 98.7663 26.5531 99.0736C27.0768 99.4242 27.6072 99.7657 28.1439 100.098ZM91.2705 97.2035C90.8469 97.5579 90.2163 97.5017 89.8619 97.0781C89.5075 96.6546 89.5636 96.0239 89.9872 95.6695C90.4712 95.2646 90.9478 94.8512 91.4169 94.4296C91.8276 94.0604 92.4599 94.0941 92.8291 94.5049C93.1983 94.9156 93.1646 95.5479 92.7539 95.9171C92.2672 96.3545 91.7727 96.7834 91.2705 97.2035ZM22.0128 95.6695C22.4364 96.0239 22.4925 96.6545 22.1381 97.0781C21.7837 97.5017 21.1531 97.5578 20.7295 97.2035C20.2273 96.7834 19.7328 96.3545 19.2461 95.9171C18.8354 95.5479 18.8017 94.9156 19.1709 94.5049C19.5401 94.0941 20.1724 94.0604 20.5831 94.4296C21.0522 94.8512 21.5288 95.2646 22.0128 95.6695ZM96.9171 91.7539C96.5479 92.1646 95.9156 92.1983 95.5049 91.8291C95.0941 91.4599 95.0604 90.8276 95.4296 90.4169C95.8512 89.9478 96.2646 89.4712 96.6695 88.9872C97.0239 88.5636 97.6545 88.5075 98.0781 88.8619C98.5017 89.2163 98.5578 89.8469 98.2035 90.2705C97.7834 90.7727 97.3545 91.2672 96.9171 91.7539ZM16.5704 90.4169C16.9396 90.8276 16.9059 91.4599 16.4951 91.8291C16.0844 92.1983 15.4521 92.1646 15.0829 91.7538C14.6455 91.2672 14.2166 90.7727 13.7965 90.2705C13.4421 89.8469 13.4983 89.2163 13.9218 88.8619C14.3454 88.5075 14.9761 88.5636 15.3305 88.9872C15.7354 89.4712 16.1488 89.9478 16.5704 90.4169ZM101.735 85.5596C101.428 86.0185 100.807 86.1415 100.348 85.8342C99.8893 85.527 99.7663 84.9059 100.074 84.4469C100.424 83.9232 100.766 83.3928 101.098 82.8561C101.389 82.3865 102.005 82.2415 102.475 82.5322C102.944 82.8229 103.089 83.4392 102.799 83.9088C102.454 84.4658 102.099 85.0161 101.735 85.5596ZM11.9264 84.4469C12.2337 84.9059 12.1107 85.527 11.6518 85.8342C11.1929 86.1415 10.5717 86.0185 10.2645 85.5596C9.90065 85.0161 9.54622 84.4658 9.20146 83.9088C8.91077 83.4392 9.05581 82.8229 9.5254 82.5322C9.99499 82.2415 10.6113 82.3865 10.902 82.8561C11.2342 83.3928 11.5758 83.9232 11.9264 84.4469ZM105.625 78.7427C105.387 79.2407 104.789 79.4509 104.291 79.2122C103.793 78.9735 103.583 78.3763 103.822 77.8783C104.094 77.3104 104.356 76.737 104.608 76.1583C104.829 75.652 105.418 75.4205 105.925 75.6411C106.431 75.8618 106.663 76.4512 106.442 76.9574C106.18 77.5582 105.908 78.1533 105.625 78.7427ZM8.17833 77.8783C8.41703 78.3763 8.2068 78.9735 7.70877 79.2122C7.21073 79.4509 6.61349 79.2407 6.37478 78.7427C6.09232 78.1533 5.82004 77.5582 5.55817 76.9574C5.33749 76.4511 5.569 75.8618 6.07528 75.6411C6.58156 75.4204 7.17088 75.652 7.39156 76.1582C7.64385 76.737 7.90618 77.3104 8.17833 77.8783ZM108.501 71.4392C108.336 71.9663 107.775 72.2599 107.248 72.095C106.721 71.9301 106.427 71.3692 106.592 70.8421C106.78 70.2419 106.957 69.6371 107.124 69.0279C107.27 68.4953 107.82 68.1816 108.352 68.3275C108.885 68.4733 109.199 69.0233 109.053 69.556C108.88 70.1884 108.696 70.8161 108.501 71.4392ZM5.40792 70.8421C5.57279 71.3692 5.27916 71.9301 4.75206 72.095C4.22496 72.2599 3.664 71.9663 3.49912 71.4392C3.30424 70.8161 3.12013 70.1883 2.94703 69.556C2.80121 69.0233 3.11482 68.4733 3.64751 68.3275C4.18019 68.1816 4.73023 68.4953 4.87606 69.0279C5.04282 69.6371 5.22017 70.2419 5.40792 70.8421ZM110.3 63.8001C110.212 64.3453 109.699 64.7163 109.154 64.6286C108.608 64.5409 108.237 64.0277 108.325 63.4825C108.425 62.8621 108.514 62.2381 108.592 61.6107C108.66 61.0627 109.16 60.6736 109.708 60.7418C110.256 60.81 110.645 61.3096 110.577 61.8576C110.496 62.5087 110.403 63.1562 110.3 63.8001ZM3.675 63.4825C3.7627 64.0277 3.39176 64.5409 2.84648 64.6286C2.3012 64.7163 1.78807 64.3453 1.70037 63.8001C1.59682 63.1562 1.50445 62.5087 1.42346 61.8576C1.35528 61.3096 1.7443 60.81 2.29236 60.7418C2.84042 60.6736 3.33998 61.0627 3.40816 61.6107C3.48621 62.2381 3.57522 62.8621 3.675 63.4825Z" fill="white" fill-opacity="0.5"></path><mask id="svgM_moRaslidyv1_0" mask-type="alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="112" height="56"><rect width="112" height="56" fill="#C4C4C4"></rect></mask><g mask="url(#svgM_moRaslidyv1_0)"><path d="M110 56C110 26.1766 85.8234 2 56 2C26.1766 2 2 26.1766 2 56" fill="none" stroke="#C5BBAD" stroke-width="3" stroke-linecap="round"></path></g><circle cx="110" cy="56" r="4" fill="white"></circle></svg>
</div>
<p>14hr 15min</p>
</div>
<div id="moon-set" class="detail-sub-sub">
<img src="./weather/wi-moonset.svg" alt="" class="reuse-icon-size">
<p class="phase-name">Moonset</p>
<p class="phase-value">4:10pm</p>
</div>
</div>
<div id="sun-rise-set" class="detail-sec">
<div id="sun-rise" class="detail-sub-sub">
<img src="./weather/wi-sunrise.svg" alt="" class="reuse-icon-size">
<p class="phase-name">Sunrise</p>
<p class="phase-value">4:00am</p>
</div>
<div class="ill-text">
<div class="illustarate">
<svg width="114" height="110" viewBox="0 0 114 110" xmlns="http://www.w3.org/2000/svg" class="inline-DS-EntryPoint1-1" style="transform: rotate(-12.8538deg);" class="reuse-icon-size"><path fill-rule="evenodd" clip-rule="evenodd" d="M55.05 3.00834C55.366 3.00279 55.6827 3 56 3C56.3173 3 56.634 3.00279 56.95 3.00834C57.5022 3.01804 57.9577 2.57826 57.9674 2.02606C57.9771 1.47386 57.5373 1.01835 56.9851 1.00865C56.6574 1.00289 56.329 1 56 1C55.671 1 55.3426 1.00289 55.0149 1.00865C54.4627 1.01835 54.0229 1.47386 54.0326 2.02606C54.0423 2.57826 54.4978 3.01804 55.05 3.00834ZM62.8576 1.42346C62.3096 1.35528 61.81 1.7443 61.7418 2.29236C61.6736 2.84042 62.0627 3.33998 62.6107 3.40816C63.2381 3.48621 63.8621 3.57522 64.4825 3.675C65.0277 3.7627 65.5409 3.39176 65.6286 2.84648C65.7163 2.3012 65.3453 1.78807 64.8001 1.70037C64.1562 1.59682 63.5087 1.50445 62.8576 1.42346ZM49.3893 3.40816C49.9373 3.33998 50.3264 2.84042 50.2582 2.29237C50.19 1.7443 49.6904 1.35528 49.1424 1.42346C48.4913 1.50445 47.8438 1.59682 47.1999 1.70037C46.6547 1.78807 46.2837 2.3012 46.3714 2.84648C46.4591 3.39176 46.9723 3.7627 47.5175 3.675C48.1379 3.57522 48.7619 3.48621 49.3893 3.40816ZM70.556 2.94703C70.0233 2.80121 69.4733 3.11482 69.3275 3.64751C69.1816 4.18019 69.4953 4.73024 70.0279 4.87606C70.6371 5.04282 71.2419 5.22017 71.8421 5.40791C72.3692 5.5728 72.9301 5.27916 73.095 4.75206C73.2599 4.22496 72.9663 3.664 72.4392 3.49912C71.8161 3.30424 71.1883 3.12013 70.556 2.94703ZM41.9721 4.87606C42.5047 4.73024 42.8184 4.18019 42.6725 3.64751C42.5267 3.11483 41.9767 2.80121 41.444 2.94703C40.8116 3.12014 40.1839 3.30424 39.5608 3.49913C39.0337 3.66401 38.7401 4.22496 38.905 4.75206C39.0699 5.27916 39.6308 5.5728 40.1579 5.40792C40.7581 5.22018 41.3629 5.04282 41.9721 4.87606ZM77.9574 5.55817C77.4511 5.33749 76.8618 5.569 76.6411 6.07528C76.4204 6.58156 76.652 7.17088 77.1582 7.39156C77.737 7.64385 78.3104 7.90618 78.8783 8.17833C79.3763 8.41703 79.9735 8.2068 80.2122 7.70877C80.4509 7.21073 80.2407 6.61349 79.7427 6.37479C79.1533 6.09232 78.5582 5.82004 77.9574 5.55817ZM34.8417 7.39157C35.348 7.17088 35.5795 6.58157 35.3589 6.07529C35.1382 5.56901 34.5488 5.33749 34.0426 5.55818C33.4418 5.82005 32.8467 6.09233 32.2573 6.37479C31.7593 6.61349 31.5491 7.21074 31.7878 7.70877C32.0265 8.20681 32.6237 8.41704 33.1217 8.17834C33.6896 7.90619 34.263 7.64386 34.8417 7.39157ZM84.9088 9.20146C84.4392 8.91077 83.8229 9.05581 83.5322 9.5254C83.2415 9.995 83.3865 10.6113 83.8561 10.902C84.3928 11.2342 84.9232 11.5758 85.4469 11.9264C85.9059 12.2337 86.527 12.1107 86.8342 11.6518C87.1415 11.1929 87.0185 10.5717 86.5596 10.2645C86.0161 9.90065 85.4658 9.54622 84.9088 9.20146ZM28.1439 10.902C28.6135 10.6113 28.7585 9.995 28.4678 9.52541C28.1771 9.05581 27.5608 8.91078 27.0912 9.20147C26.5342 9.54623 25.9839 9.90066 25.4404 10.2645C24.9815 10.5718 24.8585 11.1929 25.1658 11.6518C25.473 12.1107 26.0941 12.2337 26.5531 11.9264C27.0768 11.5758 27.6072 11.2342 28.1439 10.902ZM91.2705 13.7965C90.8469 13.4421 90.2163 13.4983 89.8619 13.9218C89.5075 14.3454 89.5636 14.9761 89.9872 15.3305C90.4712 15.7354 90.9478 16.1488 91.4169 16.5704C91.8276 16.9396 92.4599 16.9059 92.8291 16.4951C93.1983 16.0844 93.1646 15.4521 92.7539 15.0829C92.2672 14.6455 91.7727 14.2166 91.2705 13.7965ZM22.0128 15.3305C22.4364 14.9761 22.4925 14.3455 22.1381 13.9219C21.7837 13.4983 21.1531 13.4422 20.7295 13.7965C20.2273 14.2166 19.7328 14.6455 19.2461 15.0829C18.8354 15.4521 18.8017 16.0844 19.1709 16.4951C19.5401 16.9059 20.1724 16.9396 20.5831 16.5704C21.0522 16.1488 21.5288 15.7354 22.0128 15.3305ZM96.9171 19.2461C96.5479 18.8354 95.9156 18.8017 95.5049 19.1709C95.0941 19.5401 95.0604 20.1724 95.4296 20.5831C95.8512 21.0522 96.2646 21.5288 96.6695 22.0128C97.0239 22.4364 97.6545 22.4925 98.0781 22.1381C98.5017 21.7837 98.5578 21.1531 98.2035 20.7295C97.7834 20.2273 97.3545 19.7328 96.9171 19.2461ZM16.5704 20.5831C16.9396 20.1724 16.9059 19.5401 16.4951 19.1709C16.0844 18.8017 15.4521 18.8354 15.0829 19.2462C14.6455 19.7328 14.2166 20.2273 13.7965 20.7295C13.4421 21.1531 13.4983 21.7837 13.9218 22.1381C14.3454 22.4925 14.9761 22.4364 15.3305 22.0128C15.7354 21.5288 16.1488 21.0522 16.5704 20.5831ZM101.735 25.4404C101.428 24.9815 100.807 24.8585 100.348 25.1658C99.8893 25.473 99.7663 26.0941 100.074 26.5531C100.424 27.0768 100.766 27.6072 101.098 28.1439C101.389 28.6135 102.005 28.7585 102.475 28.4678C102.944 28.1771 103.089 27.5608 102.799 27.0912C102.454 26.5342 102.099 25.9839 101.735 25.4404ZM11.9264 26.5531C12.2337 26.0941 12.1107 25.473 11.6518 25.1658C11.1929 24.8585 10.5717 24.9815 10.2645 25.4404C9.90065 25.9839 9.54622 26.5342 9.20146 27.0912C8.91077 27.5608 9.05581 28.1771 9.5254 28.4678C9.99499 28.7585 10.6113 28.6135 10.902 28.1439C11.2342 27.6072 11.5758 27.0768 11.9264 26.5531ZM105.625 32.2573C105.387 31.7593 104.789 31.5491 104.291 31.7878C103.793 32.0265 103.583 32.6237 103.822 33.1217C104.094 33.6896 104.356 34.263 104.608 34.8417C104.829 35.348 105.418 35.5795 105.925 35.3589C106.431 35.1382 106.663 34.5488 106.442 34.0426C106.18 33.4418 105.908 32.8467 105.625 32.2573ZM8.17833 33.1218C8.41703 32.6237 8.2068 32.0265 7.70877 31.7878C7.21073 31.5491 6.61349 31.7593 6.37478 32.2573C6.09232 32.8467 5.82004 33.4418 5.55817 34.0426C5.33749 34.5489 5.569 35.1382 6.07528 35.3589C6.58156 35.5796 7.17088 35.348 7.39156 34.8418C7.64385 34.263 7.90618 33.6896 8.17833 33.1218ZM108.501 39.5608C108.336 39.0337 107.775 38.7401 107.248 38.905C106.721 39.0699 106.427 39.6308 106.592 40.1579C106.78 40.7581 106.957 41.3629 107.124 41.9721C107.27 42.5047 107.82 42.8184 108.352 42.6725C108.885 42.5267 109.199 41.9767 109.053 41.444C108.88 40.8116 108.696 40.1839 108.501 39.5608ZM5.40792 40.1579C5.57279 39.6308 5.27916 39.0699 4.75206 38.905C4.22496 38.7401 3.664 39.0337 3.49912 39.5608C3.30424 40.1839 3.12013 40.8117 2.94703 41.444C2.80121 41.9767 3.11482 42.5267 3.64751 42.6725C4.18019 42.8184 4.73023 42.5047 4.87606 41.9721C5.04282 41.3629 5.22017 40.7581 5.40792 40.1579ZM110.3 47.1999C110.212 46.6547 109.699 46.2837 109.154 46.3714C108.608 46.4591 108.237 46.9723 108.325 47.5175C108.425 48.1379 108.514 48.7619 108.592 49.3893C108.66 49.9373 109.16 50.3264 109.708 50.2582C110.256 50.19 110.645 49.6904 110.577 49.1424C110.496 48.4913 110.403 47.8438 110.3 47.1999ZM3.675 47.5175C3.7627 46.9723 3.39176 46.4591 2.84648 46.3714C2.3012 46.2837 1.78807 46.6547 1.70037 47.1999C1.59682 47.8438 1.50445 48.4913 1.42346 49.1424C1.35528 49.6904 1.7443 50.19 2.29236 50.2582C2.84042 50.3264 3.33998 49.9373 3.40816 49.3893C3.48621 48.7619 3.57522 48.1379 3.675 47.5175ZM109.029 54.761C109.136 54.3241 109.53 54 110 54C110.552 54 111 54.4477 111 55C111 55.1668 110.999 55.3335 110.998 55.5C110.999 55.6665 111 55.8332 111 56C111 56.5523 110.552 57 110 57C109.53 57 109.136 56.6759 109.029 56.239C109.003 56.1472 108.99 56.0502 108.992 55.95C108.994 55.8001 108.996 55.6501 108.998 55.5C108.996 55.3499 108.994 55.1999 108.992 55.05C108.99 54.9498 109.003 54.8528 109.029 54.761ZM1.00223 55.5C1.00074 55.3335 1 55.1668 1 55C1 54.4477 1.44772 54 2 54C2.47031 54 2.86479 54.3247 2.97153 54.7621C2.99716 54.8535 3.01009 54.9502 3.00834 55.05C3.00571 55.1999 3.0037 55.3499 3.00231 55.5C3.0037 55.6501 3.00571 55.8001 3.00834 55.95C3.01009 56.0498 2.99716 56.1465 2.97153 56.2379C2.86479 56.6753 2.47031 57 2 57C1.44772 57 1 56.5523 1 56C1 55.8332 1.00074 55.6665 1.00223 55.5ZM55.05 107.992C55.366 107.997 55.6827 108 56 108C56.3173 108 56.634 107.997 56.95 107.992C57.5022 107.982 57.9577 108.422 57.9674 108.974C57.9771 109.526 57.5373 109.982 56.9851 109.991C56.6574 109.997 56.329 110 56 110C55.671 110 55.3426 109.997 55.0149 109.991C54.4627 109.982 54.0229 109.526 54.0326 108.974C54.0423 108.422 54.4978 107.982 55.05 107.992ZM62.8576 109.577C62.3096 109.645 61.81 109.256 61.7418 108.708C61.6736 108.16 62.0627 107.66 62.6107 107.592C63.2381 107.514 63.8621 107.425 64.4825 107.325C65.0277 107.237 65.5409 107.608 65.6286 108.154C65.7163 108.699 65.3453 109.212 64.8001 109.3C64.1562 109.403 63.5087 109.496 62.8576 109.577ZM49.3893 107.592C49.9373 107.66 50.3264 108.16 50.2582 108.708C50.19 109.256 49.6904 109.645 49.1424 109.577C48.4913 109.496 47.8438 109.403 47.1999 109.3C46.6547 109.212 46.2837 108.699 46.3714 108.154C46.4591 107.608 46.9723 107.237 47.5175 107.325C48.1379 107.425 48.7619 107.514 49.3893 107.592ZM70.556 108.053C70.0233 108.199 69.4733 107.885 69.3275 107.352C69.1816 106.82 69.4953 106.27 70.0279 106.124C70.6371 105.957 71.2419 105.78 71.8421 105.592C72.3692 105.427 72.9301 105.721 73.095 106.248C73.2599 106.775 72.9663 107.336 72.4392 107.501C71.8161 107.696 71.1883 107.88 70.556 108.053ZM41.9721 106.124C42.5047 106.27 42.8184 106.82 42.6725 107.352C42.5267 107.885 41.9767 108.199 41.444 108.053C40.8116 107.88 40.1839 107.696 39.5608 107.501C39.0337 107.336 38.7401 106.775 38.905 106.248C39.0699 105.721 39.6308 105.427 40.1579 105.592C40.7581 105.78 41.3629 105.957 41.9721 106.124ZM77.9574 105.442C77.4511 105.663 76.8618 105.431 76.6411 104.925C76.4204 104.418 76.652 103.829 77.1582 103.608C77.737 103.356 78.3104 103.094 78.8783 102.822C79.3763 102.583 79.9735 102.793 80.2122 103.291C80.4509 103.789 80.2407 104.387 79.7427 104.625C79.1533 104.908 78.5582 105.18 77.9574 105.442ZM34.8417 103.608C35.348 103.829 35.5795 104.418 35.3589 104.925C35.1382 105.431 34.5488 105.663 34.0426 105.442C33.4418 105.18 32.8467 104.908 32.2573 104.625C31.7593 104.387 31.5491 103.789 31.7878 103.291C32.0265 102.793 32.6237 102.583 33.1217 102.822C33.6896 103.094 34.263 103.356 34.8417 103.608ZM84.9088 101.799C84.4392 102.089 83.8229 101.944 83.5322 101.475C83.2415 101.005 83.3865 100.389 83.8561 100.098C84.3928 99.7658 84.9232 99.4242 85.4469 99.0736C85.9059 98.7663 86.527 98.8893 86.8342 99.3482C87.1415 99.8071 87.0185 100.428 86.5596 100.736C86.0161 101.099 85.4658 101.454 84.9088 101.799ZM28.1439 100.098C28.6135 100.389 28.7585 101.005 28.4678 101.475C28.1771 101.944 27.5608 102.089 27.0912 101.799C26.5342 101.454 25.9839 101.099 25.4404 100.735C24.9815 100.428 24.8585 99.8071 25.1658 99.3482C25.473 98.8893 26.0941 98.7663 26.5531 99.0736C27.0768 99.4242 27.6072 99.7658 28.1439 100.098ZM91.2705 97.2035C90.8469 97.5579 90.2163 97.5017 89.8619 97.0782C89.5075 96.6546 89.5636 96.0239 89.9872 95.6695C90.4712 95.2646 90.9478 94.8512 91.4169 94.4296C91.8276 94.0604 92.4599 94.0941 92.8291 94.5049C93.1983 94.9156 93.1646 95.5479 92.7539 95.9171C92.2672 96.3545 91.7727 96.7834 91.2705 97.2035ZM22.0128 95.6695C22.4364 96.0239 22.4925 96.6545 22.1381 97.0781C21.7837 97.5017 21.1531 97.5578 20.7295 97.2035C20.2273 96.7834 19.7328 96.3545 19.2461 95.9171C18.8354 95.5479 18.8017 94.9156 19.1709 94.5049C19.5401 94.0941 20.1724 94.0604 20.5831 94.4296C21.0522 94.8512 21.5288 95.2646 22.0128 95.6695ZM96.9171 91.7539C96.5479 92.1646 95.9156 92.1983 95.5049 91.8291C95.0941 91.4599 95.0604 90.8276 95.4296 90.4169C95.8512 89.9478 96.2646 89.4712 96.6695 88.9872C97.0239 88.5636 97.6545 88.5075 98.0781 88.8619C98.5017 89.2163 98.5578 89.8469 98.2035 90.2705C97.7834 90.7727 97.3545 91.2672 96.9171 91.7539ZM16.5704 90.4169C16.9396 90.8276 16.9059 91.4599 16.4951 91.8291C16.0844 92.1983 15.4521 92.1646 15.0829 91.7538C14.6455 91.2672 14.2166 90.7727 13.7965 90.2705C13.4421 89.8469 13.4983 89.2163 13.9218 88.8619C14.3454 88.5075 14.9761 88.5636 15.3305 88.9872C15.7354 89.4712 16.1488 89.9478 16.5704 90.4169ZM101.735 85.5596C101.428 86.0185 100.807 86.1415 100.348 85.8342C99.8893 85.527 99.7663 84.9059 100.074 84.4469C100.424 83.9232 100.766 83.3928 101.098 82.8561C101.389 82.3865 102.005 82.2415 102.475 82.5322C102.944 82.8229 103.089 83.4392 102.799 83.9088C102.454 84.4658 102.099 85.0161 101.735 85.5596ZM11.9264 84.4469C12.2337 84.9059 12.1107 85.527 11.6518 85.8342C11.1929 86.1415 10.5717 86.0185 10.2645 85.5596C9.90065 85.0161 9.54622 84.4658 9.20146 83.9088C8.91077 83.4392 9.05581 82.8229 9.5254 82.5322C9.99499 82.2415 10.6113 82.3865 10.902 82.8561C11.2342 83.3928 11.5758 83.9232 11.9264 84.4469ZM105.625 78.7427C105.387 79.2407 104.789 79.4509 104.291 79.2122C103.793 78.9735 103.583 78.3763 103.822 77.8783C104.094 77.3104 104.356 76.737 104.608 76.1583C104.829 75.652 105.418 75.4205 105.925 75.6411C106.431 75.8618 106.663 76.4512 106.442 76.9574C106.18 77.5582 105.908 78.1533 105.625 78.7427ZM8.17833 77.8782C8.41703 78.3763 8.2068 78.9735 7.70877 79.2122C7.21073 79.4509 6.61349 79.2407 6.37478 78.7427C6.09232 78.1533 5.82004 77.5582 5.55817 76.9574C5.33749 76.4511 5.569 75.8618 6.07528 75.6411C6.58156 75.4204 7.17088 75.652 7.39156 76.1582C7.64385 76.737 7.90618 77.3104 8.17833 77.8782ZM108.501 71.4392C108.336 71.9663 107.775 72.2599 107.248 72.095C106.721 71.9301 106.427 71.3692 106.592 70.8421C106.78 70.2419 106.957 69.6371 107.124 69.0279C107.27 68.4953 107.82 68.1816 108.352 68.3275C108.885 68.4733 109.199 69.0233 109.053 69.556C108.88 70.1884 108.696 70.8161 108.501 71.4392ZM5.40792 70.8421C5.57279 71.3692 5.27916 71.9301 4.75206 72.095C4.22496 72.2599 3.664 71.9663 3.49912 71.4392C3.30424 70.8161 3.12013 70.1883 2.94703 69.556C2.80121 69.0233 3.11482 68.4733 3.64751 68.3275C4.18019 68.1816 4.73023 68.4953 4.87606 69.0279C5.04282 69.6371 5.22017 70.2419 5.40792 70.8421ZM110.3 63.8001C110.212 64.3453 109.699 64.7163 109.154 64.6286C108.608 64.5409 108.237 64.0277 108.325 63.4825C108.425 62.8621 108.514 62.2381 108.592 61.6107C108.66 61.0627 109.16 60.6736 109.708 60.7418C110.256 60.81 110.645 61.3096 110.577 61.8576C110.496 62.5087 110.403 63.1562 110.3 63.8001ZM3.675 63.4825C3.7627 64.0277 3.39176 64.5409 2.84648 64.6286C2.3012 64.7163 1.78807 64.3453 1.70037 63.8001C1.59682 63.1562 1.50445 62.5087 1.42346 61.8576C1.35528 61.3096 1.7443 60.81 2.29236 60.7418C2.84042 60.6736 3.33998 61.0627 3.40816 61.6107C3.48621 62.2381 3.57522 62.8621 3.675 63.4825Z" fill="white" fill-opacity="0.5"></path><mask id="svgM_sunRaslidyv1_0" mask-type="alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="112" height="56"><rect width="112" height="56" fill="#C4C4C4"></rect></mask><g mask="url(#svgM_sunRaslidyv1_0)"><path d="M110 56C110 26.1766 85.8234 2 56 2C26.1766 2 2 26.1766 2 56" fill="none" stroke="#FEC80A" stroke-width="3" stroke-linecap="round"></path></g><circle cx="110" cy="56" r="4" fill="white"></circle></svg>
</div>
<p>14hr 14min</p>
</div>
<div id="moon-rise" class="detail-sub-sub">
<img src="./weather/wi-sunset.svg" alt="" class="reuse-icon-size">
<p class="phase-name">Sunset</p>
<p class="phase-value">8:10pm</p>
</div>
</div>
</div>
</div>
</aside>
</section>
<section id="hourly-report">
<article id="hourly-container">
<div id="hour-head-div">
<h4 class="hour-head">Overview</h4>
<div class="overview-btn">
<button class="overview-btn-item active" id="tempbtn">Temprature</button>
<button class="overview-btn-item" id="humbtn" >Humidity</button>
<button class="overview-btn-item" id="rainbtn">Rainfall</button>
<button class="overview-btn-item" id="presbtn">Pressure</button>
</div>
</div>
<div id="hourly-graph">
</div>
<div class="hourly">
<button id="left-shift-hour" class="hour-btn"></button>
<div class="hours">
</div>
<button id="right-shift-hour" class="hour-btn"></button>
</div>
</div>
</article>
</section>
<section id="day-wise-weather">
<h4>10 DAYS FORECAST</h4>
<article id="days">
<button id="left-shift" class="d-h-s-btn"></button>
<div id="day-container">
</div>
<button id="right-shift" class="d-h-s-btn"></button>
</article>
</section>
</main>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script src="./vite.build.js"></script>
</body>
</html>