le css que j'avais oublié, LOL

style.css

@@ -0,0 +1,186 @@
+
+/* * { */
+/*     border: 1px solid black; */
+/* } */
+
+.highlight {
+    border: 1px solid red;
+}
+
+@keyframes spin {
+    from {
+        transform: rotate(0deg);
+    }
+    to {
+        transform: rotate(360deg);
+    }
+}
+
+@keyframes bounce {
+    0% {
+        transform: scale(1);
+    }
+    50% {
+        transform: scale(1.2);
+    }
+    100% {
+        transform: scale(1);
+    }
+}
+
+.bounce-repeat:hover {
+    animation-name: bounce;
+    animation-duration: 0.3s;
+    animation-iteration-count: infinite;
+}
+
+#Title {
+    font-family: Arial;
+    font-size: 80px;
+    color:red;
+}
+
+#denonciation > h3 {
+    color: red;
+}
+
+#denonciation {
+    padding-bottom: 100px;
+}
+
+.to-middle {
+    display:table;
+    margin-left:auto;
+    margin-right:auto;
+}
+
+.fun:hover {
+    background-color: green;
+    animation-name: spin;
+    animation-duration: 2s;
+}
+
+.be-big {
+    line-height: 100px;
+}
+
+#logo {
+    width:300px;
+}
+
+#logo:hover {
+    width:400px;
+}
+
+.side-to-side {
+    display: inline-block;
+    padding: 50px;
+    /* padding-left: 50px; */
+    /* padding-right: 50px; */
+}
+
+.side-to-side-small {
+    display: inline-block;
+    padding: 5px;
+}
+
+p {
+    text-align: center;
+}
+
+strong {
+    text-transform: uppercase;
+}
+
+.right-sidebar {
+    float: right;
+}
+
+thead {
+    font-size: 40px;
+}
+
+footer {
+    text-align: center;
+    background-color: lightgray;
+    left:0px;
+    width:100vw;
+    position: fixed;
+    bottom:0px;
+}
+
+#css-image {
+    float: right;
+}
+
+#css-image > div {
+    /* background-color:red; */
+}
+
+.insideColor {
+    background-color: red;
+}
+.half-circle-container {
+    background-color:white;
+    height: 70px;
+    padding:0px;
+    margin:0px;
+}
+.half-circle {
+
+    display:inline-block;
+    border-radius: 50px 50px 0px 0px;
+    width: 100px;
+    height: 70px;
+    margin: 0px;
+    padding: 0px;
+}
+
+.triangle {
+    width: 0px;
+    height:0px;
+    background-color:transparent;
+    border-left: 100px solid transparent;
+    border-right: 100px solid transparent;
+    border-top: 200px solid red;
+}
+
+#y_rotation {
+    z-index: 1;
+    margin-right: auto;
+    margin-left:auto;
+    width: 300px;
+    /* padding-left: 50%; */
+    /* transform: translateX(-50%) translateY(-30px); */
+    /* width: 300px; */
+}
+
+.y_slider {
+    position:absolute;
+    /* transform: translateX(50%); */
+    bottom: 20px;
+    transform: translateX(50%);
+}
+
+#x_rotation {
+    z-index: 1;
+    width: 300px;
+    /* width: 300px; */
+}
+
+.x_slider {
+    position:absolute;
+    transform: rotate(90deg) translateX(-87%);
+    right: -80px;
+    /* margin-top: 50%; */
+}
+
+.glCanvas {
+    z-index: 0;
+}
+
+#canvas-container {
+    position: relative;
+    width: auto;
+    height: auto;
+}