-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
133 lines (121 loc) · 9.78 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="This website accepts the payments for making donation. The website integrated with Razorpay payment platform to accept donations. Please make your contribution ❤️ support to Sriram Foundation">
<meta name="keywords" content="sriram foundation, sriramfoundation, donate us , donation, make a donation, Sriram Santhosh NIT Agartala, sriramsanthosh nit agartala, coding, html, css, JavaScript, sriramsanthosh donation">
<meta name="author" content="Itha Sriram Santhosh">
<title>Sriram Foundation</title>
<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=Almendra&family=Audiowide&family=Quantico&family=Tilt+Prism&display=swap" rel="stylesheet">
<script src="https://kit.fontawesome.com/0d3ce04075.js" crossorigin="anonymous"></script>
<link rel="shortcut icon" href="images/logo img-modified.png" type="image/x-icon">
<link rel="stylesheet" href="styles/style.css">
</head>
<body>
<div class="loader"></div>
<header id="#">
<div class="nav-bar">
<div class="nav-hor-bars">
<input class="bars-check" type="checkbox" id="check-box">
<label for="check-box" class="nav-link nav-bars"><i class="fa-solid fa-bars"></i></label>
</div>
<div class="logo-container"><a href="#" class="logo"><img src="images/logo-removebg-preview.png" alt="logo" class="logo-img"></a></div>
<ul class="nav-list">
<li class="nav-link-box"><a href="#" class="nav-link">Home</a></li>
<li class="nav-link-box"><a href="#about" class="nav-link">About</a></li>
<li class="nav-link-box"><a href="#donate" class="nav-link">Donate</a></li>
<li class="nav-link-box"><a href="#contact" class="nav-link">Contact</a></li>
</ul>
</div>
<div class="donate-bg">
<div class="paynow-container text-center">
<p><form class="text-center razorpay "><script src="https://checkout.razorpay.com/v1/payment-button.js" data-payment_button_id="pl_M2U5EFSffso0sW" async> </script> </form></p>
</div>
</div>
</header>
<main>
<section id="about">
<h1 class="text-center section-heading"><i class="fa-solid fa-circle-info"></i> About Us</h1>
<div class="about-container">
<h2>Investing in a better tomorrow... </h2>
<p>We firmly believe that by investing in their education, providing scholarships, and meeting their basic needs, we can empower them to break free from the cycle of poverty and create a better life for themselves and their communities.
Education lies at the core of our mission. We understand <a href="#readmore1" class="read-more-link readLink1">[Read More]</a> <span class="read-more-text" id="readmore1"> that education is not just a basic right but also a powerful tool for personal and societal transformation. We strive to provide quality education to children who would otherwise lack access to it. By equipping them with knowledge and skills, we open doors of opportunity and enable them to build a brighter future.In addition to education, we recognize the immediate needs of these children. Many of them face hunger, inadequate healthcare, and challenging living conditions.</span> <a href="#about" class="readless1 readless-link">[Read Less]</a></p>
<!-- Photo Grid -->
<div class="row" id="photogrid">
<div class="column">
<img src="images/img4.jpg" style="width:100%">
<img src="images/img4.jpeg" style="width:100%">
</div>
<div class="column">
<img src="images/img2.avif" style="width:100%">
<img src="images/img5.jpg" style="width:100%">
</div>
<div class="column">
<img src="images/img6.webp" style="width:100%">
<img src="images/img6.jpg" style="width:100%">
</div>
</div>
<p>Therefore, we extend its support by providing nutritious meals, healthcare facilities, and shelter to ensure their overall well-being. We believe that a child's physical and emotional needs must be met for them to thrive academically and in life.
One of our key focuses is on scholarships. We firmly <a href="#readmore2" class="read-more-link readLink2">[Read More]</a> <span class="read-more-text" id="readmore2">believe that financial constraints should not hinder a child's ability to pursue higher education. Through our scholarship programs, we aim to empower talented and deserving students to fulfill their dreams. By offering financial assistance, we remove barriers and enable them to access quality higher education, setting them on a path towards success.
We understands that children are the future of our society, and their well-being is crucial for the progress of our communities and nations. Our commitment extends beyond providing immediate relief; we aim to instill a sense of hope, resilience, and self-confidence in these children. We strive to create an environment where they can dream big, believe in themselves, and realize their full potential.</span> <a href="#photogrid" class="readless2 readless-link">[Read Less]</a></p>
</div>
</section>
<section id="donate">
<h1 class="text-center section-heading"><i class="fa-solid fa-heart"></i> Donate Us</h1>
<div class="donate-container">
<p class="donate-text">None of our achievements would have been possible without the generous support of individuals, organizations, and partners who share our vision. Their donations and contributions have helped us reach out to more children and make a greater impact in their lives.</p>
<div class="heart-container text-center">
<img src="images/img7.jpg" alt="">
</div>
<div class="donate-text">We are dedicated to serving the needs of underprivileged children, focusing on education, scholarships, and meeting their basic necessities. We firmly believe that by investing in their future, we are investing in a better tomorrow for all of us. Together, let us continue to make a difference in the lives of these deserving children.</div>
<div class="col">
<p><form class="text-center"><script src="https://checkout.razorpay.com/v1/payment-button.js" data-payment_button_id="pl_M2U5EFSffso0sW" async> </script> </form></p>
</div>
</div>
</section>
<section id="contact">
<h1 class="text-center section-heading"><i class="fa-regular fa-address-card"></i> Contact</h1>
<div class="input-container">
<div>We'd love to hear from you!</div>
<div>Comments, suggestions and questions are always welcome...</div>
<form action="/" method="post" class="input-form">
<input class="input-box" type="text" name="Fname" id="Fname" placeholder="First Name *" required><br>
<input class="input-box" type="text" name="Lname" id="Lname" placeholder="Last Name *" required><br>
<input class="input-box" type="email" name="email" id="email" placeholder="Email Address *" required><br>
<input class="input-box" type="tel" name="phone" id="phone" placeholder="Phone Number (Optional)"><br>
<textarea class="input-box" name="message" id="message" cols="20" rows="3" placeholder="Your Message Here *" required></textarea><br>
<div class="button-container">
<button class="text-center paynow" type="submit">Send Message</button>
</div>
</form>
</div>
</section>
</main>
<footer id="footer">
<div class="footer-container">
<div class="text-center">
<span class="footer-link">©</span>Sriram Foundation @2023
</div>
<div class="text-center follow-us">
: : Follow us : :
<div>
<a class="footer-link social" href="https://www.linkedin.com/in/sriramsanthosh/" target="_blank"><i class="fa-brands fa-linkedin-in"></i></a> <a class="footer-link social" target="_blank" href="https://www.facebook.com/sriramsanthosh44/"></i> <i class="fa-brands fa-facebook-f"></i></a> <a class="footer-link social" target="_blank" href="https://twitter.com/sriramsanthosh_"><i class="fa-brands fa-twitter"></i></a>
</div>
</div>
<div class="text-center made-with">
Made with <span class="footer-link">💚</span> by
<div>
<a class="footer-link author" href="https://www.linkedin.com/in/sriramsanthosh/" target="_blank">Sriram Santhosh Itha</a>
</div>
</div>
</div>
</footer>
<script async src="https://www.googletagmanager.com/gtag/js?id=G-CHLZ29Q7QG"></script>
<script src="https://www.gstatic.com/firebasejs/8.3.1/firebase.js"></script>
<script src="https://smtpjs.com/v3/smtp.js"></script>
<script src="scripts/script.js"></script>
</body>
</html>