diff --git a/index.html b/index.html
index 7b1bbed..7380763 100644
--- a/index.html
+++ b/index.html
@@ -10,7 +10,7 @@
   <body>
     <div id="myDIV" class="container">
       <div class="header">
-        <input type="text" id="myInput" placeholder="Title..." />
+        <input type="text" id="myInput" placeholder="Enter Task" />
         <span onclick="newElement()" class="addBtn">Add</span>
         <h1>My To Do List</h1>
       </div>
@@ -22,6 +22,8 @@ <h1>My To Do List</h1>
         <li>Buy eggs</li>
         <li>Read a book</li>
         <li>Organize office</li>
+        <li>Go shopping</li>
+        <li class="checked">Make noodles</li>
       </ul>
     </div>
 
diff --git a/styles.css b/styles.css
index 686f00f..728a1fe 100644
--- a/styles.css
+++ b/styles.css
@@ -8,6 +8,10 @@
 
 body {
   background-color: #1c1c5d;
+  border: 5pt solid white;
+  border-radius: 8pt;
+  padding: 15pt;
+  margin: 10pt;
 
 }
 #divunder{
@@ -91,7 +95,7 @@ ul li.checked::before {
 }
 
 .close:hover {
-  background-color: #FF9494;
+  background-color: #f72525;
   color: white;
 }
 
@@ -102,10 +106,12 @@ ul li.checked::before {
   align-items: center;
   background-color: #0b0b0b;
   padding: 90px 40px;
-
+  
+  border: 5pt solid white;
+  border-radius: 5pt;
   color: white;
   text-align: center;
-  border-radius: 5px;
+  
 }
 
 
@@ -124,7 +130,7 @@ ul li.checked::before {
 #myInput {
   margin-left: 150px ;
   border: none;
-  border-radius: 0;
+  border-radius: 5pt;
   width: 45%;
   padding: 10px;
   float: left;
@@ -142,12 +148,13 @@ ul li.checked::before {
   font-size: 16px;
   cursor: pointer;
   transition: 0.3s;
-  border-radius: 0;
+  border-radius: 5pt;
 }
 
 .addBtn:hover {
   background-color: rgb(47, 47, 108);
   color: #888;
+  
 }
 
 .container #myInput {
@@ -182,8 +189,6 @@ ul li.checked::before {
 
 }
 
-
-
 @keyframes animate {
 
   0%,
