├── day-02 Oct-11-2025 ├── images │ └── bd.jpg ├── audios │ └── nature-sounds.mp3 ├── videos │ └── videoplayback.mp4 └── index.html ├── day-07 Nov-01-2025 ├── iamges │ └── bd.jpeg ├── css │ └── style.css └── index.html ├── day-06 Oct-28-2025 ├── images │ └── right.png ├── index.html └── css │ └── style.css ├── day-08 Nov-4-2025 ├── images │ └── rocket.webp ├── index.html └── css │ └── style.css ├── day-13 - 16 Nov-22-2025 - Dec-02-2025 ├── images │ ├── camera.png │ ├── camerabg.png │ ├── dribble.png │ ├── twitter.png │ ├── youtube.png │ ├── instagram.png │ ├── partner-1.png │ ├── partner-2.png │ ├── partner-3.png │ ├── partner-4.png │ ├── partner-5.png │ ├── partner-6.png │ ├── partner-7.png │ ├── product-1.jpg │ ├── product-2.jpg │ ├── product-3.jpg │ ├── product-4.jpg │ ├── product-5.jpg │ ├── product-6.jpg │ ├── product-7.jpg │ ├── product-8.jpg │ ├── product-9.jpg │ ├── arrow-forward-1.png │ ├── partner-border.png │ ├── featured-product.jpg │ ├── star.svg │ ├── star-half.svg │ ├── search-icon.svg │ ├── bar.svg │ ├── right-arrow.svg │ └── cart.svg ├── js │ └── script.js ├── css │ └── style.css └── index.html ├── day-01 Oct-04-2025 └── index.html ├── day-12 Nov-18-2025 ├── index.html └── css │ └── style.css ├── day-11 Nov-15-2025 ├── Transform-Transition │ ├── index.html │ └── css │ │ └── style.css └── Reasponsive Layout │ ├── css │ └── style.css │ └── index.html ├── day-10 Nov-11-2025 ├── index.html └── css │ └── style.css ├── day-09 Nov-08-2025 ├── index.html └── css │ └── style.css ├── day-05 Oct-25-2025 ├── style.css └── index.html ├── day-03 Oct-18-2025 └── index.html └── day-04 Oct-21-2025 └── index.html /day-02 Oct-11-2025/images/bd.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-02 Oct-11-2025/images/bd.jpg -------------------------------------------------------------------------------- /day-07 Nov-01-2025/iamges/bd.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-07 Nov-01-2025/iamges/bd.jpeg -------------------------------------------------------------------------------- /day-06 Oct-28-2025/images/right.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-06 Oct-28-2025/images/right.png -------------------------------------------------------------------------------- /day-08 Nov-4-2025/images/rocket.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-08 Nov-4-2025/images/rocket.webp -------------------------------------------------------------------------------- /day-02 Oct-11-2025/audios/nature-sounds.mp3: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-02 Oct-11-2025/audios/nature-sounds.mp3 -------------------------------------------------------------------------------- /day-02 Oct-11-2025/videos/videoplayback.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-02 Oct-11-2025/videos/videoplayback.mp4 -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/camera.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-13 - 16 Nov-22-2025 - Dec-02-2025/images/camera.png -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/camerabg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-13 - 16 Nov-22-2025 - Dec-02-2025/images/camerabg.png -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/dribble.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-13 - 16 Nov-22-2025 - Dec-02-2025/images/dribble.png -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/twitter.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-13 - 16 Nov-22-2025 - Dec-02-2025/images/twitter.png -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/youtube.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-13 - 16 Nov-22-2025 - Dec-02-2025/images/youtube.png -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/instagram.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-13 - 16 Nov-22-2025 - Dec-02-2025/images/instagram.png -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/partner-1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-13 - 16 Nov-22-2025 - Dec-02-2025/images/partner-1.png -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/partner-2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-13 - 16 Nov-22-2025 - Dec-02-2025/images/partner-2.png -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/partner-3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-13 - 16 Nov-22-2025 - Dec-02-2025/images/partner-3.png -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/partner-4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-13 - 16 Nov-22-2025 - Dec-02-2025/images/partner-4.png -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/partner-5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-13 - 16 Nov-22-2025 - Dec-02-2025/images/partner-5.png -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/partner-6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-13 - 16 Nov-22-2025 - Dec-02-2025/images/partner-6.png -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/partner-7.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-13 - 16 Nov-22-2025 - Dec-02-2025/images/partner-7.png -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/product-1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-13 - 16 Nov-22-2025 - Dec-02-2025/images/product-1.jpg -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/product-2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-13 - 16 Nov-22-2025 - Dec-02-2025/images/product-2.jpg -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/product-3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-13 - 16 Nov-22-2025 - Dec-02-2025/images/product-3.jpg -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/product-4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-13 - 16 Nov-22-2025 - Dec-02-2025/images/product-4.jpg -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/product-5.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-13 - 16 Nov-22-2025 - Dec-02-2025/images/product-5.jpg -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/product-6.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-13 - 16 Nov-22-2025 - Dec-02-2025/images/product-6.jpg -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/product-7.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-13 - 16 Nov-22-2025 - Dec-02-2025/images/product-7.jpg -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/product-8.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-13 - 16 Nov-22-2025 - Dec-02-2025/images/product-8.jpg -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/product-9.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-13 - 16 Nov-22-2025 - Dec-02-2025/images/product-9.jpg -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/arrow-forward-1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-13 - 16 Nov-22-2025 - Dec-02-2025/images/arrow-forward-1.png -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/partner-border.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-13 - 16 Nov-22-2025 - Dec-02-2025/images/partner-border.png -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/featured-product.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/asif-daffodil/cmbd337/main/day-13 - 16 Nov-22-2025 - Dec-02-2025/images/featured-product.jpg -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/js/script.js: -------------------------------------------------------------------------------- 1 | const mbi = document.getElementById('mbi'); 2 | const navLinks = document.getElementById('nav-links'); 3 | 4 | mbi.addEventListener('click', () => { 5 | navLinks.classList.toggle('active'); 6 | }); 7 | -------------------------------------------------------------------------------- /day-01 Oct-04-2025/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Batch - 337 7 | 8 | 9 | Hello World! 10 | 11 | -------------------------------------------------------------------------------- /day-12 Nov-18-2025/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 |
11 | 12 | -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/star.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /day-11 Nov-15-2025/Transform-Transition/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 |
11 | 12 | -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/star-half.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/search-icon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/bar.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /day-11 Nov-15-2025/Transform-Transition/css/style.css: -------------------------------------------------------------------------------- 1 | *{ 2 | margin: 0; 3 | padding: 0; 4 | box-sizing: border-box; 5 | } 6 | 7 | .div1 { 8 | width: 150px; 9 | height: 150px; 10 | background-color: teal; 11 | margin: 20px; 12 | /* transition: transform 0.5s ease 0.3s; */ 13 | /* transition: all 0.5s ease 0.3s; */ 14 | transition: 0.5s; 15 | } 16 | 17 | .div1:hover { 18 | /* transform: translateX(20px); */ 19 | /* transform: translateY(20px); */ 20 | /* transform: translateX(20px) translateY(20px); */ 21 | /* transform: translate(20px, 20px); */ 22 | /* transform: rotateZ(180deg); */ 23 | transform: translate(10px, 10px) skew(5deg, 5deg) rotate(360deg) scale(1.2); 24 | } -------------------------------------------------------------------------------- /day-10 Nov-11-2025/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 |
11 |
1
12 |
2
13 |
3
14 |
4
15 |
16 | 17 |
18 |
1
19 |
2
20 |
3
21 |
4
22 |
5
23 |
6
24 |
7
25 |
8
26 |
9
27 |
28 | 29 | -------------------------------------------------------------------------------- /day-09 Nov-08-2025/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 |
11 |
item 1
12 |
item 2
13 |
item 3
14 |
item 4
15 |
16 | 17 |
18 |
child 1
19 |
child 2
20 |
child 3
21 |
child 4
22 |
23 | 24 | -------------------------------------------------------------------------------- /day-05 Oct-25-2025/style.css: -------------------------------------------------------------------------------- 1 | .para2 { 2 | /* background: rgb(128, 79, 243); */ 3 | background: rgba(128, 79, 243, 0.5); 4 | /* background: #ff00bb; */ 5 | color: #f00; 6 | width: 600px; 7 | font-weight: bold; 8 | text-transform: uppercase; 9 | letter-spacing: 3px; 10 | padding: 50px; 11 | text-decoration: underline; 12 | font-size: 32px; 13 | line-height: 40px; 14 | text-align: center; 15 | /* margin: 20px 30px 40px 50px; */ 16 | /* margin: 20px 30px; */ 17 | /* margin: 20px 30px 40px; */ 18 | margin-top: -10px; 19 | /* border: 20px solid black; */ 20 | /* border-width: 20px; 21 | border-style: double; 22 | border-color: #000; */ 23 | border-top: 20px solid; 24 | border-right: 20px double; 25 | border-left: 20px double; 26 | border-bottom: 20px solid; 27 | border-radius: 20px; 28 | } -------------------------------------------------------------------------------- /day-06 Oct-28-2025/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 17 | 18 | Click Here 19 | 20 | 24 | 25 | -------------------------------------------------------------------------------- /day-12 Nov-18-2025/css/style.css: -------------------------------------------------------------------------------- 1 | *{ 2 | margin: 0; 3 | padding: 0; 4 | box-sizing: border-box; 5 | } 6 | body { 7 | width: 100%; 8 | overflow: hidden; 9 | } 10 | 11 | .main { 12 | width: 150px; 13 | height: 150px; 14 | /* animation-name: mainAnimation; */ 15 | /* animation-duration: 2s; */ 16 | /* animation-iteration-count: infinite; */ 17 | /* animation-timing-function: linear; */ 18 | animation: mainAnimation 2s infinite linear; 19 | position: absolute; 20 | top: 200px; 21 | } 22 | 23 | @keyframes mainAnimation { 24 | 0% { 25 | background: limegreen; 26 | transform: rotateZ(0deg); 27 | left: calc(0% - 150px); 28 | } 29 | 50% { 30 | background: orange; 31 | transform: rotateZ(360deg); 32 | left: calc(50% - 75px); 33 | } 34 | 100% { 35 | background: limegreen; 36 | transform: rotateZ(720deg); 37 | left: calc(100% + 150px); 38 | } 39 | } -------------------------------------------------------------------------------- /day-05 Oct-25-2025/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 15 | 16 | 17 | 18 | 19 | 20 | 21 |

This is heading 1

22 |

23 | Lorem ipsum dolor sit amet consectetur adipisicing elit. Corrupti excepturi quis est cumque facilis delectus, vitae dolorum similique asperiores atque alias aut libero neque, quo suscipit temporibus odit? Vitae, quidem. 24 |

25 |

26 | ha ha ha ha ha ha ha ha ha ha ha ha ha ha ha 27 |

28 | 29 | 30 | -------------------------------------------------------------------------------- /day-03 Oct-18-2025/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 |
Student Data
SNNameGenderCity
01Taousif 23 | Male 24 | Dhaka
02AmirCtg
03BadhonDhaka
38 | 39 | -------------------------------------------------------------------------------- /day-06 Oct-28-2025/css/style.css: -------------------------------------------------------------------------------- 1 | @import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&display=swap'); 2 | * { 3 | margin: 0; 4 | padding: 0; 5 | box-sizing: border-box; 6 | font-family: "Oswald", sans-serif; 7 | } 8 | 9 | .list { 10 | list-style-type: none; 11 | list-style-position: inside; 12 | /* list-style-image: url("../images/right.png"); */ 13 | } 14 | 15 | .list>li { 16 | padding-left: 40px; 17 | line-height: 32px; 18 | background-image: url("../images/right.png"); 19 | background-size: 16px 16px; 20 | background-repeat: no-repeat; 21 | background-position: 20px center; 22 | } 23 | 24 | .link { 25 | text-decoration: none; 26 | color: cornflowerblue; 27 | } 28 | 29 | .link:hover { 30 | text-decoration: underline; 31 | color: darkblue; 32 | } 33 | 34 | .btn { 35 | width: max-content; 36 | padding: 8px 20px; 37 | border-radius: 20px/50%; 38 | cursor: pointer; 39 | border-width: 0; 40 | background: dodgerblue; 41 | color: white; 42 | } 43 | 44 | .btn:hover { 45 | background: darkblue; 46 | box-shadow: 3px 3px 3px black; 47 | } -------------------------------------------------------------------------------- /day-11 Nov-15-2025/Reasponsive Layout/css/style.css: -------------------------------------------------------------------------------- 1 | *{ 2 | margin: 0; 3 | padding: 0; 4 | box-sizing: border-box; 5 | } 6 | 7 | .container { 8 | display: grid; 9 | } 10 | 11 | .container > div { 12 | border: 1px solid #333; 13 | border-radius: 8px; 14 | } 15 | 16 | @media (max-width: 768px) { 17 | .container { 18 | padding: 12px; 19 | grid-template-columns: 1fr; 20 | gap: 12px; 21 | } 22 | 23 | .container > div { 24 | padding: 12px; 25 | background: lightblue; 26 | } 27 | } 28 | 29 | @media (min-width: 768px) and (max-width: 1280px) { 30 | .container { 31 | padding: 20px; 32 | grid-template-columns: 1fr 1fr; 33 | gap: 20px; 34 | } 35 | 36 | .container > div { 37 | padding: 20px; 38 | background: lightgreen; 39 | } 40 | } 41 | 42 | @media (min-width: 1280px) { 43 | .container { 44 | padding: 28px; 45 | grid-template-columns: 1fr 1fr 1fr 1fr; 46 | gap: 28px; 47 | } 48 | 49 | .container > div { 50 | padding: 28px; 51 | background: lightgoldenrodyellow; 52 | } 53 | } -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/right-arrow.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /day-09 Nov-08-2025/css/style.css: -------------------------------------------------------------------------------- 1 | *{ 2 | margin: 0; 3 | padding: 0; 4 | box-sizing: border-box; 5 | } 6 | 7 | .container { 8 | display: flex; 9 | padding: 10px; 10 | background: green; 11 | gap: 10px; 12 | /* flex-direction: row; */ 13 | justify-content: center; 14 | height: 100vh; 15 | /* align-items: baseline; */ 16 | align-content: center; 17 | /* flex-wrap: wrap; */ 18 | flex-flow: row wrap; 19 | } 20 | 21 | .item { 22 | background: lightblue; 23 | padding: 10px; 24 | width: 300px; 25 | } 26 | 27 | .montainer { 28 | width: 100%; 29 | height: 100vh; 30 | display: flex; 31 | gap: 10px; 32 | padding: 10px; 33 | } 34 | 35 | .child { 36 | flex-basis: 100%; 37 | background: limegreen; 38 | } 39 | 40 | .montainer > .child:first-child { 41 | order: 2; 42 | /* flex-grow: 1; */ 43 | /* flex-shrink: 1; */ 44 | align-self: center; 45 | } 46 | 47 | .montainer > .child:nth-child(2) { 48 | order: 4; 49 | /* flex-grow: 2; */ 50 | /* flex-shrink: 2; */ 51 | align-self: center; 52 | } 53 | 54 | .montainer > .child:nth-child(3) { 55 | order: 1; 56 | /* flex-grow: 3; */ 57 | /* flex-shrink: 3; */ 58 | align-self: center; 59 | } 60 | 61 | .montainer > .child:last-child { 62 | order: 3; 63 | /* flex-grow: 4; */ 64 | /* flex-shrink: 4; */ 65 | align-self: center; 66 | } -------------------------------------------------------------------------------- /day-08 Nov-4-2025/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 |
11 | This is a demo text! 12 |
13 |
14 | This is a demo text! 15 |
16 |

17 | Lorem ipsum dolor sit amet consectetur adipisicing elit. Velit enim voluptatem nostrum pariatur ducimus reprehenderit nobis ea accusamus alias commodi? 18 |

19 |
20 |
21 |
22 |

23 | Lorem, ipsum dolor sit amet consectetur adipisicing elit. Harum quos consectetur possimus non hic doloremque, iure perspiciatis consequatur qui ut! 24 |

25 |

26 | Hukka huya! 27 |

28 | Click Here 29 | 30 |
31 |
32 |
33 |

34 | Lorem ipsum dolor sit amet consectetur adipisicing elit. Accusantium obcaecati harum blanditiis et ab tempora eaque, necessitatibus voluptatibus, sequi aperiam ratione officiis minus? Nemo voluptates, dignissimos doloremque corrupti odio aspernatur! 35 |

36 | 37 | -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/images/cart.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /day-07 Nov-01-2025/css/style.css: -------------------------------------------------------------------------------- 1 | *{ 2 | margin: 0; 3 | padding: 0; 4 | box-sizing: border-box; 5 | } 6 | 7 | .link { 8 | display: inline-block; 9 | width: 300px; 10 | background: yellow; 11 | margin-left: auto; 12 | } 13 | 14 | .para { 15 | width: 300px; 16 | height: 100px; 17 | margin: auto; 18 | padding: 10px; 19 | border: 1px solid #000; 20 | /* overflow: scroll; */ 21 | overflow-y: scroll; 22 | } 23 | 24 | /* .div1, .div2 { 25 | width: 300px; 26 | border: 1px solid #000; 27 | margin: 20px; 28 | padding: 20px; 29 | float: right; 30 | } */ 31 | 32 | .float-div { 33 | width: 600px; 34 | padding: 20px; 35 | border: 1px solid #000; 36 | margin: 20px auto; 37 | } 38 | 39 | .float-div > img { 40 | width: 300px; 41 | float: left; 42 | clear: both; 43 | margin-right: 10px; 44 | } 45 | 46 | .pos { 47 | width: 200px; 48 | height: 200px; 49 | background: green; 50 | position: relative; 51 | /* z-index: 10; */ 52 | } 53 | 54 | .pos:hover { 55 | top: 50px; 56 | right: -50px; 57 | } 58 | 59 | .pos2 { 60 | width: 200px; 61 | height: 200px; 62 | background: red; 63 | position: relative; 64 | /* z-index: 20; */ 65 | } 66 | 67 | .child { 68 | width: 100px; 69 | height: 100px; 70 | background: lightblue; 71 | position: absolute; 72 | top: 20px; 73 | right: -20px; 74 | } 75 | 76 | .pos3 { 77 | width: 50px; 78 | height: 50px; 79 | background: #000; 80 | position: fixed; 81 | bottom: 20px; 82 | right: 20px; 83 | } 84 | 85 | .space { 86 | width: 100%; 87 | height: 100vh; 88 | } 89 | 90 | .pos4 { 91 | width: 60px; 92 | height: 400px; 93 | background: yellow; 94 | } 95 | 96 | .child2 { 97 | width: 100%; 98 | height: 60px; 99 | background: green; 100 | position: sticky; 101 | top: 20px; 102 | } -------------------------------------------------------------------------------- /day-02 Oct-11-2025/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 |

This is heading 1

10 |

This is heading 2

11 |

This is heading 3

12 |

This is heading 4

13 |
This is heading 5
14 |
This is heading 6
15 | 16 |

17 | Lorem ipsum dolor sit amet consectetur, adipisicing elit. Dolore dignissimos exercitationem esse, ut consectetur fuga expedita non quisquam. Necessitatibus nam dolore tenetur voluptate voluptatibus suscipit commodi, autem vitae illum! Aspernatur. 18 |

19 | 20 | 21 | Goo there 22 |
23 | 24 | 25 | 26 | 27 | 34 | 35 |
    36 |
  1. Porata
  2. 37 |
  3. Dim Vaji
  4. 38 |
  5. Daal Shobji
  6. 39 |
  7. Kacchi Biriyani
  8. 40 |
  9. Fuchka
  10. 41 |
  11. Chotpoti
  12. 42 |
  13. Lacchi
  14. 43 |
44 | 45 |

46 | Lorem ipsum dolor sit amet consectetur adipisicing elit. Laboriosam distinctio totam repellat aspernatur obcaecati in architecto temporibus quos explicabo! Iure! 47 |

48 | 49 |
50 | "You will be a great web developer!" 51 |
52 | 53 |
54 | 55 | Bold 56 | Bold 57 | 58 | -------------------------------------------------------------------------------- /day-07 Nov-01-2025/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | Click here 12 | Span 13 | 14 | Bangladesh 15 | Italic 16 | Umbrella 17 | 18 | 19 | 20 |
Div
21 |

Heading

22 |

Heading

23 |

Heading

24 |
Heading
25 |
Heading
26 |

27 | this is a paragraph. Lorem, ipsum dolor sit amet consectetur adipisicing elit. Eaque eos non voluptatum nemo, iure nulla aspernatur veniam, doloribus alias cumque cupiditate impedit saepe molestiae nisi nesciunt! Quos provident quis rerum. Ut repudiandae illum sapiente incidunt fugiat rem facilis necessitatibus nobis cupiditate, doloremque, delectus, commodi magni ea consectetur veritatis natus. Laborum pariatur nihil ea. Suscipit, tempore adipisci quis odit cumque in. 28 |

29 |
30 | 31 |

32 | Lorem ipsum, dolor sit amet consectetur adipisicing elit. Facilis atque non quisquam similique molestias veritatis molestiae animi omnis ipsam deleniti accusamus quibusdam iste illum unde repellat alias fuga illo, temporibus impedit magni commodi cupiditate dolorum totam. Sit inventore ipsa quod. Soluta, iusto voluptates nobis fugiat, voluptatibus inventore, nihil voluptatem ducimus eveniet perspiciatis dignissimos quisquam sed alias sit. Deleniti, voluptatibus excepturi? 33 |

34 |
35 | 36 |
37 |
38 |
39 |
40 |
41 |
42 |
43 |
44 |
45 | 46 | 47 | -------------------------------------------------------------------------------- /day-11 Nov-15-2025/Reasponsive Layout/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 |
11 |
12 | Lorem ipsum, dolor sit amet consectetur adipisicing elit. Perferendis magni architecto aliquid amet, sunt accusantium assumenda nihil iusto ab odit fuga quo porro quis at ducimus facere ex laborum, similique corrupti minima ipsum, ea provident! Quisquam a, dicta explicabo fugiat blanditiis incidunt debitis sequi assumenda eveniet sint exercitationem minus molestiae soluta commodi, libero maiores perferendis, odit voluptas repellat laboriosam reiciendis? 13 |
14 |
15 | Lorem ipsum, dolor sit amet consectetur adipisicing elit. Perferendis magni architecto aliquid amet, sunt accusantium assumenda nihil iusto ab odit fuga quo porro quis at ducimus facere ex laborum, similique corrupti minima ipsum, ea provident! Quisquam a, dicta explicabo fugiat blanditiis incidunt debitis sequi assumenda eveniet sint exercitationem minus molestiae soluta commodi, libero maiores perferendis, odit voluptas repellat laboriosam reiciendis? 16 |
17 |
18 | Lorem ipsum, dolor sit amet consectetur adipisicing elit. Perferendis magni architecto aliquid amet, sunt accusantium assumenda nihil iusto ab odit fuga quo porro quis at ducimus facere ex laborum, similique corrupti minima ipsum, ea provident! Quisquam a, dicta explicabo fugiat blanditiis incidunt debitis sequi assumenda eveniet sint exercitationem minus molestiae soluta commodi, libero maiores perferendis, odit voluptas repellat laboriosam reiciendis? 19 |
20 |
21 | Lorem ipsum, dolor sit amet consectetur adipisicing elit. Perferendis magni architecto aliquid amet, sunt accusantium assumenda nihil iusto ab odit fuga quo porro quis at ducimus facere ex laborum, similique corrupti minima ipsum, ea provident! Quisquam a, dicta explicabo fugiat blanditiis incidunt debitis sequi assumenda eveniet sint exercitationem minus molestiae soluta commodi, libero maiores perferendis, odit voluptas repellat laboriosam reiciendis? 22 |
23 |
24 | 25 | -------------------------------------------------------------------------------- /day-10 Nov-11-2025/css/style.css: -------------------------------------------------------------------------------- 1 | *{ 2 | margin: 0; 3 | padding: 0; 4 | box-sizing: border-box; 5 | } 6 | 7 | .container { 8 | width: 100%; 9 | height: 100vh; 10 | background: linear-gradient(45deg, #ff9a9e, #fad0c4, #fad0c4, #ff9a9e); 11 | display: grid; 12 | padding: 20px; 13 | gap: 20px; 14 | /* grid-template-columns: auto auto auto; */ 15 | /* grid-template-columns: 1fr 2fr 1fr; */ 16 | /* grid-template-columns: 2fr repeat(3, 1fr); */ 17 | } 18 | 19 | .container > div { 20 | background: linear-gradient(45deg, #a18cd1, #fbc2eb, #fbc2eb, #a18cd1); 21 | box-shadow: 0 0px 20px #000; 22 | font-size: 48px; 23 | display: grid; 24 | place-items: center; 25 | } 26 | 27 | .container > div:nth-child(1) { 28 | grid-column: 1 / 3; 29 | grid-row: 1 / 2; 30 | } 31 | 32 | .container > div:nth-child(2) { 33 | grid-column: 3 / 4; 34 | grid-row: 1 / 3; 35 | } 36 | 37 | .container > div:nth-child(3) { 38 | grid-column: 1 / 2; 39 | grid-row: 2 / 3; 40 | } 41 | 42 | .container > div:nth-child(4) { 43 | grid-column: 2 / 3; 44 | grid-row: 2 / 3; 45 | } 46 | 47 | .main { 48 | width: 100%; 49 | height: 100vh; 50 | background: linear-gradient(45deg, #000, #fff, #000); 51 | display: grid; 52 | padding: 20px; 53 | gap: 20px; 54 | grid-template-areas: "area1 area1 area2 area2 area3" 55 | "area4 area5 area6 area6 area3" 56 | "area4 area8 area6 area6 area9" 57 | "area7 area8 area6 area6 area9"; 58 | } 59 | 60 | .main > div { 61 | background: linear-gradient(45deg, orange, yellow, yellow, orange); 62 | font-size: 40px; 63 | display: grid; 64 | place-items: center; 65 | } 66 | 67 | .main > div:first-child { 68 | grid-area: area1; 69 | } 70 | 71 | .main > div:nth-child(2) { 72 | grid-area: area2; 73 | } 74 | 75 | .main > div:nth-child(3) { 76 | grid-area: area3; 77 | } 78 | 79 | .main > div:nth-child(4) { 80 | grid-area: area4; 81 | } 82 | 83 | .main > div:nth-child(5) { 84 | grid-area: area5; 85 | } 86 | 87 | .main > div:nth-child(6) { 88 | grid-area: area6; 89 | } 90 | 91 | .main > div:nth-child(7) { 92 | grid-area: area7; 93 | } 94 | 95 | .main > div:nth-child(8) { 96 | grid-area: area8; 97 | } 98 | 99 | .main > div:last-child { 100 | grid-area: area9; 101 | } 102 | -------------------------------------------------------------------------------- /day-08 Nov-4-2025/css/style.css: -------------------------------------------------------------------------------- 1 | *{ 2 | margin: 0; 3 | padding: 0; 4 | box-sizing: border-box; 5 | } 6 | 7 | .div1, .div2 { 8 | width: 300px; 9 | height: 200px; 10 | background: blue; 11 | margin: 20px; 12 | color: #fff; 13 | font-size: 24px; 14 | text-shadow: 1px 1px 1px yellow; 15 | box-shadow: 10px 10px 10px #000, 0px 0px 100px #000 inset; 16 | } 17 | 18 | .div1 { 19 | padding: 20px; 20 | position: relative; 21 | } 22 | 23 | .div1::before { 24 | content: "50%"; 25 | width: max-content; 26 | /* padding: 4px 8px; */ 27 | font-size: 14px; 28 | width: 40px; 29 | line-height: 40px; 30 | text-align: center; 31 | color: #fff; 32 | background: red; 33 | border-radius: 50%; 34 | /* aspect-ratio: 1/1; */ 35 | position: absolute; 36 | top: 0; 37 | right: 0; 38 | transform: translate(-50%, -50%); 39 | } 40 | 41 | .dhaka { 42 | width: 300px; 43 | height: 200px; 44 | background: green; 45 | margin: 20px; 46 | } 47 | 48 | .dhaka > .dhanmondi { 49 | width: 140px; 50 | height: 140px; 51 | background: blue; 52 | } 53 | 54 | /* .dhaka + p { 55 | color: maroon; 56 | } */ 57 | .dhaka ~ p { 58 | color: maroon; 59 | } 60 | 61 | a:link { 62 | color: blue; 63 | text-decoration: none; 64 | } 65 | a:visited { 66 | color: hotpink; 67 | text-decoration: none; 68 | } 69 | a:hover { 70 | color: green; 71 | text-decoration: none; 72 | } 73 | a:active { 74 | color: yellow; 75 | text-decoration: none; 76 | } 77 | 78 | p::first-letter { 79 | font-size: 22px; 80 | } 81 | 82 | p::before { 83 | content: "Hi. "; 84 | } 85 | 86 | p::after { 87 | content: " Thank you."; 88 | } 89 | 90 | .bg-img { 91 | width: 300px; 92 | height: 300px; 93 | margin: 20px; 94 | border: 1px solid #000; 95 | background-image: url("../images/rocket.webp"); 96 | /* background-size: 100% 100%; */ 97 | /* background-size: contain; */ 98 | background-size: cover; 99 | background-repeat: no-repeat; 100 | background-position: center; 101 | } 102 | 103 | .gradient { 104 | width: 200px; 105 | height: 200px; 106 | background: linear-gradient(to top right, red, white, green); 107 | margin: 20px; 108 | } 109 | 110 | .gradient2 { 111 | width: 200px; 112 | height: 200px; 113 | background: radial-gradient(white, red, black 75%); 114 | margin: 20px; 115 | } 116 | 117 | .para { 118 | width: 300px; 119 | border: 1px solid #000; 120 | margin: 20px; 121 | white-space: nowrap; 122 | /* overflow: hidden; 123 | text-overflow: ellipsis; */ 124 | overflow-x: scroll; 125 | } 126 | -------------------------------------------------------------------------------- /day-04 Oct-21-2025/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 |
10 | 11 | 12 |
13 | 14 |

15 | 16 |

17 | 18 |

19 | 20 |

21 | 22 |

23 | 24 |

25 | 26 |

27 | 28 |

29 | 30 |

31 | 32 |

33 | 34 |

35 | Gender : 36 | 39 | 42 | 45 |

46 | Skills : 47 | 50 | 53 | 56 | 59 | 62 |

63 | 72 |

73 | 74 |

75 | 76 | 77 |
78 | 79 | -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/css/style.css: -------------------------------------------------------------------------------- 1 | @import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Manrope:wght@200..800&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap'); 2 | 3 | * { 4 | margin: 0; 5 | padding: 0; 6 | box-sizing: border-box; 7 | font-family: "Poppins", sans-serif; 8 | } 9 | 10 | header { 11 | display: flex; 12 | justify-content: space-between; 13 | align-items: center; 14 | max-width: 1200px; 15 | margin: 87px auto 41.8px; 16 | flex-wrap: wrap; 17 | } 18 | 19 | header>a { 20 | text-decoration: none; 21 | font-size: 24px; 22 | color: #3A3A3A; 23 | font-weight: bold; 24 | } 25 | 26 | header>ul { 27 | list-style: none; 28 | display: flex; 29 | } 30 | 31 | header>ul>li:not(:last-child) { 32 | margin-right: 34px; 33 | } 34 | 35 | header>ul>li>a { 36 | text-decoration: none; 37 | font-weight: 600; 38 | color: #3A3A3A; 39 | } 40 | 41 | .mobile-bar-icon { 42 | display: none; 43 | } 44 | 45 | .mobile-cart { 46 | display: none; 47 | } 48 | 49 | .main-container { 50 | max-width: 1200px; 51 | margin: 0 auto; 52 | } 53 | 54 | .hero { 55 | width: 100%; 56 | display: flex; 57 | justify-content: space-between; 58 | margin-bottom: 79px; 59 | } 60 | 61 | .hero>.left { 62 | display: flex; 63 | flex-direction: column; 64 | justify-content: center; 65 | } 66 | 67 | .hero>.left>h1 { 68 | font-size: 52px; 69 | font-weight: bold; 70 | line-height: 70px; 71 | max-width: 582px; 72 | color: #3A3A3A; 73 | } 74 | 75 | .hero>.left>p { 76 | font-weight: 600; 77 | color: #3A3A3A; 78 | width: 505px; 79 | margin: 16px 0; 80 | } 81 | 82 | .hero>.left>button { 83 | width: 196px; 84 | height: 44px; 85 | border-width: 0; 86 | background: #E02C6D; 87 | color: #FFFFFF; 88 | font-weight: bold; 89 | display: flex; 90 | justify-content: center; 91 | align-items: center; 92 | gap: 8px; 93 | border-radius: 41px; 94 | } 95 | 96 | .hero>.right { 97 | background: url("../images/camerabg.png") no-repeat center; 98 | background-size: cover; 99 | } 100 | 101 | .partner { 102 | max-width: 1110px; 103 | margin: 0 auto; 104 | display: flex; 105 | justify-content: center; 106 | align-content: center; 107 | flex-wrap: wrap; 108 | gap: 60px; 109 | position: relative; 110 | padding: 36px 62px; 111 | margin-bottom: 100px; 112 | } 113 | 114 | .partner::before { 115 | content: ""; 116 | position: absolute; 117 | top: 0; 118 | left: 0; 119 | width: 100%; 120 | height: 1px; 121 | background: linear-gradient(90deg, rgba(192, 204, 218, 0.1) 0%, rgba(192, 204, 218, 0.6) 50.38%, rgba(192, 204, 218, 0.1) 100%); 122 | box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25); 123 | } 124 | 125 | .partner::after { 126 | content: ""; 127 | position: absolute; 128 | bottom: 0; 129 | left: 0; 130 | width: 100%; 131 | height: 1px; 132 | background: linear-gradient(90deg, rgba(192, 204, 218, 0.1) 0%, rgba(192, 204, 218, 0.6) 50.38%, rgba(192, 204, 218, 0.1) 100%); 133 | box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25); 134 | } 135 | 136 | .popular-section { 137 | max-width: 1200px; 138 | margin: 0 auto 100px; 139 | } 140 | 141 | .popular-section>h2 { 142 | text-align: center; 143 | color: #3A3A3A; 144 | font-weight: 600; 145 | line-height: 70px; 146 | font-size: 28px; 147 | margin-bottom: 30px; 148 | } 149 | 150 | .popular-section>.popular-grid { 151 | display: grid; 152 | grid-template-columns: repeat(3, minmax(0, 329px)); 153 | justify-content: center; 154 | gap: 30px; 155 | margin-bottom: 50px; 156 | } 157 | 158 | .popular-section>.popular-grid>.product { 159 | padding: 16px; 160 | background: #FFFFFF; 161 | box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.15); 162 | border-radius: 5px; 163 | 164 | } 165 | 166 | .popular-section>.popular-grid>.product>img { 167 | width: 100%; 168 | border-radius: 5px; 169 | } 170 | 171 | .popular-section>.popular-grid>.product>h3 { 172 | font-size: 28px; 173 | font-weight: 500; 174 | line-height: 40px; 175 | color: #18191F; 176 | } 177 | 178 | .popular-section>.popular-grid>.product>.price { 179 | font-family: 'Inter'; 180 | font-weight: 400; 181 | font-size: 24px; 182 | line-height: 150%; 183 | color: rgba(0, 0, 0, 0.87); 184 | } 185 | 186 | .popular-section>.popular-grid>.product>.reviews { 187 | display: flex; 188 | justify-content: start; 189 | align-items: center; 190 | gap: 8px; 191 | } 192 | 193 | .popular-section>.popular-grid>.product>.reviews>ul { 194 | list-style: none; 195 | display: flex; 196 | } 197 | 198 | .popular-section>.popular-grid>.product>.reviews>p { 199 | font-size: 14px; 200 | line-height: 22px; 201 | font-family: Roboto; 202 | font-weight: bold; 203 | } 204 | 205 | .popular-section>.popular-grid>.product>p { 206 | width: 196px; 207 | font-family: Inter; 208 | font-weight: bold; 209 | font-size: 14px; 210 | color: #787885; 211 | line-height: 143%; 212 | letter-spacing: 1.8%; 213 | } 214 | 215 | .popular-section>a { 216 | font-weight: bold; 217 | color: #E02C6D; 218 | display: flex; 219 | justify-content: end; 220 | align-items: center; 221 | gap: 8px; 222 | max-width: 1047px; 223 | margin: 0 auto; 224 | } 225 | 226 | .featured-product { 227 | max-width: 1110px; 228 | display: flex; 229 | align-items: center; 230 | gap: 96px; 231 | } 232 | 233 | .featured-product>div>h2 { 234 | font-weight: bold; 235 | font-size: 38px; 236 | line-height: 60px; 237 | color: #0A0826; 238 | margin-bottom: 16px; 239 | } 240 | 241 | .featured-product>div>p { 242 | font-weight: bold; 243 | line-height: 28px; 244 | color: #6C6C6C; 245 | margin-bottom: 12px; 246 | } 247 | 248 | .featured-product>div>button { 249 | width: 155px; 250 | height: 44px; 251 | background: #E02C6D; 252 | border-width: 0; 253 | color: #fff; 254 | font-weight: bold; 255 | display: flex; 256 | align-items: center; 257 | justify-content: center; 258 | gap: 8px; 259 | cursor: pointer; 260 | } 261 | 262 | footer { 263 | width: 100%; 264 | background: #0A0826; 265 | color: #fff; 266 | text-align: center; 267 | padding: 50px 10px; 268 | margin-top: 100px; 269 | } 270 | 271 | footer > h3 { 272 | font-size: 24px; 273 | font-weight: bold; 274 | margin-bottom: 3px; 275 | } 276 | 277 | footer > p { 278 | font-weight: bold; 279 | font-size: 14px; 280 | line-height: 24px; 281 | color: #D9DBE1; 282 | margin-bottom: 3px; 283 | font-family: Manrope; 284 | } 285 | 286 | .snav { 287 | list-style: none; 288 | display: flex; 289 | justify-content: center; 290 | align-items: center; 291 | gap: 16px; 292 | margin-top: 17px; 293 | } 294 | 295 | .snav>li { 296 | width: 32px; 297 | height: 32px; 298 | border-radius: 50%; 299 | background: rgba(255, 255, 255, 0.1); 300 | } 301 | 302 | .snav>li>a { 303 | text-decoration: none; 304 | display: flex; 305 | justify-content: center; 306 | align-items: center; 307 | height: 100%; 308 | } 309 | 310 | @media screen and (max-width: 768px) { 311 | header { 312 | width: 100%; 313 | padding: 0 20px; 314 | align-items: center; 315 | } 316 | 317 | header>a { 318 | font-size: 16px; 319 | } 320 | 321 | header>ul { 322 | margin-top: 20px; 323 | flex-direction: column; 324 | width: 100%; 325 | display: none; 326 | } 327 | 328 | header>ul.active { 329 | display: flex; 330 | } 331 | 332 | header>ul>li { 333 | margin-bottom: 15px; 334 | } 335 | 336 | header>ul>li:not(:last-child) { 337 | margin-right: 0; 338 | } 339 | 340 | header>ul>li:last-child { 341 | display: none; 342 | } 343 | 344 | .mobile-bar-icon { 345 | display: block; 346 | } 347 | 348 | .mobile-cart { 349 | display: block; 350 | } 351 | 352 | .mobile-bar-icon>img, 353 | .mobile-cart>img { 354 | width: 24px; 355 | height: 24px; 356 | } 357 | 358 | .main-container { 359 | width: 100%; 360 | padding: 0 20px; 361 | } 362 | 363 | .hero { 364 | width: 100%; 365 | flex-direction: column-reverse; 366 | align-items: center; 367 | text-align: center; 368 | margin-bottom: 50px; 369 | } 370 | 371 | .hero>.left { 372 | align-items: center; 373 | } 374 | 375 | .hero>.left>h1 { 376 | width: 100%; 377 | font-size: 28px; 378 | line-height: 42px; 379 | max-width: 100%; 380 | } 381 | 382 | .hero>.left>p { 383 | width: 100%; 384 | font-size: 14px; 385 | font-weight: 500; 386 | } 387 | 388 | .hero>.right>img { 389 | width: 100%; 390 | } 391 | 392 | .partner { 393 | max-width: 100%; 394 | padding: 0; 395 | gap: 30px; 396 | margin-bottom: 50px; 397 | } 398 | 399 | .partner::before, 400 | .partner::after { 401 | display: none; 402 | } 403 | 404 | .popular-section>.popular-grid { 405 | grid-template-columns: repeat(1, minmax(0, 100%)); 406 | } 407 | 408 | .featured-product { 409 | flex-direction: column-reverse; 410 | text-align: center; 411 | gap: 30px; 412 | } 413 | 414 | .featured-product>div { 415 | text-align: center; 416 | } 417 | 418 | .featured-product>div>button { 419 | margin: 0 auto; 420 | } 421 | } -------------------------------------------------------------------------------- /day-13 - 16 Nov-22-2025 - Dec-02-2025/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 |
12 | 13 | Influencer products 14 | 15 | 23 |
24 | 25 | 26 |
27 | 28 |
29 |
30 |

Start your Journey as Influencer

31 |

32 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sem vestibulum sed scelerisque eros. Lectus faucibus. 33 |

34 | 38 |
39 |
40 | 41 |
42 |
43 | 44 | 45 | 46 |
47 | Alibaba 48 | Amazon 49 | Daraz 50 | Ebay 51 | Rakuten 52 | Walmart 53 | Target 54 |
55 | 56 | 57 | 58 | 238 | 239 | 240 | 241 | 256 | 257 |
258 | 259 | 286 | 287 | 288 | 289 | --------------------------------------------------------------------------------