diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 0000000..6f3a291
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+    "liveServer.settings.port": 5501
+}
\ No newline at end of file
diff --git a/CSS/cart.css b/CSS/cart.css
new file mode 100644
index 0000000..daf3602
--- /dev/null
+++ b/CSS/cart.css
@@ -0,0 +1,116 @@
+/* resets and commons starts here  */
+:root{
+    --font-size:1.5rem;
+}
+
+*{ 
+     margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+    font-weight: 400;
+    text-decoration: none;
+    list-style-type: none;
+    outline: none;
+}
+
+html{
+    background-color:#e6eaee;
+    scroll-behavior: smooth;
+    font-size: 62.5;
+    font-family: 'Rajdhani', sans-serif;
+}
+body{
+    width: 60rem;
+    margin: auto;
+}
+.chekout-form {
+    display: flex;
+    flex-wrap: wrap;
+}
+  .payment-information{
+    flex:70%
+  }
+  .cart-information{
+    flex:30%;
+  }
+  .payment-ditails{
+    display: flex;
+    flex-direction: column;
+    flex-wrap: wrap;
+  }
+  .main-form {
+    flex: 50%;
+  }
+
+  input[type=text], input[type=date] {
+    width: 100%;
+    margin-bottom: 20px;
+    padding: 12px;
+    border: 1px solid #ccc;
+    border-radius: 3px;
+  }
+  
+  label {
+    margin-bottom: 10px;
+    display: block;
+  }
+
+  .btn {
+    background-color:#C27664;
+    color:black;
+    font-weight: 600;
+    padding: 12px;
+    margin: 10px 0;
+    border: none;
+    width: 100%;
+    border-radius: 3px;
+    cursor: pointer;
+    font-size: 17px;
+  }
+
+  .container {
+    background-color: white;
+    padding: 5px 20px 15px 20px;
+    border:lightgray 1px solid ;
+    border-radius: 3px;
+  }
+  h2{
+    margin-bottom: 1rem;
+    font-size: var(--font-size);
+    font-weight: 600;
+  }
+  span.price {
+    float: right;
+    color: grey;
+  }
+  .table__info{
+    width: 100%;
+    border-collapse: collapse;
+  }
+  td,tr{
+    border-bottom: 1px solid #ddd;
+    text-align: left;
+    padding: 1rem;
+  }
+  p{
+    font-size: var(--font-size);
+    margin-bottom: 1rem;
+  }
+/* resposiveness section starts here  */
+@media screen and (max-width:992px) {
+    
+}
+
+@media screen and (max-width:760px) {
+
+}
+
+@media screen and (max-width:600px) {
+  .chekout-form {
+    flex-direction: column-reverse;
+}
+.cart-information{
+  margin-bottom: 2rem;
+}
+}
+/* resposiveness section ends here  */
\ No newline at end of file
diff --git a/CSS/login.css b/CSS/login.css
new file mode 100644
index 0000000..6b6390b
--- /dev/null
+++ b/CSS/login.css
@@ -0,0 +1,118 @@
+/* resets and commons starts here  */
+*{
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+    font-weight: 400;
+    text-decoration: none;
+    list-style-type: none;
+    outline: none;
+}
+
+html{
+    background-color:#e6eaee;
+    scroll-behavior: smooth;
+    font-size: 62.5;
+    font-family: 'Rajdhani', sans-serif;
+}
+body{
+    width: 50rem;
+    margin: auto;
+}
+/* reset and commons ends here  */
+.box{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+   }
+#container{
+    display: flex;
+    flex-direction: column;
+    background-color: #fff;
+    width: 80%;
+    margin-top: 10rem;
+    height: 45vh;
+
+}
+img{
+width: 100px;
+margin-bottom: 1rem;
+}
+.col-15{
+    flex:15%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin:0 1rem;
+    gap: 1rem;
+}
+.col-30{
+    flex: 30%;
+    margin: 0 1rem;
+    display: flex;
+    align-items: center;
+}
+.col-40{
+    flex: 40%;
+    display: flex;
+    flex-direction: column;
+}
+.colum{
+    display: flex;
+    flex-direction: column;
+    align-items:center;
+    margin: 1rem 2rem;
+}
+.row{
+    display: flex;
+    justify-content: space-around;
+    gap: 1rem;
+    width: 100%;
+  }
+.sign-btn{
+    background-color:#C27664;
+    color: black;
+    font-weight: 600;
+    padding: 12px;
+    border: none;
+    width: 100%;
+    border-radius: 3px;
+    cursor: pointer;
+    font-size: 17px;
+}
+.btn{
+    display: flex;
+    justify-content:space-evenly;
+    align-items: center;
+    background-color:#C27664;
+    color:white;
+    font-weight: 600;
+    padding: 6px;
+    border: none;
+    width: 100%;
+    border-radius: 3px;
+    cursor: pointer;
+    font-size: 1.5rem;
+}
+input[type=email],
+input[type=password] {
+    width: 100%;
+    margin-bottom: 20px;
+    padding: 12px;
+    border: 1px solid #ccc;
+    border-radius: 3px;
+  }
+a{
+    color: black;
+ }
+ 
+ input[type=submit]{
+    background-color:#84D2C5;
+    color:black;
+    padding: 12px;
+    border: none;
+    width: 40%;
+    border-radius: 3px;
+    cursor: pointer;
+    font-size: 17px;
+ }
\ No newline at end of file
diff --git a/CSS/product.css b/CSS/product.css
new file mode 100644
index 0000000..4428963
--- /dev/null
+++ b/CSS/product.css
@@ -0,0 +1,284 @@
+/* resets and commons starts here  */
+:root{
+    --font-size:1.5rem;
+}
+
+*{
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+    font-weight: 400;
+    text-decoration: none;
+    list-style-type: none;
+    outline: none;
+}
+
+html{
+    background-color:#e6eaee;
+    scroll-behavior: smooth;
+    font-size: 62.5;
+    font-family: 'Rajdhani', sans-serif;
+}
+body{
+    width: 100rem;
+    margin: auto;
+}
+.card__heading{
+    font-weight: 800;
+}
+.nav-link{
+    font-weight: 500;
+    color: black;
+}
+a{
+    color: black;
+}
+/* reset and commons ends here  */
+
+/* nav section starts here  */
+.logo{
+    width:60px;
+}
+.nav-bar{
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    background-color: #fff;
+    min-height: 5vh;
+}
+.list-elements{
+    display: flex;
+    justify-content: space-around;
+    align-items: center;
+    /* color:#C27664; */
+    font-size: var(--font-size);
+}
+
+.nav-left{
+    flex: 50%;
+}
+.nav-right{
+    flex: 50%;
+}
+
+.serch{
+    width: 80%;
+}
+#main-nav{
+    position: sticky;
+    top: 0;
+    z-index: 10;
+}
+/* nav section ends here  */
+
+/* main section starts here  */
+
+.product-section{
+    display: flex;
+    background-color: #fff;
+    margin-bottom: 2rem;
+    gap:2rem;
+}
+.product-heading{
+    padding: 0.5rem 0;
+    font-size: var(--font-size);
+    font-weight: 500;
+    margin-bottom: 2rem;
+    margin-left: 2rem;
+}
+.product-images{
+    width:75%;
+}
+.product-features{
+    width: 25%;
+    margin-right: 2rem;
+}
+.product-main-image img{
+    width: 100%;
+    height: 700px;
+    object-fit: cover;
+}
+.product-image-set img{
+    height: 50px;
+    width: 100%;
+    object-fit: cover;
+}
+.product-image-set{
+    display:grid;
+    grid-template-columns: repeat(10, minmax(0,1fr));
+    gap:1rem;
+}
+.container{
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+}
+.conteiner-row{
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 100%;
+    margin-bottom: 2rem;
+}
+.row{
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 80%;
+}
+
+.card__price{
+    display: flex;
+    height: 10%;
+    gap:5rem;
+    margin-bottom: 2rem;
+    font-size: var(--font-size);
+    font-weight: 500;
+}
+.price__reduced{
+    text-decoration:line-through;
+}
+input[type=number] {
+    width: 30%;
+    margin-bottom: 10px;
+    padding: 8px;
+    border: 1px solid #ccc;
+    border-radius: 3px;
+  }
+.btn {
+    background-color:#C27664;
+    color:black;
+    font-weight: 600;
+    padding: 8px;
+    margin: 10px 0;
+    border: none;
+    width: 100%;
+    border-radius: 3px;
+    cursor: pointer;
+    font-size: 17px;
+  }
+.buy-form{
+    height: 90%;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    align-items:flex-start ;
+    gap:2rem;
+}
+.chekbox{
+    display: block;
+    flex-direction: column;
+    width: 100;
+}
+.table__info{
+    width: 80%;
+    border-collapse: collapse;
+}
+td,tr{
+    border-bottom: 1px solid #ddd;
+    text-align: left;
+    padding: 1rem;
+    font-size: 1.2rem
+}
+.product-demensions{
+    display: flex;
+    width: 100%;
+    align-items: center;
+    
+}
+.demension-table{
+    flex:40%;
+}
+.demension-pic{
+    flex: 60%;
+}
+.demension-pic img{
+    width: 100%;
+    height: 400px;
+    object-fit: cover;
+}
+
+.product-advantages{
+    background-color: #fff;
+}
+.description-cards{
+    display: flex;
+    gap: 2rem;
+    width: 90%;
+}
+.decription-card{
+    display: flex;
+    width: 33%;
+    flex-direction: column;
+    gap: 1rem;
+}
+.description{
+    margin-bottom: 1rem;
+    margin-left: 2rem;
+    margin-right: 2rem;
+}
+.description-card__heading{
+    font-weight: 800;
+}
+.card img{
+    height: 20rem;
+    width: auto;
+    margin-bottom: 1rem;
+    object-fit: cover;
+ }
+ 
+ .inline-pic{
+    display: grid;
+    grid-template-columns: repeat(4, minmax(0,1fr));
+    gap: 2rem;
+    width: 90%;
+ }
+
+ .card{
+    display: flex;
+    flex-direction: column;
+}
+.product-recomendations{
+    margin-bottom: 2rem;
+}
+/* main section ends here  */
+
+/* footer section starts here  */
+#main-footer{
+    background-color: #B05A7A;
+    height: 15vh;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+/* footer section ends here  */
+
+/* resposiveness section starts here  */
+@media screen and (max-width:992px) {
+    
+}
+
+@media screen and (max-width:760px) {
+
+}
+
+@media screen and (max-width:600px) {
+    .inline-pic{
+        grid-template-columns: repeat(2, minmax(0,1fr));
+     }
+     .description-cards{
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        align-items: center;
+        gap: 2rem;
+        width: 90%;
+    }
+    .decription-card{
+        width: 60%;
+
+    }
+}
+
+/* resposiveness section ends here  */
\ No newline at end of file
diff --git a/CSS/style.css b/CSS/style.css
new file mode 100644
index 0000000..ce0f23a
--- /dev/null
+++ b/CSS/style.css
@@ -0,0 +1,373 @@
+/* resets and commons starts here  */
+:root{
+    --font-size:1.5rem;
+}
+
+*{
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+    font-weight: 400;
+    text-decoration: none;
+    list-style-type: none;
+    outline: none;
+}
+
+html{
+    background-color:#e6eaee;
+    scroll-behavior: smooth;
+    font-size: 62.5;
+    font-family: 'Rajdhani', sans-serif;
+}
+body{
+    width: 100rem;
+    margin: auto;
+}
+.card__heading{
+    font-weight: 800;
+}
+.nav-link{
+    font-weight: 500;
+    color: black;
+}
+a{
+    color: black;
+}
+.list__item{
+    color: black;
+}
+.button-box{
+    position: sticky;
+    bottom:15%;
+    right: 20%;
+    transform: translate(-50% 50%);
+}
+.puls{
+    outline: 1px solid #84D2C5;
+    width:6rem;
+    height:6rem;
+    color:fff;
+    text-align: center;
+    background-color: #84D2C5;
+    border-radius: 50%;
+    position: relative;
+}
+
+.phone{
+    position: absolute;
+    font-size: 2rem;
+    width: 6rem;
+    height: 6rem;
+
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    
+    animation: phone.9s ease-in-out infinite;
+}
+.phone i{
+    color:#fff
+}
+
+@keyframes phone{
+0%, 100%{
+    transform: rotate(-20deg);
+}
+50%{
+    transform: rotate(21deg);
+}
+}
+.puls::before{
+    content:" ";
+    position: absolute;
+    border: 2px solid #84D2C5;
+    left: -2rem;
+    right: -2rem;
+    top:-2rem;
+    bottom:-2rem;
+    border-radius: 50%;
+    animation: puls 1.8s linear infinite;
+}
+.puls:hover::after{
+    animation-delay: 5s;
+}
+@keyframes puls{
+    0%{
+        transform: scale(0.5);
+    }
+    50%{
+        opacity: 1;
+    }
+    100%{
+        transform: scale(1.2);
+        opacity: 0;
+    }
+}
+/* reset and commons ends here  */
+
+/* nav section starts here  */
+.logo{
+    width:60px;
+}
+.nav-bar{
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    background-color: #fff;
+    min-height: 5vh;
+}
+.list-elements{
+    display: flex;
+    justify-content: space-around;
+    align-items: center;
+    color:#C27664;
+    font-size: var(--font-size);
+}
+.serch-bar{
+    width: 100%;
+    background-color: rgba(176, 90, 122, 0.2);
+    display: flex;
+    border-radius: 60px;
+    padding: 0.3rem 1rem;
+}
+.serch-bar input{
+    background: transparent;
+    flex:1;
+    border:none;
+    padding: 0.1rem 0.1rem;
+    font-size: 1.1rem;
+    color:black;
+}
+.serch-icon{
+    font-size: 1.3rem;
+}
+.serch-bar button{
+    border: none;
+    border-radius: 50%;
+    width: 3rem;
+    height: 3rem;
+    cursor:pointer;
+}
+.nav-left{
+    width: 30%;
+}
+.nav-right{
+    width: 30%;
+}
+.nav-midle{
+    display: flex;
+    justify-content: center;
+    width: 40%;
+}
+.serch{
+    width: 80%;
+}
+#main-nav{
+    position: sticky;
+    top: 0;
+    z-index: 10;
+}
+/* nav section ends here  */
+
+/* main section starts here  */
+
+.container{
+    width: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+ }
+.banner-noimg{
+    display: flex;
+    flex-direction: column;
+    align-items:center;
+    justify-content: center;
+    height: 20vh;
+    background-color: #fff;
+    text-align: center;
+}
+.main-heading{
+    font-size: 5rem;
+    font-weight: 500;
+    padding-bottom: 2rem;
+}
+.description{
+    font-size: var(--font-size);
+    text-align: center;
+}
+
+.banner-img{
+    height: 60vh;
+    background-image: url(/img/index-img/main-banner.jpg);
+    background-size: cover;
+    position: relative;
+}
+.banner-description{
+    display: flex;
+    flex-direction: column;
+    align-items:center;
+    justify-content: center;
+    background-color:#fff;
+    width: 25rem;
+    opacity: 0.8;
+    position: absolute;
+    top:400px;
+    left:60px;
+    padding: 0.2rem;
+}
+.banner-heading{
+    font-size: 3rem;
+    padding-bottom: 2rem;
+    font-weight: 500;
+}
+
+.conteiner-row{
+    display: flex;
+    }
+.goods-banner{
+    position: relative;
+    color:#fff; 
+}
+.goods-banner img{
+    width: 50rem;
+    height: 60rem;
+    background-size: cover;
+}
+.group__dsc{
+    position: absolute;
+    top:45%;
+    left:30%;
+    font-size: 5rem;
+    font-weight: 800;
+}
+.shop-items{
+    margin-bottom: 2rem;
+}
+
+.items-list{
+    display: grid;
+    grid-template-columns: repeat(3, minmax(0,1fr));
+    gap:2rem;
+    width: 90%;
+}
+.card img{
+   height: 40rem;
+   width: 100%;
+   margin-bottom: 1rem;
+   object-fit: cover;
+}
+.card{
+    display: flex;
+    flex-direction: column;
+}
+.card__price{
+    display: flex;
+    margin-bottom: 1rem;
+}
+.price__reduced{
+    margin-left: 1.5rem;
+    text-decoration: line-through;
+}
+.card__button{
+    width:8rem;
+    padding: 0.5rem 1rem;
+    background-color: #C27664;
+    border: none;
+    border-radius: 5px;
+    font-size: 1.3rem;
+
+}
+.section-heading{
+    padding: 5rem;
+    text-align: center;
+    font-size: 5rem;
+}
+.row{
+    display: flex;
+    justify-items: center;
+    align-items: center;
+    margin:1rem 0;
+}
+.btn{
+    width:8rem;
+    margin-left: 0.5rem;
+    padding: 0.2rem 0.2rem;
+    background-color: #C27664;
+    border: none;
+    border-radius: 5px;
+    font-size: 1rem;
+}
+.subscribtion-bar{
+    width: 30%;
+    background-color: rgba(176, 90, 122, 0.2);
+    display: flex;
+    border-radius: 20px;
+    padding: 0.7rem 1rem;
+    margin: 1rem 0;
+}
+.subscribtion-bar input{
+    background: transparent;
+    flex:1;
+    border:none;
+    padding: 0.1rem 0.1rem;
+    font-size: 1.1rem;
+    color:black;
+}
+.subscribtion-bar button{
+    border: none;
+    border-radius: 20px;
+    width: 6rem;
+    height: 2rem;
+    cursor:pointer;
+}
+
+/* main section ends here  */
+
+
+/* footer section starts here  */
+#main-footer{
+    background-color: #B05A7A;
+    height: 15vh;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+/* footer section ends here  */
+
+/* resposiveness section starts here  */
+@media screen and (max-width:992px) {
+    
+}
+
+@media screen and (max-width:760px) {
+    .items-list{
+        display: grid;
+        grid-template-columns: repeat(2, minmax(0,1fr));
+    }
+}
+
+@media screen and (max-width:600px) {
+    .items-list{
+        display: grid;
+        grid-template-columns: repeat(1, minmax(0,1fr));
+        width: 80%;
+    }
+    .conteiner-row{
+        flex-direction: column;
+        justify-content: center;
+        align-items: center;
+        width: 100%;
+        }
+    .goods-banner img{
+        width: 80rem;
+        height: 40rem;
+        object-fit: cover;
+    }
+    .nav-midle{
+        display: none;
+    }
+    .conteiner-row{
+        margin-top: 2rem;
+    }
+}
+/* resposiveness section ends here  */
\ No newline at end of file
diff --git a/Pages/cart.html b/Pages/cart.html
new file mode 100644
index 0000000..dac7351
--- /dev/null
+++ b/Pages/cart.html
@@ -0,0 +1,78 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Casavile Furniture & Accessories</title>
+    <link rel="stylesheet" href="/CSS/cart.css">
+
+    <!-- icon link starts here  -->
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css" integrity="sha512-MV7K8+y+gLIBoVD59lQIYicR65iaqukzvf/nwasF0nqhPay5w/9lJmVM2hMDcnK1OnMGCdVK+iQrJ7lzPJQd1w==" crossorigin="anonymous" referrerpolicy="no-referrer" />
+
+    <!-- font link starts here  -->
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Rajdhani:wght@300;400;500;600;700&display=swap" rel="stylesheet">
+</head>
+<body>
+    <h1>Checkout Form</h1>
+    <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Dignissimos, obcaecati.</p>
+    <div class="chekout-form">
+        <div class="payment-information">
+          <div class="container">
+            <form>
+              <div class="payment-ditails">
+                <div class="main-form">
+                  <h2>Billing Address</h2>
+                  <label for="name">Full Name</label>
+                  <input type="text" id="name" name="name" placeholder="John Smith">
+                  <label for="email">Email</label>
+                  <input type="text" id="email" name="email" placeholder="john@gmail.com">
+                  <label for="address">Address</label>
+                  <input type="text" id="adress" name="address" placeholder="Street 65f">
+                  <label for="city">City</label>
+                  <input type="text" id="city" placeholder="Munchen">
+                  <label for="zip">Zip</label>
+                  <input type="text" id="zip" name="zip" placeholder="10001">
+                </div>
+
+                <div class="main-form">
+                  <h2>Payment ditails</h2>
+                  <label for="cardname">Name on Card</label>
+                  <input type="text" id="cardname" name="cardname" placeholder="John Smith">
+                  <label for="cardcnum">Credit card number</label>
+                  <input type="text" id="cardcnum" name="cardnumber" placeholder="1111-1111-1111-1111">
+                  <label for="date">Exp date</label>
+                  <input type="date" id="date" name="date" placeholder="January">
+                  <label for="cvv">CVV</label>
+                  <input type="text" id="cvv" name="cvv" placeholder="111">
+                </div>
+              </div>
+              <input type="submit" value="Clik to checkout" class="btn">
+        </form>
+        </div>
+      </div>
+      <div class="cart-information">
+        <div class="container">
+          <h2>Your order:</h2>
+          <table class="table__info">
+              <tr class="table-row">
+                 <td class="cart__item">Product 1</th>
+                 <td class="item__price">100 USD</td>
+             </tr>
+             <tr class="table-row">
+                <td class="cart__item">Product 1</td>
+                <td class="item__price">100 USD</td>
+             </tr>
+             <tr class="table-row">
+              <td class="cart__item">Total</td>
+              <td class="item__price">200 USD</td>
+             </tr>
+         </table>
+        </div>
+          </div>
+  </div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/Pages/login.html b/Pages/login.html
new file mode 100644
index 0000000..58616fe
--- /dev/null
+++ b/Pages/login.html
@@ -0,0 +1,71 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Casavile | Sign in</title>
+    <link rel="stylesheet" href="/CSS/login.css">
+
+    <!-- icon link starts here  -->
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css" integrity="sha512-MV7K8+y+gLIBoVD59lQIYicR65iaqukzvf/nwasF0nqhPay5w/9lJmVM2hMDcnK1OnMGCdVK+iQrJ7lzPJQd1w==" crossorigin="anonymous" referrerpolicy="no-referrer" />
+
+    <!-- font link starts here  -->
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Rajdhani:wght@300;400;500;600;700&display=swap" rel="stylesheet">
+
+</head>
+<body>
+    <main>
+        <div class="box">
+        <div id="container">
+            <div class="col-15">
+                <img src="/img/index-img/logo.png" alt="logo">
+            </div>
+            <div class="col-15">
+                <button class="sign-btn">Join</button>
+                <button class="sign-btn">Sign in</button>
+            </div>
+
+            <div class="col-40">
+                <div class="container">
+                    <form>
+                        <div class="colum">
+                            <label for="email">Email adress:</label>
+                            <input type="email" id="email" name="email" placeholder="john@gmail.com">
+                
+                            <label for="password">Password</label>
+                            <input type="password" id="password" name="password" placeholder="Enter your password">
+                
+                            <input type="submit" value="Sign-in">
+                        </div>
+                    </form>
+                    <div class="row">
+                        <a href="#">Forgot password?</a>     
+                    </div>
+                
+                </div>
+            </div>
+
+            <div class="col-30">
+                <div class="row">
+                    <div class="btn">
+                        <i class="fa-brands fa-google icon"></i>
+                        <p>Google</p>
+                    </div>
+                    <div class="btn">
+                        <i class="fa-brands fa-apple icon"></i>
+                        <p>Apple</p>
+                    </div>
+                    <div class="btn">
+                        <i class="fa-brands fa-facebook icon"></i>
+                        <p>Facebook</p>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    </main>
+</body>
+</html>
\ No newline at end of file
diff --git a/Pages/product.html b/Pages/product.html
new file mode 100644
index 0000000..f6d1e87
--- /dev/null
+++ b/Pages/product.html
@@ -0,0 +1,198 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Casavile Furniture & Accessories</title>
+    <link rel="stylesheet" href="/CSS/product.css">
+
+    <!-- icon link starts here  -->
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css" integrity="sha512-MV7K8+y+gLIBoVD59lQIYicR65iaqukzvf/nwasF0nqhPay5w/9lJmVM2hMDcnK1OnMGCdVK+iQrJ7lzPJQd1w==" crossorigin="anonymous" referrerpolicy="no-referrer" />
+
+    <!-- font link starts here  -->
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Rajdhani:wght@300;400;500;600;700&display=swap" rel="stylesheet">
+
+<body>
+    <nav id="main-nav">
+        <div class="nav-bar">
+            <div class="nav-left">
+                <ul class="list-elements">
+                    <li class="list__item"><img class="logo" src="/img/index-img/logo.png" alt="logo"></li>
+                    <li class="list__item"><a class="nav-link" href="#Furniture">Furniture</a></li>
+                    <li class="list__item"><a class="nav-link" href="#Acceccories">Accessories</a></li>
+                </ul>
+            </div>
+
+
+            <div class="nav-right">
+                <ul class="list-elements">
+                    <li class="list__item"><a class="nav-link" href="login.html" target="_blank"><i class="fa-solid fa-user list__icon"></i> Login</a></li>
+                    <li class="list__item"><a class="nav-link" href="#main-footer"><i class="fa-solid fa-address-card list__icon"></i> Contacts</a></li>
+                    <li class="list__item"><a class="nav-link" href="cart.html" target="_blank"><i class="fa-solid fa-cart-shopping list__icon"></i> Cart</a></li>
+                </ul>
+            </div>
+        </div>
+    </nav>
+    <!-- nav section ends here  -->
+    
+    <!-- main section starts here  -->
+    <main>
+        <section class="product-section">
+            <div class="product-images">
+                <h5 class="product-heading">Collection name</h5>
+                <div class="product-main-image">
+                    <img src="/img/index-img/furniture.jpg" alt="product pic">
+                </div>
+                <div class="product-image-set">
+                    <img src="/img/index-img/furniture.jpg" alt="product pic">
+                    <img src="/img/index-img/furniture.jpg" alt="product pic">
+                    <img src="/img/index-img/furniture.jpg" alt="product pic">
+                    <img src="/img/index-img/furniture.jpg" alt="product pic">
+                    <img src="/img/index-img/furniture.jpg" alt="product pic">
+                </div>
+            </div>
+            <aside class="product-features">
+                <div class="conteiner">
+                    <h5 class="product-heading">Product name</h5>
+                    <div class="card__price">
+                        <p class="price__regular">122$</p>
+                        <p class="price__reduced">1555$</p>
+                    </div>
+                    <form class="buy-form">
+                        <div class="chekbox">
+                            <div class="chekbox-row">
+                                <input type="checkbox" id="upgrade1" name="upgrade1" value="upgrade1">
+                                <label for="upgrade1">Upgrade1</label>
+                            </div>
+                            <div class="chekbox-row">
+                                <input type="checkbox" id="upgrade2" name="upgrade2" value="upgrade2">
+                                <label for="upgrade2">Upgrade2</label>
+                            </div>
+                            <div class="chekbox-row">
+                                <input type="checkbox" id="upgrade3" name="upgrade3" value="upgrade3">
+                                <label for="upgrade3">Upgrade3</label>
+                            </div>
+                            <div class="chekbox-row">
+                                <input type="checkbox" id="upgrade4" name="upgrade4" value="upgrade4">
+                                <label for="upgrade4">Upgrade4</label>
+                            </div>
+                            <div class="chekbox-row">
+                                <input type="checkbox" id="upgrade5" name="upgrade5" value="upgrade5">
+                                <label for="upgrade5">Upgrade5</label>
+                            </div>
+                        </div>
+                        <div class="cart-add">
+                            <input type="number" id="quantity" name="quantity" min="1" max="5">
+                            <label for="quantity">Quantity</label>
+                            <button class="btn" type="submit">Add to cart</button>
+                        </div>
+                    </form>
+                </div>
+                
+            </aside>
+        </section>
+        <section class="product-demensions">
+            <div class="conteiner-row">
+                <div class="row">
+                    <div class="demension-table">
+                        <p class="product-heading">Demension:</p>
+                        <table class="table__info">
+                        <tr class="table-row">
+                                <th class="table-data">General Demension </th>
+                                <td class="table-data">85cm L x 35cm H x 60cm H </td>
+                        </tr>
+                        <tr class="table-row">
+                                <th class="table-data">Demensions 2</th>
+                                <td class="table-data">85cm  </td>
+                            </tr>
+                            <tr class="table-row">
+                                <th class="table-data">Demensions 3</th>
+                                <td class="table-data">85cm </td>
+                            </tr>
+                        </table>
+                    </div>
+                    <div class="demension-pic">
+                    <img src="/img/index-img/furniture.jpg" alt="demension pic">
+                    </div>
+                </div>
+            </div>
+        </section>
+        <section class="product-advantages">
+                <p class="product-heading">About this piece</p>
+                <p class="description">Lorem ipsum dolor sit amet consectetur adipisicing elit. Quam ipsa officia repudiandae deserunt perspiciatis deleniti odio optio, tenetur blanditiis inventore, aut sequi nemo ut aperiam eligendi tempora eos, magnam asperiores! Itaque eaque iste provident unde sunt sed alias facere? Delectus voluptatibus rem at, quia autem animi maiores fugiat reprehenderit dolores!</p>
+                <div class="conteiner-row">
+                    <div class="description-cards">
+                        <div class="decription-card">
+                            <p class="description-card__heading">Advantage1</p>
+                            <p class="description">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Tenetur laboriosam modi sint voluptas, a animi autem commodi deserunt delectus voluptates amet porro, pariatur hic, dicta dignissimos deleniti doloremque quod. Explicabo qui voluptates aspernatur natus quisquam beatae illum quia non dolor, quis modi fugiat maiores eum. Quae tenetur iusto eligendi unde!</p>
+                        </div>
+                        <div class="decription-card">
+                            <p class="description-card__heading">Advantage1</p>
+                            <p class="description">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Facere temporibus mollitia neque vel repellendus. In eum quae reprehenderit excepturi temporibus, mollitia numquam suscipit, doloremque officiis ex omnis veniam quisquam vel est tenetur accusamus quia, ad qui? Voluptatem facere iusto voluptas? Alias excepturi consequuntur iusto officia laborum repellendus, nisi mollitia omnis.</p>
+                        </div>
+                        <div class="decription-card">
+                            <p class="description-card__heading">Advantage1</p>
+                            <p class="description">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Rerum vitae doloremque ullam illum minima excepturi, quibusdam at facere omnis, exercitationem impedit ipsam necessitatibus nam voluptatibus natus, inventore sapiente nisi quis atque! Dolore quis velit suscipit repudiandae alias ducimus molestiae ullam, fugiat rem dignissimos. Blanditiis nemo dolore aliquid voluptatibus suscipit quia!</p>
+                        </div>
+                    </div>
+                </div>
+        </section>
+        <section class="product-recomendations">
+            <div></div>
+            <p class="product-heading">Here's what else our designers recommend:</p>
+            <div class="conteiner-row">
+                <div class="inline-pic">
+                    <div class="card">
+                        <img src="/img/index-img/furniture.jpg" alt="furniture pic" class="card-img">
+                        <h4 class="card__heading">Item1</h4>
+                        <p class="card__description">Lorem ipsum dolor sit amet.</p>
+                        <p class="price__regular">122$</p>
+                    </div>
+                    <div class="card">
+                        <img src="/img/index-img/furniture.jpg" alt="furniture pic" class="card-img">
+                        <h4 class="card__heading">Item1</h4>
+                        <p class="card__description">Lorem ipsum dolor sit amet.</p>
+                        <p class="price__regular">122$</p>
+                    </div>
+                    <div class="card">
+                        <img src="/img/index-img/furniture.jpg" alt="furniture pic" class="card-img">
+                        <h4 class="card__heading">Item1</h4>
+                        <p class="card__description">Lorem ipsum dolor sit amet.</p>
+                        <p class="price__regular">122$</p>
+                    </div>
+                    <div class="card">
+                        <img src="/img/index-img/furniture.jpg" alt="furniture pic" class="card-img">
+                        <h4 class="card__heading">Item1</h4>
+                        <p class="card__description">Lorem ipsum dolor sit amet.</p>
+                        <p class="price__regular">122$</p>
+                    </div>
+                </div>
+        </div>
+         </section>
+    </main>
+    <!-- main section ends here  -->
+
+<!-- footer starts here  -->
+    <footer id="main-footer">
+        <div class="nav-left">
+            <ul class="list-elements">
+                <li class="list__item"><a href="#main-nav"><i class="fa-solid fa-house list__icon"></i> Home</a></li>
+                <li class="list__item"><p class="copywright">Designed by Eugene &copy; Copyright 2023</p></li>
+            </ul>
+        </div>
+
+
+        <div class="nav-right">
+            <ul class="list-elements">
+                <li class="list__item"><a class="nav-link" href="#"><i class="fa-brands fa-facebook list__icon"></i> FB</a></li>
+                <li class="list__item"><a class="nav-link" href="#"><i class="fa-brands fa-youtube list__icon"></i> Youtube</a></li>
+                <li class="list__item"><a class="nav-link" href="#"><i class="fa-brands fa-square-instagram list__icon"></i> Insta</a></li>
+            </ul>
+        </div>
+</footer>
+<!-- footer ends here -->
+</body>
+</html>
\ No newline at end of file
diff --git a/README.md b/README.md
index 2d98fa1..34d0499 100644
--- a/README.md
+++ b/README.md
@@ -10,4 +10,5 @@
    - make sure the website is 100% accessibile (2 point)
    - make sure the website is 100% responsive (2 points)
    - Your creativity and additional functionality to the project will help you to get extra 1 point
-  
+   - deployed link - https://profound-arithmetic-3dcd1e.netlify.app
+
diff --git a/img/index-img/accessories.jpg b/img/index-img/accessories.jpg
new file mode 100644
index 0000000..b6a7f2d
Binary files /dev/null and b/img/index-img/accessories.jpg differ
diff --git a/img/index-img/furniture.jpg b/img/index-img/furniture.jpg
new file mode 100644
index 0000000..dc0440b
Binary files /dev/null and b/img/index-img/furniture.jpg differ
diff --git a/img/index-img/logo.png b/img/index-img/logo.png
new file mode 100644
index 0000000..5b55b18
Binary files /dev/null and b/img/index-img/logo.png differ
diff --git a/img/index-img/main-banner.jpg b/img/index-img/main-banner.jpg
new file mode 100644
index 0000000..7add9e5
Binary files /dev/null and b/img/index-img/main-banner.jpg differ
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..bce994f
--- /dev/null
+++ b/index.html
@@ -0,0 +1,291 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Casavile Furniture & Accessories</title>
+    <link rel="stylesheet" href="/CSS/style.css">
+
+    <!-- icon link starts here  -->
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css" integrity="sha512-MV7K8+y+gLIBoVD59lQIYicR65iaqukzvf/nwasF0nqhPay5w/9lJmVM2hMDcnK1OnMGCdVK+iQrJ7lzPJQd1w==" crossorigin="anonymous" referrerpolicy="no-referrer" />
+
+    <!-- font link starts here  -->
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Rajdhani:wght@300;400;500;600;700&display=swap" rel="stylesheet">
+
+</head>
+<body>
+    <!-- nav dection starts here  -->
+    <nav id="main-nav">
+        <div class="nav-bar">
+            <div class="nav-left">
+                <ul class="list-elements">
+                    <li class="list__item"><img class="logo" src="/img/index-img/logo.png" alt="logo"></li>
+                    <li class="list__item"><a class="nav-link" href="#Furniture">Furniture</a></li>
+                    <li class="list__item"><a class="nav-link" href="#Acceccories">Accessories</a></li>
+                </ul>
+            </div>
+
+            <div class="nav-midle">
+                <form class="serch-bar">                
+                    <label for="serch"></label>
+                    <input id="serch" class="serch" type="text" placeholder="Let's rock...">
+                    <button type="submit"><i class="fa-solid fa-magnifying-glass serch-icon"></i></button>
+                </form>
+            </div>
+
+            <div class="nav-right">
+                <ul class="list-elements">
+                    <li class="list__item"><a class="nav-link" href="/Pages/login.html" target="_blank"><i class="fa-solid fa-user list__icon"></i> Login</a></li>
+                    <li class="list__item"><a class="nav-link" href="#main-footer"><i class="fa-solid fa-address-card list__icon"></i> Contacts</a></li>
+                    <li class="list__item"><a class="nav-link" href="/Pages/cart.html" target="_blank"><i class="fa-solid fa-cart-shopping list__icon"></i> Cart</a></li>
+                </ul>
+            </div>
+        </div>
+    </nav>
+    <!-- nav section ends here  -->
+
+    <!-- Header section starts here -->
+    <header id="header">
+        <div class="banner-noimg">
+            <h1 class="main-heading">Casavile shop</h1>
+            <p class="description">Shop for homeware</p>
+        </div>
+
+        <div class="banner-img">
+            <div class="banner-description">
+                <h2 class="banner-heading">Lorem, ipsum.</h2>
+                <p class="description">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Aperiam, commodi!</p>
+            </div>
+        </div>
+    </header>
+    <!-- header section ends here  -->
+
+    <!-- main section starts here  -->
+    <main>
+        <div class="banner-noimg">
+            <h2 class="banner-heading">Lorem, ipsum.</h2>
+            <p class="description">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Aperiam, commodi!</p>
+        </div>
+
+        <div class="goods-banners">
+            <div class="conteiner-row">
+                <div class="goods-banner">
+                    <a href="#Furniture"><img src="/img/index-img/furniture.jpg" alt="accessories img"></a>
+                    <h2 class="banner-heading group__dsc">Furniture</h2>
+                </div>
+                <div class="goods-banner">
+                    <a href="#Acceccories"><img src="/img/index-img/accessories.jpg" alt="accessories img"></a>
+                    <h2 class="banner-heading group__dsc">Accessories</h2>
+                </div>
+            </div>
+
+        </div>
+
+        <section id="Furniture" class="shop-items">
+                <h3 class="section-heading">Furniture</h3>
+                <div class="container">
+                    <div class="items-list">
+                        <div class="card">
+                            <a href="/Pages/product.html" target="_blank"><img src="/img/index-img/furniture.jpg" alt="furniture pic" class="card-img"></a>
+                            <h4 class="card__heading">Item1</h4>
+                            <p class="card__description">Lorem ipsum dolor sit amet.</p>
+                            <div class="card__price">
+                                <p class="price__regular">122$</p>
+                                <p class="price__reduced">1555$</p>
+                            </div>
+                            <p class="card__price"></p>
+                            <button class="card__button">Buy</button>
+                        </div>
+
+                        <div class="card">
+                            <a href="/Pages/product.html" target="_blank"><img src="/img/index-img/furniture.jpg" alt="furniture pic" class="card-img"></a>
+                            <h4 class="card__heading">Item1</h4>
+                            <p class="card__description">Lorem ipsum dolor sit amet.</p>
+                            <div class="card__price">
+                                <p class="price__regular">122$</p>
+                                <p class="price__reduced">1555$</p>
+                            </div>
+                            <p class="card__price"></p>
+                            <button class="card__button">Buy</button>
+                        </div>
+
+                        <div class="card">
+                            <a href="/Pages/product.html" target="_blank"><img src="/img/index-img/furniture.jpg" alt="furniture pic" class="card-img"></a>
+                            <h4 class="card__heading">Item1</h4>
+                            <p class="card__description">Lorem ipsum dolor sit amet.</p>
+                            <div class="card__price">
+                                <p class="price__regular">122$</p>
+                                <p class="price__reduced">1555$</p>
+                            </div>
+                            <p class="card__price"></p>
+                            <button class="card__button">Buy</button>
+                        </div>
+
+                        <div class="card">
+                            <a href="/Pages/product.html"><img src="/img/index-img/furniture.jpg" alt="furniture pic" class="card-img"></a>
+                            <h4 class="card__heading" target="_blank">Item1</h4>
+                            <p class="card__description">Lorem ipsum dolor sit amet.</p>
+                            <div class="card__price">
+                                <p class="price__regular">122$</p>
+                                <p class="price__reduced">1555$</p>
+                            </div>
+                            <p class="card__price"></p>
+                            <button class="card__button">Buy</button>
+                        </div>
+
+                        <div class="card">
+                            <a href="/Pages/product.html" target="_blank"><img src="/img/index-img/furniture.jpg" alt="furniture pic" class="card-img"></a>
+                            <h4 class="card__heading">Item1</h4>
+                            <p class="card__description">Lorem ipsum dolor sit amet.</p>
+                            <div class="card__price">
+                                <p class="price__regular">122$</p>
+                                <p class="price__reduced">1555$</p>
+                            </div>
+                            <p class="card__price"></p>
+                            <button class="card__button">Buy</button>
+                        </div>
+
+                        <div class="card">
+                            <a href="/Pages/product.html" target="_blank"><img src="/img/index-img/furniture.jpg" alt="furniture pic" class="card-img"></a>
+                            <h4 class="card__heading">Item1</h4>
+                            <p class="card__description">Lorem ipsum dolor sit amet.</p>
+                            <div class="card__price">
+                                <p class="price__regular">122$</p>
+                                <p class="price__reduced">1555$</p>
+                            </div>
+                            <p class="card__price"></p>
+                            <button class="card__button">Buy</button>
+                        </div>
+                    </div>
+                </div>
+        </section>
+
+        <section id="Acceccories" class="shop-items">
+            <h3 class="section-heading">Acceccories</h3>
+            <div class="container">
+                <div class="items-list">
+                    <div class="card">
+                        <a href="/Pages/product.html" target="_blank"><img src="/img/index-img/accessories.jpg" alt="furniture pic" class="card-img"></a>
+                        <h4 class="card__heading">Item1</h4>
+                        <p class="card__description">Lorem ipsum dolor sit amet.</p>
+                        <div class="card__price">
+                            <p class="price__regular">122$</p>
+                            <p class="price__reduced">1555$</p>
+                        </div>
+                        <p class="card__price"></p>
+                        <button class="card__button">Buy</button>
+                    </div>
+
+                    <div class="card">
+                        <a href="/Pages/product.html" target="_blank"><img src="/img/index-img/accessories.jpg" alt="furniture pic" class="card-img"></a>
+                        <h4 class="card__heading">Item1</h4>
+                        <p class="card__description">Lorem ipsum dolor sit amet.</p>
+                        <div class="card__price">
+                            <p class="price__regular">122$</p>
+                            <p class="price__reduced">1555$</p>
+                        </div>
+                        <p class="card__price"></p>
+                        <button class="card__button">Buy</button>
+                    </div>
+
+                    <div class="card">
+                        <a href="/Pages/product.html" target="_blank"><img src="/img/index-img/accessories.jpg" alt="furniture pic" class="card-img"></a>
+                        <h4 class="card__heading">Item1</h4>
+                        <p class="card__description">Lorem ipsum dolor sit amet.</p>
+                        <div class="card__price">
+                            <p class="price__regular">122$</p>
+                            <p class="price__reduced">1555$</p>
+                        </div>
+                        <p class="card__price"></p>
+                        <button class="card__button">Buy</button>
+                    </div>
+
+                    <div class="card">
+                        <a href="/Pages/product.html" target="_blank"><img src="/img/index-img/accessories.jpg" alt="furniture pic" class="card-img"></a>
+                        <h4 class="card__heading">Item1</h4>
+                        <p class="card__description">Lorem ipsum dolor sit amet.</p>
+                        <div class="card__price">
+                            <p class="price__regular">122$</p>
+                            <p class="price__reduced">1555$</p>
+                        </div>
+                        <p class="card__price"></p>
+                        <button class="card__button">Buy</button>
+                    </div>
+
+                    <div class="card">
+                        <a href="/Pages/product.html" target="_blank"><img src="/img/index-img/accessories.jpg" alt="furniture pic" class="card-img"></a>
+                        <h4 class="card__heading">Item1</h4>
+                        <p class="card__description">Lorem ipsum dolor sit amet.</p>
+                        <div class="card__price">
+                            <p class="price__regular">122$</p>
+                            <p class="price__reduced">1555$</p>
+                        </div>
+                        <p class="card__price"></p>
+                        <button class="card__button">Buy</button>
+                    </div>
+
+                    <div class="card">
+                        <a href="/Pages/product.html" target="_blank"><img src="/img/index-img/accessories.jpg" alt="furniture pic" class="card-img"></a>
+                        <h4 class="card__heading">Item1</h4>
+                        <p class="card__description">Lorem ipsum dolor sit amet.</p>
+                        <div class="card__price">
+                            <p class="price__regular">122$</p>
+                            <p class="price__reduced">1555$</p>
+                        </div>
+                        <p class="card__price"></p>
+                        <button class="card__button">Buy</button>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <section id="subscription">
+            <div class="banner-noimg">
+                <p class="banner-heading">Subscribe to get best offers</p>
+                <p class="decription">Once a month we will sent you personal offers based on your prefers. Get the best offer first</p>
+                <form class="subscribtion-bar">                
+                    <label for="email"></label>
+                    <input id="email" class="email" type="text" placeholder="Enter your email">
+                    <button type="submit">Stay with us</button>
+                </form>
+            </div>
+         </section>
+
+    </main>
+    <!-- main section ends here  -->
+
+    <!-- footer starts here  -->
+    <footer id="main-footer">
+                <div class="nav-left">
+                    <ul class="list-elements">
+                        <li class="list__item"><a href="#main-nav"><i class="fa-solid fa-house list__icon"></i> Home</a></li>
+                        <li class="list__item"><a class="nav-link" href="#Furniture">Furniture</a></li>
+                        <li class="list__item"><a class="nav-link" href="#Acceccories">Accessories</a></li>
+                    </ul>
+                </div>
+    
+                <div class="nav-midle">
+                    <p class="copywright">Designed by Eugene &copy; Copyright 2023</p>
+                </div>
+    
+                <div class="nav-right">
+                    <ul class="list-elements">
+                        <li class="list__item"><a class="nav-link" href="#"><i class="fa-brands fa-facebook list__icon"></i> FB</a></li>
+                        <li class="list__item"><a class="nav-link" href="#"><i class="fa-brands fa-youtube list__icon"></i> Youtube</a></li>
+                        <li class="list__item"><a class="nav-link" href="#"><i class="fa-brands fa-square-instagram list__icon"></i> Insta</a></li>
+                    </ul>
+                </div>
+    </footer>
+    <!-- footer ends here -->
+    <div class="button-box">
+        <div class="puls">
+            <div class="phone">
+                <i class="fa-solid fa-phone"></i>
+            </div>
+        </div>
+    </div>
+</body>
+</html>
\ No newline at end of file