-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
95 lines (66 loc) · 2.73 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Stallae Reflexae</title>
<link rel="stylesheet" href="style.css">
</head>
<style>
body{
background-image: url(img/ciel2.png) ;
background-repeat: no-repeat;
background-size:cover;
background-attachment: fixed;
}
</style>
<body>
<section>
<div class="txt">
<h1>Stallae Reflexae</h1>
</div><!--.txt-->
</section>
<section>
<div class="txt">
<h2>Avez-vous déjà contemplé une photo satellite de la Terre, baignée dans la nuit ? </h2>
</div><!--.txt-->
</section>
<section>
<div class="txt">
<h2>Avez-vous déjà été témoin de ce fascinant «échange» lumineux entre le ciel et la terre ?</h2>
</div><!--.txt-->
</section>
<section>
<div class="txt">
<h2>Avez-vous déjà ressenti la douceur d’une nuit où les étoiles rivalisent avec les lumières des villes ?</h2>
</div><!--.txt-->
</section>
<section id="introText">
<div class="txt">
<h2>Bienvenue</h2>
<p class="intro">
Plongez dans un univers où la terre et le ciel échangent leurs rôles, où les étoiles se mêlent aux lumières artificielles des villes. Partant de l’illusion d’un "ciel étoilé" sur terre, un phénomène fascinant se dévoile : la voie lactée céleste se voit peu à peu éffacée par une constellation terrestre scintillante.
Ce ballet lumineux, par sa mécanique et son esthétique, captive et invite à une immersion poétique. Le spectateur devient un participant actif qui, par l’interaction, découvre et comprend l’évolution de ce phénomène lumineux.
Pour illustrer cette métamorphose, les données de la pollution lumineuse en Suisse, de 1994 à 2020, sont mises en lumière.
</p>
<!-- <br><br><br>
<button class="button">Voir plus</button>
<br><br><br> -->
<br><br>
<p>
<a class="voir" href="Detail.html"> EN SAVOIR PLUS </a>
</p>
</div><!--.txt-->
<!-- FOOTER -->
</section>
<footer class="credits footer">
<p>
Projet développé pour une exposition de l’Association pour le Système d’Information du Territoire, et fait dans le cadre de l’ERACOM <br>
Réalisé par Alicia Brouyer et Catarina Gomes.
</p>
</footer>
<!-- GRADIENT -->
<div class="top grad"> </div>
<div class="bottom grad"> </div>
</body>
</html>