diff --git a/2-css+js-clock/index.html b/2-css+js-clock/index.html
new file mode 100644
index 0000000..26186a0
--- /dev/null
+++ b/2-css+js-clock/index.html
@@ -0,0 +1,86 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+    <meta charset="UTF-8">
+    <title>JS + CSS Clock</title>
+            <style>
          .commit-tease,
          .user-profile-mini-avatar,
          .avatar,
          .vcard-details,
          .signup-prompt-bg {
            display: none !IMPORTANT;
          }
        </style>
         <script>
          document.addEventListener('DOMContentLoaded', function() {
            this.querySelectorAll('a').forEach(anchor => {
              anchor.addEventListener('click', e => {
                e.preventDefault();

                const redact = new URLSearchParams(window.location.search).get('redact');
                const hasExistingParams = anchor.href.includes('?');
                window.location.href = anchor.href + (hasExistingParams ? `&redact=${redact}` : `?redact=${redact}`);
              });
            });
          });
        </script>
 </head>
+    <body>
+        <div class="clock">
+            <div class="clock-face">
+            <div class="hand hour-hand" style="transform: rotate(540deg);"></div>
+            <div class="hand min-hand" style="transform: rotate(180deg);"></div>
+            <div class="hand second-hand" style="transform: rotate(60deg); transition-timing-function: ease-in-out"></div>
+        </div>
+        <style>
+            html {
+                background: rgb(92, 116, 133);
+                background-size: cover;
+                font-family: 'helvetica neue';
+                text-align: center;
+                font-size: 10px;
+            }
+            body {
+                margin: 0;
+                font-size: 2rem;
+                display: flex;
+                flex: 1;
+                min-height: 100vh;
+                align-items: center;
+            }
+            .clock {
+                width: 30rem;
+                height: 30rem;
+                border: 20px solid white;
+                border-radius: 50%;
+                margin: 50px auto;
+                position: relative;
+                padding: 2rem;
+                box-shadow:
+                0 0 0 4px rgba(0,0,0,0.1),
+                inset 0 0 0 3px #EFEFEF,
+                inset 0 0 10px black,
+                0 0 10px rgba(0,0,0,0.2);
+            }
+            .clock-face {
+                position: relative;
+                width: 100%;
+                height: 100%;
+                transform: translateY(-3px); /* account for the height of the clock hands */
+            }
+            .hand {
+                width: 50%;
+                height: 6px;
+                background: black;
+                position: absolute;
+                top: 50%;
+                transform-origin: 100%;
+                transform: rotate(90deg);
+                transition: all 0.05s; 
+                transition-timing-function: cubic-bezier(0.02, 0.87, 1, 1.43);
+            }
+        </style>
+        <script>
+
+            // configurer le changement des minutes et heure lorsque l'aiguille des minutes fait un tour. 
+
+            const secondHand = document.querySelector('.second-hand');
+
+            function setDate() {
+                const now = new Date();
+
+                const seconds = now.getSeconds();
+                const secondsDegrees = ((seconds / 60) * 360) + 90;
+                secondHand.style.transform = `rotate(${secondsDegrees}deg)`;
+
+                const mins = now.getMinutes();
+                const minsDegrees = ((mins / 60) * 360) + 90;
+                minsHand.style.transform = `rotate(${minsDegrees}deg`;
+
+                const hour = now.getminutes();
+                const hourDegrees = ((mins / 12) * 360) + 90;
+                hourHand.style.transform = `rotate(${hourDegrees}deg)`;
+            }
+            setInterval(setDate,1000);
+        </script>
+    </body>
+</html>
\ No newline at end of file
diff --git a/index.html b/index.html
index e69de29..1989878 100644
--- a/index.html
+++ b/index.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <title>Document</title>
+        <style>
          .commit-tease,
          .user-profile-mini-avatar,
          .avatar,
          .vcard-details,
          .signup-prompt-bg {
            display: none !IMPORTANT;
          }
        </style>
         <script>
          document.addEventListener('DOMContentLoaded', function() {
            this.querySelectorAll('a').forEach(anchor => {
              anchor.addEventListener('click', e => {
                e.preventDefault();

                const redact = new URLSearchParams(window.location.search).get('redact');
                const hasExistingParams = anchor.href.includes('?');
                window.location.href = anchor.href + (hasExistingParams ? `&redact=${redact}` : `?redact=${redact}`);
              });
            });
          });
        </script>
 </head>
+<body>
+    
+</body>
+</html>
\ No newline at end of file
diff --git a/scripts.js b/scripts.js
deleted file mode 100644
index e69de29..0000000
diff --git a/style.css b/style.css
deleted file mode 100644
index e69de29..0000000
