From 43b00480e4b0c1d684b23e1b014d56849beae77e Mon Sep 17 00:00:00 2001
From: Joachim <contact@uwo.nya.pub>
Date: Sat, 19 Apr 2025 02:05:41 +0200
Subject: [PATCH] =?UTF-8?q?T=C3=A9l=C3=A9verser=20les=20fichiers=20vers=20?=
 =?UTF-8?q?"css"?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 css/main.css | 166 +++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 166 insertions(+)
 create mode 100644 css/main.css

diff --git a/css/main.css b/css/main.css
new file mode 100644
index 0000000..ff75043
--- /dev/null
+++ b/css/main.css
@@ -0,0 +1,166 @@
+@font-face {
+    font-family: 'Luciole';
+    src: url('../font/Luciole-Regular.woff2') format('woff2'),
+    url('../font/Luciole-Regular.woff') format('woff');
+    font-weight: normal;
+    font-style: normal;
+    font-display: swap;
+}
+
+html {
+    font-family: 'Luciole';
+    color: #00fd69;
+    background-color: black;
+}
+
+body {
+    display: flex;
+    flex-direction: column;
+    min-height: 100vh;
+
+    a {
+        color: #00fd69;
+    }
+
+    ul {
+        list-style-type: none;
+        div {
+            margin-left:20px;
+        }
+    }
+
+    li {
+        display: flex;
+        margin-top:20px;
+        margin-bottom:20px;
+    }
+
+    div {
+        margin-top: auto;
+        margin-bottom:auto;
+    }
+
+    .ico {
+        height:50px;
+        width:50px;
+    }
+}
+
+main {
+    flex: 1;
+    width: 80%;
+    margin:auto;
+    margin-top:50px;
+    margin-bottom:50px;
+}
+
+header{
+    font-size:20px;
+    display:flex;
+    flex-direction: row;
+    margin-top: 10px;
+    margin-left: 10px;
+
+    img {
+        height: 100%;
+    }
+
+    a {
+        text-decoration: none;
+        color: #00fd69;
+        display: flex;
+    }
+
+    nav {
+        display: flex;
+        flex-direction: row;
+        width: 50%;
+        margin:auto;
+        margin-right:0px;
+        justify-content: right;
+        img {
+            width: 100%;
+        }
+    }
+
+    .img {
+        float:left;
+        width: 20%;
+        min-width:50px;
+        max-width:100px;
+    }
+    .text {
+        float:right;
+        margin-top: auto;
+        margin-bottom: auto;
+        margin-right:auto;
+        margin-left:20px;
+        width: 80%
+    }
+
+    .forge-ico-op, .cloud-ico-op, .stuff-ico-op {
+        display: none;
+    }
+
+    .cloud:hover .cloud-ico-op, .forge:hover .forge-ico-op, .stuff:hover .stuff-ico-op {
+        display:block;
+    }
+
+    .cloud:hover .cloud-ico, .forge:hover .forge-ico, .stuff:hover .stuff-ico {
+        display:none;
+    }
+
+    .cloud:hover, .forge:hover, .stuff:hover {
+        text-decoration: underline;
+    }
+
+    .logo {
+        transition-duration: 4s;
+        max-height:150px;
+        margin-left:auto;
+        margin-right:auto;
+    }
+
+    .logo:hover {
+        transform: rotate(360deg);
+    }
+}
+
+footer {
+    text-align: center;
+
+    a {
+        color: #00fd69;
+    }
+
+    div {
+        border-top-left-radius: 30px;
+        border-top-right-radius: 30px;
+        border-top: solid #00fd69 2px;
+        border-left: solid #00fd69 2px;
+        border-right: solid #00fd69 2px;
+        width:40%;
+        margin-left:auto;
+        margin-right:auto;
+        padding-top:20px;
+    }
+}
+
+@media (max-width: 868px) {
+    header {
+        flex-direction: column;
+        nav {
+            a{
+                margin-left:auto;
+                margin-right:auto;
+            }
+            flex-direction: column;
+            width:100%;
+        }
+    }
+    footer {
+        div {
+            width:100%;
+        }
+    }
+}