diff --git a/ecommerce/flora_website/shop.html b/ecommerce/flora_website/shop.html
new file mode 100644
index 0000000..569342a
--- /dev/null
+++ b/ecommerce/flora_website/shop.html
@@ -0,0 +1,278 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Flora-Flower For You</title>
+    <link rel="stylesheet" href="style.css">
+    <link rel="stylesheet" href="style_blog.css">
+    <link rel="stylesheet" href="style_shop.css">
+    <link rel="shortcut icon" href="images/title.png">
+    <link href='https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css' rel='stylesheet'>
+    <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=Klee+One:wght@400;600&family=Montserrat:wght@300;400;500;600;700;800;900&family=Norican&display=swap" rel="stylesheet">    
+</head>
+<body>
+    <header>
+        <div class="nav container">
+            <a href="index.html" class="logo">
+                <img src="images/logo1.png" alt="" class="logo-img">
+            </a>
+            <div class="search-box">
+                <input type="search" name="" id="search-input" placeholder="Search">
+                <i class='bx bx-search'></i>
+            </div>
+            <div class="navbar">
+                <a href="index.html" class="nav-link">
+                    <i class='bx bxs-home'></i>
+                    <span class="nav-link-title">HOME</span>
+                </a>
+                <a href="" class="nav-link nav-active">
+                    <i class='bx bx-basket'></i>
+                    <span class="nav-link-title">Shop</span>
+                </a>
+                <a href="blog.html" class="nav-link">
+                    <i class='bx bx-book-bookmark' ></i>
+                    <span class="nav-link-title">Blog</span>
+                </a>
+                <a href="about.html" class="nav-link">
+                    <i class='bx bxs-florist'></i>
+                    <span class="nav-link-title">About Us</span>
+                </a>
+                <a href="contact.html" class="nav-link">
+                    <i class='bx bx-phone-call'></i>
+                    <span class="nav-link-title">Contact</span>
+                </a>
+            </div>
+        </div>
+    </header>
+
+    <section id="shop">
+        <!--set1-->
+        <div class="blog-heading">
+            <h1>Graduation</h1>
+        </div>
+        <div class="new-content">
+            <!--flower1-->
+            <div class="row">
+                <img src="images/sg1.jpg">
+                <h4>###</h4>
+                <h5>$$$</h5>
+                <div class="top">
+                    <p><i class='bx bxs-hot' ></i>hot</p>
+                </div>
+                <div class="flower-btn">
+                    <br><a href="#">Add to cart</a>
+                </div>
+            </div>
+            <!--flower2-->
+            <div class="row">
+                <img src="images/sg2.jpg">
+                <h4>###</h4>
+                <h5>$$$</h5>
+                <div class="top">
+                    <p><i class='bx bxs-hot' ></i>hot</p>
+                </div>
+                <div class="flower-btn">
+                    <br><a href="#">Add to cart</a>
+                </div>
+            </div>
+            <!--flower3-->
+            <div class="row">
+                <img src="images/sg3.jpg">
+                <h4>###</h4>
+                <h5>$$$</h5>
+                <div class="top">
+                    <p><i class='bx bxs-hot' ></i>hot</p>
+                </div>
+                <div class="flower-btn">
+                    <br><a href="#">Add to cart</a>
+                </div>
+            </div>
+            <!--flower4-->
+            <div class="row">
+                <img src="images/sg4.jpg">
+                <h4>###</h4>
+                <h5>$$$</h5>
+                <div class="top">
+                    <p><i class='bx bxs-hot' ></i>hot</p>
+                </div>
+                <div class="flower-btn">
+                    <br><a href="#">Add to cart</a>
+                </div>
+            </div>
+        </div>
+        <!--set2-->
+        <div class="blog-heading">
+            <h1>Wedding</h1>
+        </div>
+        <div class="new-content">
+            <!--flower1-->
+            <div class="row">
+                <img src="images/sw1.jpg">
+                <h4>###</h4>
+                <h5>$$$</h5>
+                <div class="top">
+                    <p><i class='bx bxs-hot' ></i>hot</p>
+                </div>
+                <div class="flower-btn">
+                    <br><a href="#">Add to cart</a>
+                </div>
+            </div>
+            <!--flower2-->
+            <div class="row">
+                <img src="images/sw2.jpg">
+                <h4>###</h4>
+                <h5>$$$</h5>
+                <div class="top">
+                    <p><i class='bx bxs-hot' ></i>hot</p>
+                </div>
+                <div class="flower-btn">
+                    <br><a href="#">Add to cart</a>
+                </div>
+            </div>
+            <!--flower3-->
+            <div class="row">
+                <img src="images/sw3.jpg">
+                <h4>###</h4>
+                <h5>$$$</h5>
+                <div class="top">
+                    <p><i class='bx bxs-hot' ></i>hot</p>
+                </div>
+                <div class="flower-btn">
+                    <br><a href="#">Add to cart</a>
+                </div>
+            </div>
+            <!--flower4-->
+            <div class="row">
+                <img src="images/sw4.jpg">
+                <h4>###</h4>
+                <h5>$$$</h5>
+                <div class="top">
+                    <p><i class='bx bxs-hot' ></i>hot</p>
+                </div>
+                <div class="flower-btn">
+                    <br><a href="#">Add to cart</a>
+                </div>
+            </div>
+        </div>
+         <!--set3-->
+         <div class="blog-heading">
+            <h1>Memorial Day</h1>
+        </div>
+        <div class="new-content">
+            <!--flower1-->
+            <div class="row">
+                <img src="images/sm2.jpg">
+                <h4>###</h4>
+                <h5>$$$</h5>
+                <div class="top">
+                    <p><i class='bx bxs-hot' ></i>hot</p>
+                </div>
+                <div class="flower-btn">
+                    <br><a href="#">Add to cart</a>
+                </div>
+            </div>
+            <!--flower2-->
+            <div class="row">
+                <img src="images/sm3.jpg">
+                <h4>###</h4>
+                <h5>$$$</h5>
+                <div class="top">
+                    <p><i class='bx bxs-hot' ></i>hot</p>
+                </div>
+                <div class="flower-btn">
+                    <br><a href="#">Add to cart</a>
+                </div>
+            </div>
+            <!--flower3-->
+            <div class="row">
+                <img src="images/sm4.jpg">
+                <h4>###</h4>
+                <h5>$$$</h5>
+                <div class="top">
+                    <p><i class='bx bxs-hot' ></i>hot</p>
+                </div>
+                <div class="flower-btn">
+                    <br><a href="#">Add to cart</a>
+                </div>
+            </div>
+            <!--flower4-->
+            <div class="row">
+                <img src="images/sm1.jpg">
+                <h4>###</h4>
+                <h5>$$$</h5>
+                <div class="top">
+                    <p><i class='bx bxs-hot' ></i>hot</p>
+                </div>
+                <div class="flower-btn">
+                    <br><a href="#">Add to cart</a>
+                </div>
+            </div>
+        </div>
+         <!--set4-->
+         <div class="blog-heading">
+            <h1>Birthday</h1>
+        </div>
+        <div class="new-content">
+            <!--flower1-->
+            <div class="row">
+                <img src="images/sb1.jpg">
+                <h4>###</h4>
+                <h5>$$$</h5>
+                <div class="top">
+                    <p><i class='bx bxs-hot' ></i>hot</p>
+                </div>
+                <div class="flower-btn">
+                    <br><a href="#">Add to cart</a>
+                </div>
+            </div>
+            <!--flower2-->
+            <div class="row">
+                <img src="images/sb2.jpg">
+                <h4>###</h4>
+                <h5>$$$</h5>
+                <div class="top">
+                    <p><i class='bx bxs-hot' ></i>hot</p>
+                </div>
+                <div class="flower-btn">
+                    <br><a href="#">Add to cart</a>
+                </div>
+            </div>
+            <!--flower3-->
+            <div class="row">
+                <img src="images/sb3.jpg">
+                <h4>###</h4>
+                <h5>$$$</h5>
+                <div class="top">
+                    <p><i class='bx bxs-hot' ></i>hot</p>
+                </div>
+                <div class="flower-btn">
+                    <br><a href="#">Add to cart</a>
+                </div>
+            </div>
+            
+            <!--flower4-->
+            <div class="row">
+                <img src="images/sb4.jpg">
+                <h4>###</h4>
+                <h5>$35.49</h5>
+                <div class="top">
+                    <p><i class='bx bxs-hot' ></i>hot</p>
+                </div>
+                <div class="flower-btn">
+                    <br><a href="#">Add to cart</a>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <a href="#" class="scroll-top"><i class='bx bxs-chevrons-up'></i></a>
+
+    <div class="end-text">
+        <p>&#169; Flora All Rights Reserved </p>
+    </div>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/ecommerce/flora_website/style_shop.css b/ecommerce/flora_website/style_shop.css
new file mode 100644
index 0000000..8849225
--- /dev/null
+++ b/ecommerce/flora_website/style_shop.css
@@ -0,0 +1,8 @@
+#shop{
+    margin-top: 5%;
+    text-align: center;
+}
+#shop .blog-heading h1{
+    margin-top: 8%;
+}
+
