diff --git a/index.css b/index.css
new file mode 100644
index 0000000..03f6e82
--- /dev/null
+++ b/index.css
@@ -0,0 +1,70 @@
+body {
+    background-image: url('https://cdn.pixabay.com/photo/2010/12/13/10/09/abstract-2384_960_720.jpg');
+    background-size: cover;
+    height: 100vh;
+}
+
+.header {
+    display: flex;
+    justify-content: center;
+    margin-top: 5%;
+}
+
+h1 {
+    font-size: 5em;
+    color: rgb(252, 252, 252);
+}
+
+.add {
+    display: flex;
+    justify-content: center;
+    margin-top: 5%;
+}
+
+.addinput {
+    width: 20%;
+    height: 35px;
+}
+
+.list ul li {
+    list-style: none;
+    font-size: 2em;
+    color: rgb(245, 250, 255);
+    background-color: rgba(10, 67, 164, 0.3);
+    margin-top: -10%;
+    backface-visibility: visible;
+}
+
+#remBtn {
+    color: rgb(154, 34, 34);
+    backface-visibility: hidden;
+}
+
+.list {
+    display: flex;
+    justify-content: flex-end;
+    margin-right: 10%;
+    margin-top: 8%;
+}
+
+#listContainer {
+    display: inline-block;
+}
+
+button {
+    background: none;
+    border: none;
+}
+
+#addInput:focus {
+    background: pink;
+    font-size: 20px;
+}
+
+
+/*Troisieme solution*/
+
+
+/*#remBtn {
+  display: none;
+}*/
diff --git a/index.html b/index.html
index a3e8cca..0925804 100644
--- a/index.html
+++ b/index.html
@@ -1,36 +1,55 @@
 <!DOCTYPE html>
 <html>
-
-<head>
+  <head>
     <meta charset="utf-8">
-    <title>CV Factory</title>
-    <link rel="stylesheet" href="CVFactory.css">
-    <link href="https://fonts.googleapis.com/css?family=Cinzel" rel="stylesheet">
+    <title>SkillsListeNode</title>
+    <link rel="stylesheet" href="index.css">
     <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
-</head>
+    <!-- <script src = "indexx.js" type="text/javascript"></script>  -->
+  </head>
+  <body>
+<header>
+       <h1 class="header">CV FACTORY</h1>
+</header>
+
+<section class="add">
+        <input id = "addInput"  class="addinput" type="text" name="addinput" value="" autofocus >
+        <button id = "btn" type="button" onclick="addClick()" name="button" value="" ><i class="fa fa-plus-circle fa-3x" style = "color:rgb(8, 23, 79)"aria-hidden="true"></i>
+        </button>
+</section>
+
+<section class="list">
+        <ul id = listContainer>
+       <!-- <li id = "remBtn"><button type="button" name="remove"><i onclick="Supp()" class="fa fa-trash fa-2x" style = "color: red" aria-hidden="true"></i>
+        </button>Html</li> -->
+        </ul>
+</section>
+
+<script type="text/javascript">
 
-<body>
-    <header>
-        <h1>CV FACTORY</h1>
+//premiere solution
 
-    </header>
-    <section>
+var btn = document.getElementById ('btn');
+var addInput = document.getElementById('addInput');
+var listContainer = document.getElementById('listContainer');
 
+function addClick () {
+     var eLi = document.createElement("li");
+     var ii = document.createElement("i");
+     ii.innerHTML = '<i id="remBtn" class="fa fa-trash fa-2x" aria-hidden="true"></i>'
+     ii.innerHTML = ii.innerHTML;
+     listContainer.appendChild (ii);
+     eLi.innerHTML = '<button type="button" name="remove" style ="margin-right:250px"></button>';
+     eLi.innerHTML = eLi.innerHTML + addInput.value;
+     listContainer.appendChild (eLi);
 
-        <div class="add">
-            <input type="text" name="addinput">
-            <button type="button" name="add">Confirm</button>
-        </div>
+  ii.addEventListener('click', function(){
+      eLi.remove(eLi.listContainer);
+      ii.remove(ii.listContainer);
+    });
+}
 
-        <div class="list">
-            <ul>
-                <li> <button type="button" name="remove"><i class="fa fa-trash" aria-hidden="true"></i></button> Css </li>
-                <li> <button type="button" name="remove"><i class="fa fa-times" aria-hidden="true"></i>
-</button> JavaScript </li>
-                <li> <button type="button" name="remove"></button> Html5 </li>
-            </ul>
-        </div>
-    </section>
-</body>
 
+</script>
+  </body>
 </html>
