-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
172 lines (172 loc) · 12.1 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
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
<!DOCTYPE html>
<html lang="en">
<head>
<meta charSet="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="style.css">
<title>MIT Reap Indonesia</title>
<link rel="icon" href="icon.png">
</head>
<body class="bg-background font-sans antialiased">
<header class="top-0 fixed py-2 bg-white w-full gap-x-3 flex items-center z-20 justify-between px-5 xl:px-24">
<a href="/"><img alt="MIT Reap Logo Color" width="200" src="logo.png"></a>
<nav class="hidden xl:flex justify-center pr-10 w-full ">
<a class="text-lg font-bold p-6" href="/">ABOUT</a>
<a class="text-lg font-bold p-6" href="/board.html">ADVISORY BOARD</a>
<a class="text-lg font-bold p-6" href="/events.html">EVENTS</a>
</nav>
<a class="text-lg font-bold bg-primary text-primary-foreground h-12 px-4 py-2" href="/road.html">ROAD TO MIT</a>
</header>
<main class="items-center justify-between">
<section id="banner" class="relative xl:h-screen bg-black w-full flex flex-col justify-center">
<img class="w-full h-[300px] top-0 z-0 object-cover"
style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent"
sizes="100vw"
src="hero-banner.png">
<article class="ml-1 mt-14 xl:mt-40 flex flex-col z-10 px-5 py-10 xl:py-32 xl:px-24">
<h1 class="rounded-br-xl text-xs xl:text-3xl px-4 font-semibold py-1 w-fit text-white bg-primary-600">
MIT REAP INDONESIA
</h1>
<h2 class="py-5 flex text-3xl xl:text-6xl flex-col font-bold xl:gap-y-5 text-white">
FOSTERING INNOVATION ECOSYSTEM IN INDONESIA
</h2>
<p class="text-white md:text-3xl xl:text-3xl font-semibold italic">
STARTING FROM JAVA
</p>
<p class="text-white md:text-3xl xl:text-3xl font-semibold" style="margin-top: 150px; margin-bottom: 50px;">
Learn how we can collaborate to grow deep tech innovation in Indonesia, with help from the world’s #1 Deep Tech source — MIT
</p>
<div>
<a class="text-lg font-bold bg-primary text-primary-foreground h-12 px-4 py-2" style="margin-right: 10px;" href="/events.html">Engage</a>
<a class="text-lg font-bold bg-primary-foreground text-primary-foreground border h-12 px-4 py-2" href="/road.html">Road to MIT</a>
</div>
</article>
</section>
<section class="p-5 md:p-14 lg:p-20 lg:px-32 w-full justify-between items-center text-white" style="padding: 5rem;">
<div class="flex flex-col-reverse h-full xl:flex-row p-1 items-center shadow-xl bg-[#3F2340] rounded-[20px]">
<img class="bg-white p-8 xl:p-12 2xl:p-16 rounded-[20px] border-primary-[#3F2340]/50" width="400" src="system.png">
<div class="flex flex-col h-full p-4 lg:px-5 2xl:px-28">
<h3 class="text-primary-600 font-semibold text-lg xl:text-xl 2xl:text-5xl 2xl:py-5">
MIT Approach
</h3>
<article class="space-y-5 text-xs xl:text-xl 2xl:text-2xl">
<p><strong>MIT REAP (Regional Entrepreneurship Acceleration Program)</strong>
adalah inisiatif yang dikelola oleh MIT Sloan School of Management yang dirancang untuk mempercepat
pertumbuhan ekonomi suatu negara/regional dengan memanfaatkan kekuatan inovasi dan kewirausahaan.
</p>
<p><strong>MIT REAP</strong> menggunakan inovasi deep tech dalam meningkatkan ekonomi regional. Menurut definisi MIT,
Deep Tech adalah teknologi-teknologi yang sulit dikembangkan pada saat ini, namun akan memiliki potensi menjadi
kebutuhan mendasar, masif, dan mudah digunakan di masa depan.
</p>
<p><strong>Deep Tech Areas:</strong> Advanced Computing, Advanced Manufacturing, Advanced Materials, Semiconductors (microchips),
Climate Technologies, Aerospace, Automotive (incl. EV), Remote Sensing, AI/ML, Biotechnology,Communications (incl. 5G),
Cybersecurity, Photonics, Internet of Things, Robotics, VR/AR/XR, Metaverse, Web 3.0 (incl. Blockchain)
</p>
</article>
</div>
</div>
</section>
<section class="flex flex-col justify-center items-center pb-10">
<div class="text-center">
<h3 class="font-bold text-primary-600 md:text-3xl xl:text-4xl">CONNECTED,</h3>
<span class="font-bold xl:text-5xl">GLOBAL NETWORK</span>
<p class="text-[10px] p-3 xl:text-xl max-w-xl">Get advice based on 10 years of <strong>MIT REAP</strong> experience
in building innovation ecosystem in more than 70 countries.</p>
</div>
<div class="p-8 flex h-full xl:py-10"><img class="border border-black rounded-xl shadow-xl" src="maps.png"></div>
</section>
<section class="p-5 md:p-14 lg:p-20 lg:px-32 w-full justify-between items-center text-white" style="padding: 5rem;">
<div class="flex flex-col-reverse h-full xl:flex-row p-1 items-center shadow-xl bg-[#3F2340] rounded-[20px] px-10">
<div class="flex flex-col h-full p-4 lg:px-5 2xl:px-28">
<h3 class="text-primary-600 font-semibold text-lg xl:text-4xl 2xl:text-5xl 2xl:py-5" style="margin-bottom: 20px;">
How will we improve Deep Tech innovation in indonesia:
</h3>
<article class="space-y-5 text-xs xl:text-2xl 2xl:text-2xl font-bold" style="margin-left: 50px;">
<ul style="list-style: disc; line-height: 3rem;"><li>Transfer of knowledge & tech</li>
<li>Industry & government offtaker</li>
<li>Funding for death valley phase</li>
</u>
</article>
</div>
</div>
</section>
<section class="w-full px-10 py-10 relative">
<div class="w-full flex flex-col xl:flex-row xl:justify-between relative z-10">
<div class="flex flex-col justify-center items-center xl:items-start xl:px-10">
<div class="py-5 xl:text-4xl">
<h4 class="text-primary font-bold">Innovation Ecosystem</h4>
<h2 class="text-primary-foreground font-semibold">Stakeholder Model</h2>
</div>
<p class="py-5 text-center xl:text-start text-xs xl:text-2xl max-w-4xl text-white">
<strong>MIT REAP</strong> memiliki misi untuk menjadi pendorong utama pertumbuhan ekonomi regional
melalui pendekatan ekosistem yang kolaboratif. Lima elemen yang harus ada dalam sebuah ekosistem inovasi
adalah pemerintah, universitas, wirausahawan, korporat, dan risk capital.
</p>
</div>
<div class="flex justify-center p-2 bg-white rounded-xl"><img src="stakeholder.png"></div>
</div>
<img class="object-cover w-full z-0"
style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent"
sizes="100vw"
src="hero-banner.png">
</section>
<section class="p-5 md:p-14 lg:p-20 lg:px-32 w-full justify-between items-center text-white" style="padding: 5rem;">
<div class="flex flex-col-reverse h-full xl:flex-row p-1 items-center text-center shadow-xl bg-[#3F2340] rounded-[20px] px-10">
<div class="flex flex-col h-full p-4 lg:px-5 2xl:px-28">
<h3 class="text-primary-600 font-semibold text-lg xl:text-4xl 2xl:text-5xl 2xl:py-5">
Join Road to MIT
</h3>
<article class="space-y-5 text-xs xl:text-2xl 2xl:text-2xl">
<p>Bergabung dengan gerakan “Road To MIT” untuk menyebarkan kesadaran publik mengenai pentingnya inovasi di Indonesia.
Para pemenang akan mendapat beasiswa ke MIT, dan beragam hadiah menarik lainnya.</p>
<div style="margin: 40px;">
<a class="text-2xl font-bold bg-primary-foreground text-primary-foreground border h-12 px-4 py-2" href="/road.html">Road to MIT</a>
</div>
</article>
</div>
</div>
</section>
<section class="py-5">
<div>
<h2 class="font-bold text-center xl:text-4xl text-primary">Our Partners</h2>
<div class="flex gap-x-2 justify-center p-3 items-center">
<img width="300" src="logo-ditjendik.png">
<img width="300" src="logo-kedaireka.png">
<img width="300" src="logo-paragoncorp.png">
</div>
<div class="flex gap-x-2 justify-center p-3 items-center">
<img width="300" src="logo-ugm.png">
<img width="300" src="logo-amnesindo.png">
<img width="300" src="logo-bniventures.png"></div>
</div>
<div>
<h2 class="font-bold text-center xl:text-2 xl text-primary">Organizing Team</h2>
<div class="flex gap-x-2 justify-center p-3 items-center">
<img width="100" src="logo-linxbrain.png">
<img width="100" src="logo-startup-bandung.png">
</div>
</div>
</section>
</main>
<footer class="p-5 bg-[#3F2340] border-t-[1.5rem] border-primary text-white xl:px-24">
<div class="flex flex-col xl:flex-row xl:justify-between xl:items-center ">
<img alt="MIT Reap Logo White" width="200" src="logo-white.png">
<div class="flex flex-col py-3 space-y-3 xl:items-end">
<div class="text-xl flex items-center justify-between border rounded-full max-w-fit">
<span class="px-2">Contact for more information</span>
<a class="bg-white text-black rounded-full h-full p-1" href="mailto:[email protected]">[email protected]</a>
</div>
</div>
</div>
<div data-orientation="vertical" role="none" class="shrink-0 bg-border w-full h-[1px]" style="margin-top: 20px; margin-bottom: 20px;"></div>
<div class="flex flex-col-reverse xl:flex-row justify-between">
<section class="flex text-xs py-2 space-x-2"><span>© COPYRIGHT 2024 </span></section>
<div><a class="h-5 w-5" href="https://www.instagram.com/mitreapid/">
<svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 448 512" class="fill-white" height="20" width="20" xmlns="http://www.w3.org/2000/svg">
<path d="M224.1 141c-63.6 0-114.9 51.3-114.9 114.9s51.3 114.9 114.9 114.9S339 319.5 339 255.9 287.7 141 224.1 141zm0 189.6c-41.1 0-74.7-33.5-74.7-74.7s33.5-74.7 74.7-74.7 74.7 33.5 74.7 74.7-33.6 74.7-74.7 74.7zm146.4-194.3c0 14.9-12 26.8-26.8 26.8-14.9 0-26.8-12-26.8-26.8s12-26.8 26.8-26.8 26.8 12 26.8 26.8zm76.1 27.2c-1.7-35.9-9.9-67.7-36.2-93.9-26.2-26.2-58-34.4-93.9-36.2-37-2.1-147.9-2.1-184.9 0-35.8 1.7-67.6 9.9-93.9 36.1s-34.4 58-36.2 93.9c-2.1 37-2.1 147.9 0 184.9 1.7 35.9 9.9 67.7 36.2 93.9s58 34.4 93.9 36.2c37 2.1 147.9 2.1 184.9 0 35.9-1.7 67.7-9.9 93.9-36.2 26.2-26.2 34.4-58 36.2-93.9 2.1-37 2.1-147.8 0-184.8zM398.8 388c-7.8 19.6-22.9 34.7-42.6 42.6-29.5 11.7-99.5 9-132.1 9s-102.7 2.6-132.1-9c-19.6-7.8-34.7-22.9-42.6-42.6-11.7-29.5-9-99.5-9-132.1s-2.6-102.7 9-132.1c7.8-19.6 22.9-34.7 42.6-42.6 29.5-11.7 99.5-9 132.1-9s102.7-2.6 132.1 9c19.6 7.8 34.7 22.9 42.6 42.6 11.7 29.5 9 99.5 9 132.1s2.7 102.7-9 132.1z"></path>
</svg>
</a></div>
</div>
</footer>
</body>
</html>