-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
66 lines (62 loc) · 3.99 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Home</title>
<link href="https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css" rel="stylesheet">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Your Website Title</title>
<script src="script.js" defer></script>
</head>
<body>
<header class="text-gray-600 body-font">
<div class="container mx-auto flex flex-wrap p-5 flex-col md:flex-row items-center">
<a class="flex title-font font-medium items-center text-gray-900 mb-4 md:mb-0">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="w-10 h-10 text-white p-2 bg-indigo-500 rounded-full" viewBox="0 0 24 24">
<path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5"></path>
</svg>
<span class="ml-3 text-xl">Md Rayyan -- Sambit</span>
</a>
<nav class="md:ml-auto flex flex-wrap items-center text-base justify-center">
<a class="mr-5 hover:text-gray-900" href="index.html">Home</a>
<a class="mr-5 hover:text-gray-900" href="about.html">About Us</a>
<a class="mr-5 hover:text-gray-900" href="solutions.html">Solutions</a>
<a class="mr-5 hover:text-gray-900" href="contact.html">Contact Us</a>
<a class="mr-5 hover:text-gray-900" href="news.html">News</a>
</nav>
</div>
</header>
<section class="text-gray-600 body-font">
<div class="container mx-auto flex px-5 py-24 md:flex-row flex-col items-center">
<div
class="lg:flex-grow md:w-1/2 lg:pr-24 md:pr-16 flex flex-col md:items-start md:text-left mb-16 md:mb-0 items-center text-center">
<h1 class="title-font sm:text-4xl text-3xl mb-4 font-medium text-gray-900"> Drowning In Crises :<br>Adressing Water Avalabilty In Worldwide
<br class="hidden lg:inline-block">
</h1>
<p class="mb-8 leading-relaxed">
Welcome to this portal, where we are on a mission to tackle the global water crisis head-on.
With over 85% of the world's population facing water scarcity, the need for sustainable solutions
has never been more urgent. At the core of our initiative is a team of experts passionate about
water management, environmental science, and technology. Our goal is to raise awareness, foster
collaboration, and advocate for change. Explore the causes and consequences of the water crisis,
stay updated on the latest news and success stories, and discover how individuals and organizations
worldwide are making a difference. Whether you're here to volunteer, donate, or simply learn how to
reduce your water footprint, this provides the resources and tools to empower you.
Join us in the movement towards a future where clean water is a reality for all. Together, let's
make every drop count and build a sustainable water future.</p>
<div class="flex justify-center">
<a href="https://en.wikipedia.org/wiki/Water_scarcity">
<button
class="inline-flex text-white bg-yellow-500 border-0 py-2 px-6 focus:outline-none hover:bg-yellow-600 rounded text-lg">Know More</button>
</a>
</div>
</div>
<div class="lg:max-w-lg lg:w-full md:w-1/2 w-5/6">
<img class="object-cover object-center rounded" alt="hero"
src="https://th.bing.com/th/id/OIP.-Mqx6ttZdkSa4uJ5Kt0PCQHaGA?rs=1&pid=ImgDetMain">
</div>
</div>
</body>
</html>