-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
205 lines (186 loc) · 7.14 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
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Area 2071 Challenge</title>
<link href="https://fonts.googleapis.com/css?family=Palanquin" rel="stylesheet">
<!-- Font Awesome for Social Media Icons -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.10/css/all.css" integrity="sha384-+d0P83n9kaQMCwj8F4RJB66tzIwOKmrdb46+porD/OvrJ+37WqIM7UoBtwHO6Nlg" crossorigin="anonymous">
<!-- Primary CSS -->
<link rel="stylesheet" href="style.css">
<!-- Responsive CSS -->
<link rel="stylesheet" href="responsive.css">
</head>
<body class="site">
<img class ="logo-img" src="images/logo.jpg" alt="logo">
<div class="topbar">
<ul>
<li><a href="#about">ABOUT</a></li>
<li><a href="#products">PRODUCTS & OFFERINGS</a></li>
<li><a href="#space">SPACE & DESIGN</a></li>
<li><a href="#challenge">CHALLENGE</a></li>
<li>-----------------------------</li>
<li>ENGLISH / LANGUAGE</li>
</ul>
</div>
<h1 class="explore-text">Explore new ways to garden.</h1>
<img class="explore-img" src="images/kaleidoscope-faded.jpg" alt="explore-image">
<img class="explore-img-small" src="images/kaleidoscope-faded-small.jpg" alt="explore-image-small">
<span class="downarrow">↓</span>
<img class="girl-nebula-img" src="images/girl-nebula.jpg">
<div class="grey-nebula"></div>
<div class="white-nebula"></div>
<div id="about" class="girl-nebula">
<h2>
We will unlock people's potential to imagine and
create new solutions to our greatest challenges
</h2>
<p class="girl-nebula-text-1">
The UAE has a vision for the future
based on radical creativity, curiosity
and generosity and invite the world's
most curious minds and creative
institutions to co-create this future
with us.<br/><br/>
<u>
Creative thinkers from government,
business, and culture will design the
future together.
</u>
</p>
<p class="girl-nebula-text-2">
AREA 2071 is a creative ecosystem to
design the future that includes
government, creative individuals,
business, and people from all walks of
life. We've come together to imagine
and create solutions to the world's
most pressing questions.
</p>
</div>
<p class="mobile-nebula-text-2">
AREA 2071 is a creative ecosystem to
design the future that includes
government, creative individuals,
business, and people from all walks of
life. We've come together to imagine
and create solutions to the world's
most pressing questions.
</p>
<div class="quote">
<img class ="quote-img" src="images/chevrons.png" alt="chevrons">
<p class="quote-text">"We are building a new reality for our people, a new future for our children,
and a new model of development."
</p>
<p class="quote-author">
— Sheikh Mohammed bin Rashid al Maktoum
</p>
</div>
<img class="lounge-img" src="images/lounge.jpg" alt="lounge">
<div id="products" class="grey-lounge"></div>
<div class="lounge-verbage">
<p class="lounge-text">
<strong>Area 2071 Environment</strong>
In this space, innovators will meet and use the best technology of today to design the future
<a class="learn-link" href="">LEARN MORE <span>→</span></a>
<div class="orange-box"></div>
</p>
</div>
<div class="lounge-topo">
<img src="images/topo-single-fade-3.jpg" alt="topo-graphic" class="lounge-topo">
</div>
<div class="vision">
<h1 id="space" class="title-v">We create a vision
of the future
</h1>
<p class="text-v">
We will grow together in this community and thrive. As pioneers, we will forge a new path to address human needs.
<a class="learn-more" href=""><div class="orange-box2"></div>LEARN MORE <span>→</span></a>
</p>
<img class="bking-img" src="images/bahrain-man.jpg" alt="Government">
<div class="grey-bking"></div>
<div class="white-bking"></div>
<div class="text-gov">
<strong>Government</strong><br/>
<p>
Powerful individuals looking to work with the best minds to build the future.
</p>
</div>
<img class="laptop-img" src="images/laptop.jpg" alt="Startups">
<div class="grey-laptop"></div>
<div class="white-laptop"></div>
<div class="text-startup">
<strong>Startups</strong>
<p>
Entreoreneurs looking to innovate and make a global impact.
</p>
</div>
<img class="boardroom-img" src="images/boardroom.jpg" alt="Corporate">
<div class="grey-boardroom"></div>
<div class="white-boardroom"></div>
<div class="text-corp">
<strong>Corporate</strong>
<p>
Powerful organisations collaborating to build a better future.
</p>
</div>
<img class="pedestrians-img" src="images/pedestrians2.jpg" alt="Public">
<div class="grey-pedestrians"></div>
<div class="white-pedestrians"></div>
<div class="text-public">
<strong>Public</strong>
<p>
Come meet others who want to make a change.
</p>
</div>
</div>
<div class="challenge">
<img id="challenge" class ="challenge-chevron" src="images/chevrons.png" alt="chevrons">
<h1 class="challenge-title">The Area 2071 Challenge
</h1>
<p class="challenge-text">
Compete on a battlefield to solve a global problem and win a year of incubation and invaluable resources to make it happen. Your success, is everyone's success.
</p>
<p class="challenge-link">
ACCEPT THE CHALLENGE <span>→</span>
</div>
<div class="lower-topo">
<img src="images/topo-lower3.jpg" alt="topo-graphic" class="lower-topo">
</div>
<div class="news">
<div class="news1">
<img class="news-img" src="images/news1.jpg" alt="Corporate">
<p>26 Jul, 2017</p>
<strong>
The Incubator launch is drawing the attention
</strong>
</div>
<div class="news2">
<img class="news-img" src="images/news2.jpg" alt="Corporate">
<p>23 Jul, 2017</p>
<strong>
Area 2071 startup has raised $5 million
</strong>
</div>
<div class="news3">
<img class="news-img" src="images/news3.jpg" alt="Corporate">
<p>18 Jul, 2017</p>
<strong>
UAE's MOHESR has funded new wing for Area 2071
</strong>
</div>
</div>
<div class="foot">
<div class="social-media">
<i class="fab fa-instagram"></i>
<i class="fab fa-facebook-f"></i>
<i class="fab fa-twitter"></i>
</div>
<p class="copyright">
Area 2071. All rights reserved.
</p>
</div>
</body>
<script type="text/javascript" src="script.js"></script>
</html>