diff --git a/css/garde.css b/css/garde.css
new file mode 100644
index 0000000..ad60534
--- /dev/null
+++ b/css/garde.css
@@ -0,0 +1,16 @@
+#blockPrincipale
+{
+    margin-top: 60px;
+    margin-right: 15%;
+    margin-left: 15%;
+}
+
+.lineText
+{
+    color: white;
+}
+
+.blockText
+{
+    background-color: #0073be;
+}
\ No newline at end of file
diff --git a/garde.html b/garde.html
new file mode 100644
index 0000000..4169ac2
--- /dev/null
+++ b/garde.html
@@ -0,0 +1,47 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta charset="UTF-8">
+    <link rel="stylesheet" href="css/index.css">
+    <link rel="stylesheet" href="css/garde.css">
+</head>
+
+<body>
+    <div id="blockPrincipale">
+        <div class="blockText">
+            <p class="lineText">
+                Surfrider Foundation Europe est une association loi 1901 qui agit depuis 30 ans pour la préservation des
+                océans et de la santé de ses usagers.<br>
+                Nous travaillons sur 3 enjeux : les déchets, la qualité des eaux littorales et le changement climatique.
+            </p>
+        </div>
+        <div id="blockImg">
+            <img src="img/groupe.png" />
+        </div>
+        <div class="blockText">
+            <ul>
+                <li class="lineText">
+                    De ce fait ce site web a été réalisé pour répondre à 3 buts principaux :
+                </li>
+                <ul>
+                    <li class="lineText">
+                        Motiver les surfeur·euses·s à utiliser ce site lors de leurs sessions de surf
+                    </li>
+                    <li class="lineText">
+                        Fournir des données exhaustives pour l’association
+                    </li>
+                    <li class="lineText">
+                        Permettre de soutenir l’association dans sa lutte.
+                    </li>
+                </ul>
+                <li class="lineText">
+                    Pour relever ce défi nous avons constitué un groupe de 9 programmeurs issus d’IUT, de fac et de
+                    MIAGE.
+                </li>
+            </ul>
+        </div>
+    </div>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/img/groupe.png b/img/groupe.png
new file mode 100644
index 0000000..a5c2ef6
Binary files /dev/null and b/img/groupe.png differ
