-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
120 lines (119 loc) · 9.75 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Green Protocol</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class=" flex flex-row md: text-white flex flex-row justify-between px-40 items-center position-absolute h-20 bg-green-700">
<h1 class=" text-xl md: text-2xl font-bold ">Green Protocol</h1>
<img class=" md:hidden flex w-10 justify-between" src="https://cdn-icons-png.flaticon.com/128/2976/2976215.png" alt="">
<div class="hidden md:flex flex-row gap-10 ">
<p>Problem</p>
<p>Solution</p>
<p>Buisness Model</p>
<p>Profit Distribution</p>
</div>
</div>
<div class="bg-green-500">
<h1 class="flex justify-center text-4xl font-bold text-white items-center pt-20">Green Protocol</h1>
<div class="flex pt-10 justify-center">
<img class="h-40" src="https://greenprotocol.netlify.app/static/media/4.a3945fe8a5d2e0f9a9c2.png" alt="">
<div class="pt-20">
<img class="h-2 w-20 " src="data:image/png;base64,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" alt="">
</div>
<img class="h-40" src="https://greenprotocol.netlify.app/static/media/3.f68aef71096dfba35833.png" alt="">
<div class="pt-20">
<img class="h-2 w-20 " src="data:image/png;base64,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" alt="">
</div>
<img class="h-40" src="https://greenprotocol.netlify.app/static/media/1.18666672bd1b15ad77d4.png" alt="">
</div>
<br><br><br><br><br><br><br>
</div>
<br><br>
<div class="p-40 overflow-hidden">
<h1 class="text-4xl font-bold text-green-500">Problem</h1><hr>
<div class="flex flex-row justify-between items-center">
<p class="text-xl font-bold">Major current environmental issues may include climate change, pollution, environmental degradation, and resource depletion. The conservation movement lobbies for protection of endangered species and protection of any ecologically valuable natural areas, genetically modified foods and global warming.</p>
<img class="h-80" src="https://greenprotocol.netlify.app/static/media/5.5609c04fba05a424bb7e.png" alt="">
</div>
</div>
<div class="px-40 ">
<h1 class="text-4xl font-bold text-green-500">Solution</h1><hr><br><br>
<!-- div start -->
<div class="flex ml-40">
<div class="">
<div class="h-60 w-40 bg-green-500 p-10">
<img class="h-20" src="https://greenprotocol.netlify.app/static/media/10.2cb91b7bf063e74508fc.png" alt="">
<center>
<p class="text-white text-xl "><b>Electrical Mobility</b></p></center>
</div>
</div>
<div class="">
<div class="h-60 w-40 bg-green-600 p-10">
<img class="h-20" src="https://greenprotocol.netlify.app/static/media/11.594a24caa9d9ebccd42a.png" alt="">
<center>
<p class="text-white text-xl "><b>Solar charging station</b></p></center>
</div>
</div>
<div class="">
<div class="h-60 w-40 bg-green-500 p-10">
<img class="h-20" src="https://greenprotocol.netlify.app/static/media/12.df14fe8339f536600da6.png" alt="">
<center>
<p class="text-white text-xl "><b>Recycling plastic</b></p></center>
</div>
</div>
<div class="">
<div class="h-60 w-40 bg-green-600 p-10">
<img class="h-20" src="https://greenprotocol.netlify.app/static/media/13.70a9519f5c6e830aeeed.png" alt="">
<center>
<p class="text-white text-xl "><b>Cleaning ocean</b></p></center>
</div>
</div>
</div>
<!-- div ends -->
<div class="flex ml-40">
<div class="">
<div class="h-60 w-40 bg-green-600 p-10">
<img class="h-20" src="https://greenprotocol.netlify.app/static/media/6.d63b0f1a643f8565e1f8.png" alt="">
<center>
<p class="text-white text-xl "><b>Green Energy</b></p></center>
</div>
</div>
<div class="">
<div class="h-60 w-40 bg-green-500 p-10">
<img class="h-20" src="https://greenprotocol.netlify.app/static/media/7.3d2864d76afebdac372e.png" alt="">
<center>
<p class="text-white text-xl "><b>Automated Agriculture</b></p></center>
</div>
</div>
<div class="">
<div class="h-60 w-40 bg-green-600 p-10">
<img class="h-20" src="https://greenprotocol.netlify.app/static/media/8.cfba64bcfa3e8e318795.png" alt="">
<center>
<p class="text-white text-xl "><b>Depuration of water</b></p></center>
</div>
</div>
<div class="">
<div class="h-60 w-40 bg-green-500 p-10">
<img class="h-20" src="https://greenprotocol.netlify.app/static/media/9.e48f0c2504d1ceb791bb.png" alt="">
<center>
<p class="text-white text-xl "><b>Mosquito Prevention</b></p></center>
</div>
</div>
</div>
<!-- Next Div -->
</div><br><br>
<div class="flex justify-center align-center ">
<div class="flex gap-1 border-4 border-green-600">
<img class="h-80 w-80 relative" src="https://greenprotocol.netlify.app/static/media/15.4417e6cdc5650ff75447.png" alt="">
<img class="h-80 w-80" src="https://greenprotocol.netlify.app/static/media/14.e49332e78c2a094d6e47.png" alt="">
<p class="absolute left-96 top-40 bg-green-500 text-white ">Ocean Wave Renewable Energy</p>
</div><br>
</div><br><br>
<!-- Next div end -->
</body>
</html>