├── .gitignore
├── images
    ├── 1.jpg
    ├── 2.jpg
    ├── 3.jpg
    ├── 4.jpg
    ├── 5.jpg
    ├── 6.jpg
    ├── 7.jpg
    ├── 8.jpg
    ├── banner.png
    ├── bl-1.png
    ├── bl-2.png
    ├── bl-3.png
    ├── logo.png
    ├── team-1.jpg
    └── banner-3.png
├── README.md
├── java.js
├── style.css
└── index.html


/.gitignore:
--------------------------------------------------------------------------------
1 | images/Minash (1).jpg
2 | 


--------------------------------------------------------------------------------
/images/1.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/amminash/Ecommerce-Website-master/HEAD/images/1.jpg


--------------------------------------------------------------------------------
/images/2.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/amminash/Ecommerce-Website-master/HEAD/images/2.jpg


--------------------------------------------------------------------------------
/images/3.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/amminash/Ecommerce-Website-master/HEAD/images/3.jpg


--------------------------------------------------------------------------------
/images/4.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/amminash/Ecommerce-Website-master/HEAD/images/4.jpg


--------------------------------------------------------------------------------
/images/5.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/amminash/Ecommerce-Website-master/HEAD/images/5.jpg


--------------------------------------------------------------------------------
/images/6.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/amminash/Ecommerce-Website-master/HEAD/images/6.jpg


--------------------------------------------------------------------------------
/images/7.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/amminash/Ecommerce-Website-master/HEAD/images/7.jpg


--------------------------------------------------------------------------------
/images/8.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/amminash/Ecommerce-Website-master/HEAD/images/8.jpg


--------------------------------------------------------------------------------
/images/banner.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/amminash/Ecommerce-Website-master/HEAD/images/banner.png


--------------------------------------------------------------------------------
/images/bl-1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/amminash/Ecommerce-Website-master/HEAD/images/bl-1.png


--------------------------------------------------------------------------------
/images/bl-2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/amminash/Ecommerce-Website-master/HEAD/images/bl-2.png


--------------------------------------------------------------------------------
/images/bl-3.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/amminash/Ecommerce-Website-master/HEAD/images/bl-3.png


--------------------------------------------------------------------------------
/images/logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/amminash/Ecommerce-Website-master/HEAD/images/logo.png


--------------------------------------------------------------------------------
/images/team-1.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/amminash/Ecommerce-Website-master/HEAD/images/team-1.jpg


--------------------------------------------------------------------------------
/images/banner-3.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/amminash/Ecommerce-Website-master/HEAD/images/banner-3.png


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # Ecommerce-Website-master
2 | Simple E-commerce website using HTML, CSS and JAVASCRIPT
3 | 
4 | ## UI
5 | ![image](https://user-images.githubusercontent.com/105323431/215714209-efbf84ee-6c84-42d0-8108-d413f2a0dd4a.png)
6 | 


--------------------------------------------------------------------------------
/java.js:
--------------------------------------------------------------------------------
 1 | const header = document.querySelector("header");
 2 | 
 3 | window.addEventListener ("scroll", function(){
 4 |     header.classList.toggle ("sticky", this.window.scrollY > 0);
 5 | })
 6 | 
 7 | let menu = document.querySelector('#menu-icon');
 8 | let navmenu = document.querySelector('.navmenu');
 9 | 
10 | menu.onclick = () => {
11 |     menu.classList.toggle('bx-x');
12 |     navmenu.classList.toggle('open');
13 | }
14 | 
15 | 


--------------------------------------------------------------------------------
/style.css:
--------------------------------------------------------------------------------
  1 | *{
  2 |     margin: 0;
  3 |     padding: 0;
  4 |     box-sizing: border-box;
  5 |     scroll-behavior: smooth;
  6 |     font-family: 'Jost', sans-serif;
  7 |     list-style: none;
  8 |     text-decoration: none;
  9 | }
 10 | 
 11 | header{
 12 |     position: fixed;
 13 |     width: 100%;
 14 |     top: 0;
 15 |     right: 0;
 16 |     z-index: 1000;
 17 |     display: flex;
 18 |     align-items: center;
 19 |     justify-content: space-between;
 20 |     padding: 20px 10%;
 21 | }
 22 | 
 23 | .logo img{
 24 |     max-width: 120px;
 25 |     height: auto;
 26 | }
 27 | 
 28 | .navmenu{
 29 |     display: flex;
 30 | }
 31 | 
 32 | .navmenu a{
 33 |     color: #2c2c2c;
 34 |     font-size: 16px;
 35 |     padding: 10px 20px;
 36 |     font-weight: 400;
 37 |     transition: all .42s ease;
 38 | }
 39 | 
 40 | .navmenu a:hover{
 41 |     color: #ee1c47;
 42 | }
 43 | 
 44 | .nav-icon{
 45 |     display: flex;
 46 |     align-items: center;
 47 | }
 48 | 
 49 | .nav-icon i{
 50 |     margin-right: 20px;
 51 |     color: #2c2c2c;
 52 |     font-size: 25px;
 53 |     font-weight: 400;
 54 |     transition: all .42s ease;
 55 | }
 56 | 
 57 | .nav-icon i:hover{
 58 |     transform: scale(1,1);
 59 |     color: #ee1c47;
 60 | }
 61 | 
 62 | #menu-icon{
 63 |     font-size: 35px;
 64 |     color: #2c2c2c;
 65 |     z-index: 10001;
 66 |     cursor: pointer;
 67 | }
 68 | 
 69 | section{
 70 |     padding: 5px 10%;
 71 | }
 72 | 
 73 | .main-home{
 74 |     width: 100%;
 75 |     height: 100vh;
 76 |     background-image: url(./images/banner.png);
 77 |     background-position: center;
 78 |     background-size: cover;
 79 |     display: grid;
 80 |     grid-template-columns: repeat(1, 1fr);
 81 |     align-items: center;
 82 | }
 83 | 
 84 | .main-text h5{
 85 |     color: #ee1c47;
 86 |     font-size: 16px;
 87 |     text-transform: capitalize;
 88 |     font-weight: 500;
 89 | }
 90 | 
 91 | .main-text h1{
 92 |     color: #000;
 93 |     font-size: 65px;
 94 |     text-transform: capitalize;
 95 |     line-height: 1.1;
 96 |     font-weight: 600;
 97 |     margin: 6px 0 10px;
 98 | }
 99 | 
100 | .main-text p{
101 |     color: #333c56;
102 |     font-size: 20px;
103 |     font-style: italic;
104 |     margin-bottom: 20px;
105 | }
106 | 
107 | .main-btn{
108 |     display: inline-block;
109 |     color: #111;
110 |     font-size: 16px;
111 |     font-weight: 500;
112 |     text-transform: capitalize;
113 |     border: 2px solid #111;
114 |     padding: 12px 25px;
115 |     transition: all .42s ease;
116 | }
117 | 
118 | .main-btn:hover{
119 |     background-color: #000;
120 |     color: #fff;
121 | }
122 | 
123 | .main-btn i{
124 |     vertical-align: middle;
125 | }
126 | 
127 | .down-arrow{
128 |     position: absolute;
129 |     top: 85%;
130 |     right: 11%;
131 | }
132 | 
133 | .down i{
134 |     font-size: 30px;
135 |     color: #2c2c2c;
136 |     border: 2px solid #2c2c2c;
137 |     border-radius: 50px;
138 |     padding: 12px 12px;
139 | }
140 | 
141 | .down i:hover{
142 |     background-color: #2c2c2c;
143 |     color: #fff;
144 |     transition: all .42s ease;
145 | }
146 | 
147 | header.sticky{
148 |     background: #fff;
149 |     padding: 20px 10%;
150 |     box-shadow: 0px 0px 10px rgb(0 0 0 / 10%);
151 | }
152 | 
153 | /* trending-section-css */
154 | .center-text h2{
155 |     color: #111;
156 |     font-size: 28px;
157 |     text-transform: capitalize;
158 |     text-align: center;
159 |     margin-bottom: 30px;
160 | }
161 | 
162 | .center-text span{
163 |     color: #ee1c47;
164 | }
165 | 
166 | .products{
167 |     display: grid;
168 |     grid-template-columns: auto auto auto auto;
169 |     gap: 2rem;
170 | }
171 | 
172 | /* mobile view */
173 | @media only screen and (max-width: 600px) {
174 |     .products{
175 |         display: grid;
176 |         grid-template-columns: auto auto;
177 |         gap: 2rem;
178 |     }
179 |   }
180 | 
181 | .row{
182 |     position: relative;
183 |     transition: all .40s;
184 | }
185 | 
186 | .row img{
187 |     width: 100%;
188 |     height: auto;
189 |     transition: all .40s;
190 | }
191 | 
192 | .row img:hover{
193 |     transform: scale(0.9);
194 | }
195 | 
196 | .product-text h5{
197 |     position: absolute;
198 |     top: 13px;
199 |     left: 13px;
200 |     color: #fff;
201 |     font-size: 12px;
202 |     font-weight: 500;
203 |     text-transform: uppercase;
204 |     background-color: #27b737;
205 |     padding: 3px 10px;
206 |     border-radius: 2px;
207 | }
208 | 
209 | .heart-icon{
210 |     position: absolute;
211 |     right: 0;
212 |     font-size: 20px;
213 | }
214 | 
215 | .heart-icon:hover{
216 |     color: #ee1c47;
217 | }
218 | 
219 | .rating i{
220 |     color: #ff8c00;
221 |     font-size: 18px;
222 | }
223 | 
224 | .price h4{
225 |     color: #111;
226 |     font-size: 16px;
227 |     text-transform: capitalize;
228 |     font-weight: 400;
229 | }
230 | 
231 | .price p{
232 |     color: #151515;
233 |     font-size: 14px;
234 |     font-weight: 600;
235 | }
236 | 
237 | .client-reviews{
238 |     background-color: #f3f4f6;
239 | }
240 | 
241 | .reviews{
242 |     text-align: center;
243 | }
244 | 
245 | .reviews h3{
246 |     color: #111;
247 |     font-size: 25px;
248 |     text-transform: capitalize;
249 |     text-align: center;
250 |     font-weight: 700;
251 | }
252 | 
253 | .reviews img{
254 |     width: 100px;
255 |     height: auto;
256 |     border-radius: 50px;
257 |     margin: 10px 0;
258 | }
259 | 
260 | .reviews p{
261 |     color: #707070;
262 |     font-size: 16px;
263 |     font-weight: 400;
264 |     line-height: 25px;
265 |     margin-bottom: 10px;
266 | }
267 | 
268 | .reviews h2{
269 |     font-size: 22px;
270 |     color: #000;
271 |     font-weight: 400;
272 |     text-transform: capitalize;
273 |     margin-bottom: 2px;
274 | }
275 | /* updare-section-css */
276 | .up-center-text h2{
277 |     text-align: center;
278 |     color: #111;
279 |     font-size: 25px;
280 |     text-transform: capitalize;
281 |     font-weight: 700;
282 |     margin-bottom: 30px;
283 | }
284 | 
285 | .cart img{
286 |     width: 380px;
287 |     height: auto;
288 |     border-radius: 5px;
289 | }
290 | 
291 | .update-cart{
292 |     display: grid;
293 |     grid-template-columns: auto auto auto;
294 |     gap: 2rem;
295 |     padding: 15px auto;
296 | }
297 | 
298 | .cart h5{
299 |    color: #636872;
300 |    font-size: 15px;
301 |    text-transform: capitalize;
302 |    font-weight: 500;
303 | }
304 | 
305 | .cart h4{
306 |     color: #111;
307 |     font-size: 17px;
308 |     font-weight: 600;
309 | }
310 | 
311 | .cart p{
312 |     color: #111;
313 |     font-size: 15px;
314 |     max-width: 380px;
315 |     line-height: 25px;
316 |     margin-bottom: 12px;
317 | }
318 | 
319 | .cart h6{
320 |     color:#151515;
321 |     font-size: 13px;
322 |     font-weight: 500;
323 | }
324 | 
325 | /* contact-section */
326 | .contact{
327 |     background-color: #f3f4f6;
328 | }
329 | 
330 | .contact-info{
331 |     margin: 30px auto;
332 |     display: grid;
333 |     grid-template-columns: auto auto auto auto auto;
334 |     gap: 3rem;
335 | }
336 | 
337 | .first-info img{
338 |     width: 140px;
339 |     height: auto;
340 | }
341 | 
342 | .contact-info h4{
343 |     color: #212529;
344 |     font-size: 13px;
345 |     text-transform: uppercase;
346 |     margin-bottom: 10px;
347 | }
348 | 
349 | .contact-info p{
350 |     color: #565656;
351 |     font-size: 14px;
352 |     font-weight: 400;
353 |     line-height: 1.5;
354 |     margin-bottom: 10px;
355 |     cursor: pointer;
356 |     transition: all .42s;
357 | }
358 | 
359 | .contact-info p:hover{
360 |     color: #ee1c47;    
361 | }
362 | 
363 | .social-icon i{
364 |     color: #565656;
365 |     margin-right: 10px;
366 |     font-size: 20px;
367 |     transition: all .42s;
368 | }
369 | 
370 | .social-icon i:hover{
371 |     transform: scale(1.3);
372 | }
373 | 
374 | .end-text{
375 |     background-color: #edfff1;
376 |     text-align: center;
377 |     padding: 20px;
378 | }
379 | 
380 | .end-text p{
381 |     color: #111;
382 |     text-transform: capitalize;
383 | }
384 | 
385 | /* Responsive-css */
386 | @media(max-width:890px){
387 |     header{
388 |         padding: 20px 3%;
389 |         transition: .4s;
390 |     }
391 | }
392 | 
393 | @media(max-width:630px){
394 |     .main-text h1{
395 |         font-size: 50px;
396 |         transition: .4s;
397 |     }
398 |     .main-text p{
399 |         font-size: 18px;
400 |         transition: .4s;
401 |     }
402 |     .main-btn{
403 |         padding: 10px 20px;
404 |         transition: .4s;
405 |     }
406 | }
407 | 
408 | @media(max-width:750px){
409 |     .navmenu{
410 |         position: absolute;
411 |         top: 100%;
412 |         right: -100%;
413 |         width: 300px;
414 |         height: 130vh;
415 |         background: #edfff1;
416 |         display: flex;
417 |         flex-direction: column;
418 |         align-items: center;
419 |         padding: 120px 30px;
420 |         transition: all .42s;
421 |     }
422 |     .navmenu a{
423 |         display: block;
424 |         margin: 18px 0;
425 |     }
426 |     .navmenu.open{
427 |         right: 0;
428 |     }
429 | }
430 | 
431 | 


--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
  1 | <!DOCTYPE html>
  2 | <html lang="en">
  3 |   <head>
  4 |     <meta charset="UTF-8" />
  5 |     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  6 |     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  7 |     <title>Ecommerce Responsive full Website</title>
  8 |     <link rel="stylesheet" href="style.css" />
  9 | 
 10 |     <link rel="preconnect" href="https://fonts.googleapis.com" />
 11 |     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
 12 |     <link
 13 |       href="https://fonts.googleapis.com/css2?family=Jost:wght@100;200;300;400;500;600;700&display=swap"
 14 |       rel="stylesheet"
 15 |     />
 16 | 
 17 |     <link
 18 |       rel="stylesheet"
 19 |       href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css"
 20 |       integrity="sha512-MV7K8+y+gLIBoVD59lQIYicR65iaqukzvf/nwasF0nqhPay5w/9lJmVM2hMDcnK1OnMGCdVK+iQrJ7lzPJQd1w=="
 21 |       crossorigin="anonymous"
 22 |       referrerpolicy="no-referrer"
 23 |     />
 24 | 
 25 |     <link
 26 |       rel="stylesheet"
 27 |       href="https://unpkg.com/boxicons@latest/css/boxicons.min.css"
 28 |     />
 29 |   </head>
 30 |   <body>
 31 |     <header>
 32 |       <a href="#" class="logo"><img src="./images/logo.png" alt="" /></a>
 33 |       <ul class="navmenu">
 34 |         <li><a href="#">Home</a></li>
 35 |         <li><a href="#">Shop</a></li>
 36 |         <li><a href="#">Products</a></li>
 37 |         <li><a href="#">Page</a></li>
 38 |         <li><a href="#">Docs</a></li>
 39 |       </ul>
 40 | 
 41 |       <div class="nav-icon">
 42 |         <a href="#"><i class="bx bx-search"></i></a>
 43 |         <a href="#"><i class="bx bx-user"></i></a>
 44 |         <a href="#"><i class="bx bx-cart"></i></a>
 45 | 
 46 |         <div class="bx bx-menu" id="menu-icon"></div>
 47 |       </div>
 48 |     </header>
 49 | 
 50 |     <section class="main-home">
 51 |       <div class="main-text">
 52 |         <h5>Winter Collection</h5>
 53 |         <h1>New Winter <br />Collection</h1>
 54 |         <p>There's Nothing like Trend</p>
 55 | 
 56 |         <a href="#" class="main-btn"
 57 |           >Shop Now<i class="bx bx-right-arrow-alt"></i
 58 |         ></a>
 59 |       </div>
 60 |       <div class="down-arrow">
 61 |         <a href="#trending" class="down"
 62 |           ><i class="bx bx-down-arrow-alt"></i
 63 |         ></a>
 64 |       </div>
 65 |     </section>
 66 | 
 67 |     <section class="trending-product" id="trending">
 68 |       <div class="center-text">
 69 |         <h2>Our Trending <span>Products</span></h2>
 70 |       </div>
 71 | 
 72 |       <div class="products">
 73 |         <div class="row">
 74 |           <img src="./images/1.jpg" alt="" />
 75 |           <div class="product-text">
 76 |             <h5>Sale</h5>
 77 |           </div>
 78 |           <div class="heart-icon">
 79 |             <i class="bx bx-heart"></i>
 80 |           </div>
 81 |           <div class="rating">
 82 |             <i class="bx bx-star"></i>
 83 |             <i class="bx bx-star"></i>
 84 |             <i class="bx bx-star"></i>
 85 |             <i class="bx bx-star"></i>
 86 |             <i class="bx bxs-star-half"></i>
 87 |           </div>
 88 | 
 89 |           <div class="price">
 90 |             <h4>Half Running Set</h4>
 91 |             <p>$99 - $129</p>
 92 |           </div>
 93 |         </div>
 94 | 
 95 |         <div class="row">
 96 |           <img src="./images/2.jpg" alt="" />
 97 |           <div class="product-text">
 98 |             <h5>New</h5>
 99 |           </div>
100 |           <div class="heart-icon">
101 |             <i class="bx bx-heart"></i>
102 |           </div>
103 |           <div class="rating">
104 |             <i class="bx bx-star"></i>
105 |             <i class="bx bx-star"></i>
106 |             <i class="bx bx-star"></i>
107 |             <i class="bx bx-star"></i>
108 |             <i class="bx bxs-star-half"></i>
109 |           </div>
110 | 
111 |           <div class="price">
112 |             <h4>Formal Men Lowers</h4>
113 |             <p>$99 - $129</p>
114 |           </div>
115 |         </div>
116 | 
117 |         <div class="row">
118 |           <img src="./images/3.jpg" alt="" />
119 | 
120 |           <div class="heart-icon">
121 |             <i class="bx bx-heart"></i>
122 |           </div>
123 |           <div class="rating">
124 |             <i class="bx bx-star"></i>
125 |             <i class="bx bx-star"></i>
126 |             <i class="bx bx-star"></i>
127 |             <i class="bx bx-star"></i>
128 |             <i class="bx bxs-star-half"></i>
129 |           </div>
130 | 
131 |           <div class="price">
132 |             <h4>Half Running Suit</h4>
133 |             <p>$99 - $129</p>
134 |           </div>
135 |         </div>
136 | 
137 |         <div class="row">
138 |           <img src="./images/4.jpg" alt="" />
139 |           <div class="product-text">
140 |             <h5>Hot</h5>
141 |           </div>
142 |           <div class="heart-icon">
143 |             <i class="bx bx-heart"></i>
144 |           </div>
145 |           <div class="rating">
146 |             <i class="bx bx-star"></i>
147 |             <i class="bx bx-star"></i>
148 |             <i class="bx bx-star"></i>
149 |             <i class="bx bx-star"></i>
150 |             <i class="bx bxs-star-half"></i>
151 |           </div>
152 | 
153 |           <div class="price">
154 |             <h4>Half Fancy Lady Dress</h4>
155 |             <p>$99 - $129</p>
156 |           </div>
157 |         </div>
158 | 
159 |         <div class="row">
160 |           <img src="./images/5.jpg" alt="" />
161 |           
162 |           <div class="heart-icon">
163 |             <i class="bx bx-heart"></i>
164 |           </div>
165 |           <div class="rating">
166 |             <i class="bx bx-star"></i>
167 |             <i class="bx bx-star"></i>
168 |             <i class="bx bx-star"></i>
169 |             <i class="bx bx-star"></i>
170 |             <i class="bx bxs-star-half"></i>
171 |           </div>
172 | 
173 |           <div class="price">
174 |             <h4>Flix Flox Jeans</h4>
175 |             <p>$99 - $129</p>
176 |           </div>
177 |         </div>
178 | 
179 |         <div class="row">
180 |           <img src="./images/6.jpg" alt="" />
181 |           <div class="product-text">
182 |             <h5>Hot</h5>
183 |           </div>
184 |           <div class="heart-icon">
185 |             <i class="bx bx-heart"></i>
186 |           </div>
187 |           <div class="rating">
188 |             <i class="bx bx-star"></i>
189 |             <i class="bx bx-star"></i>
190 |             <i class="bx bx-star"></i>
191 |             <i class="bx bx-star"></i>
192 |             <i class="bx bxs-star-half"></i>
193 |           </div>
194 | 
195 |           <div class="price">
196 |             <h4>Fancy Salwa Suits</h4>
197 |             <p>$99 - $129</p>
198 |           </div>
199 |         </div>
200 | 
201 |         <div class="row">
202 |           <img src="./images/7.jpg" alt="" />
203 |           <div class="product-text">
204 |             <h5>Sale</h5>
205 |           </div>
206 |           <div class="heart-icon">
207 |             <i class="bx bx-heart"></i>
208 |           </div>
209 |           <div class="rating">
210 |             <i class="bx bx-star"></i>
211 |             <i class="bx bx-star"></i>
212 |             <i class="bx bx-star"></i>
213 |             <i class="bx bx-star"></i>
214 |             <i class="bx bxs-star-half"></i>
215 |           </div>
216 | 
217 |           <div class="price">
218 |             <h4>Printed Straight Kurta</h4>
219 |             <p>$99 - $129</p>
220 |           </div>
221 |         </div>
222 | 
223 |         <div class="row">
224 |           <img src="./images/8.jpg" alt="" />
225 |           <div class="product-text">
226 |             <h5>Sale</h5>
227 |           </div>
228 |           <div class="heart-icon">
229 |             <i class="bx bx-heart"></i>
230 |           </div>
231 |           <div class="rating">
232 |             <i class="bx bx-star"></i>
233 |             <i class="bx bx-star"></i>
234 |             <i class="bx bx-star"></i>
235 |             <i class="bx bx-star"></i>
236 |             <i class="bx bxs-star-half"></i>
237 |           </div>
238 | 
239 |           <div class="price">
240 |             <h4>Collot Full Dress</h4>
241 |             <p>$99 - $129</p>
242 |           </div>
243 |         </div>
244 |       </div>
245 |     </section>
246 | 
247 |     <!--Clent-Review-section-->
248 | 
249 |     <section class="client-reviews">
250 |       <div class="reviews">
251 |         <h3>Client Reviews</h3>
252 |         <img src="./images/team-1.jpg" alt="">
253 |         <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit.
254 |            Veniam nihil temporibus <br> eos minima sapiente minus laboriosam quod modi 
255 |            illo accusamus, repellendus <br> possimus optio debitis. Non sunt illum odit? 
256 |            Quos, odit!</p>
257 | 
258 |            <h2>Mark Jevenue</h2>
259 |            <p>CEO of Addle</p>
260 |       </div>
261 |     </section>
262 | 
263 |     <!--update-news-section-->
264 | 
265 |     <section class="update-news">
266 |       <div class="up-center-text">
267 |         <h2>New Updates</h2>
268 |       </div>
269 |       <div class="update-cart">
270 |         <div class="cart">
271 |         <img src="./images/bl-1.png" alt="">
272 |         <h5>23 Jan 2023</h5>
273 |         <h4>Let's Start bring sale on this summer vacation.</h4>
274 |         <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. 
275 |           Magni fugiat fugit illum saepe, reprehenderit commodi atque accusantium
276 |            amet veritatis earum accusamus
277 |         </p>
278 |             
279 |             <h6>Continue Reading..</h6>
280 |           </div>
281 | 
282 |           <div class="cart">
283 |             <img src="./images/bl-2.png" alt="">
284 |             <h5>23 Jan 2023</h5>
285 |             <h4>Let's Start bring sale on this summer vacation.</h4>
286 |             <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. 
287 |               Magni fugiat fugit illum saepe, reprehenderit commodi atque accusantium 
288 |               amet veritatis earum accusamus
289 |             </p>
290 |                 
291 |                 <h6>Continue Reading..</h6>
292 |               </div>
293 | 
294 |               <div class="cart">
295 |                 <img src="./images/bl-3.png" alt="">
296 |                 <h5>23 Jan 2023</h5>
297 |                 <h4>Let's Start bring sales on this summer vacation.</h4>
298 |                 <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. 
299 |                   Magni fugiat fugit illum saepe,reprehenderit commodi atque
300 |                    accusantium amet veritatis earum accusamus
301 |                 </p>
302 |                     
303 |                     <h6><b>Continue Reading..</b></h6>
304 |               </div>
305 | 
306 |       </div>
307 | 
308 |     </section>
309 | 
310 |     <!--contact-section-->
311 | 
312 |     <section class="contact">
313 |       <div class="contact-info">
314 |         <div class="first-info">
315 |           <img src="./images/logo.png" alt="">
316 | 
317 |           <p>Nana Kwando 1 Road, <br>Bibiani-Ghana</p>
318 |           <p>+233 543 02 8885</p>
319 |           <p>alhassanaminatu12@gmail.com</p>
320 |           <div class="social-icon">
321 |             <a href="#"><i class='bx bxl-facebook'></i></a>
322 |             <a href="#"><i class='bx bxl-twitter' ></i></a>
323 |             <a href="#"><i class='bx bxl-instagram'></i></a>
324 |             <a href="#"><i class='bx bxl-youtube'></i></a>
325 |             <a href="#"><i class='bx bxl-linkedin' ></i></a>
326 |           </div>
327 |         </div>
328 | 
329 |           <div class="second-info">
330 |             <h4>Support</h4>
331 |             <p>Contact us</p>
332 |             <p>About Page</p>
333 |             <p>Site Guide</p>
334 |             <p>Shopping and Returns</p>
335 |             <p>Privacy</p>
336 |           </div>
337 | 
338 |           <div class="third-info">
339 |             <h4>Shop</h4>
340 |             <p>Men's Shopping</p>
341 |             <p>Women's Shopping</p>
342 |             <p>Kid's Shopping</p>
343 |             <p>Furniture</p>
344 |             <p>Discount</p>
345 |           </div>
346 | 
347 |           <div class="fourth-info">
348 |             <h4>Company</h4>
349 |             <p>About</p>
350 |             <p>Blog</p>
351 |             <p>Affiliate</p>
352 |             <p>Login</p>
353 |           </div>
354 |           <div class="five">
355 |             <h4>Subscribe</h4>
356 |             <p>Receive Updates, Hot Deals, Discounts Sent Straight In Your Inbox Daily</p>
357 |             <p>Lorem ipsum dolor sit amet consectetur adipisi hytre ame dolor Debilis</p>
358 |             <p>Receive Updates, Hot Deals, Discounts Sent Straight In Your Inbox Daily</p>
359 |           </div>
360 | 
361 |        </div> 
362 |       
363 |     </section>
364 | 
365 |     <div class="end-text">
366 |     <p>Copyright © @2023. All Rights Reserved. Designed by Aminatu Alhassan.</p>
367 |     
368 |     </div>
369 | 
370 |     
371 |     <script src="java.js"></script>
372 |   </body>
373 | </html>
374 | 


--------------------------------------------------------------------------------