-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathwaebtask.html
More file actions
445 lines (361 loc) · 53.9 KB
/
Copy pathwaebtask.html
File metadata and controls
445 lines (361 loc) · 53.9 KB
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
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://kit.fontawesome.com/4c68dd9408.js" crossorigin="anonymous"></script>
<link href="https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css" rel="stylesheet">
</head>
<body>
<div class="px-16 bg-red-100">
<div class="pb-44">
<!--navbar-->
<div class="flex justify-between items-center py-2 px-3">
<div class="flex items-center space-x-2">
<svg class="fill-current text-red-500 w-16 h-16" id="Capa_1" enable-background="new 0 0 512 512" height="512" viewBox="0 0 512 512" width="512" xmlns="http://www.w3.org/2000/svg">
<g>
<path d="m322 401c44.112 0 80 35.888 80 80 0 5.522 4.478 10 10 10s10-4.478 10-10c0-44.112 35.888-80 80-80 5.522 0 10-4.478 10-10s-4.478-10-10-10c-44.112 0-80-35.888-80-80 0-5.522-4.478-10-10-10s-10 4.478-10 10c0 44.112-35.888 80-80 80-5.522 0-10 4.478-10 10s4.478 10 10 10zm90-56.429c9.816 20.194 26.234 36.612 46.429 46.429-20.194 9.816-36.612 26.234-46.429 46.429-9.816-20.194-26.234-36.612-46.429-46.429 20.195-9.816 36.613-26.234 46.429-46.429z"></path>
<path d="m10 101c27.57 0 50 22.43 50 50 0 5.522 4.477 10 10 10s10-4.478 10-10c0-27.57 22.43-50 50-50 5.523 0 10-4.478 10-10s-4.477-10-10-10c-27.57 0-50-22.43-50-50 0-5.522-4.477-10-10-10s-10 4.478-10 10c0 27.57-22.43 50-50 50-5.523 0-10 4.478-10 10s4.477 10 10 10zm60-33.976c5.913 9.81 14.166 18.064 23.975 23.976-9.81 5.912-18.063 14.166-23.975 23.976-5.913-9.81-14.166-18.064-23.975-23.976 9.809-5.912 18.062-14.166 23.975-23.976z"></path>
<circle cx="279" cy="294" r="10"></circle>
<path d="m305.678 271.194c2.817 4.749 8.954 6.315 13.703 3.496 26.118-15.498 56.07-23.69 86.619-23.69 5.522 0 10-4.478 10-10s-4.478-10-10-10c-93.738 0-170-76.262-170-170 0-5.522-4.477-10-10-10s-10 4.478-10 10c0 93.738-76.262 170-170 170-5.523 0-10 4.478-10 10s4.477 10 10 10c93.738 0 170 76.262 170 170 0 5.522 4.477 10 10 10s10-4.478 10-10c0-30.549 8.192-60.501 23.69-86.619 2.818-4.75 1.253-10.885-3.496-13.703-4.753-2.821-10.886-1.253-13.703 3.496-6.764 11.398-12.282 23.445-16.498 35.931-18.953-55.876-63.24-100.157-119.118-119.105 55.884-18.95 100.175-63.241 119.125-119.125 18.948 55.878 63.229 100.165 119.104 119.118-12.485 4.216-24.532 9.734-35.931 16.498-4.748 2.819-6.314 8.953-3.495 13.703z"></path>
</g>
</svg>
<h1 class="text-red-500 font-bold">
Logo
</h1>
</div>
<div class="flex space-x-6">
<h1 class="">home</h1>
<h1 class=""> features</h1>
<h1 class=""> pricing </h1>
<h1 class=""> contact </h1>
</div>
<div>
<button class="bg-red-500 text-white rounded-md shadow-md px-3 py-2 mt-6 font-bold">
Get started
</button>
</div>
</div>
<!--hero-->
<div class="flex justify-between items-center mt-20 ">
<div class="w-5/12">
<h1 class="text-6xl font-bold">
schebule your success plan
<span class="text-red-500">
now!
</span>
</h1>
<p class="mt-4 text-gray-700">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. At atque dicta dolorem, ex in magni natus
quibusdam rem similique voluptatef!
</p>
<button class="bg-red-500 text-white rounded-md shadow-md px-3 py-2 mt-6 font-bold">
Get started
</button>
<div class="flex space-x-3 mt-6">
<svg class="fill-current text-gray-600 h-8 w-8" id="Layer_1" enable-background="new 0 0 512 512" height="512" viewBox="0 0 512 512" width="512" xmlns="http://www.w3.org/2000/svg">
<path d="m392 458h-272c-66.168 0-120-53.832-120-120v-164c0-66.168 53.832-120 120-120h272c66.168 0 120 53.832 120 120v164c0 66.168-53.832 120-120 120zm-272-364c-44.112 0-80 35.888-80 80v164c0 44.112 35.888 80 80 80h272c44.112 0 80-35.888 80-80v-164c0-44.112-35.888-80-80-80zm209.286 197.406 98.855-75.512c8.778-6.705 10.458-19.256 3.753-28.034-6.706-8.778-19.256-10.458-28.034-3.753l-98.843 75.503c-28.541 21.769-68.4 21.785-96.96.055l-95.781-74.455c-8.721-6.78-21.287-5.205-28.065 3.516-6.779 8.721-5.205 21.286 3.516 28.065l95.855 74.512c.048.038.097.075.146.112 21.424 16.34 47.094 24.509 72.77 24.509s51.357-8.174 72.788-24.518z"></path>
</svg>
<svg class="fill-current text-gray-600 h-8 w-8" id="Layer_1" enable-background="new 0 0 512.058 512.058" height="512" viewBox="0 0 512.058 512.058" width="512" xmlns="http://www.w3.org/2000/svg">
<path d="m19.999 512.033c-10.757.179-20.189-9.204-19.996-20.002l.012-233.596c-1.571-228.697 276.736-344.968 437.966-182.879 159.524 161.859 44.352 436.676-183.165 436.475-40.3.001-78.774-9.038-114.35-26.866-33.992-17.035-75.147-10.167-102.409 17.097l-3.912 3.912c-3.826 3.825-8.942 5.858-14.146 5.859zm81.271-76.151c19.422 0 38.962 4.423 57.119 13.523 30.017 15.044 62.551 22.658 96.653 22.626 191.181.283 289.155-233.256 154.516-368.33-136.568-136.67-370.535-38.778-369.544 154.457.001.064.001.129.001.193l-.01 193.067c18.952-10.248 40.036-15.536 61.265-15.536zm56.043-80.824c-10.753 0-21.543-3.412-30.591-10.355-20.72-15.902-25.863-44.569-11.963-66.683l53.723-85.464c16.166-26.789 54.253-33.907 78.937-14.607l40.725 30.571 32.022-31.967c17.807-17.777 46.172-19.481 65.979-3.964 20.172 15.805 25.103 44.084 11.47 65.781l-54.055 86.026c-8.071 12.934-21.326 21.967-36.332 24.732-14.951 2.752-30.479-.935-42.607-10.122-.027-.021-.056-.043-.084-.064l-39.773-30.465-31.812 31.86c-9.728 9.745-22.656 14.721-35.639 14.721zm-6.237-42.088c4.091 3.141 9.926 2.756 13.569-.894l44.204-44.271c7.093-7.103 18.347-7.849 26.315-1.746l53.65 41.095c3.232 2.432 7.192 3.368 11.164 2.638 4.041-.745 7.479-3.098 9.68-6.624l54.087-86.078c2.696-4.292 1.721-9.886-2.27-13.013-3.918-3.068-9.53-2.731-13.05.784l-44.294 44.218c-7.041 7.03-18.18 7.813-26.137 1.841l-54.662-41.034c-3.31-2.509-7.291-3.452-11.273-2.721-4.04.745-7.478 3.097-9.679 6.624l-53.757 85.519c-2.847 4.53-1.793 10.404 2.453 13.662z"></path>
</svg>
<svg class="fill-current text-gray-600 h-8 w-8" id="Layer_1" enable-background="new 0 0 511.982 511.982" height="512" viewBox="0 0 511.982 511.982" width="512" xmlns="http://www.w3.org/2000/svg">
<path d="m255.991 455.991c-65.145 0-122.316-4.258-158.806-7.83-46.194-4.521-82.997-39.75-89.5-85.668-10.247-72.729-10.247-140.275 0-213.005 6.503-45.917 43.306-81.146 89.5-85.667 36.489-3.572 93.661-7.83 158.806-7.83s122.316 4.258 158.806 7.83c46.194 4.521 82.997 39.75 89.5 85.668 10.247 72.729 10.247 140.275 0 213.005-6.503 45.917-43.306 81.146-89.5 85.667-36.49 3.572-93.661 7.83-158.806 7.83zm0-360c-63.53 0-119.306 4.154-154.909 7.641-27.766 2.718-49.885 23.881-53.791 51.465-4.844 34.204-7.3 68.149-7.3 100.895s2.456 66.69 7.3 100.894c3.906 27.585 26.025 48.748 53.791 51.466 35.604 3.486 91.379 7.641 154.909 7.641s119.306-4.154 154.909-7.641c27.766-2.718 49.885-23.881 53.791-51.465 4.844-34.204 7.3-68.149 7.3-100.895s-2.456-66.69-7.3-100.894c-3.906-27.585-26.025-48.748-53.791-51.466-35.603-3.487-91.379-7.641-154.909-7.641zm-25.943 254.796c-26.74.364-50.683-22.824-50.057-49.881v-90.33c0-18.09 9.423-34.249 25.207-43.225 15.908-9.048 34.796-8.862 50.519.492l75.914 45.165c32.302 18.533 32.294 66.938 0 85.465l-75.914 45.165c-8.006 4.763-16.834 7.149-25.669 7.149zm.047-150.043c-2.333 0-4.189.848-5.123 1.379-1.86 1.058-4.98 3.562-4.98 8.453v90.33c0 4.892 3.12 7.396 4.98 8.453 1.557.886 5.676 2.651 10.294-.098l75.914-45.165c6.463-3.858 6.472-12.845 0-16.711l-75.914-45.165c-1.848-1.099-3.616-1.476-5.171-1.476z"></path>
</svg>
</div>
</div>
<div class="w-5/12">
<img src="undraw_Profile_data_re_v81r.svg" alt="">
</div>
</div>
</div>
</div>
<div class="px-16">
<div class="flex justify-between items-center mt-20 justify-center flex-col place-items-center py-4 px-4 ">
<div class=" rounded-full bg-red-300 py-3 px-8 w-4... "> features</div>
<h1 class="text-3xl font-bold">
Hello there blah blah
</h1>
<p class="mt-4 w-4/12 text-center text-gray-500">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. At atque dicta dolorem, ex in magni natus
quibusdam rem similique voluptatef!Lorem ipsum dolor sit amet, consectetur adipisicing elit. At atque dicta dolorem, ex in magni natus
</p>
</div >
<div class="flex justify-evenly justify-center place-items-center ...">
<div class="flex flex-col place-items-center space-x-4 w-2/12">
<div class="rounded-lg bg-red-300 h-20 w-20 flex items-center justify-center">
<svg class=" fill-current text-gray-600 h-10 w-10" id="Layer_1" enable-background="new 0 0 512.058 512.058" height="512" viewBox="0 0 512.058 512.058" width="512" xmlns="http://www.w3.org/2000/svg">
<path d="m19.999 512.033c-10.757.179-20.189-9.204-19.996-20.002l.012-233.596c-1.571-228.697 276.736-344.968 437.966-182.879 159.524 161.859 44.352 436.676-183.165 436.475-40.3.001-78.774-9.038-114.35-26.866-33.992-17.035-75.147-10.167-102.409 17.097l-3.912 3.912c-3.826 3.825-8.942 5.858-14.146 5.859zm81.271-76.151c19.422 0 38.962 4.423 57.119 13.523 30.017 15.044 62.551 22.658 96.653 22.626 191.181.283 289.155-233.256 154.516-368.33-136.568-136.67-370.535-38.778-369.544 154.457.001.064.001.129.001.193l-.01 193.067c18.952-10.248 40.036-15.536 61.265-15.536zm56.043-80.824c-10.753 0-21.543-3.412-30.591-10.355-20.72-15.902-25.863-44.569-11.963-66.683l53.723-85.464c16.166-26.789 54.253-33.907 78.937-14.607l40.725 30.571 32.022-31.967c17.807-17.777 46.172-19.481 65.979-3.964 20.172 15.805 25.103 44.084 11.47 65.781l-54.055 86.026c-8.071 12.934-21.326 21.967-36.332 24.732-14.951 2.752-30.479-.935-42.607-10.122-.027-.021-.056-.043-.084-.064l-39.773-30.465-31.812 31.86c-9.728 9.745-22.656 14.721-35.639 14.721zm-6.237-42.088c4.091 3.141 9.926 2.756 13.569-.894l44.204-44.271c7.093-7.103 18.347-7.849 26.315-1.746l53.65 41.095c3.232 2.432 7.192 3.368 11.164 2.638 4.041-.745 7.479-3.098 9.68-6.624l54.087-86.078c2.696-4.292 1.721-9.886-2.27-13.013-3.918-3.068-9.53-2.731-13.05.784l-44.294 44.218c-7.041 7.03-18.18 7.813-26.137 1.841l-54.662-41.034c-3.31-2.509-7.291-3.452-11.273-2.721-4.04.745-7.478 3.097-9.679 6.624l-53.757 85.519c-2.847 4.53-1.793 10.404 2.453 13.662z"></path>
</svg></div>
<h1 class="text-xl ">
Hello there
</h1>
<p class="mt-4 text-gray-500">
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</p>
</div>
<div class="flex flex-col place-items-center space-x-4 w-2/12">
<div class="rounded-lg bg-gray-200 h-20 w-20 flex items-center justify-center">
<svg class="fill-current text-gray-600 h-10 w-10" id="Layer_1" enable-background="new 0 0 511.982 511.982" height="512" viewBox="0 0 511.982 511.982" width="512" xmlns="http://www.w3.org/2000/svg">
<path d="m255.991 455.991c-65.145 0-122.316-4.258-158.806-7.83-46.194-4.521-82.997-39.75-89.5-85.668-10.247-72.729-10.247-140.275 0-213.005 6.503-45.917 43.306-81.146 89.5-85.667 36.489-3.572 93.661-7.83 158.806-7.83s122.316 4.258 158.806 7.83c46.194 4.521 82.997 39.75 89.5 85.668 10.247 72.729 10.247 140.275 0 213.005-6.503 45.917-43.306 81.146-89.5 85.667-36.49 3.572-93.661 7.83-158.806 7.83zm0-360c-63.53 0-119.306 4.154-154.909 7.641-27.766 2.718-49.885 23.881-53.791 51.465-4.844 34.204-7.3 68.149-7.3 100.895s2.456 66.69 7.3 100.894c3.906 27.585 26.025 48.748 53.791 51.466 35.604 3.486 91.379 7.641 154.909 7.641s119.306-4.154 154.909-7.641c27.766-2.718 49.885-23.881 53.791-51.465 4.844-34.204 7.3-68.149 7.3-100.895s-2.456-66.69-7.3-100.894c-3.906-27.585-26.025-48.748-53.791-51.466-35.603-3.487-91.379-7.641-154.909-7.641zm-25.943 254.796c-26.74.364-50.683-22.824-50.057-49.881v-90.33c0-18.09 9.423-34.249 25.207-43.225 15.908-9.048 34.796-8.862 50.519.492l75.914 45.165c32.302 18.533 32.294 66.938 0 85.465l-75.914 45.165c-8.006 4.763-16.834 7.149-25.669 7.149zm.047-150.043c-2.333 0-4.189.848-5.123 1.379-1.86 1.058-4.98 3.562-4.98 8.453v90.33c0 4.892 3.12 7.396 4.98 8.453 1.557.886 5.676 2.651 10.294-.098l75.914-45.165c6.463-3.858 6.472-12.845 0-16.711l-75.914-45.165c-1.848-1.099-3.616-1.476-5.171-1.476z"></path>
</svg></div>
<h1 class="text-xl">
Hello there
</h1>
<p class="mt-4 text-gray-500">
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</p>
</div>
<div class=" flex flex-col place-items-center space-x-4 w-2/12">
<div class="rounded-lg bg-red-100 h-20 w-20 flex items-center justify-center">
<svg class="fill-current text-gray-600 h-10 w-10" id="Layer_1" enable-background="new 0 0 512 512" height="512" viewBox="0 0 512 512" width="512" xmlns="http://www.w3.org/2000/svg">
<path d="m392 458h-272c-66.168 0-120-53.832-120-120v-164c0-66.168 53.832-120 120-120h272c66.168 0 120 53.832 120 120v164c0 66.168-53.832 120-120 120zm-272-364c-44.112 0-80 35.888-80 80v164c0 44.112 35.888 80 80 80h272c44.112 0 80-35.888 80-80v-164c0-44.112-35.888-80-80-80zm209.286 197.406 98.855-75.512c8.778-6.705 10.458-19.256 3.753-28.034-6.706-8.778-19.256-10.458-28.034-3.753l-98.843 75.503c-28.541 21.769-68.4 21.785-96.96.055l-95.781-74.455c-8.721-6.78-21.287-5.205-28.065 3.516-6.779 8.721-5.205 21.286 3.516 28.065l95.855 74.512c.048.038.097.075.146.112 21.424 16.34 47.094 24.509 72.77 24.509s51.357-8.174 72.788-24.518z"></path>
</svg></div>
<h1 class="text-xl ">
Hello there
</h1>
<p class="mt-4 text-gray-500">
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</p>
</div>
<div class="flex flex-col place-items-center space-x-4 w-2/12">
<div class="rounded-lg bg-blue-200 h-20 w-20 flex items-center justify-center">
<svg class="fill-current text-gray-600 h-10 w-10" id="Layer_1" enable-background="new 0 0 511.982 511.982" height="512" viewBox="0 0 511.982 511.982" width="512" xmlns="http://www.w3.org/2000/svg">
<path d="m255.991 455.991c-65.145 0-122.316-4.258-158.806-7.83-46.194-4.521-82.997-39.75-89.5-85.668-10.247-72.729-10.247-140.275 0-213.005 6.503-45.917 43.306-81.146 89.5-85.667 36.489-3.572 93.661-7.83 158.806-7.83s122.316 4.258 158.806 7.83c46.194 4.521 82.997 39.75 89.5 85.668 10.247 72.729 10.247 140.275 0 213.005-6.503 45.917-43.306 81.146-89.5 85.667-36.49 3.572-93.661 7.83-158.806 7.83zm0-360c-63.53 0-119.306 4.154-154.909 7.641-27.766 2.718-49.885 23.881-53.791 51.465-4.844 34.204-7.3 68.149-7.3 100.895s2.456 66.69 7.3 100.894c3.906 27.585 26.025 48.748 53.791 51.466 35.604 3.486 91.379 7.641 154.909 7.641s119.306-4.154 154.909-7.641c27.766-2.718 49.885-23.881 53.791-51.465 4.844-34.204 7.3-68.149 7.3-100.895s-2.456-66.69-7.3-100.894c-3.906-27.585-26.025-48.748-53.791-51.466-35.603-3.487-91.379-7.641-154.909-7.641zm-25.943 254.796c-26.74.364-50.683-22.824-50.057-49.881v-90.33c0-18.09 9.423-34.249 25.207-43.225 15.908-9.048 34.796-8.862 50.519.492l75.914 45.165c32.302 18.533 32.294 66.938 0 85.465l-75.914 45.165c-8.006 4.763-16.834 7.149-25.669 7.149zm.047-150.043c-2.333 0-4.189.848-5.123 1.379-1.86 1.058-4.98 3.562-4.98 8.453v90.33c0 4.892 3.12 7.396 4.98 8.453 1.557.886 5.676 2.651 10.294-.098l75.914-45.165c6.463-3.858 6.472-12.845 0-16.711l-75.914-45.165c-1.848-1.099-3.616-1.476-5.171-1.476z"></path>
</svg></div>
<h1 class="text-xl ">
Hello there
</h1>
<p class="mt-4 text-gray-500">
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</p>
</div>
</div>
</div>
<div class="flex justify-between items-center px-16 mt-20 ">
<div class="w-5/12">
<img src="undraw_Chatting_re_j55r.svg" alt="">
</div>
<div class="w-5/12">
<h1 class="text-xl font-bold">
Hello there blah blah
Hello there blah blah
</h1>
<p class="mt-4 text-gray-400">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. At atque dicta dolorem, ex in magni natus
quibusdam rem similique voluptatef!
</p>
<div class="flex space-x-3 mt-6 list-inside grid grid-flow-row auto-rows-max">
<div>
<div class="flex space-x-3 mt-3">
<svg class="fill-current text-gray-600 h-5 w-5" id="Layer_1" enable-background="new 0 0 512.058 512.058" height="512" viewBox="0 0 512.058 512.058" width="512" xmlns="http://www.w3.org/2000/svg">
<path d="m19.999 512.033c-10.757.179-20.189-9.204-19.996-20.002l.012-233.596c-1.571-228.697 276.736-344.968 437.966-182.879 159.524 161.859 44.352 436.676-183.165 436.475-40.3.001-78.774-9.038-114.35-26.866-33.992-17.035-75.147-10.167-102.409 17.097l-3.912 3.912c-3.826 3.825-8.942 5.858-14.146 5.859zm81.271-76.151c19.422 0 38.962 4.423 57.119 13.523 30.017 15.044 62.551 22.658 96.653 22.626 191.181.283 289.155-233.256 154.516-368.33-136.568-136.67-370.535-38.778-369.544 154.457.001.064.001.129.001.193l-.01 193.067c18.952-10.248 40.036-15.536 61.265-15.536zm56.043-80.824c-10.753 0-21.543-3.412-30.591-10.355-20.72-15.902-25.863-44.569-11.963-66.683l53.723-85.464c16.166-26.789 54.253-33.907 78.937-14.607l40.725 30.571 32.022-31.967c17.807-17.777 46.172-19.481 65.979-3.964 20.172 15.805 25.103 44.084 11.47 65.781l-54.055 86.026c-8.071 12.934-21.326 21.967-36.332 24.732-14.951 2.752-30.479-.935-42.607-10.122-.027-.021-.056-.043-.084-.064l-39.773-30.465-31.812 31.86c-9.728 9.745-22.656 14.721-35.639 14.721zm-6.237-42.088c4.091 3.141 9.926 2.756 13.569-.894l44.204-44.271c7.093-7.103 18.347-7.849 26.315-1.746l53.65 41.095c3.232 2.432 7.192 3.368 11.164 2.638 4.041-.745 7.479-3.098 9.68-6.624l54.087-86.078c2.696-4.292 1.721-9.886-2.27-13.013-3.918-3.068-9.53-2.731-13.05.784l-44.294 44.218c-7.041 7.03-18.18 7.813-26.137 1.841l-54.662-41.034c-3.31-2.509-7.291-3.452-11.273-2.721-4.04.745-7.478 3.097-9.679 6.624l-53.757 85.519c-2.847 4.53-1.793 10.404 2.453 13.662z"></path>
</svg> <h1 class="text-justify ">Hello there blah blah </h1></div>
<div class="flex space-x-3 mt-3">
<svg class="fill-current text-gray-600 h-5 w-5" id="Layer_1" enable-background="new 0 0 512.058 512.058" height="512" viewBox="0 0 512.058 512.058" width="512" xmlns="http://www.w3.org/2000/svg">
<path d="m19.999 512.033c-10.757.179-20.189-9.204-19.996-20.002l.012-233.596c-1.571-228.697 276.736-344.968 437.966-182.879 159.524 161.859 44.352 436.676-183.165 436.475-40.3.001-78.774-9.038-114.35-26.866-33.992-17.035-75.147-10.167-102.409 17.097l-3.912 3.912c-3.826 3.825-8.942 5.858-14.146 5.859zm81.271-76.151c19.422 0 38.962 4.423 57.119 13.523 30.017 15.044 62.551 22.658 96.653 22.626 191.181.283 289.155-233.256 154.516-368.33-136.568-136.67-370.535-38.778-369.544 154.457.001.064.001.129.001.193l-.01 193.067c18.952-10.248 40.036-15.536 61.265-15.536zm56.043-80.824c-10.753 0-21.543-3.412-30.591-10.355-20.72-15.902-25.863-44.569-11.963-66.683l53.723-85.464c16.166-26.789 54.253-33.907 78.937-14.607l40.725 30.571 32.022-31.967c17.807-17.777 46.172-19.481 65.979-3.964 20.172 15.805 25.103 44.084 11.47 65.781l-54.055 86.026c-8.071 12.934-21.326 21.967-36.332 24.732-14.951 2.752-30.479-.935-42.607-10.122-.027-.021-.056-.043-.084-.064l-39.773-30.465-31.812 31.86c-9.728 9.745-22.656 14.721-35.639 14.721zm-6.237-42.088c4.091 3.141 9.926 2.756 13.569-.894l44.204-44.271c7.093-7.103 18.347-7.849 26.315-1.746l53.65 41.095c3.232 2.432 7.192 3.368 11.164 2.638 4.041-.745 7.479-3.098 9.68-6.624l54.087-86.078c2.696-4.292 1.721-9.886-2.27-13.013-3.918-3.068-9.53-2.731-13.05.784l-44.294 44.218c-7.041 7.03-18.18 7.813-26.137 1.841l-54.662-41.034c-3.31-2.509-7.291-3.452-11.273-2.721-4.04.745-7.478 3.097-9.679 6.624l-53.757 85.519c-2.847 4.53-1.793 10.404 2.453 13.662z"></path>
</svg> <h1 class="text-justify ">Hello there blah blah </h1></div>
<div class="flex space-x-3 mt-3">
<svg class="fill-current text-gray-600 h-5 w-5" id="Layer_1" enable-background="new 0 0 512.058 512.058" height="512" viewBox="0 0 512.058 512.058" width="512" xmlns="http://www.w3.org/2000/svg">
<path d="m19.999 512.033c-10.757.179-20.189-9.204-19.996-20.002l.012-233.596c-1.571-228.697 276.736-344.968 437.966-182.879 159.524 161.859 44.352 436.676-183.165 436.475-40.3.001-78.774-9.038-114.35-26.866-33.992-17.035-75.147-10.167-102.409 17.097l-3.912 3.912c-3.826 3.825-8.942 5.858-14.146 5.859zm81.271-76.151c19.422 0 38.962 4.423 57.119 13.523 30.017 15.044 62.551 22.658 96.653 22.626 191.181.283 289.155-233.256 154.516-368.33-136.568-136.67-370.535-38.778-369.544 154.457.001.064.001.129.001.193l-.01 193.067c18.952-10.248 40.036-15.536 61.265-15.536zm56.043-80.824c-10.753 0-21.543-3.412-30.591-10.355-20.72-15.902-25.863-44.569-11.963-66.683l53.723-85.464c16.166-26.789 54.253-33.907 78.937-14.607l40.725 30.571 32.022-31.967c17.807-17.777 46.172-19.481 65.979-3.964 20.172 15.805 25.103 44.084 11.47 65.781l-54.055 86.026c-8.071 12.934-21.326 21.967-36.332 24.732-14.951 2.752-30.479-.935-42.607-10.122-.027-.021-.056-.043-.084-.064l-39.773-30.465-31.812 31.86c-9.728 9.745-22.656 14.721-35.639 14.721zm-6.237-42.088c4.091 3.141 9.926 2.756 13.569-.894l44.204-44.271c7.093-7.103 18.347-7.849 26.315-1.746l53.65 41.095c3.232 2.432 7.192 3.368 11.164 2.638 4.041-.745 7.479-3.098 9.68-6.624l54.087-86.078c2.696-4.292 1.721-9.886-2.27-13.013-3.918-3.068-9.53-2.731-13.05.784l-44.294 44.218c-7.041 7.03-18.18 7.813-26.137 1.841l-54.662-41.034c-3.31-2.509-7.291-3.452-11.273-2.721-4.04.745-7.478 3.097-9.679 6.624l-53.757 85.519c-2.847 4.53-1.793 10.404 2.453 13.662z"></path>
</svg> <h1 class="text-justify ">Hello there blah blah </h1> </div></div>
</div>
</div>
</div>
</div>
<div class="flex justify-between items-center px-16 mt-20 ">
<div class="w-5/12">
<h1 class="text-xl font-bold">
Hello there blah blah
Hello there blah blah
</h1>
<p class="mt-4 text-gray-400">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. At atque dicta dolorem, ex in magni natus
quibusdam rem similique voluptatef!
</p>
<div class="flex space-x-3 mt-3 list-inside grid grid-flow-row auto-rows-max">
<div>
<div class="flex space-x-3 mt-3">
<svg class="fill-current text-gray-600 h-5 w-5" id="Layer_1" enable-background="new 0 0 512.058 512.058" height="512" viewBox="0 0 512.058 512.058" width="512" xmlns="http://www.w3.org/2000/svg">
<path d="m19.999 512.033c-10.757.179-20.189-9.204-19.996-20.002l.012-233.596c-1.571-228.697 276.736-344.968 437.966-182.879 159.524 161.859 44.352 436.676-183.165 436.475-40.3.001-78.774-9.038-114.35-26.866-33.992-17.035-75.147-10.167-102.409 17.097l-3.912 3.912c-3.826 3.825-8.942 5.858-14.146 5.859zm81.271-76.151c19.422 0 38.962 4.423 57.119 13.523 30.017 15.044 62.551 22.658 96.653 22.626 191.181.283 289.155-233.256 154.516-368.33-136.568-136.67-370.535-38.778-369.544 154.457.001.064.001.129.001.193l-.01 193.067c18.952-10.248 40.036-15.536 61.265-15.536zm56.043-80.824c-10.753 0-21.543-3.412-30.591-10.355-20.72-15.902-25.863-44.569-11.963-66.683l53.723-85.464c16.166-26.789 54.253-33.907 78.937-14.607l40.725 30.571 32.022-31.967c17.807-17.777 46.172-19.481 65.979-3.964 20.172 15.805 25.103 44.084 11.47 65.781l-54.055 86.026c-8.071 12.934-21.326 21.967-36.332 24.732-14.951 2.752-30.479-.935-42.607-10.122-.027-.021-.056-.043-.084-.064l-39.773-30.465-31.812 31.86c-9.728 9.745-22.656 14.721-35.639 14.721zm-6.237-42.088c4.091 3.141 9.926 2.756 13.569-.894l44.204-44.271c7.093-7.103 18.347-7.849 26.315-1.746l53.65 41.095c3.232 2.432 7.192 3.368 11.164 2.638 4.041-.745 7.479-3.098 9.68-6.624l54.087-86.078c2.696-4.292 1.721-9.886-2.27-13.013-3.918-3.068-9.53-2.731-13.05.784l-44.294 44.218c-7.041 7.03-18.18 7.813-26.137 1.841l-54.662-41.034c-3.31-2.509-7.291-3.452-11.273-2.721-4.04.745-7.478 3.097-9.679 6.624l-53.757 85.519c-2.847 4.53-1.793 10.404 2.453 13.662z"></path>
</svg> <h1 class="text-justify ">Hello there blah blah </h1>
</div>
<div class="flex space-x-3 mt-3">
<svg class="fill-current text-gray-600 h-5 w-5" id="Layer_1" enable-background="new 0 0 512.058 512.058" height="512" viewBox="0 0 512.058 512.058" width="512" xmlns="http://www.w3.org/2000/svg">
<path d="m19.999 512.033c-10.757.179-20.189-9.204-19.996-20.002l.012-233.596c-1.571-228.697 276.736-344.968 437.966-182.879 159.524 161.859 44.352 436.676-183.165 436.475-40.3.001-78.774-9.038-114.35-26.866-33.992-17.035-75.147-10.167-102.409 17.097l-3.912 3.912c-3.826 3.825-8.942 5.858-14.146 5.859zm81.271-76.151c19.422 0 38.962 4.423 57.119 13.523 30.017 15.044 62.551 22.658 96.653 22.626 191.181.283 289.155-233.256 154.516-368.33-136.568-136.67-370.535-38.778-369.544 154.457.001.064.001.129.001.193l-.01 193.067c18.952-10.248 40.036-15.536 61.265-15.536zm56.043-80.824c-10.753 0-21.543-3.412-30.591-10.355-20.72-15.902-25.863-44.569-11.963-66.683l53.723-85.464c16.166-26.789 54.253-33.907 78.937-14.607l40.725 30.571 32.022-31.967c17.807-17.777 46.172-19.481 65.979-3.964 20.172 15.805 25.103 44.084 11.47 65.781l-54.055 86.026c-8.071 12.934-21.326 21.967-36.332 24.732-14.951 2.752-30.479-.935-42.607-10.122-.027-.021-.056-.043-.084-.064l-39.773-30.465-31.812 31.86c-9.728 9.745-22.656 14.721-35.639 14.721zm-6.237-42.088c4.091 3.141 9.926 2.756 13.569-.894l44.204-44.271c7.093-7.103 18.347-7.849 26.315-1.746l53.65 41.095c3.232 2.432 7.192 3.368 11.164 2.638 4.041-.745 7.479-3.098 9.68-6.624l54.087-86.078c2.696-4.292 1.721-9.886-2.27-13.013-3.918-3.068-9.53-2.731-13.05.784l-44.294 44.218c-7.041 7.03-18.18 7.813-26.137 1.841l-54.662-41.034c-3.31-2.509-7.291-3.452-11.273-2.721-4.04.745-7.478 3.097-9.679 6.624l-53.757 85.519c-2.847 4.53-1.793 10.404 2.453 13.662z"></path>
</svg> <h1 class="text-justify ">Hello there blah blah </h1></div>
<div class="flex space-x-3 mt-3">
<svg class="fill-current text-gray-600 h-5 w-5" id="Layer_1" enable-background="new 0 0 512.058 512.058" height="512" viewBox="0 0 512.058 512.058" width="512" xmlns="http://www.w3.org/2000/svg">
<path d="m19.999 512.033c-10.757.179-20.189-9.204-19.996-20.002l.012-233.596c-1.571-228.697 276.736-344.968 437.966-182.879 159.524 161.859 44.352 436.676-183.165 436.475-40.3.001-78.774-9.038-114.35-26.866-33.992-17.035-75.147-10.167-102.409 17.097l-3.912 3.912c-3.826 3.825-8.942 5.858-14.146 5.859zm81.271-76.151c19.422 0 38.962 4.423 57.119 13.523 30.017 15.044 62.551 22.658 96.653 22.626 191.181.283 289.155-233.256 154.516-368.33-136.568-136.67-370.535-38.778-369.544 154.457.001.064.001.129.001.193l-.01 193.067c18.952-10.248 40.036-15.536 61.265-15.536zm56.043-80.824c-10.753 0-21.543-3.412-30.591-10.355-20.72-15.902-25.863-44.569-11.963-66.683l53.723-85.464c16.166-26.789 54.253-33.907 78.937-14.607l40.725 30.571 32.022-31.967c17.807-17.777 46.172-19.481 65.979-3.964 20.172 15.805 25.103 44.084 11.47 65.781l-54.055 86.026c-8.071 12.934-21.326 21.967-36.332 24.732-14.951 2.752-30.479-.935-42.607-10.122-.027-.021-.056-.043-.084-.064l-39.773-30.465-31.812 31.86c-9.728 9.745-22.656 14.721-35.639 14.721zm-6.237-42.088c4.091 3.141 9.926 2.756 13.569-.894l44.204-44.271c7.093-7.103 18.347-7.849 26.315-1.746l53.65 41.095c3.232 2.432 7.192 3.368 11.164 2.638 4.041-.745 7.479-3.098 9.68-6.624l54.087-86.078c2.696-4.292 1.721-9.886-2.27-13.013-3.918-3.068-9.53-2.731-13.05.784l-44.294 44.218c-7.041 7.03-18.18 7.813-26.137 1.841l-54.662-41.034c-3.31-2.509-7.291-3.452-11.273-2.721-4.04.745-7.478 3.097-9.679 6.624l-53.757 85.519c-2.847 4.53-1.793 10.404 2.453 13.662z"></path>
</svg> <h1 class="text-justify ">Hello there blah blah </h1></div> </div>
</div>
</div>
<div class="w-5/12">
<img src="undraw_Mobile_marketing_re_p77p.svg" alt="">
</div>
</div>
</div>
<div class="flex justify-between items-center px-16 mt-20 ">
<div class="w-5/12">
<img src="undraw_Push_notifications_re_t84m.svg" alt="">
</div>
<div class="w-5/12">
<h1 class="text-xl font-bold">
Hello there blah blah
Hello there blah blah
</h1>
<p class="mt-4 text-gray-400">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. At atque dicta dolorem, ex in magni natus
quibusdam rem similique voluptatef!
</p>
<div class="flex space-x-3 mt-6 list-inside grid grid-flow-row auto-rows-max">
<div>
<div class="flex space-x-3 mt-3">
<svg class="fill-current text-gray-600 h-5 w-5" id="Layer_1" enable-background="new 0 0 512.058 512.058" height="512" viewBox="0 0 512.058 512.058" width="512" xmlns="http://www.w3.org/2000/svg">
<path d="m19.999 512.033c-10.757.179-20.189-9.204-19.996-20.002l.012-233.596c-1.571-228.697 276.736-344.968 437.966-182.879 159.524 161.859 44.352 436.676-183.165 436.475-40.3.001-78.774-9.038-114.35-26.866-33.992-17.035-75.147-10.167-102.409 17.097l-3.912 3.912c-3.826 3.825-8.942 5.858-14.146 5.859zm81.271-76.151c19.422 0 38.962 4.423 57.119 13.523 30.017 15.044 62.551 22.658 96.653 22.626 191.181.283 289.155-233.256 154.516-368.33-136.568-136.67-370.535-38.778-369.544 154.457.001.064.001.129.001.193l-.01 193.067c18.952-10.248 40.036-15.536 61.265-15.536zm56.043-80.824c-10.753 0-21.543-3.412-30.591-10.355-20.72-15.902-25.863-44.569-11.963-66.683l53.723-85.464c16.166-26.789 54.253-33.907 78.937-14.607l40.725 30.571 32.022-31.967c17.807-17.777 46.172-19.481 65.979-3.964 20.172 15.805 25.103 44.084 11.47 65.781l-54.055 86.026c-8.071 12.934-21.326 21.967-36.332 24.732-14.951 2.752-30.479-.935-42.607-10.122-.027-.021-.056-.043-.084-.064l-39.773-30.465-31.812 31.86c-9.728 9.745-22.656 14.721-35.639 14.721zm-6.237-42.088c4.091 3.141 9.926 2.756 13.569-.894l44.204-44.271c7.093-7.103 18.347-7.849 26.315-1.746l53.65 41.095c3.232 2.432 7.192 3.368 11.164 2.638 4.041-.745 7.479-3.098 9.68-6.624l54.087-86.078c2.696-4.292 1.721-9.886-2.27-13.013-3.918-3.068-9.53-2.731-13.05.784l-44.294 44.218c-7.041 7.03-18.18 7.813-26.137 1.841l-54.662-41.034c-3.31-2.509-7.291-3.452-11.273-2.721-4.04.745-7.478 3.097-9.679 6.624l-53.757 85.519c-2.847 4.53-1.793 10.404 2.453 13.662z"></path>
</svg> <h1 class="text-justify ">Hello there blah blah </h1>
</div>
<div class="flex space-x-3 mt-3">
<svg class="fill-current text-gray-600 h-5 w-5" id="Layer_1" enable-background="new 0 0 512.058 512.058" height="512" viewBox="0 0 512.058 512.058" width="512" xmlns="http://www.w3.org/2000/svg">
<path d="m19.999 512.033c-10.757.179-20.189-9.204-19.996-20.002l.012-233.596c-1.571-228.697 276.736-344.968 437.966-182.879 159.524 161.859 44.352 436.676-183.165 436.475-40.3.001-78.774-9.038-114.35-26.866-33.992-17.035-75.147-10.167-102.409 17.097l-3.912 3.912c-3.826 3.825-8.942 5.858-14.146 5.859zm81.271-76.151c19.422 0 38.962 4.423 57.119 13.523 30.017 15.044 62.551 22.658 96.653 22.626 191.181.283 289.155-233.256 154.516-368.33-136.568-136.67-370.535-38.778-369.544 154.457.001.064.001.129.001.193l-.01 193.067c18.952-10.248 40.036-15.536 61.265-15.536zm56.043-80.824c-10.753 0-21.543-3.412-30.591-10.355-20.72-15.902-25.863-44.569-11.963-66.683l53.723-85.464c16.166-26.789 54.253-33.907 78.937-14.607l40.725 30.571 32.022-31.967c17.807-17.777 46.172-19.481 65.979-3.964 20.172 15.805 25.103 44.084 11.47 65.781l-54.055 86.026c-8.071 12.934-21.326 21.967-36.332 24.732-14.951 2.752-30.479-.935-42.607-10.122-.027-.021-.056-.043-.084-.064l-39.773-30.465-31.812 31.86c-9.728 9.745-22.656 14.721-35.639 14.721zm-6.237-42.088c4.091 3.141 9.926 2.756 13.569-.894l44.204-44.271c7.093-7.103 18.347-7.849 26.315-1.746l53.65 41.095c3.232 2.432 7.192 3.368 11.164 2.638 4.041-.745 7.479-3.098 9.68-6.624l54.087-86.078c2.696-4.292 1.721-9.886-2.27-13.013-3.918-3.068-9.53-2.731-13.05.784l-44.294 44.218c-7.041 7.03-18.18 7.813-26.137 1.841l-54.662-41.034c-3.31-2.509-7.291-3.452-11.273-2.721-4.04.745-7.478 3.097-9.679 6.624l-53.757 85.519c-2.847 4.53-1.793 10.404 2.453 13.662z"></path>
</svg> <h1 class="text-justify ">Hello there blah blah </h1></div>
<div class="flex space-x-3 mt-3">
<svg class="fill-current text-gray-600 h-5 w-5" id="Layer_1" enable-background="new 0 0 512.058 512.058" height="512" viewBox="0 0 512.058 512.058" width="512" xmlns="http://www.w3.org/2000/svg">
<path d="m19.999 512.033c-10.757.179-20.189-9.204-19.996-20.002l.012-233.596c-1.571-228.697 276.736-344.968 437.966-182.879 159.524 161.859 44.352 436.676-183.165 436.475-40.3.001-78.774-9.038-114.35-26.866-33.992-17.035-75.147-10.167-102.409 17.097l-3.912 3.912c-3.826 3.825-8.942 5.858-14.146 5.859zm81.271-76.151c19.422 0 38.962 4.423 57.119 13.523 30.017 15.044 62.551 22.658 96.653 22.626 191.181.283 289.155-233.256 154.516-368.33-136.568-136.67-370.535-38.778-369.544 154.457.001.064.001.129.001.193l-.01 193.067c18.952-10.248 40.036-15.536 61.265-15.536zm56.043-80.824c-10.753 0-21.543-3.412-30.591-10.355-20.72-15.902-25.863-44.569-11.963-66.683l53.723-85.464c16.166-26.789 54.253-33.907 78.937-14.607l40.725 30.571 32.022-31.967c17.807-17.777 46.172-19.481 65.979-3.964 20.172 15.805 25.103 44.084 11.47 65.781l-54.055 86.026c-8.071 12.934-21.326 21.967-36.332 24.732-14.951 2.752-30.479-.935-42.607-10.122-.027-.021-.056-.043-.084-.064l-39.773-30.465-31.812 31.86c-9.728 9.745-22.656 14.721-35.639 14.721zm-6.237-42.088c4.091 3.141 9.926 2.756 13.569-.894l44.204-44.271c7.093-7.103 18.347-7.849 26.315-1.746l53.65 41.095c3.232 2.432 7.192 3.368 11.164 2.638 4.041-.745 7.479-3.098 9.68-6.624l54.087-86.078c2.696-4.292 1.721-9.886-2.27-13.013-3.918-3.068-9.53-2.731-13.05.784l-44.294 44.218c-7.041 7.03-18.18 7.813-26.137 1.841l-54.662-41.034c-3.31-2.509-7.291-3.452-11.273-2.721-4.04.745-7.478 3.097-9.679 6.624l-53.757 85.519c-2.847 4.53-1.793 10.404 2.453 13.662z"></path>
</svg> <h1 class="text-justify ">Hello there blah blah </h1></div></div>
</div>
</div>
</div>
</div>
<div class=" my-16 mx-16 grid grid-cols-1 md:grid-cols-3 gap-6 xl:gap-8">
<div class="w-full flex shadow-lg">
<div class="w-full flex md:flex-col rounded-3xl bg-gray-200">
<div class=" flex items-center justify-cente sm:max-w-sm sm:flex-none md:w-auto md:flex-auto flex flex-col items-start relative z-10 p-6 xl:p-8">
<p class=" text-xl "> 20$</p>
<div class=" my-6">
<svg class="fill-current text-gray-600 h-10 w-10" id="Layer_1" enable-background="new 0 0 512.058 512.058" height="512" viewBox="0 0 512.058 512.058" width="512" xmlns="http://www.w3.org/2000/svg">
<path d="m19.999 512.033c-10.757.179-20.189-9.204-19.996-20.002l.012-233.596c-1.571-228.697 276.736-344.968 437.966-182.879 159.524 161.859 44.352 436.676-183.165 436.475-40.3.001-78.774-9.038-114.35-26.866-33.992-17.035-75.147-10.167-102.409 17.097l-3.912 3.912c-3.826 3.825-8.942 5.858-14.146 5.859zm81.271-76.151c19.422 0 38.962 4.423 57.119 13.523 30.017 15.044 62.551 22.658 96.653 22.626 191.181.283 289.155-233.256 154.516-368.33-136.568-136.67-370.535-38.778-369.544 154.457.001.064.001.129.001.193l-.01 193.067c18.952-10.248 40.036-15.536 61.265-15.536zm56.043-80.824c-10.753 0-21.543-3.412-30.591-10.355-20.72-15.902-25.863-44.569-11.963-66.683l53.723-85.464c16.166-26.789 54.253-33.907 78.937-14.607l40.725 30.571 32.022-31.967c17.807-17.777 46.172-19.481 65.979-3.964 20.172 15.805 25.103 44.084 11.47 65.781l-54.055 86.026c-8.071 12.934-21.326 21.967-36.332 24.732-14.951 2.752-30.479-.935-42.607-10.122-.027-.021-.056-.043-.084-.064l-39.773-30.465-31.812 31.86c-9.728 9.745-22.656 14.721-35.639 14.721zm-6.237-42.088c4.091 3.141 9.926 2.756 13.569-.894l44.204-44.271c7.093-7.103 18.347-7.849 26.315-1.746l53.65 41.095c3.232 2.432 7.192 3.368 11.164 2.638 4.041-.745 7.479-3.098 9.68-6.624l54.087-86.078c2.696-4.292 1.721-9.886-2.27-13.013-3.918-3.068-9.53-2.731-13.05.784l-44.294 44.218c-7.041 7.03-18.18 7.813-26.137 1.841l-54.662-41.034c-3.31-2.509-7.291-3.452-11.273-2.721-4.04.745-7.478 3.097-9.679 6.624l-53.757 85.519c-2.847 4.53-1.793 10.404 2.453 13.662z"></path>
</svg> </div>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Aliquam autem, placeat nostrum, neque tenetur commodi voluptatum corporis a qui reiciendis esse at nobis fugit vitae id fuga, minus similique rerum!</p>
</div>
</div>
</div>
<div class="w-full flex shadow-lg">
<div class="w-full flex md:flex-col rounded-3xl bg-gray-200">
<div class=" flex items-center justify-cente sm:max-w-sm sm:flex-none md:w-auto md:flex-auto flex flex-col items-start relative z-10 p-6 xl:p-8">
<p class=" text-xl "> $19</p>
<div class=" my-6">
<svg class="fill-current text-gray-600 h-10 w-10" id="Layer_1" enable-background="new 0 0 512.058 512.058" height="512" viewBox="0 0 512.058 512.058" width="512" xmlns="http://www.w3.org/2000/svg">
<path d="m19.999 512.033c-10.757.179-20.189-9.204-19.996-20.002l.012-233.596c-1.571-228.697 276.736-344.968 437.966-182.879 159.524 161.859 44.352 436.676-183.165 436.475-40.3.001-78.774-9.038-114.35-26.866-33.992-17.035-75.147-10.167-102.409 17.097l-3.912 3.912c-3.826 3.825-8.942 5.858-14.146 5.859zm81.271-76.151c19.422 0 38.962 4.423 57.119 13.523 30.017 15.044 62.551 22.658 96.653 22.626 191.181.283 289.155-233.256 154.516-368.33-136.568-136.67-370.535-38.778-369.544 154.457.001.064.001.129.001.193l-.01 193.067c18.952-10.248 40.036-15.536 61.265-15.536zm56.043-80.824c-10.753 0-21.543-3.412-30.591-10.355-20.72-15.902-25.863-44.569-11.963-66.683l53.723-85.464c16.166-26.789 54.253-33.907 78.937-14.607l40.725 30.571 32.022-31.967c17.807-17.777 46.172-19.481 65.979-3.964 20.172 15.805 25.103 44.084 11.47 65.781l-54.055 86.026c-8.071 12.934-21.326 21.967-36.332 24.732-14.951 2.752-30.479-.935-42.607-10.122-.027-.021-.056-.043-.084-.064l-39.773-30.465-31.812 31.86c-9.728 9.745-22.656 14.721-35.639 14.721zm-6.237-42.088c4.091 3.141 9.926 2.756 13.569-.894l44.204-44.271c7.093-7.103 18.347-7.849 26.315-1.746l53.65 41.095c3.232 2.432 7.192 3.368 11.164 2.638 4.041-.745 7.479-3.098 9.68-6.624l54.087-86.078c2.696-4.292 1.721-9.886-2.27-13.013-3.918-3.068-9.53-2.731-13.05.784l-44.294 44.218c-7.041 7.03-18.18 7.813-26.137 1.841l-54.662-41.034c-3.31-2.509-7.291-3.452-11.273-2.721-4.04.745-7.478 3.097-9.679 6.624l-53.757 85.519c-2.847 4.53-1.793 10.404 2.453 13.662z"></path>
</svg> </div>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Aliquam autem, placeat nostrum, neque tenetur commodi voluptatum corporis a qui reiciendis esse at nobis fugit vitae id fuga, minus similique rerum!</p>
<div class="my-6"><div class=" rounded-full bg-red-300 py-3 px-8 ... "> features</div> </div>
</div>
</div>
</div>
<div class="w-full flex shadow-lg">
<div class="w-full flex md:flex-col rounded-3xl bg-gray-200">
<div class=" flex items-center justify-cente sm:max-w-sm sm:flex-none md:w-auto md:flex-auto flex flex-col items-start relative z-10 p-6 xl:p-8">
<p class=" text-xl "> 20$</p>
<div class=" my-6">
<svg class="fill-current text-gray-600 h-10 w-10" id="Layer_1" enable-background="new 0 0 512.058 512.058" height="512" viewBox="0 0 512.058 512.058" width="512" xmlns="http://www.w3.org/2000/svg">
<path d="m19.999 512.033c-10.757.179-20.189-9.204-19.996-20.002l.012-233.596c-1.571-228.697 276.736-344.968 437.966-182.879 159.524 161.859 44.352 436.676-183.165 436.475-40.3.001-78.774-9.038-114.35-26.866-33.992-17.035-75.147-10.167-102.409 17.097l-3.912 3.912c-3.826 3.825-8.942 5.858-14.146 5.859zm81.271-76.151c19.422 0 38.962 4.423 57.119 13.523 30.017 15.044 62.551 22.658 96.653 22.626 191.181.283 289.155-233.256 154.516-368.33-136.568-136.67-370.535-38.778-369.544 154.457.001.064.001.129.001.193l-.01 193.067c18.952-10.248 40.036-15.536 61.265-15.536zm56.043-80.824c-10.753 0-21.543-3.412-30.591-10.355-20.72-15.902-25.863-44.569-11.963-66.683l53.723-85.464c16.166-26.789 54.253-33.907 78.937-14.607l40.725 30.571 32.022-31.967c17.807-17.777 46.172-19.481 65.979-3.964 20.172 15.805 25.103 44.084 11.47 65.781l-54.055 86.026c-8.071 12.934-21.326 21.967-36.332 24.732-14.951 2.752-30.479-.935-42.607-10.122-.027-.021-.056-.043-.084-.064l-39.773-30.465-31.812 31.86c-9.728 9.745-22.656 14.721-35.639 14.721zm-6.237-42.088c4.091 3.141 9.926 2.756 13.569-.894l44.204-44.271c7.093-7.103 18.347-7.849 26.315-1.746l53.65 41.095c3.232 2.432 7.192 3.368 11.164 2.638 4.041-.745 7.479-3.098 9.68-6.624l54.087-86.078c2.696-4.292 1.721-9.886-2.27-13.013-3.918-3.068-9.53-2.731-13.05.784l-44.294 44.218c-7.041 7.03-18.18 7.813-26.137 1.841l-54.662-41.034c-3.31-2.509-7.291-3.452-11.273-2.721-4.04.745-7.478 3.097-9.679 6.624l-53.757 85.519c-2.847 4.53-1.793 10.404 2.453 13.662z"></path>
</svg> </div>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Aliquam autem, placeat nostrum, neque tenetur commodi voluptatum corporis a qui reiciendis esse at nobis fugit vitae id fuga, minus similique rerum!</p>
</div>
</div>
</div>
</div>
<div>
<div class="flex justify-between items-center mt-20 justify-center flex-col place-items-center py-4 px-4 ">
<div class=" rounded-full bg-red-300 py-3 px-8 w-4... "> features</div>
<h1 class="text-3xl font-bold">
Hello there blah blah
</h1>
<p class="mt-4 w-4/12 text-center text-gray-500">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. At atque dicta dolorem, ex in magni natus
quibusdam rem similique voluptatef!Lorem ipsum dolor sit amet, consectetur adipisicing elit. At atque dicta dolorem, ex in magni natus
</p>
</div >
<div class=" my-16 mx-16 grid grid-cols-1 md:grid-cols-3 gap-6 xl:gap-8">
<div class="w-full flex shadow-lg">
<div class="w-full flex md:flex-col rounded-3xl bg-gray-100">
<div class=" flex items-center justify-cente sm:max-w-sm sm:flex-none md:w-auto md:flex-auto flex flex-col items-start relative z-10 p-6 xl:p-8">
<img class="rounded-full h-24 w-24 flex items-center justify-center" src="undraw_female_avatar_w3jk.svg">
<p class=" text-3xl my-6 "> 20$</p>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Aliquam autem, placeat nostrum, neque tenetur commodi voluptatum corporis a qui reiciendis esse at nobis fugit vitae id fuga, minus similique rerum!</p>
</div>
</div>
</div>
<div class="w-full flex shadow-lg">
<div class="w-full flex md:flex-col rounded-3xl bg-gray-100">
<div class=" flex items-center justify-cente sm:max-w-sm sm:flex-none md:w-auto md:flex-auto flex flex-col items-start relative z-10 p-6 xl:p-8">
<img class="rounded-full h-24 w-24 flex items-center justify-center" src="undraw_female_avatar_w3jk (1).svg">
<p class=" text-3xl my-6 "> 20$</p>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Aliquam autem, placeat nostrum, neque tenetur commodi voluptatum corporis a qui reiciendis esse at nobis fugit vitae id fuga, minus similique rerum!</p>
</div>
</div>
</div>
<div class="w-full flex shadow-lg">
<div class="w-full flex md:flex-col rounded-3xl bg-gray-100">
<div class=" flex items-center justify-cente sm:max-w-sm sm:flex-none md:w-auto md:flex-auto flex flex-col items-start relative z-10 p-6 xl:p-8">
<img class="rounded-full h-24 w-24 flex items-center justify-center" src="undraw_male_avatar_323b.svg">
<p class=" text-3xl my-6 "> 20$</p>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Aliquam autem, placeat nostrum, neque tenetur commodi voluptatum corporis a qui reiciendis esse at nobis fugit vitae id fuga, minus similique rerum!</p>
</div>
</div>
</div>
</div>
<div class=" mx-20 my-20 absolute -mt-9">
<div class=" flex flex-wrap md:flex-nowrap items-center bg-red-400 shadow-lg rounded-2xl py-6 md:py-4 px-16 md:pr-5 space-y-4 md:space-y-0 md:space-x-8">
<p class="w-6/12 text-white text-3xl">Lorem ipsum dolor sit,asperiores ipsa veniam vero explicabo fugit quod.</p>
<button class="flex text-center justify-center bg-red-500 text-white rounded-md shadow-md px-3 py-2 mt-6 font-bold">
Get started
</button>
</div>
</div>
<div class="h-foll w-full bg-red-200 grid grid-flow-col grid-cols-4 grid-rows-1 gap-4 ">
<div class=" px-16 py-20 ">
<div class="flex items-center my-4 mx-5 space-x-2">
<svg class="fill-current text-red-500 w-10 h-10" id="Capa_1" enable-background="new 0 0 512 512" height="512" viewBox="0 0 512 512" width="512" xmlns="http://www.w3.org/2000/svg">
<g>
<path d="m322 401c44.112 0 80 35.888 80 80 0 5.522 4.478 10 10 10s10-4.478 10-10c0-44.112 35.888-80 80-80 5.522 0 10-4.478 10-10s-4.478-10-10-10c-44.112 0-80-35.888-80-80 0-5.522-4.478-10-10-10s-10 4.478-10 10c0 44.112-35.888 80-80 80-5.522 0-10 4.478-10 10s4.478 10 10 10zm90-56.429c9.816 20.194 26.234 36.612 46.429 46.429-20.194 9.816-36.612 26.234-46.429 46.429-9.816-20.194-26.234-36.612-46.429-46.429 20.195-9.816 36.613-26.234 46.429-46.429z"></path>
<path d="m10 101c27.57 0 50 22.43 50 50 0 5.522 4.477 10 10 10s10-4.478 10-10c0-27.57 22.43-50 50-50 5.523 0 10-4.478 10-10s-4.477-10-10-10c-27.57 0-50-22.43-50-50 0-5.522-4.477-10-10-10s-10 4.478-10 10c0 27.57-22.43 50-50 50-5.523 0-10 4.478-10 10s4.477 10 10 10zm60-33.976c5.913 9.81 14.166 18.064 23.975 23.976-9.81 5.912-18.063 14.166-23.975 23.976-5.913-9.81-14.166-18.064-23.975-23.976 9.809-5.912 18.062-14.166 23.975-23.976z"></path>
<circle cx="279" cy="294" r="10"></circle>
<path d="m305.678 271.194c2.817 4.749 8.954 6.315 13.703 3.496 26.118-15.498 56.07-23.69 86.619-23.69 5.522 0 10-4.478 10-10s-4.478-10-10-10c-93.738 0-170-76.262-170-170 0-5.522-4.477-10-10-10s-10 4.478-10 10c0 93.738-76.262 170-170 170-5.523 0-10 4.478-10 10s4.477 10 10 10c93.738 0 170 76.262 170 170 0 5.522 4.477 10 10 10s10-4.478 10-10c0-30.549 8.192-60.501 23.69-86.619 2.818-4.75 1.253-10.885-3.496-13.703-4.753-2.821-10.886-1.253-13.703 3.496-6.764 11.398-12.282 23.445-16.498 35.931-18.953-55.876-63.24-100.157-119.118-119.105 55.884-18.95 100.175-63.241 119.125-119.125 18.948 55.878 63.229 100.165 119.104 119.118-12.485 4.216-24.532 9.734-35.931 16.498-4.748 2.819-6.314 8.953-3.495 13.703z"></path>
</g>
</svg>
<h1 class="text-red-500 font-bold">
Logo
</h1>
</div>
<p class=" mx-4 my-5">Lorem ipsum dolor sit amet consectetur adipisicing elit. Error, quas perspiciatis. commodi minus eveniet!</p>
</div>
<div class="px-16 py-20"> <div class=" my-4 mx-8 space-x-2" ><h1 class=" font-bold">test</h1> <p class="w-20">Lorem ipsum dolor sit amet,Lorem ipsum dolor sit amet,</p> </div> </div>
<div class="px-16 py-20"><div class=" my-4 mx-8 space-x-2" ><h1 class="font-bold">test</h1> <p class="w-20" >Lorem ipsum dolor sit amet,Lorem ipsum dolor sit amet, </p> </div> </div>
<div class="px-16 py-20"> <div class=" my-4 mx-8 space-x-2" ><h1 class="font-bold">test</h1> <p class="w-20">Lorem ipsum dolor sit amet, </p>
<div class="flex space-x-3 mt-6">
<div class="rounded-lg bg-red-300 h-10 w-10 flex items-center justify-center">
<svg class="fill-current text-gray-600 h-5 w-5" id="Layer_1" enable-background="new 0 0 512 512" height="512" viewBox="0 0 512 512" width="512" xmlns="http://www.w3.org/2000/svg">
<path d="m392 458h-272c-66.168 0-120-53.832-120-120v-164c0-66.168 53.832-120 120-120h272c66.168 0 120 53.832 120 120v164c0 66.168-53.832 120-120 120zm-272-364c-44.112 0-80 35.888-80 80v164c0 44.112 35.888 80 80 80h272c44.112 0 80-35.888 80-80v-164c0-44.112-35.888-80-80-80zm209.286 197.406 98.855-75.512c8.778-6.705 10.458-19.256 3.753-28.034-6.706-8.778-19.256-10.458-28.034-3.753l-98.843 75.503c-28.541 21.769-68.4 21.785-96.96.055l-95.781-74.455c-8.721-6.78-21.287-5.205-28.065 3.516-6.779 8.721-5.205 21.286 3.516 28.065l95.855 74.512c.048.038.097.075.146.112 21.424 16.34 47.094 24.509 72.77 24.509s51.357-8.174 72.788-24.518z"></path>
</svg></div>
<div class="rounded-lg bg-red-300 h-10 w-10 flex items-center justify-center">
<svg class="fill-current text-gray-600 h-5 w-5" id="Layer_1" enable-background="new 0 0 512.058 512.058" height="512" viewBox="0 0 512.058 512.058" width="512" xmlns="http://www.w3.org/2000/svg">
<path d="m19.999 512.033c-10.757.179-20.189-9.204-19.996-20.002l.012-233.596c-1.571-228.697 276.736-344.968 437.966-182.879 159.524 161.859 44.352 436.676-183.165 436.475-40.3.001-78.774-9.038-114.35-26.866-33.992-17.035-75.147-10.167-102.409 17.097l-3.912 3.912c-3.826 3.825-8.942 5.858-14.146 5.859zm81.271-76.151c19.422 0 38.962 4.423 57.119 13.523 30.017 15.044 62.551 22.658 96.653 22.626 191.181.283 289.155-233.256 154.516-368.33-136.568-136.67-370.535-38.778-369.544 154.457.001.064.001.129.001.193l-.01 193.067c18.952-10.248 40.036-15.536 61.265-15.536zm56.043-80.824c-10.753 0-21.543-3.412-30.591-10.355-20.72-15.902-25.863-44.569-11.963-66.683l53.723-85.464c16.166-26.789 54.253-33.907 78.937-14.607l40.725 30.571 32.022-31.967c17.807-17.777 46.172-19.481 65.979-3.964 20.172 15.805 25.103 44.084 11.47 65.781l-54.055 86.026c-8.071 12.934-21.326 21.967-36.332 24.732-14.951 2.752-30.479-.935-42.607-10.122-.027-.021-.056-.043-.084-.064l-39.773-30.465-31.812 31.86c-9.728 9.745-22.656 14.721-35.639 14.721zm-6.237-42.088c4.091 3.141 9.926 2.756 13.569-.894l44.204-44.271c7.093-7.103 18.347-7.849 26.315-1.746l53.65 41.095c3.232 2.432 7.192 3.368 11.164 2.638 4.041-.745 7.479-3.098 9.68-6.624l54.087-86.078c2.696-4.292 1.721-9.886-2.27-13.013-3.918-3.068-9.53-2.731-13.05.784l-44.294 44.218c-7.041 7.03-18.18 7.813-26.137 1.841l-54.662-41.034c-3.31-2.509-7.291-3.452-11.273-2.721-4.04.745-7.478 3.097-9.679 6.624l-53.757 85.519c-2.847 4.53-1.793 10.404 2.453 13.662z"></path>
</svg></div>
<div class="rounded-lg bg-red-300 h-9 w-11 flex items-center justify-center">
<svg class="fill-current text-gray-600 h-5 w-5" id="Layer_1" enable-background="new 0 0 511.982 511.982" height="512" viewBox="0 0 511.982 511.982" width="512" xmlns="http://www.w3.org/2000/svg">
<path d="m255.991 455.991c-65.145 0-122.316-4.258-158.806-7.83-46.194-4.521-82.997-39.75-89.5-85.668-10.247-72.729-10.247-140.275 0-213.005 6.503-45.917 43.306-81.146 89.5-85.667 36.489-3.572 93.661-7.83 158.806-7.83s122.316 4.258 158.806 7.83c46.194 4.521 82.997 39.75 89.5 85.668 10.247 72.729 10.247 140.275 0 213.005-6.503 45.917-43.306 81.146-89.5 85.667-36.49 3.572-93.661 7.83-158.806 7.83zm0-360c-63.53 0-119.306 4.154-154.909 7.641-27.766 2.718-49.885 23.881-53.791 51.465-4.844 34.204-7.3 68.149-7.3 100.895s2.456 66.69 7.3 100.894c3.906 27.585 26.025 48.748 53.791 51.466 35.604 3.486 91.379 7.641 154.909 7.641s119.306-4.154 154.909-7.641c27.766-2.718 49.885-23.881 53.791-51.465 4.844-34.204 7.3-68.149 7.3-100.895s-2.456-66.69-7.3-100.894c-3.906-27.585-26.025-48.748-53.791-51.466-35.603-3.487-91.379-7.641-154.909-7.641zm-25.943 254.796c-26.74.364-50.683-22.824-50.057-49.881v-90.33c0-18.09 9.423-34.249 25.207-43.225 15.908-9.048 34.796-8.862 50.519.492l75.914 45.165c32.302 18.533 32.294 66.938 0 85.465l-75.914 45.165c-8.006 4.763-16.834 7.149-25.669 7.149zm.047-150.043c-2.333 0-4.189.848-5.123 1.379-1.86 1.058-4.98 3.562-4.98 8.453v90.33c0 4.892 3.12 7.396 4.98 8.453 1.557.886 5.676 2.651 10.294-.098l75.914-45.165c6.463-3.858 6.472-12.845 0-16.711l-75.914-45.165c-1.848-1.099-3.616-1.476-5.171-1.476z"></path>
</svg></div>
<div class="rounded-lg bg-red-300 h-9 w-11 flex items-center justify-center">
<svg class="fill-current text-gray-600 h-5 w-5" id="Layer_1" enable-background="new 0 0 512 512" height="512" viewBox="0 0 512 512" width="512" xmlns="http://www.w3.org/2000/svg">
<path d="m392 458h-272c-66.168 0-120-53.832-120-120v-164c0-66.168 53.832-120 120-120h272c66.168 0 120 53.832 120 120v164c0 66.168-53.832 120-120 120zm-272-364c-44.112 0-80 35.888-80 80v164c0 44.112 35.888 80 80 80h272c44.112 0 80-35.888 80-80v-164c0-44.112-35.888-80-80-80zm209.286 197.406 98.855-75.512c8.778-6.705 10.458-19.256 3.753-28.034-6.706-8.778-19.256-10.458-28.034-3.753l-98.843 75.503c-28.541 21.769-68.4 21.785-96.96.055l-95.781-74.455c-8.721-6.78-21.287-5.205-28.065 3.516-6.779 8.721-5.205 21.286 3.516 28.065l95.855 74.512c.048.038.097.075.146.112 21.424 16.34 47.094 24.509 72.77 24.509s51.357-8.174 72.788-24.518z"></path>
</svg></div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>