-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
143 lines (132 loc) · 5.35 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
<!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">
<link rel="stylesheet" href="style.css">
<link rel="shortcut icon" href="icons/logo.png" type="image/x-icon">
<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=Poppins&display=swap" rel="stylesheet">
<title>Spread Smiles</title>
</head>
<body>
<section class="upper-part">
<div class="menu-container">
<ul>
<a href="#">
<li class="menu">Home</li>
</a>
<a href="#">
<li class="menu">About</li>
</a>
<a href="#">
<li class="menu">Product</li>
</a>
<a href="#">
<li class="menu">Contact</li>
</a>
</ul>
</div>
<div id="donate-now">
<h1>Let’s Help Those Who Are More In Need</h1>
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Aperiam inventore neque quis laborum
perferendis
culpa, reiciendis sed vitae dignissimos sapiente.</p> <br><br>
<a class="anchor-link" href="#"><b>Donate Now</b></a>
</div>
</section>
<section class="center-content">
<h2>Donate Today</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Recusandae dolore obcaecati quo iusto non nisi
cupiditate doloribus odio corporis voluptatum.</p>
<div class="donate-tk">
<div class="amount-digit">
<h3>100tk</h3>
</div>
<div class="amount-digit" id="red-bg">
<h3>200tk</h3>
</div>
<div class="amount-digit">
<h3>500tk</h3>
</div>
<div class="amount-digit">
<h3>1000tk</h3>
</div>
<div class="amount-digit">
<h3>2200tk</h3>
</div>
</div>
<input type="text" name="" id="" placeholder="Other Amount (Taka)">
<br><br>
<a class="anchor-link" href=""><b>Donate Now</b></a>
</section>
<section>
<div class="center-content">
<h2>Our Donate Plan</h2>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Commodi sed accusantium fugit perferendis
ducimus
reprehenderit.</p>
</div>
<div class="donate-plans">
<div class="single-plan" id="food">
<img src="icons/food.png" alt="">
<h3>Food for family</h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Provident aliquam pariatur laborum maiores
ipsum similique.</p>
</div>
<div class="single-plan" id="shelter">
<img src="icons/shelter.png" alt="">
<h3>Shelter for family</h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Provident aliquam pariatur laborum maiores
ipsum similique.</p>
</div>
<div class="single-plan" id="education">
<img src="icons/education.png" alt="">
<h3>Education for child</h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Provident aliquam pariatur laborum maiores
ipsum similique.</p>
</div>
</div>
</section>
<section class="two-part">
<div class="half-width center-content">
<h2>Their lives depend on your donation</h2>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Saepe, dolorum odio repellendus amet harum vel.
</p>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Totam, iusto.</p>
<a class="anchor-link" href="#">How to Contribute</a>
</div>
<div class="half-width">
<img src="images/donation13.jpg" alt="">
</div>
</section>
<section class="two-part">
<div class="half-width">
<img src="images/donation13.jpg" alt="">
</div>
<div class="half-width center-content">
<h2>Their lives depend on your donation</h2>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Saepe, dolorum odio repellendus amet harum vel.
</p>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Totam, iusto.</p>
<a class="anchor-link" href="#">How to Contribute</a>
</div>
</section>
<section>
<div class="center-content">
<h2>Get Our Updates</h2>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Commodi sed accusantium fugit.</p>
<div class="center-content newsletter">
<input type="email" name="" id="" placeholder="Email"><a class="anchor-link" href="#">Subscribe</a>
</div>
</div>
</div>
</section>
<footer>
<h3 class="be-humble"> Be Humble </h3>
<p>Eat healthy to live healthy. Live healthy to live happy.</p>
</footer>
</body>
</html>