-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathhealth.html
79 lines (74 loc) · 4.68 KB
/
health.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
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://cdn.tailwindcss.com"></script>
</head>
<body>
<header class="text-gray-400 bg-[#f8f8f8] 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-white mb-4 md:mb-0">
<a href="index.html"> <img src="logo.png" class="w-[75px] h-[50px]"> </a>
<path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5"></path>
</svg>
</a>
<nav class="md:ml-auto flex flex-wrap items-center text-base justify-center">
<a href="index.html" class="mr-5 ">Home</a>
<a href="about.html" class="mr-5 ">About Us</a>
<a href="updates.html" class="mr-5 ">Updates</a>
<a href="contact.html" class="mr-5 ">Contact Us</a>
</nav>
</div>
</header>
<article class="max-w-2xl px-6 py-24 mx-auto space-y-16 bg[#f8f8f8] text-gray-500">
<div class="w-full mx-auto space-y-4">
<h1 class="text-5xl font-bold leading-none">Our Health-Related Involvement</h1>
<div class="flex flex-wrap space-x-2 text-sm text-gray-400">
</div>
<p class="text-sm text-gray-400">by
<a href="#" target="_blank" rel="noopener noreferrer" class="hover:underline text-[#465775]">
<span>James Smith</span>
</a>on
<time datetime="2021-02-12 15:34:18-0200">Feb 12th 2022</time>
</p>
<div class="text-gray-600">
<div class="relative text-center items-center mx-12 lg:mx-0">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" fill="currentColor" class="absolute top-0 left-0 w-8 h-8 text-gray-700" data-darkreader-inline-fill="" style="--darkreader-inline-fill:currentColor;">
<path d="M232,246.857V16H16V416H54.4ZM48,48H200V233.143L48,377.905Z"></path>
<path d="M280,416h38.4L496,246.857V16H280ZM312,48H464V233.143L312,377.905Z"></path>
</svg><br>
<p class="px-6 py-1 text-lg italic">More efforts. More cleanliness. More good lives.</p><br>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" fill="currentColor" class="absolute bottom-0 right-0 w-8 h-8 text-gray-700" data-darkreader-inline-fill="" style="--darkreader-inline-fill:currentColor;">
<path d="M280,185.143V416H496V16H457.6ZM464,384H312V198.857L464,54.1Z"></path>
<path d="M232,16H193.6L16,185.143V416H232ZM200,384H48V198.857L200,54.1Z"></path>
</svg>
</div><br>
</div>
<p>Every child has the right to grow up in a clean and safe environment. Access to safe drinking water, basic toilets, and proper hygiene habits not only keeps children alive, but also offers them a healthier start in life.
<br>
Despite the fact that COVID-19 highlights the importance of hand hygiene in preventing disease transmission, three billion people globally, including hundreds of millions of school-aged children, lack access to soap-free handwashing facilities. The most susceptible and affected include people living in rural areas, urban slums, disaster-prone locations, and low-income countries.</p>
</div>
</article>
<section class="p-6 bg-gray-700 text-gray-100">
<div class="container mx-auto grid justify-center grid-cols-2 text-center lg:grid-cols-2">
<div class="flex flex-col justify-start m-2 lg:m-6">
<p class="text-4xl font-bold leading-none lg:text-6xl">500+</p>
<p class="text-sm sm:text-base">Schools provided access to safe drinking water</p>
</div>
<div class="flex flex-col justify-start m-2 lg:m-6">
<p class="text-4xl font-bold leading-none lg:text-6xl">10L</p>
<p class="text-sm sm:text-base">Bars of soap distributed</p>
</div>
<div class="flex flex-col justify-start m-2 lg:m-6">
<p class="text-4xl font-bold leading-none lg:text-6xl">23</p>
<p class="text-sm sm:text-base">Village Hospitals Opened</p>
</div>
<div class="flex flex-col justify-start m-2 lg:m-6">
<p class="text-4xl font-bold leading-none lg:text-6xl">50L</p>
<p class="text-sm sm:text-base">Vaccines administered in liaison with government</p>
</div>
</div>
</section>
</body>
</html>