-
Notifications
You must be signed in to change notification settings - Fork 0
/
architecture.html
341 lines (329 loc) · 17.4 KB
/
architecture.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
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title>Architecture</title>
<link rel="stylesheet" href="css/index.css" />
</head>
<body>
<header>
<div class="container flex justify-center">
<div id="logo">
<span>VA</span>
</div>
</div>
</header>
<nav id="navbar">
<div class="container">
<ul class="flex">
<li>
<a href="index.html">Home</a>
</li>
<li>
<a href="handicrafts.html">Handicrafts</a>
<div class="dropdown">
<div class="container flex">
<div class="dropdown-image">
<img src="images/handicrafts.png" />
</div>
<div class="dropdown-details">
<p>A handicraft, sometimes more precisely expressed as artisanal handicraft or handmade...</p>
</div>
</div>
</div>
</li>
<li>
<a href="painting.html">Painting</a>
<div class="dropdown">
<div class="container flex">
<div class="dropdown-image">
<img src="images/painting.png" />
</div>
<div class="dropdown-details">
<p>Painting is the practice of applying paint, pigment, color or other medium to a solid surface...</p>
</div>
</div>
</div>
</li>
<li>
<a href="sculpture.html">Sculpture</a>
<div class="dropdown">
<div class="container flex">
<div class="dropdown-image">
<img src="images/sculpture.png" />
</div>
<div class="dropdown-details">
<p>Sculpture began fundamentally from hieroglyphics...</p>
</div>
</div>
</div>
</li>
<li>
<a href="gallery.html">Gallery</a>
</li>
</ul>
</div>
</nav>
<section class="page-content">
<div class="container">
<h1>Architecture</h1>
<span class="line-separator"></span>
<div class="page-details">
<p>Architecture is one of mankind's most perceptible and enduring forms of articulation, bridging the gap between the past and present. Architecture plays a very important role in our everyday lives. From the incredibly designed homes to quite essential buildings that we come across either with our own eyes or in books, architecture is a circumference which we witness daily. The visionary brains behind theses icons called buildings are actually those architects who put their heart and soul while building those pieces of excellence.</p>
<br />
<h2>Famous Filipino Architects</h2>
<div class="grid-tiles">
<div class="grid-row justify-center">
<div class="grid-tile">
<img src="images/architects/locsin.jpg" />
<h3>Leandro Locsin</h3>
</div>
<div class="grid-tile">
<img src="images/architects/santos.jpg" />
<h3>Ildefonso P. Santos</h3>
</div>
<div class="grid-tile">
<img src="images/architects/antonio.jpg" />
<h3>Pablo Antonio</h3>
</div>
</div>
<div class="grid-row justify-center">
<div class="grid-tile">
<img src="images/architects/nakpil.jpg" />
<h3>Juan Nakpil</h3>
</div>
<div class="grid-tile">
<img src="images/architects/viola.jpg" />
<h3>Carlos Santos-Viola</h3>
</div>
</div>
</div>
<br />
<h2>Famous Foreign Achitects</h2>
<div class="grid-tiles">
<div class="grid-row justify-center">
<div class="grid-tile">
<img src="images/architects/gaudi.jpg" />
<h3>Antoni Gaudi</h3>
</div>
<div class="grid-tile">
<img src="images/architects/wright.jpg" />
<h3>Frank Lloyd Wright</h3>
</div>
<div class="grid-tile">
<img src="images/architects/rohe.jpg" />
<h3>Mies Van Der Rohe</h3>
</div>
<div class="grid-tile">
<img src="images/architects/pei.jpg" />
<h3>Ieoh Ming Pei</h3>
</div>
</div>
<div class="grid-row justify-center">
<div class="grid-tile">
<img src="images/architects/hadid.jpg" />
<h3>Zaha Hadid</h3>
</div>
<div class="grid-tile">
<img src="images/architects/gehry.jpg" />
<h3>Frank Gehry</h3>
</div>
<div class="grid-tile">
<img src="images/architects/piano.jpg" />
<h3>Renzo Piano</h3>
</div>
<div class="grid-tile">
<img src="images/architects/safdie.jpg" />
<h3>Moshe Safdie</h3>
</div>
</div>
<div class="grid-row justify-center">
<div class="grid-tile">
<img src="images/architects/johnson.jpg" />
<h3>Philip Johnson</h3>
</div>
<div class="grid-tile">
<img src="images/architects/rogers.jpg" />
<h3>Richard Rogers</h3>
</div>
</div>
</div>
<div class="overlay">
<div class="grid-tiles-content">
<div class="close">x</div>
<div class="grid-tile-content">
<h3>Leandro Locsin</h3>
<span class="line-separator"></span>
<ul>
<li>His most substantial contribution to Filipino architecture is the Cultural Center of the Philippines, a collection of five buildings that demonstrate the architect's drive to find a vernacular form of modernist architecture.</li>
<li>The National Theatre building within the complex is a good example of Locsin's trademark style. Known as "floating volume," it consists of a two-floor-high block of travertine marble cantilevered 12 feet into the air.</li>
<li>The theatre harks back to traditional Filipino dwelling huts, but on a monumentally modern scale.</li>
</ul>
</div>
<div class="grid-tile-content">
<h3>Ildefonso P. Santos</h3>
<span class="line-separator"></span>
<ul>
<li>The father of Philippine landscape architecture, Ildefonso Paez Santos, or IP Santos as he was known, created some of the best-loved urban spaces in the Philippines.</li>
<li>Landscape architecture, which deals with parks, plazas, and green spaces, was a little-considered element of urban planning in the first half of the 20th century.</li>
<li>However, Santos changed that, carrying out pioneering work that, after four decades in the profession, led him to become National Artist for Architecture in 2006.</li>
</ul>
</div>
<div class="grid-tile-content">
<h3>Pablo Antonio</h3>
<span class="line-separator"></span>
<ul>
<li>One of the first exponents of modernist architecture in the Philippines, Pablo Antonio is revered as a pioneer and the foremost architect of his time.</li>
<li>He went on to revolutionize popular architecture in the Philippines, eschewing the fashionable neo-classical style for his own version of art deco.</li>
<li>Antonio was acutely aware of the demands made on architecture by the unforgiving Philippine climate.</li>
<li>Buildings such as the Galaxy Theatre, the Far Eastern University, and the Manila Polo Club display practical innovations such as natural ventilation systems and sunscreens, all of which are rendered in Antonio's signature style: clean lines, strong shapes, and simplicity. As Antonio's son Pablo Jr explains, "for our father, every line must have a meaning, a purpose. For him, function comes first before elegance and form."</li>
</ul>
</div>
<div class="grid-tile-content">
<h3>Juan Nakpil</h3>
<span class="line-separator"></span>
<ul>
<li>The son of veterans of the Philippine Revolution, Juan Nakpil was committed to the belief that architecture built in the Philippines should reflect its culture and people.</li>
<li>In his early career, Nakpil spent time studying in the United States and France, absorbing the lessons of international architecture.</li>
<li>When he returned to Manila in the mid-1920s, Nakpil applied his new-found knowledge to Filipino structures.</li>
<li>He worked on the restoration of the home of national hero Jose Rizal and, like Locsin, took inspiration from traditional stilt houses, remaking them in cantilevered concrete on a mammoth scale.</li>
</ul>
</div>
<div class="grid-tile-content">
<h3>Carlos Santos-Viola</h3>
<span class="line-separator"></span>
<ul>
<li>He was devout Catholic throughout his life and many of his best known designs were executed for the Church of Iglesia Ni Cristo, which is owned by a Filipino Religious group.</li>
<li>Santos-Viola created churches for the group all over the archipelago, designed in a style quite distinct from that of his contemporaries.</li>
<li>Instead of the monumentalism of Leondro Locsin or the art deco simplicity of Pablo Antonio, Santos-Viola chose to incorporate Gothic and Baroque elements into his modern churches.</li>
</ul>
</div>
<div class="grid-tile-content">
<h3>Antoni Gaudi</h3>
<span class="line-separator"></span>
<ul>
<li>The Catalin Modernist</li>
<li>Gaudi spent his entire life as an architect in Barcelona, where we can witness all of his projects, the most famous of which is La Sagrada Familia Cathedral that is still under construction.</li>
<li>Gaudi initially worked in the same old Victorian style, but later he developed his own style, composing his works where he would amalgamate geometric masses and would decorate the surfaces with patterned brick or stone, bright ceramic tiles and floral metalwork.</li>
</ul>
</div>
<div class="grid-tile-content">
<h3>Mies Van Der Rohe</h3>
<span class="line-separator"></span>
<ul>
<li>Famous for his saying <i>"less is more"</i>, German architect Mies Van Der Rohe disrobed all sorts of ornamentations from architecture and paved way to elemental geometric forms, commonly called as minimalism.</li>
<li>He was famous for working with materials such as steel and glass which gave his buildings a skin and bone sort of a look.</li>
</ul>
</div>
<div class="grid-tile-content">
<h3>Ieoh Ming Pei</h3>
<span class="line-separator"></span>
<ul>
<li>The Pragmatic Artist</li>
<li>Ieoh Ming Pei is one of the most acknowledged and creative architects of our time.</li>
<li>The most common characteristics of his style include rectilinear forms; light, taut plane surfaces stripped of ornamentation and decoration; open interior spaces; and a visually weightless quality reflected by the cantilever construction.</li>
<li>Pei's work graces some of the most prestigious government and acclaimed site throughout the world.</li>
</ul>
</div>
<div class="grid-tile-content">
<h3>Zaha Hadid</h3>
<span class="line-separator"></span>
<ul>
<li>The Deconstructivist</li>
<li>Hadid was the first woman architect to win the Pritzker prize in 1994.</li>
<li>She learned about abstract art and architecture at the Architectural Association in London.</li>
<li>Born in Iraq, Hadid went on to win this iconic award which is often termed the "Nobel peace prize of Architecture".</li>
<li>Hadid's forms are characterized as futuristic, unconventional, daring and artistic.</li>
<li>Zaha Hadid and her many works, including a mobile museum for Chanel with Karl Lagerfield.</li>
</ul>
</div>
<div class="grid-tile-content">
<h3>Juan Nakpil</h3>
<span class="line-separator"></span>
<ul>
<li>The son of veterans of the Philippine Revolution, Juan Nakpil was committed to the belief that architecture built in the Philippines should reflect its culture and people.</li>
<li>In his early career, Nakpil spent time studying in the United States and France, absorbing the lessons of international architecture.</li>
<li>When he returned to Manila in the mid-1920s, Nakpil applied his new-found knowledge to Filipino structures.</li>
<li>He worked on the restoration of the home of national hero Jose Rizal and, like Locsin, took inspiration from traditional stilt houses, remaking them in cantilevered concrete on a mammoth scale.</li>
</ul>
</div>
<div class="grid-tile-content">
<h3>Frank Gehry</h3>
<span class="line-separator"></span>
<ul>
<li>There is no mistaking Gehry’s work, as they are the most distinctive, and innovative architectural phenomena around.</li>
<li>His deconstructive forms are iconic as tourists flock to all of his buildings worldwide to marvel at the architectural forms he creates.</li>
<li>Named by Vanity Fair as “the most important architect of our age”, he has set the precedence for contemporary architecture.</li>
<li>His most notable project include: The Walt Disney Concert Hall in Los Angeles, The Guggenheim Museum in Bilbao, Der Neue Zollhof in Dusseldorf and the Marques de Riscal Vineyard Hotel in Elciego.</li>
</ul>
</div>
<div class="grid-tile-content">
<h3>Renzo Piano</h3>
<span class="line-separator"></span>
<ul>
<li>The Italian born architect was named one of Time magazine’s top 100 most influential people in 2008.</li>
<li>Piano who is an Italian Pritzker prize-winning architect has been instrumental in shaping modern architecture that stands on its own in recognition.</li>
<li>The Shard – Europe’s tallest skyscraper in London has faced much controversy in its construction, but many feel it has given London a way to join the 21st century.</li>
<li>In his younger years he worked with the world-renowned architect Louis Kahn and soon become known for his unique applications of materials and details.</li>
<li>Piano’s most notable project include: The newly opened Shard in London, NEMO Science Center in Amsterdam, The New York Times building in New York, and Kansai International Airport in Osaka, Japan.</li>
</ul>
</div>
<div class="grid-tile-content">
<h3>Moshe Safdie</h3>
<span class="line-separator"></span>
<ul>
<li>Safdie is another product of Louis Kahn’s apprenticeship that led to his remarkable modern architecture career.</li>
<li>Originally from Haifa, Safdie is known for his 1967 International & Universal Exposition – Expo 67, which was Canada’s main celebration during its centennial year, and was deemed a remarkable cultural achievement.</li>
<li>Safdie has been awarded with much recognition of which the Gold Medal, from the Royal Architectural Institute of Canada is among the finest.</li>
</ul>
</div>
<div class="grid-tile-content">
<h3>Philip Johnson</h3>
<span class="line-separator"></span>
<ul>
<li>Johnson's role as the founding director of MoMA’s Department of Architect had an enormous impact on the field, making him a gatekeeper who helped to shape architectural trends from 1935 onward.</li>
<li>His was also a designer in his own right, though it’s fair to say that he was more of a refiner of other people’s ideas than he was an innovator.</li>
<li>Nonetheless, his work achieved iconic status in a number of cases, most notably in the residence he built for himself in 1949.</li>
</ul>
</div>
<div class="grid-tile-content">
<h3>Richard Rogers</h3>
<span class="line-separator"></span>
<ul>
<li>When the Pompidou Center first opened in 1977, it was consider the epitome of a trend at the time known variously as High Tech and Structural Expressionism.</li>
<li>British architect Richard Rogers was a leading proponent of the style.</li>
<li>This building, designed as Paris’s central institution for Modern and contemporary art, suggests a structure turning inside out, with its heating and plumbing systems worn as the facade—which also features a glass-enclosed outdoor escalator climbing the height of the building.</li>
<li>Rogers took a similar approach for another of his iconic buildings, the headquarters for Lloyd’s of London.</li>
</ul>
</div>
</div>
</div>
<div class="links-container">
<a href="gallery.html#architecture" id="view">View their works</a>
</div>
</div>
</div>
</section>
<script src="js/jquery-3.3.1.min.js"></script>
<script>
$('#navbar li').hover(function() {
$(this).children('.dropdown').fadeToggle();
});
var content = $('.grid-tile-content');
// Hide all grid tile content except the first one
content.not(':first').hide();
$('.grid-tile').each(function(index) {
$(this).click(function() {
// Hide all except the selected one
content.hide();
content.eq(index).show();
$('.overlay').fadeIn();
});
});
$('.close').click(function() {
$('.overlay').fadeOut();
});
</script>
</body>
</html>